/* 7Maps cockpit: the shared visual language of every 7Maps page (static pages under /7maps/ and the server
   pages rendered by api/maps.ts pageShell). Loaded after each page's own <style> and after the site chrome,
   so it sets the tokens every page already uses (--bg, --card, --ink, --mute, --line, --acc and the status
   colours under their several local names) and restyles the shared pieces: panels (.card), headings, chips,
   numbers, inputs, buttons, tables, code, the 7Maps strip under the site header, and the site footer.
   Injected by scripts/build-7maps-chrome.mjs (static pages) and api/_chrome.ts (server pages); never by hand.
   Dark by design: a control room. One accent (the 7IT blue). Status colours only for status. */
:root{
  --cp-bg:#05070d;--cp-bg2:#080c17;--cp-panel:#0b1121;--cp-panel2:#0f172b;--cp-ink:#e8edf7;--cp-mute:#97a3ba;--cp-dim:#66738c;
  --cp-line:rgba(130,165,225,.15);--cp-line2:rgba(130,165,225,.28);--cp-acc:#2997ff;--cp-acc2:#6cb6ff;--cp-glow:rgba(41,151,255,.35);
  --cp-ok:#34d399;--cp-warn:#f5b83d;--cp-bad:#ff6b6b;--cp-pay:#a78bfa;--cp-off:#1d2742;
  --cp-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --cp-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",Inter,"Segoe UI",Arial,sans-serif;
  /* the names the pages already use */
  --bg:var(--cp-bg);--card:var(--cp-panel);--ink:var(--cp-ink);--mute:var(--cp-mute);--line:var(--cp-line);--acc:var(--cp-acc);
  --g:var(--cp-ok);--y:var(--cp-warn);--r:var(--cp-bad);--o:var(--cp-ok);--a:var(--cp-warn);--p:var(--cp-pay);--d:var(--cp-bad);
  --ok:var(--cp-ok);--no:var(--cp-bad);--warn:var(--cp-warn);--off:var(--cp-off);--empty:#141c31;--cat:var(--cp-acc);
  --good:var(--cp-ok);--bad:var(--cp-bad);--chip:rgba(41,151,255,.14);--soft:rgba(41,151,255,.13);
  color-scheme:dark;
}
html{background:var(--cp-bg)}
body{background:var(--cp-bg);color:var(--cp-ink);font-family:var(--cp-sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1200px 600px at 70% -10%,rgba(41,151,255,.13),transparent 60%),radial-gradient(900px 500px at -10% 20%,rgba(41,151,255,.06),transparent 60%),
  linear-gradient(var(--cp-line) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,var(--cp-line) 1px,transparent 1px) 0 0/48px 48px;
  -webkit-mask-image:linear-gradient(#000 0,rgba(0,0,0,.35) 520px,rgba(0,0,0,.18) 100%);mask-image:linear-gradient(#000 0,rgba(0,0,0,.35) 520px,rgba(0,0,0,.18) 100%);opacity:.55}
::selection{background:rgba(41,151,255,.35)}
a{color:var(--cp-acc2)}
a:hover{color:#9ccdff}
:focus-visible{outline:2px solid var(--cp-acc2);outline-offset:3px}
h1,h2,h3{color:var(--cp-ink)}
h1{font-weight:700;letter-spacing:-.03em}
h2{font-weight:650;letter-spacing:-.015em}
.mute,.lead,.eyebrow{color:var(--cp-mute)}
.eyebrow{font:600 12px/1.4 var(--cp-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cp-acc2)}
/* panels */
.card{background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 40%),var(--cp-panel);border:1px solid var(--cp-line);border-radius:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 30px rgba(0,0,0,.25)}
.card[style*="background:transparent"]{border:0;box-shadow:none}
.card>h2:first-child,.card>.tool>b{letter-spacing:-.01em}
/* numbers */
.stat b,.grid b,.big3 b,b.n{font-variant-numeric:tabular-nums;color:var(--cp-ink)}
/* form controls */
input,select,textarea{color:var(--cp-ink);background:var(--cp-bg2);border:1px solid var(--cp-line2);border-radius:12px}
input::placeholder,textarea::placeholder{color:var(--cp-dim)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--cp-acc);outline-offset:1px;border-color:var(--cp-acc)}
button{color:#fff;background:var(--cp-acc)}
button:hover{filter:brightness(1.08)}
.btn{background:var(--cp-ink);color:var(--cp-bg)}
.btn:hover{color:var(--cp-bg);filter:brightness(.92)}
pre,.copy code{background:var(--cp-bg2);border:1px solid var(--cp-line);color:#cfe2ff}
code{color:#cfe2ff}
.tool code{color:var(--cp-acc2)}
table{border-color:var(--cp-line)}
th,td{border-color:var(--cp-line)!important}
th{color:var(--cp-mute)}
hr{border:0;border-top:1px solid var(--cp-line)}
details summary{cursor:pointer}
/* shared cockpit pieces */
.cp-chip{display:inline-flex;align-items:center;gap:6px;font:600 11px/1 var(--cp-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cp-mute);border:1px solid var(--cp-line2);border-radius:999px;padding:5px 9px;white-space:nowrap}
.cp-chip.ok{color:var(--cp-ok);border-color:color-mix(in srgb,var(--cp-ok) 45%,transparent)}
.cp-chip.warn{color:var(--cp-warn);border-color:color-mix(in srgb,var(--cp-warn) 45%,transparent)}
.cp-chip.bad{color:var(--cp-bad);border-color:color-mix(in srgb,var(--cp-bad) 45%,transparent)}
.cp-dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none;box-shadow:0 0 0 0 currentColor}
.cp-live .cp-dot{animation:cp-beat 2.4s ease-out infinite}
@keyframes cp-beat{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 55%,transparent)}70%,100%{box-shadow:0 0 0 7px transparent}}
.cp-label{font:600 11px/1.3 var(--cp-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cp-dim)}
.cp-num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
/* the 7Maps strip under the site header */
.mx-strip{margin:0 -16px;position:sticky;top:44px;z-index:40;background:rgba(5,7,13,.82);-webkit-backdrop-filter:saturate(160%) blur(16px);backdrop-filter:saturate(160%) blur(16px);border-bottom:1px solid var(--cp-line)}
.mx-in{max-width:1180px;margin:0 auto;padding:0 16px;height:40px;display:flex;align-items:center;gap:14px;min-width:0}
.mx-brand{display:inline-flex;align-items:center;gap:8px;font:700 12px/1 var(--cp-mono);letter-spacing:.16em;color:var(--cp-ink);text-decoration:none;flex:none}
.mx-brand:hover{color:#fff}
.mx-mark{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,var(--cp-acc) 0 2px,transparent 3px),conic-gradient(from 0deg,rgba(41,151,255,.0),rgba(41,151,255,.65),rgba(41,151,255,0) 30%);border:1px solid var(--cp-line2)}
.mx-nav{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;min-width:0;flex:1;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.mx-nav::-webkit-scrollbar{display:none}
.mx-nav a{font:500 13px/1 var(--cp-sans);color:var(--cp-mute);text-decoration:none;padding:7px 9px;border-radius:8px;white-space:nowrap}
.mx-nav a:hover{color:var(--cp-ink);background:rgba(255,255,255,.04)}
.mx-nav a[aria-current="page"]{color:var(--cp-ink);background:rgba(41,151,255,.14)}
.mx-age{flex:none;display:none;align-items:center;gap:7px;font:500 12px/1 var(--cp-mono);color:var(--cp-mute);white-space:nowrap}
.mx-age .cp-dot{color:var(--cp-ok)}
.mx-age.stale .cp-dot{color:var(--cp-warn)}
@media(min-width:720px){.mx-age{display:inline-flex}}
html{scroll-padding-top:96px}
/* the site footer, in the cockpit's colours */
.lx-foot{background:#04060b;color:var(--cp-dim);border-top:1px solid var(--cp-line)}
.lx-foot h3{color:var(--cp-ink)}
.lx-foot a{color:var(--cp-mute)}
.lx-foot a:hover{color:var(--cp-ink)}
.lx-foot-base{border-top-color:var(--cp-line)}
.lx-foot-base span{color:var(--cp-line2)}
@media (prefers-reduced-motion:reduce){.cp-live .cp-dot{animation:none}}
@media (forced-colors:active){.card{border:1px solid CanvasText}.cp-dot{forced-color-adjust:none}}
.mx-age[hidden]{display:none!important}