/* Console-only layout. style.css stays byte-identical to whatsmybiz.app - never edit that file here. */
body { background: var(--bg); color: var(--ink); font-family: var(--font-body); }
.wrap.wide { max-width: 1040px; }
.top { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:18px 0 10px; }
.top .who { color: var(--muted); font-size: 13px; }
.stack > * + * { margin-top: 12px; }
.grid2 { display:grid; grid-template-columns: 1fr; gap:12px; }
@media (min-width: 860px) { .grid2 { grid-template-columns: 1.4fr 1fr; } }
.rowline { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.rot { display:flex; gap:12px; align-items:flex-start; }
.rot .num { font-family: var(--font-mono); font-size: 22px; color: var(--gold-dim); min-width: 34px; }
.rot .body { flex:1; min-width:0; }
.rot .t { font-weight:600; font-size:16px; word-break:break-word; }
.rot .s { color: var(--muted); font-size:13px; }
.rot.done { opacity:.55; }
.chip.now { background: var(--green-soft); color: var(--green-deep); }
.chip.blocked { background: #f6e2df; color: var(--rust); }
.chip.warn { background: #f6efdd; color: var(--gold-dim); }
.nowplaying { font-family: var(--font-head); font-size: clamp(20px, 3.4vw, 32px); line-height:1.15; }
.stage-title { font-family: var(--font-head); font-size: clamp(30px, 6vw, 64px); line-height:1.05; }
.msg { font-family: var(--font-mono); font-size: 12px; color: var(--muted); word-break: break-word; }
.msg.err { color: var(--rust); }
.msg.ok { color: var(--green-deep); }
.mini { font-family: var(--font-mono); font-size: 11px; color: var(--muted); }
.footnote { border-top:1px solid var(--line); margin-top:34px; padding-top:14px; color: var(--muted); font-size:12px; line-height:1.6; }
@media (max-width: 560px) { .btn { width:100%; } }

/* ---- theme toggle (uses the [data-theme="dark"] block already in style.css) ---- */
.brandbar { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:14px 0 6px; border-bottom:1px solid var(--line); }
.brandbar .brand { font-family: var(--font-head); font-size:20px; font-weight:600; letter-spacing:-0.01em; }
.brandbar .nav { display:flex; gap:14px; align-items:center; flex-wrap:wrap; font-size:13px; }
.brandbar .nav a { color: var(--ink-soft); text-decoration:none; border-bottom:1px solid transparent; }
.brandbar .nav a:hover { border-bottom-color: var(--green); }
.theme-toggle { background:transparent; border:1px solid var(--line); color: var(--ink-soft); border-radius: var(--radius); padding:6px 10px; font:inherit; font-size:12px; cursor:pointer; }
.theme-toggle:hover { border-color: var(--green); color: var(--ink); }
.doodle { background-image: var(--doodle); }

/* ---- singers + rotation ---- */
.singer { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:7px 0; border-bottom:1px dashed var(--line); }
.singer:last-child { border-bottom:0; }
.singer .n { font-weight:600; }
.singer .wa { font-family: var(--font-mono); font-size:11px; color: var(--muted); }
.rot .singer-tag { font-family: var(--font-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color: var(--gold-dim); }
select { background: var(--surface); color: var(--ink); border:1px solid var(--line); border-radius: var(--radius); padding:6px 8px; font:inherit; font-size:13px; }
.rot .num.singer { font-family: var(--font-head); font-size:15px; color: var(--green-deep); }