:root{--bg:#eef1ec;--panel:#fff;--panel2:#f6f8f4;--ink:#18212b;--muted:#5d6771;--line:#dbe0d7;--accent:#a8570c;--accent-soft:#f6e6d2;--ok:#1d6a55;--ok-soft:#dcefe6;--warn:#b4231b;--warn-soft:#fbe3e0;--amber:#8f5d12;--amber-soft:#fbefd6;--shadow:0 1px 2px rgba(24,33,43,.06),0 10px 30px rgba(24,33,43,.08)}
@media (prefers-color-scheme:dark){:root{--bg:#0d1216;--panel:#151c22;--panel2:#1a232a;--ink:#e8edef;--muted:#9aa6b0;--line:#28323b;--accent:#f0a24a;--accent-soft:#3a2914;--ok:#62c6a4;--ok-soft:#163128;--warn:#ff8a7f;--warn-soft:#3d1a17;--amber:#f2c063;--amber-soft:#3a2d12;--shadow:none;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
h1,h2,h3,p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
.hidden{display:none!important}
.muted{color:var(--muted)}.small{font-size:.86rem}.grow{flex:1}.num{font-variant-numeric:tabular-nums}.r{text-align:right}
header{position:sticky;top:0;z-index:5;background:var(--panel);border-bottom:1px solid var(--line)}
.toprow{display:flex;align-items:center;gap:10px;padding:10px 16px}
nav{display:flex;gap:4px;overflow-x:auto;padding:0 12px 8px;scrollbar-width:none}
nav::-webkit-scrollbar{display:none}
nav button{flex:none;border:0;background:none;padding:8px 12px;border-radius:10px;color:var(--muted);font-weight:600}
nav button.on{background:var(--accent-soft);color:var(--accent)}
.badge{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:999px;background:var(--warn);color:#fff;font-size:.75rem;text-align:center}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{border:0;background:none;padding:6px 12px;font-weight:600;color:var(--muted)}
.seg button.on{background:var(--ink);color:var(--bg)}
.link{border:0;background:none;color:var(--muted);text-decoration:underline;padding:4px;white-space:nowrap}
#page{max-width:760px;margin:0 auto;padding:16px;display:grid;gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow);min-width:0}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tile small{display:block;color:var(--muted)}.tile b{display:block;font-size:1.5rem;overflow-wrap:anywhere}
.tile.big{grid-column:1/-1}.tile.big b{font-size:2.2rem}
.split{display:grid;gap:6px}
.split div{display:flex;justify-content:space-between}
.row{display:block;width:100%;border:0;border-bottom:1px solid var(--line);background:none;padding:12px 2px;text-align:left}
.list .row:last-child{border-bottom:0}
.rowtop{display:flex;gap:10px;justify-content:space-between;align-items:baseline}
.rowtop span:first-child{min-width:0;overflow-wrap:anywhere}
.open{padding:0 2px 12px;border-bottom:1px solid var(--line);display:grid;gap:8px}
.pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:.78rem;font-weight:600;background:var(--panel2);color:var(--muted)}
.pill.bad{background:var(--warn-soft);color:var(--warn)}.pill.ok{background:var(--ok-soft);color:var(--ok)}.pill.amber{background:var(--amber-soft);color:var(--amber)}
input,select,textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
label{display:grid;gap:4px;font-size:.88rem;color:var(--muted)}
.form{display:grid;gap:10px}
.primary,.ghost,.danger{border-radius:10px;padding:10px 14px;font-weight:600}
.primary{border:0;background:var(--accent);color:#fff}
@media (prefers-color-scheme:dark){.primary{color:#1a1206}}
.primary:disabled{opacity:.5}
.ghost{border:1px solid var(--line);background:none}
.danger{border:1px solid var(--warn);background:none;color:var(--warn)}
.btns{display:flex;flex-wrap:wrap;gap:8px}
.err{color:var(--warn);min-height:1.2em;font-size:.9rem}
.login{min-height:100vh;display:grid;place-items:center;padding:16px}
.login form{width:min(380px,100%);display:grid;gap:12px}
.code{font-family:ui-monospace,Menlo,monospace;font-size:2rem;letter-spacing:.2em;text-align:center}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:9;max-width:calc(100vw - 32px);padding:10px 14px;border-radius:12px;background:var(--ink);color:var(--bg);box-shadow:var(--shadow)}
.empty{color:var(--muted);text-align:center;padding:18px 0}
pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font:inherit}
