/* Screen Terminal — Argus's own page system (tokens, skins, background, nav pill, cards, buttons), taken from
   poc/app/static/pricing.html + index.html so the two sites read as one product. Two skins as in Argus:
   Default (dark) and Metal (light, the default); the choice is kept in localStorage 'argus_skin'.
   Fonts as in Argus: Hanken Grotesk for UI/text (--mono), Tobias for display (--disp), all self-hosted. The only
   third-party request is Cloudflare Turnstile, loaded on demand before a search without sign-in. Hanken Grotesk is OFL 1.1 (licence in /assets/fonts/). */
@font-face{font-family:'Hanken Grotesk';src:url('/assets/fonts/hanken-grotesk-latin-ext.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';src:url('/assets/fonts/hanken-grotesk-latin.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Tobias';src:url('/fonts/tobias-light.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Tobias';src:url('/fonts/tobias-regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Tobias';src:url('/fonts/tobias-medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Tobias';src:url('/fonts/tobias-semibold.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap}

/* ===== Default skin (dark) — Argus tokens */
:root{
  --bg:#0a0a0d; --panel:rgba(20,20,26,.72); --panel2:rgba(28,28,36,.6);
  --ink:#e9e7e2; --mut:#9c988e; --dim:#7b776b; --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.16);
  --strong:#cf6f64; --possible:#c6a35a; --weak:#8f9ec4; --none:#84ad8b; --sanction:#e0484d;
  --mono:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --disp:'Tobias','Inter',system-ui,-apple-system,'Segoe UI',serif;
  --code:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --code-bg:#14141a; --code-ink:#e8e6f5; --chip-bg:rgba(255,255,255,.06);
}
/* ===== "Metal" skin — light (bone bg, near-black ink, purple accent), Argus's default */
:root[data-skin="metal"]{
  --bg:#f6f5f1; --panel:#ffffff; --panel2:#efeee9;
  --ink:#111114; --mut:#5b5b5b; --dim:#8d897f; --line:rgba(0,0,0,.10); --line2:rgba(0,0,0,.17);
  --strong:#b23f34; --possible:#a9812c; --weak:#5766a8; --none:#5b45c9; --sanction:#d1332f;
  --mono:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --disp:'Tobias','Fraunces',Georgia,'Times New Roman',serif;
  --code-bg:#1e1e28; --code-ink:#e8e6f5; --chip-bg:#efeee9;
}
:root[data-skin="metal"] body{background:#f6f5f1}
:root[data-skin="metal"] .bg::before{opacity:.5}
:root[data-skin="metal"] .bg::after{opacity:.22;mix-blend-mode:normal}
:root[data-skin="metal"] #stars{opacity:.18}
:root[data-skin="metal"] .card{backdrop-filter:none;box-shadow:0 1px 3px rgba(0,0,0,.06)}
:root[data-skin="metal"] .card.lift:hover{box-shadow:0 12px 28px rgba(0,0,0,.10)}
:root[data-skin="metal"] .btn:hover,:root[data-skin="metal"] button:hover{box-shadow:0 8px 20px rgba(0,0,0,.12)}
:root[data-skin="metal"] .navpill{backdrop-filter:none;box-shadow:0 1px 3px rgba(0,0,0,.06)}
:root[data-skin="metal"] .sso-btn{background:#fbfaf7}
:root[data-skin="metal"] .sso-btn:hover{background:#efeee9}
:root[data-skin="metal"] .err{border-color:rgba(209,51,47,.35);background:rgba(209,51,47,.06)}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 var(--mono);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--ink);text-decoration-color:var(--line2);text-underline-offset:3px}
a:hover{text-decoration-color:var(--none)}

/* background: glow, grain, constellation */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none}
.bg::before{content:"";position:absolute;inset:0;
  background:radial-gradient(60vw 50vh at 78% 82%,rgba(120,70,140,.18),transparent 60%),
             radial-gradient(50vw 40vh at 12% 8%,rgba(150,90,60,.10),transparent 60%),
             radial-gradient(100vw 100vh at 50% 40%,transparent 55%,rgba(0,0,0,.55) 100%)}
.bg::after{content:"";position:absolute;inset:0;opacity:.45;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E")}
#stars{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);
  width:min(92vw,720px);height:min(92vw,720px);z-index:0;opacity:.5;pointer-events:none}
.twinkle{animation:tw 3.4s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:.25}50%{opacity:1}}

.wrap{position:relative;z-index:2;max-width:1000px;margin:0 auto;padding:0 20px 16px}
.narrow{max-width:760px;margin-left:auto;margin-right:auto}
.slim{max-width:400px;margin-left:auto;margin-right:auto}

/* nav pill (page chip + links), as on Argus pricing */
nav.top{display:flex;justify-content:center;padding:18px 0 0}
.navpill{display:flex;align-items:center;gap:13px;flex-wrap:wrap;justify-content:center;background:var(--panel);
  backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:0;padding:8px 14px 8px 8px;
  box-shadow:0 10px 30px rgba(0,0,0,.4);animation:fade .8s both}
.chip{background:var(--ink);color:var(--bg);border-radius:0;padding:6px 14px;font-size:12px;
  font-weight:600;text-transform:uppercase}
.navlink{margin-left:6px;color:var(--mut);text-decoration:none;font-size:12px;letter-spacing:.02em}
.navlink:hover{color:var(--ink)}

/* page head */
.head{text-align:center;margin:26px auto 0;max-width:640px;animation:fade .8s .05s both}
.kicker{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--none);margin:0}

/* cards + grid */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:16px;
  animation:fade .8s .12s both}
.card{position:relative;background:var(--panel);backdrop-filter:blur(14px);
  border:1px solid var(--line2);border-left:3px solid var(--line2);border-radius:0;
  padding:18px 18px;box-shadow:0 20px 50px rgba(0,0,0,.4);animation:fade .8s .12s both}
.card.lift{display:flex;flex-direction:column;transition:transform .2s,box-shadow .25s,border-color .25s}
.card.lift:hover{transform:translateY(-2px);box-shadow:0 26px 60px rgba(0,0,0,.5)}
.card.rec{border-left-color:var(--none)}
.stack > .card + .card{margin-top:12px}
.top-gap{margin-top:16px}
.plan{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.card.rec .plan{color:var(--none)}
.price{font-family:var(--disp);font-weight:700;font-size:32px;margin:8px 0 2px;line-height:1}
.price small{font-family:var(--mono);font-size:12px;color:var(--mut);font-weight:400}
.q{color:var(--mut);font-size:12px;margin:8px 0 14px;flex:1;line-height:1.65}
.q b{color:var(--ink);font-weight:500}
.rectag{position:absolute;top:-1px;right:-1px;background:var(--none);color:var(--bg);
  font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:4px 9px}
.sect{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin:24px 2px 10px;
  border-top:1px solid var(--line);padding-top:14px}

/* buttons (Argus: ink block, square, weight 600) */
.btn,button{display:inline-block;background:var(--ink);color:var(--bg);border:0;font-family:var(--mono);font-weight:600;
  padding:12px 18px;border-radius:0;font-size:13px;cursor:pointer;letter-spacing:.02em;text-decoration:none;
  text-align:center;transition:transform .15s,box-shadow .2s,opacity .2s}
.btn:hover,button:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.5)}
.btn.block,button.block{display:block;width:100%}
.btn.ghost,button.ghost{background:transparent;border:1px solid var(--line2);color:var(--ink)}
.sso-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  background:rgba(255,255,255,.04);border:1px solid var(--line2);color:var(--ink);font-family:var(--mono);
  font-size:13px;font-weight:500;padding:12px;text-decoration:none;transition:border-color .2s,background .2s}
.sso-btn:hover{border-color:var(--none);background:rgba(255,255,255,.07)}
.sso-btn svg{width:16px;height:16px;flex:none}

/* text, notes */
p{margin:0 0 12px}
.mut{color:var(--mut)}
.note{color:var(--dim);font-size:11.5px;margin:10px 0 0}
.err{color:var(--sanction);font-size:12px;border:1px solid rgba(224,72,77,.35);background:rgba(224,72,77,.08);
  padding:9px 11px;margin:0 0 14px}

/* code */
code{font:12.5px var(--code);background:var(--chip-bg);padding:1px 5px;overflow-wrap:anywhere}
pre{background:var(--code-bg);color:var(--code-ink);padding:14px 16px;overflow-x:auto;margin:10px 0 16px;
  border:1px solid var(--line)}
pre code{background:none;padding:0;color:inherit;font-size:12.5px;line-height:1.6;overflow-wrap:normal}
.copyrow{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap;margin:10px 0 4px}
.copyrow code{font-size:13px;padding:10px 12px;flex:1 1 260px;display:flex;align-items:center;border:1px solid var(--line)}

/* long-form docs / legal inside a card */
.doc h2{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);
  margin:22px 0 10px;border-top:1px solid var(--line);padding-top:14px}
.doc > h2:first-child{margin-top:0;border-top:0;padding-top:0}
.doc h3{font-size:13px;font-weight:600;margin:16px 0 6px}
.doc ul{margin:0 0 14px;padding-left:18px}
.doc li{margin:4px 0}
.doc li::marker{color:var(--dim)}
.toc{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;font-size:12px;margin:12px 0 0}
.toc a{color:var(--mut);text-decoration:none}.toc a:hover{color:var(--ink)}

/* tables */
table{width:100%;border-collapse:collapse;margin:8px 0 16px;font-size:13px}
th{text-align:left;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);
  border-bottom:1px solid var(--line2);padding:8px 10px 8px 0}
td{border-bottom:1px solid var(--line);padding:9px 10px 9px 0;vertical-align:top}
.num{text-align:right;font-variant-numeric:tabular-nums}
th.num,td.num{padding-right:20px}
.scroll{overflow-x:auto;margin:8px 0 16px}
.scroll table{margin:0}

/* footer + skin toggle (as at the bottom of the Argus app) */
.foot{color:var(--dim);font-size:11.5px;margin-top:24px;text-align:center;border-top:1px solid var(--line);padding-top:12px}
.foot a{color:var(--dim);text-decoration:none;margin:0 9px}.foot a:hover{color:var(--ink)}
.skin-toggle{display:inline-flex;gap:0;margin:10px auto 6px;border:1px solid var(--line2);border-radius:20px;overflow:hidden;
  position:relative;left:50%;transform:translateX(-50%)}
.skin-opt{background:none;border:0;cursor:pointer;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;font-weight:400;
  text-transform:uppercase;color:var(--mut);padding:6px 16px;transition:color .15s ease,background .15s ease}
.skin-opt:hover{color:var(--ink);transform:none;box-shadow:none}
.skin-opt.on{background:var(--ink);color:var(--bg)}

@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:560px){.head{margin-top:20px}.card{padding:16px 14px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}
.doc .lede{font-size:14.5px;color:var(--ink);margin-bottom:6px}
.doc table{font-size:12.5px}

/* search terminal (home) — inputs as on the Argus login page */
.term{padding:20px}
.tline{display:flex;align-items:center;gap:10px;border:1px solid var(--line2);background:rgba(0,0,0,.25);padding:0 0 0 14px}
.prompt{font-family:var(--disp);font-size:22px;line-height:1;color:var(--none)}
.term input{width:100%;background:rgba(0,0,0,.25);border:1px solid var(--line2);border-radius:0;color:var(--ink);
  font-family:var(--mono);font-size:14px;padding:12px 13px;outline:none}
.tline input{border:0;background:transparent;font-size:16px;padding:14px 13px 14px 0}
.term input:focus,.tline:focus-within{border-color:var(--none)}
.trow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.term button{margin-top:2px}
.tcheck{margin-top:12px}
.tsign{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}
:root[data-skin="metal"] .term input,:root[data-skin="metal"] .tline{background:#fbfaf7}
:root[data-skin="metal"] .tline input{background:transparent}
@media (max-width:560px){.trow{grid-template-columns:1fr}}

/* results — Argus card kinds and band colours */
#t-out .card{margin-top:12px}
.card.res.k-sanction{border-left-color:var(--sanction);border-left-width:5px}
.card.res.k-pep{border-left-color:var(--strong)}
.card.res.k-rca{border-left-color:var(--mut)}
.card.res.k-watch{border-left-color:var(--strong)}
.card.res.k-debar,.card.res.k-soe{border-left-color:var(--possible)}
.rhead{font-family:var(--disp);font-weight:600;font-size:24px;margin:6px 0 10px;line-height:1.15}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.bchip{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--line2);color:var(--mut)}
.bchip.b-strong{color:var(--strong);border-color:currentColor}
.bchip.b-possible{color:var(--possible);border-color:currentColor}
.bchip.b-weak{color:var(--weak);border-color:currentColor}
.bchip.r-sanction{color:var(--sanction);border-color:currentColor}
.mtop{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.mname{font-family:var(--disp);font-weight:600;font-size:19px}
.mmeta{color:var(--mut);font-size:12px;margin:2px 0 4px;text-transform:none}
.mpos{font-size:12.5px;color:var(--ink);margin-top:4px}
.note.warn{color:var(--sanction)}

