/* Owner dashboard. Tokens, fonts and the Minecraft button come from base.css (web/shared). */
.top { background: linear-gradient(180deg, var(--sky), var(--sky-low)); border-bottom: 10px solid var(--sea); }
.bar nav { align-items: center; }
.who { color: var(--azure-deep); font-weight: 700; }
.link { border: 0; background: none; padding: 0; font: inherit; color: var(--azure); text-decoration: underline; cursor: pointer; }
main { padding-block: 28px 64px; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; align-items: start; }
.card { background: var(--white); border: 2px solid var(--ink); box-shadow: 6px 6px 0 var(--rule); padding: 20px 22px 22px; min-width: 0; }
.card.wide { grid-column: 1 / -1; }
.card.narrow { max-width: 520px; margin: 48px auto; }
.card > * + * { margin-top: 12px; }
.card h1, .card h2 { margin: 0; font: 800 34px/1 var(--display); color: var(--azure); }
.card h3 { margin: 22px 0 0; font: 800 24px/1 var(--display); }
.big { font: 600 26px/1.2 var(--pixel); }
.big.ok { color: #1C7A2E; }
.state.testing { border-left: 12px solid var(--or); }
.state.open { border-left: 12px solid #2FA84A; }
.card.warn { border-left: 12px solid #D9480F; }
.card.fine { border-left: 12px solid #2FA84A; }
.quiet { color: var(--ink-soft); font-size: 16px; }
.bad { color: #A61E1E; font-weight: 600; }
.flash { margin-bottom: 20px; padding: 12px 16px; background: #E3F6E6; border-left: 6px solid #2FA84A; font-weight: 600; }
.list { list-style: none; margin: 12px 0 0; padding: 0; }
.list li { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; border-top: 1px solid var(--rule); }
.list li.down b { color: #A61E1E; }
.list li.up b { color: #1C7A2E; }
.pairs { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 16px; margin: 12px 0 0; }
.pairs dt { color: var(--ink-soft); }
.pairs dd { margin: 0; font-weight: 600; }
.row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.confirm { padding: 14px; background: var(--ground); border: 2px dashed var(--ink-soft); }
.confirm > * + * { margin-top: 12px; }
.mcbtn.danger { background: #A33; box-shadow: inset 2px 2px 0 #D77, inset -2px -3px 0 #711; }
.mcbtn.go { background: #3C8527; box-shadow: inset 2px 2px 0 #6FBF55, inset -2px -3px 0 #245A17; }
input[type=text], textarea { width: 100%; padding: 9px 11px; border: 2px solid var(--ink-soft); background: var(--white); color: var(--ink); font: 400 17px/1.45 var(--body); }
.confirm input { width: 180px; font-family: var(--pixel); }
textarea { resize: vertical; }
textarea.inuse { border-color: var(--or-deep); box-shadow: 0 0 0 3px var(--or-pale); }
.facts label { display: block; margin-top: 16px; font-weight: 700; }
.facts small, .pair small { display: block; color: var(--ink-soft); font-weight: 400; font-size: 14px; }
.facts > input { max-width: 420px; margin-top: 4px; }
.pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-top: 4px; }
.facts .row { margin-top: 22px; }
.result > * + * { margin-top: 12px; }
.change { padding: 10px 12px; background: var(--ground); border-left: 4px solid var(--sea); }
.change + .change { margin-top: 8px; }
.change .was { color: #8A2A2A; text-decoration: line-through; font-size: 16px; }
.change .now { color: #1C5E2A; font-size: 16px; font-weight: 600; }
table { width: 100%; border-collapse: collapse; }
td { padding: 7px 10px 7px 0; border-top: 1px solid var(--rule); vertical-align: top; }
td.num { font: 600 18px/1.4 var(--pixel); white-space: nowrap; }
@media (max-width: 520px) { .card { padding: 16px; } .card h1, .card h2 { font-size: 30px; } }