/* Meazured admin shell, day 0. Tokens and components from the product design (ui-v6): paper and ink, hairlines and ticks;
   red is the needle, a flag or a warning, nothing else. Also styles the server-rendered sign-in pages (body.auth-body). */
@font-face{font-family:"Archivo";src:url("/fonts/archivo-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root,[data-theme="paper"]{
  --bg:#F7F2E8; --panel:#FBF8F2; --sunk:#F1EBDF; --ink:#1A1D26; --ink-2:#3A3934; --muted:#6B665B; --faint:#9A9484;
  --hair:#E6DECE; --hair-2:#D4C9B4; --tick:rgba(26,29,38,.42); --red:#D02815; --red-soft:rgba(208,40,21,.09); --red-txt:#B42210;
  --key:#1A1D26; --key-t:#F7F2E8; --key-side:#05060A; --hatch:rgba(26,29,38,.07); --shadow:0 1px 0 rgba(26,29,38,.04);
  --sans:"Archivo",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; --mono:ui-monospace,"SF Mono",Menlo,monospace;
  --barh:60px; --railw:216px; color-scheme:light;
}
[data-theme="ink"]{
  --bg:#12141A; --panel:#1A1D26; --sunk:#15171E; --ink:#F3EEE4; --ink-2:#D3CDC1; --muted:#9C978B; --faint:#6E6A61;
  --hair:#2A2D37; --hair-2:#373A45; --tick:rgba(243,238,228,.4); --red:#E0402B; --red-soft:rgba(224,64,43,.14); --red-txt:#F06A55;
  --key:#F3EEE4; --key-t:#12141A; --key-side:#9C978B; --hatch:rgba(243,238,228,.06); color-scheme:dark;
}
:root{--vah:0px}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--barh) + 16px)}
body{background:var(--bg);color:var(--ink);font:400 14px/1.5 var(--sans);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img,svg{display:block}
a{color:var(--ink);text-decoration-color:var(--hair-2);text-underline-offset:3px}
a:hover{text-decoration-color:var(--ink)}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:0;color:var(--muted)}
.wm-i,.li{display:none}
[data-theme="ink"] .wm-p,[data-theme="ink"] .lp{display:none}
[data-theme="ink"] .wm-i,[data-theme="ink"] .li{display:inline-block}

/* keys: off the page, flat 1px side, fire on the rebound */
.key{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:2px;background:var(--panel);color:var(--ink);
  box-shadow:inset 0 0 0 1px var(--hair-2),0 1px 0 var(--hair-2);font:500 13px/1 var(--sans);white-space:nowrap;transition:transform 50ms,box-shadow 50ms,background-color .15s}
.key:hover{box-shadow:inset 0 0 0 1px var(--muted),0 1px 0 var(--muted)}
.key.down{transform:translateY(1px);box-shadow:inset 0 0 0 1px var(--muted)}
.key--latch.on{background:var(--key);color:var(--key-t);box-shadow:0 1px 0 var(--key-side)}
.key--icon{width:32px;padding:0;justify-content:center}
.key--icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}
.key--icon .fillc{fill:currentColor;stroke:none}
.key:disabled{opacity:.55;cursor:default}
.key:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
a.key{text-decoration:none}
.info{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--hair-2);font:500 10.5px/18px var(--mono);color:var(--muted);text-align:center;flex:none}
.info:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

/* the bar */
.bar{position:fixed;top:0;left:0;right:0;height:var(--barh);z-index:30;display:flex;align-items:center;gap:14px;padding:0 18px;background:var(--bg);border-bottom:1px solid var(--hair-2)}
.wm{height:21px;flex:none;display:flex;align-items:center;padding-right:16px;border-right:1px solid var(--hair-2);margin-right:2px}
.wm svg,.wm img{height:21px;width:auto}
.bar-ctx{font:600 14px/1.2 var(--sans);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-r{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.menu{position:absolute;top:40px;left:0;min-width:320px;background:var(--panel);box-shadow:0 0 0 1px var(--hair-2),0 18px 40px -18px rgba(26,29,38,.35);border-radius:3px;padding:6px;z-index:40}
.menu button{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center;width:100%;padding:9px 10px;border-radius:2px;text-align:left}
.menu button:hover,.menu button.on{background:var(--sunk)}
.menu b{font-weight:600}.menu .mono{white-space:nowrap}
.rail-toggle{display:none}

/* view as: a flag across the page, under the bar */
.va{position:fixed;top:var(--barh);left:0;right:0;height:var(--vah);z-index:29;display:flex;align-items:center;gap:12px;padding:0 18px;
  background:linear-gradient(var(--red-soft),var(--red-soft)),var(--bg);border-bottom:1px solid var(--red);font-size:13px;line-height:1.35}
.va i{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none}
.va span{min-width:0}
.va .key{margin-left:auto;flex:none}
.va-on{--vah:48px}

/* the rail: a scale, the active module marked by the red tick */
.rail{position:fixed;top:calc(var(--barh) + var(--vah));bottom:0;left:0;width:var(--railw);padding:22px 0 18px 18px;border-right:1px solid var(--hair-2);background:var(--bg);z-index:20;display:flex;flex-direction:column;overflow-y:auto}
.rail ol{list-style:none;position:relative}
.rail ol::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--hair-2)}
.rail li a,.rail li .soon{position:relative;display:flex;align-items:center;gap:10px;padding:7px 14px 7px 18px;color:var(--ink-2);text-decoration:none;font-size:14px}
.rail li a::before,.rail li .soon::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1px;background:var(--tick);transition:width .2s,background-color .2s}
.rail li a:hover{color:var(--ink)}
.rail li a.on{color:var(--ink);font-weight:600}
.rail li a.on::before{width:14px;height:2px;margin-top:-.5px;background:var(--red)}
.rail li .soon{color:var(--faint);cursor:default}
.rail li.gap{height:14px}
.rail .n{margin-left:auto;font:400 11px var(--mono);color:var(--muted)}

/* main */
.main{margin-left:var(--railw);padding:calc(var(--barh) + var(--vah) + 22px) 28px 48px;max-width:calc(1320px + var(--railw));display:flex;flex-direction:column;gap:28px}
.no-rail{--railw:0px}
.no-rail .main{margin:0 auto;max-width:960px}
.mod{display:flex;flex-direction:column;gap:14px}
.m-head,.p-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.m-head h2{font:600 19px/1.2 var(--sans);letter-spacing:-.01em}
.p-head h2{font:600 15px/1.2 var(--sans)}
.count{font:400 12px var(--mono);color:var(--muted)}
.p-tools{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
/* a panel carries registration ticks at its corners */
.panel{position:relative;background:var(--panel);border-radius:3px;box-shadow:inset 0 0 0 1px var(--hair);padding:18px 20px;
  background-image:linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),
    linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick)),linear-gradient(var(--tick),var(--tick));
  background-size:9px 1px,1px 9px,9px 1px,1px 9px,9px 1px,1px 9px,9px 1px,1px 9px;
  background-position:-1px -1px,-1px -1px,calc(100% + 1px) -1px,calc(100% + 1px) -1px,-1px calc(100% + 1px),-1px calc(100% + 1px),calc(100% + 1px) calc(100% + 1px),calc(100% + 1px) calc(100% + 1px);
  background-repeat:no-repeat;background-color:var(--panel)}
.panel.flush{padding:0}
.panel.flush>.err,.panel.flush>.p-head{padding:16px 20px}
.panel.stack{gap:14px}

/* context line */
.ctx{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ctx-title{font:600 30px/1.1 var(--sans);letter-spacing:-.025em;overflow-wrap:anywhere}
.tag{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:2px;font:500 11px/1 var(--mono);box-shadow:inset 0 0 0 1px var(--hair-2);color:var(--ink-2);align-self:center;white-space:nowrap}
.tag i{width:6px;height:6px;border-radius:50%;background:var(--red)}
.tag.done i{background:none;box-shadow:inset 0 0 0 1.5px var(--muted)}
.ctx-meta{font:400 11.5px var(--mono);color:var(--muted);display:flex;gap:16px;flex-wrap:wrap;margin-left:auto}

/* tables are records: aligned, quiet */
.tbl-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{position:sticky;top:0;text-align:right;font:500 11.5px/1.3 var(--sans);color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--hair-2);background:var(--panel);white-space:nowrap}
.tbl th:first-child{text-align:left;padding-left:20px}
.tbl td{text-align:right;padding:9px 12px;border-bottom:1px solid var(--hair);white-space:nowrap;vertical-align:middle}
.tbl td:first-child{text-align:left;padding-left:20px;white-space:normal;min-width:230px}
.tbl tr:last-child td{border-bottom:0}
.tbl--l th,.tbl--l td{text-align:left}
.tbl--l th.r,.tbl--l td.r{text-align:right}
.tbl th:last-child,.tbl td:last-child{padding-right:20px}
.tbl .nm small{display:block;font:400 10.5px var(--mono);color:var(--muted);margin-top:1px;overflow-wrap:anywhere}
.tbl .na{color:var(--faint)}
.tbl tr.flagged td:first-child{box-shadow:inset 2px 0 0 var(--red)}
.tbl tr.ask>td{background:var(--sunk);white-space:normal;padding:14px 20px}
.tbl select{height:30px;width:auto}
.tbl td.w{white-space:normal;min-width:200px}
.tbl tr.ask>td>*{position:sticky;left:20px;max-width:min(900px,calc(100vw - 60px))}
.tbl tr.ask .row>.f{flex:0 1 340px}
a.lnk{font-weight:600;text-decoration:none}
a.lnk:hover{text-decoration:underline}
.acts{display:flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:4px}
.chip{font:400 11px/1 var(--mono);padding:5px 6px;border-radius:2px;box-shadow:inset 0 0 0 1px var(--hair-2);color:var(--ink-2)}
.chip i{font-style:normal;color:var(--muted);margin-left:6px}
.diff{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.diff b{display:block;font:500 12px var(--sans);color:var(--muted);margin-bottom:6px}
pre{font:400 11.5px/1.55 var(--mono);color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel);box-shadow:inset 0 0 0 1px var(--hair);border-radius:2px;padding:10px 12px;max-height:360px;overflow:auto}

/* forms: labels above, fields as sunk wells */
.f{display:flex;flex-direction:column;gap:5px;min-width:0}
.f>span{font:500 12.5px/1.2 var(--sans);color:var(--muted)}
input,select{font:400 14px var(--sans);color:var(--ink);height:34px;padding:0 10px;border:0;border-radius:2px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--hair-2);width:100%;min-width:0}
input:focus,select:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
input[type=checkbox]{width:18px;height:18px;padding:0;box-shadow:none;accent-color:var(--ink);flex:none}
.chk{display:flex;align-items:center;gap:8px;min-height:34px;font-size:13.5px;cursor:pointer}
.stack{display:flex;flex-direction:column;gap:14px}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.row>.f{flex:1 1 170px}
.row>.key{height:34px}
.stack>.key{align-self:flex-start}
.stack>.acts{justify-content:flex-start}
.err{display:flex;gap:8px;align-items:baseline;font-size:13px;color:var(--red-txt)}
.err::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none;transform:translateY(-1px)}
.note{font-size:13px;color:var(--ink-2)}
.empty{padding:18px 20px;color:var(--muted);font-size:13.5px}
.linkbox{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:2px;background:var(--sunk);box-shadow:inset 0 0 0 1px var(--hair-2)}
.linkbox .acts{justify-content:flex-start}
.wrap{overflow-wrap:anywhere;word-break:break-all}
p.mono.wrap{font-size:12px;color:var(--ink)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px 24px}
.dl div{display:flex;flex-direction:column;gap:2px;min-width:0}
.dl dt{font:500 12px var(--sans);color:var(--muted)}
.dl dd{overflow-wrap:anywhere}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
a.card{display:flex;flex-direction:column;gap:6px;min-height:88px;text-decoration:none}
a.card:hover{box-shadow:inset 0 0 0 1px var(--muted)}
a.card b{font:600 17px/1.2 var(--sans);overflow-wrap:anywhere}

/* the server-rendered sign-in pages */
.auth-body{min-height:100vh}
.auth{max-width:420px;margin:0 auto;padding:56px 16px 40px;display:flex;flex-direction:column;gap:16px}
.auth-wm{display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;margin-bottom:6px}
.auth-wm img{height:22px;width:auto}
.auth h1{font:600 26px/1.15 var(--sans);letter-spacing:-.02em}
.auth p{font-size:14px;color:var(--ink-2)}
.auth b{font-weight:600;color:var(--ink)}
.auth .f input{height:44px;font-size:16px}
.auth .key{height:44px;justify-content:center}
.auth form.stack .key{align-self:stretch}
.auth .mono{font-size:12px}
.auth p.mono.wrap{color:var(--ink);padding:12px;background:var(--sunk);border-radius:2px;box-shadow:inset 0 0 0 1px var(--hair-2)}
.auth p.auth-foot{margin-top:20px;padding-top:14px;border-top:1px solid var(--hair);color:var(--faint)}
.auth a:not(.auth-wm){display:inline-flex;align-items:center;min-height:44px}

@media (max-width:1000px){
  :root{--railw:0px}
  .rail{transform:translateX(-100%);width:240px;transition:transform .25s;box-shadow:24px 0 48px -32px rgba(26,29,38,.4)}
  .rail.open{transform:none}
  .rail-toggle{display:inline-flex}
}
@media (max-width:760px){
  :root{--barh:104px}
  .no-ctx{--barh:64px}
  .bar{flex-wrap:wrap;height:var(--barh);padding:10px 14px;gap:10px;align-content:flex-start}
  .wm{border-right:0;padding-right:0;height:44px}
  .bar-ctx{order:5;flex:1 1 100%}
  .va-on{--vah:72px}
  .va{padding:8px 14px;font-size:12.5px}
  .main{padding:calc(var(--barh) + var(--vah) + 16px) 14px 36px;gap:24px}
  .ctx-title{font-size:24px}.ctx-meta{margin-left:0}
  .p-tools{margin-left:0;width:100%}
  .grid2,.diff{grid-template-columns:1fr}
  .tbl td:first-child{min-width:180px;position:sticky;left:0;background:var(--panel);z-index:1}
  .tbl th:first-child{position:sticky;left:0;z-index:2}
  .tbl tr.ask>td:first-child{position:static;background:var(--sunk)}
  /* the phone floor: 12px type, 44px targets */
  .key,.row>.key,.tbl select{height:44px}.key{padding:0 14px}.key--icon{width:44px;padding:0}
  input,select{height:44px;font-size:16px}
  .chk,.rail li a,.rail li .soon,.tbl a.lnk,a.inl{min-height:44px}
  .tbl a.lnk,a.inl{display:inline-flex;align-items:center}
  .mono,.tag,.tbl th,.rail .n,.tbl .nm small,.ctx-meta,.chip,.f>span,.dl dt,pre{font-size:12px}
  .tag{height:26px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
