/* ============================================================================
   The server dashboard's OWN layout — everything else comes from the agent's
   style.css, which is linked into this project at build.

   ⚠ Only put a rule here if it describes something the agent does not have.
   Anything that is really a design decision (a colour, a radius, a button
   shape) belongs in the shared sheet, or the two halves start looking like
   two apps again — which is the whole reason the sheet is shared.
   ========================================================================== */

h2 { font-size: 15px; margin: 0 0 10px; letter-spacing: .2px; }
h3 { font-size: 13px; margin: 0 0 6px; letter-spacing: .2px; }
.hidden { display: none !important; }

/* A row of fields that wraps on a phone. The dashboard is read on one far more
   often than the agent page is — it is the half you check from the sofa. */
.row { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.row .grow { flex: 1 1 180px; min-width: 0; }
.set-field.check { flex-direction: row; align-items: center; gap: 8px; }
.actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }

/* One tool per block inside the owner card, separated rather than boxed —
   three cards would make the page read as three unrelated things. */
.tool { padding-top: 14px; margin-top: 14px; border-top: 1px solid var(--line); }
.tool:first-of-type { padding-top: 0; margin-top: 0; border-top: 0; }

/* An account line: name, balance, and what moved it last. */
.acct {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  padding: 9px 0; border-top: 1px solid var(--line);
}
.acct:first-child { border-top: 0; }
.acct-name { font-weight: 700; flex: 1 1 auto; min-width: 0; }
.acct-amt { font-family: var(--display); font-weight: 700; font-size: 18px; color: var(--accent); }
.acct-amt.negative { color: var(--red); }
.acct-sub { flex: 1 1 100%; font-size: 12px; color: var(--muted); }

/* A warning the server raised about an account — a rewound restore, or an
   opening arcade figure that landed after a balance was set. It never changes
   a number, so it has to be READ to be worth raising. */
.acct-warn {
  flex: 1 1 100%; margin-top: 6px; padding: 8px 10px; border-radius: 8px;
  background: rgba(240, 83, 58, .10); border: 1px solid var(--red);
  color: var(--text); font-size: 12.5px;
}

.lease { display: flex; gap: 10px; align-items: baseline; padding: 7px 0; border-top: 1px solid var(--line); }
.lease:first-child { border-top: 0; }
.lease-what { flex: 1 1 auto; min-width: 0; }
.lease-amt { font-family: var(--display); color: var(--accent); }
.lease.odd .lease-amt { color: var(--red); }

.dev { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; font-size: 13px; }
.dev-label { flex: 1 1 auto; min-width: 0; }
.dev.revoked { color: var(--muted); text-decoration: line-through; }

/* The one-line result under a tool: what just happened, in words. */
.econ-status { margin-top: 10px; font-size: 13px; }
.econ-status.no { color: var(--red); }
.econ-status.yes { color: var(--accent-2); }

/* A code, once issued — big enough to read aloud over the phone, which is
   exactly how it gets used. */
.code-out {
  font-family: var(--display); font-size: 26px; font-weight: 700;
  letter-spacing: .18em; color: var(--accent); text-shadow: var(--glow);
}

/* A game running with no ▶ session: worth saying, not worth shouting. Inline in the
   machine's own line, because it is a fact ABOUT that machine rather than an alert. */
.warn-inline { color: var(--accent); }

/* The ▶ row under a machine. Small buttons, because there are seven of them and
   they are a convenience — the real button is on the PC itself. */
.launch-row { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
.launch-row button { padding: 4px 9px; font-size: 12px; }
.launch-row .econ-status { margin-top: 0; flex: 1 1 100%; }

/* The screen wake lock (stage 6). This one control is the whole replacement for the retired Android
   viewer's FLAG_KEEP_SCREEN_ON, so it sits under the server's own health line rather than in a
   settings drawer — the tablet propped up in the workshop is the case it exists for.
   It reads as ON by colour, because the label alone ("Keep the screen awake" vs "Screen stays awake")
   is too easy to misread at a glance across a room. */
.wake-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.wake-row button.yes { color: var(--accent-2); border-color: var(--accent-2); }