/* The one stylesheet the portals share. Same warm neutral palette as your
   admin page, so the whole thing looks like one product. */
:root{
  --bg:#faf9f7; --card:#fff; --ink:#1a1a19; --muted:#6f6c66; --line:#e7e4de;
  --accent:#1a1a19; --good:#1f7a4d; --goodbg:#eaf5ee;
  --warn:#8a5a12; --warnbg:#fdf6e7; --bad:#9b2c2c; --badbg:#fbeeee;
  --radius:16px; --pill:9999px;
  --shadow:0 0 0 1px rgba(26,26,25,.06), 0 1px 2px rgba(26,26,25,.05);
  --shadow-lift:0 0 0 1px rgba(26,26,25,.08), 0 6px 20px rgba(26,26,25,.08);
}
@media (prefers-color-scheme:dark){
  :root{ --bg:#14140f; --card:#1d1d19; --ink:#f2f0ea; --muted:#a09c93; --line:#2e2e28;
    --accent:#f2f0ea; --good:#5fc18c; --goodbg:#16291e; --warn:#e0b05a; --warnbg:#2a2318;
    --bad:#e08a8a; --badbg:#2b1a1a;
    --shadow:0 0 0 1px rgba(255,255,255,.07);
    --shadow-lift:0 0 0 1px rgba(255,255,255,.1), 0 6px 20px rgba(0,0,0,.4);}
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding:0 16px 64px;-webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin:0 auto}
.narrow{max-width:400px}
header{padding-block:24px 16px;display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
header .grow{flex:1;min-width:180px}
h1{font-size:20px;margin:0 0 2px;letter-spacing:-.02em}
.sub{color:var(--muted);font-size:13px}
h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  margin:32px 0 10px;font-weight:600}
h3{font-size:15px;margin:0 0 4px;letter-spacing:-.01em}
.card{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);
  padding:14px;margin-bottom:10px}
.card.lift{box-shadow:var(--shadow-lift)}
.stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.stat{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);
  padding:10px 14px;min-width:92px;flex:1 1 92px}
.stat b{display:block;font-size:22px;letter-spacing:-.03em;line-height:1.2}
.stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.banner{margin-top:12px;padding:10px 14px;border-radius:var(--radius);
  background:var(--warnbg);color:var(--warn);font-size:13px;box-shadow:var(--shadow)}
.banner.bad{background:var(--badbg);color:var(--bad)}
.banner.good{background:var(--goodbg);color:var(--good)}
.pill{display:inline-block;font-size:11px;padding:2px 9px;border-radius:var(--pill);
  background:var(--bg);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}
.pill.go{background:var(--good);color:#fff;box-shadow:none}
.pill.wait{background:var(--warnbg);color:var(--warn);box-shadow:none}
.pill.no{background:var(--badbg);color:var(--bad);box-shadow:none}
.who{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:6px}
label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px}
input,select,textarea{width:100%;padding:11px 12px;border-radius:12px;
  border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:15px}
textarea{min-height:80px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ink);outline-offset:-1px}
.field{margin-bottom:10px}
.two{display:flex;gap:8px;flex-wrap:wrap}
.two>*{flex:1 1 150px}
.row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
button{padding:11px 14px;border-radius:var(--pill);border:0;font:inherit;
  font-weight:600;font-size:14px;cursor:pointer;background:var(--accent);color:var(--bg)}
button.wide{width:100%}
button.ghost{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
button.small{padding:7px 12px;font-size:13px}
button:disabled{opacity:.45;cursor:default}
table{width:100%;border-collapse:collapse;font-size:13px}
td,th{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
tr:last-child td{border-bottom:0}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.empty{color:var(--muted);font-size:13px;padding:14px 0}
.err{color:var(--bad);font-size:13px;margin-top:8px;min-height:18px}
.ok{color:var(--good);font-size:13px;margin-top:8px}
a{color:inherit}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;word-break:break-all}
details.box{padding:0;background:var(--card);box-shadow:var(--shadow);
  border-radius:var(--radius);margin-bottom:10px}
details.box summary{padding:14px;cursor:pointer;font-weight:600;font-size:14px;list-style:none}
details.box summary::-webkit-details-marker{display:none}
details.box summary::before{content:'+ ';color:var(--muted)}
details.box[open] summary::before{content:'– '}
details.box .body{padding:0 14px 14px}
.tabs{display:flex;gap:6px;margin-bottom:16px;background:var(--card);padding:4px;
  border-radius:var(--pill);box-shadow:var(--shadow)}
.tabs button{flex:1;background:transparent;color:var(--muted);font-size:13px;padding:9px}
.tabs button[aria-selected=true]{background:var(--accent);color:var(--bg)}
.muted{color:var(--muted)}
.small{font-size:12px}
.right{margin-left:auto}
