/* The app shell. Lifted verbatim out of app.html so every logged-in screen wears
   the same chrome: rail, top bar, one scrolling view. Do not restyle per page. */
:root{--cream:#f6ecd9;--cream2:#efe2c9;--ink:#1c1612;--ink2:#6d6158;--ink3:#a1948a;--hot:#ff6a4d;--line:#e6dac4;--green:#2f7a48;--amber:#c08a1e;--red:#b4483a;--gold:#d8b25e;--hue:22}
*{box-sizing:border-box}html,body{height:100%;margin:0}
body{background:var(--cream);color:var(--ink);font-family:Geist,system-ui,sans-serif;font-size:14.5px;-webkit-font-smoothing:antialiased;overflow:hidden}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
.app{display:grid;grid-template-columns:212px minmax(0,1fr);height:100vh}
/* rail */
.rail{background:#fbf2e2;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:14px 11px;height:100vh}
.brand{display:flex;align-items:center;gap:9px;padding:5px 7px 18px;font-family:'Archivo Black',sans-serif;font-size:15px;letter-spacing:.04em}
.brand i{width:20px;height:20px;background:var(--ink);display:block;position:relative}
.brand i:after{content:"";position:absolute;inset:5px;background:var(--hot)}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 11px;font-weight:600;color:var(--ink2)}
.nav a:hover{background:var(--cream2)}
.nav a.on{background:var(--ink);color:#fff}
.nav a i{font-style:normal;width:16px;text-align:center;font-size:13px}
.nav a b{margin-left:auto;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;opacity:.7}
.kids{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.kids .lbl{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink3);padding:0 7px 9px}
.kids a{display:flex;align-items:center;gap:9px;padding:6px 7px;font-size:13.5px;font-weight:600}
.kids a:hover{background:var(--cream2)}
.kids a.on{background:var(--cream2)}
.av{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;font-family:'Archivo Black',sans-serif;font-size:10px;flex:none}
.me{margin-top:auto;padding:11px 8px 2px;border-top:1px solid var(--line);display:flex;align-items:center;gap:9px}
.me b{font-size:13px}.me span{display:block;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.09em;color:var(--ink3)}
/* main */
.main{display:grid;grid-template-rows:54px minmax(0,1fr);min-width:0;height:100vh}
.top{display:flex;align-items:center;gap:13px;padding:0 20px;border-bottom:1px solid var(--line);background:var(--cream)}
.top h1{font-family:'Archivo Black',sans-serif;font-size:17px;margin:0;letter-spacing:-.01em}
.top .sub{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink3)}
.sp{flex:1}
.btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;font-weight:700;font-size:13px;background:var(--ink);color:#fff;border:0}
.btn.h{background:var(--hot);color:#111}
.btn.o{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.s{padding:6px 11px;font-size:12px}
.view{overflow-y:auto;overflow-x:hidden;height:calc(100vh - 54px);padding:20px}

/* shared bits every view needs */
.panel{background:#fffdf7;border:1px solid var(--line);padding:16px 18px}
.panel+.panel{margin-top:14px}
.panel h2{font-family:'Archivo Black',sans-serif;font-size:14px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.panel h2 .n{margin-left:auto;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.1em;color:var(--ink3);font-weight:400}
.lab{font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.pill{padding:6px 12px;font-size:12.5px;font-weight:600;background:#fffdf7;border:1px solid var(--line);cursor:pointer;font-family:inherit;color:var(--ink2)}
.pill.on{background:var(--ink);border-color:var(--ink);color:#fff}
.pill.hot{background:var(--hot);border-color:var(--hot);color:#111}
.note{font-size:13px;color:var(--ink2);margin:0 0 14px;line-height:1.5;max-width:720px}