:root { --bg:#101418; --card:#1a2129; --line:#2a3440; --txt:#e8edf2; --mut:#9aa7b4;
        --acc:#4da3ff; --ok:#3ecf6e; --bad:#ff5d5d; --warn:#ffb020; }
* { box-sizing:border-box; }
/* author display rules override the UA stylesheet's [hidden] -> display:none,
   so re-assert it explicitly or JS show/hide breaks on styled elements */
[hidden] { display:none !important; }
body { margin:0; background:var(--bg); color:var(--txt);
       font-family:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
       max-width:640px; margin:0 auto; padding-bottom:3rem; }
.topbar { position:sticky; top:0; background:#0c0f13; border-bottom:1px solid var(--line); z-index:10; }
.brandrow { display:flex; align-items:center; justify-content:space-between; padding:.6rem .9rem; }
.logo { font-weight:800; font-size:1.1rem; }
.brandswitch select { background:var(--card); color:var(--txt); border:1px solid var(--line);
  border-radius:.5rem; padding:.45rem .6rem; font-size:.95rem; max-width:46vw; }
.tabs { display:flex; overflow-x:auto; border-top:1px solid var(--line); }
.tabs a { flex:1; text-align:center; padding:.6rem .3rem; color:var(--mut); text-decoration:none;
  font-size:.82rem; white-space:nowrap; border-bottom:2px solid transparent; }
.tabs a.on { color:var(--txt); border-bottom-color:var(--acc); }
main { padding:.9rem; }
h1 { font-size:1.35rem; margin:.4rem 0 .8rem; }
h1 small { color:var(--mut); font-weight:400; font-size:.85rem; }
h2 { font-size:1.05rem; margin:.2rem 0 .6rem; }
h3 { font-size:.95rem; margin:1rem 0 .4rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:.8rem;
  padding:.9rem; margin-bottom:.9rem; }
label { display:block; margin:.7rem 0; font-size:.92rem; }
input[type=text], input[type=datetime-local], select, textarea {
  width:100%; margin-top:.35rem; padding:.6rem; border-radius:.5rem;
  border:1px solid var(--line); background:#0f141a; color:var(--txt); font-size:.95rem; }
input[type=file] { margin-top:.35rem; width:100%; }
.check { display:flex; align-items:center; gap:.55rem; }
.check.big { font-size:1rem; padding:.35rem 0; }
.check input { width:1.15rem; height:1.15rem; accent-color:var(--acc); }
.req { color:var(--bad); }
.hint { color:var(--mut); font-size:.82rem; }
.warn { color:var(--warn); }
.err { color:var(--bad); }
.flash { background:var(--card); border:1px solid var(--line); border-left:4px solid var(--acc);
  padding:.7rem .9rem; border-radius:.5rem; }
.flash.ok { border-left-color:var(--ok); }
.flash.err { border-left-color:var(--bad); }
.flash.warn { border-left-color:var(--warn); }
code.key { word-break:break-all; background:#0f141a; padding:.4rem; border-radius:.4rem;
  display:block; margin-top:.4rem; }
.btn { display:inline-block; background:var(--acc); color:#06121f; border:0; border-radius:.6rem;
  padding:.65rem 1.1rem; font-size:.95rem; font-weight:700; text-decoration:none; cursor:pointer; }
.btn.primary.big { width:100%; padding:.9rem; font-size:1.05rem; margin-top:.4rem; }
.btn.small { padding:.35rem .7rem; font-size:.8rem; }
.btn.danger { background:#3a2226; color:#ff8a8a; }
.tbl { width:100%; border-collapse:collapse; font-size:.85rem; }
.tbl th, .tbl td { text-align:left; padding:.5rem .4rem; border-bottom:1px solid var(--line);
  vertical-align:top; }
.tbl th { color:var(--mut); font-weight:600; font-size:.75rem; text-transform:uppercase; }
.chip { display:inline-block; padding:.15rem .55rem; border-radius:99px; font-size:.75rem;
  font-weight:700; background:#2a3440; }
.chip.queued { background:#2b3a4d; color:#9cc8ff; }
.chip.publishing { background:#3d3a1e; color:#ffd97a; }
.chip.retry { background:#3d3a1e; color:#ffd97a; }
.chip.published { background:#1d3a28; color:#7de6a3; }
.chip.failed { background:#3d2226; color:#ff9a9a; }
.dot { display:inline-block; width:.6rem; height:.6rem; border-radius:99px; background:#555; margin-right:.4rem; }
.dot.ok { background:var(--ok); } .dot.no { background:var(--bad); }
.checklist { list-style:none; padding:0; margin:.4rem 0; }
.checklist li { padding:.45rem 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.statrow { display:flex; gap:.6rem; margin:.6rem 0; }
.stat { flex:1; background:#0f141a; border:1px solid var(--line); border-radius:.6rem;
  padding:.6rem; text-align:center; }
.stat b { display:block; font-size:1.4rem; }
.stat span { color:var(--mut); font-size:.75rem; }
.stat.bad b { color:var(--bad); }
.rows { list-style:none; padding:0; margin:.5rem 0; }
.rows li { padding:.5rem 0; border-bottom:1px solid var(--line); font-size:.88rem; }
.rows small { color:var(--mut); }
.acct-note { color:var(--mut); font-size:.78rem; margin-left:.4rem; }
.override { margin-left:1.7rem; }
.audit-flag { display:inline-block; background:#3d3a1e; color:#ffd97a; border-radius:.5rem;
  padding:.35rem .6rem; font-size:.8rem; margin:.3rem 0; }
.audit-ok { display:inline-block; background:#1d3a28; color:#7de6a3; border-radius:.5rem;
  padding:.35rem .6rem; font-size:.8rem; margin:.3rem 0; }
.mini { font-size:.78rem; color:var(--acc); }
.nowrap { white-space:nowrap; }
.inline-form { display:flex; gap:.5rem; margin-bottom:1rem; }
.inline-form input { flex:1; margin:0; }
.code { background:#0f141a; padding:.7rem; border-radius:.5rem; font-size:.78rem;
  overflow-x:auto; white-space:pre; }
footer { text-align:center; color:var(--mut); font-size:.75rem; padding:1rem; }
a { color:var(--acc); }