/* Self-hosted fonts (CSP font-src 'self'; no third-party requests). SIL Open Font License. Latin WOFF2 subsets.
   Archivo keeps its variable axes, limited to wght 400-700 and wdth 75-100 (fontTools varLib.instancer, then
   pyftsubset), so the 75% "title-block lettering" and 700 still work. IBM Plex Mono: 400 and 600. File names carry a
   content hash because fonts are served immutable for a year. The original TTFs stay in fonts/ as the source. */
@font-face{font-family:"Archivo";src:url("fonts/Archivo-latin.27155c6d.woff2") format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+2713,U+2715,U+25D0-25D1,U+25F7,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/IBMPlexMono-400-latin.a2b3d42b.woff2") format("woff2");font-weight:100 500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+2713,U+2715,U+25D0-25D1,U+25F7,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/IBMPlexMono-600-latin.1cbd134e.woff2") format("woff2");font-weight:600 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+2713,U+2715,U+25D0-25D1,U+25F7,U+FEFF,U+FFFD}
/* Metric-matched fallback while Archivo loads, so the swap doesn't move text (CLS). Built on Arial (Liberation Sans
   and Arimo are metric-identical). Numbers from the font files: Archivo ascent 878, descent 210, line gap 0 per 1000;
   advance width of body text is 98.7% of Arial's at 400; bold is set to 93% so the 620-weight, wdth-96 home h1 keeps
   its line breaks (96.1% of Arial Bold at wdth 100, less the 4% narrower width). */
@font-face{font-family:"Archivo Fallback";src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("Arimo");font-weight:100 500;size-adjust:98.7%;ascent-override:89%;descent-override:21.3%;line-gap-override:0%}
@font-face{font-family:"Archivo Fallback";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Arimo Bold");font-weight:600 900;size-adjust:93%;ascent-override:94.4%;descent-override:22.6%;line-gap-override:0%}
/* html:root outranks the plain :root in site.css, styles.css and auth.css, so every page gets the fallback. */
html:root{--sans:"Archivo","Archivo Fallback",ui-sans-serif,system-ui,sans-serif}
/* SealBench color tokens. Every color on screen comes from here; swap a theme by editing this file only.
   Dark (Option A surfaces, cyanotype accent) is the default. Light uses Option B's paper tokens.
   PDFs and emails do not use this file: they stay ink on white per the print spec. */
:root,[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0E1116; --s1:#13171D; --s2:#181D25; --s3:#1E242D;
  --line:#262D37; --line-2:#333B47; --line-3:#5A6472;
  --t1:#E6E8EB; --t2:#A7B0BB; --t3:#8C96A2;
  --accent:#8DB4E2; --accent-ink:#0E1116; --accent-soft:rgba(141,180,226,.12); --accent-soft-2:rgba(141,180,226,.20);
  --btn:#E6E8EB; --btn-ink:#0E1116; --btn-hover:#FFFFFF;
  --ok:#6FCF9B; --ok-w:#132A20; --ok-l:#1F4A35;
  --amb:#F5B94A; --amb-w:#2E2412; --amb-l:#5A4418;
  --red:#FF8B75; --red-w:#261719; --red-l:#4E2723; --red-stripe:#E0553B;
  --pen:#B4BFCB; --pen-w:#222933; --pen-l:#3A4350;
  --grid:rgba(141,180,226,.05); --hi:rgba(255,255,255,.055);
  --band:#14263F; --band-t:#E6E8EB; --band-t2:#A9BCD6; --band-line:#2C3E5C; --band-grid:rgba(141,180,226,.06);
  --shadow-1:rgba(0,0,0,.3); --shadow-2:rgba(0,0,0,.7);
  --focus:#8DB4E2;
  --qr-tile:#FFFFFF; --qr-ink:#000000;
}
/* Control borders at 3:1 or better in dark (#66707E: 3.37:1 on --s2, 3.58:1 on --s1), for the site, app and sign-in. */
[data-theme=dark]{--line-3:#66707E}
[data-theme="light"]{
  color-scheme:light;
  --bg:#F7F5F0; --s1:#FFFFFF; --s2:#FBFAF7; --s3:#F1EEE7;
  --line:#E3DFD6; --line-2:#D4CFC4; --line-3:#8C8577;
  --t1:#14181F; --t2:#4A525C; --t3:#646B74;
  --accent:#1F5FD1; --accent-ink:#FFFFFF; --accent-soft:#E8EFFC; --accent-soft-2:#DCE6FA;
  --btn:#1F5FD1; --btn-ink:#FFFFFF; --btn-hover:#1A52B8;
  --ok:#1B7446; --ok-w:#E4F2EA; --ok-l:#B9DCC8;
  --amb:#8A5A00; --amb-w:#FBF1DC; --amb-l:#EBD3A0;
  --red:#A8321C; --red-w:#FBECE8; --red-l:#EDC3B9; --red-stripe:#C23B22;
  --pen:#3E4C5E; --pen-w:#EDEFF2; --pen-l:#9AA6B4;
  --grid:rgba(31,95,209,.07); --hi:rgba(255,255,255,0);
  --band:#0D1F3C; --band-t:#FFFFFF; --band-t2:#C9D5EA; --band-line:#3B5686; --band-grid:rgba(201,213,234,.045);
  --shadow-1:rgba(15,27,42,.04); --shadow-2:rgba(15,27,42,.35);
  --focus:#1F5FD1;
  --qr-tile:#FFFFFF; --qr-ink:#000000;
}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.theme-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--line-3);border-radius:6px;background:transparent;color:var(--t1);font:500 16px/1 var(--sans);cursor:pointer}
.theme-toggle:hover{background:var(--s2)}
.theme-toggle .tg{font:500 15px/1 var(--mono);color:var(--t2)}
/* Shared drawing grid (homepage hero, sign-in header area). 32px squares, fades out before any text block. */
:root,[data-theme="dark"]{--grid-line:rgba(230,232,235,.075); --grid-line-faint:rgba(230,232,235,.05)}
[data-theme="light"]{--grid-line:rgba(20,24,31,.08); --grid-line-faint:rgba(20,24,31,.055)}
.sb-grid{position:relative;isolation:isolate}
.sb-grid::before{content:"";position:absolute;inset:0 0 -24px 0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(to right,var(--grid-line) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-line) 1px,transparent 1px);
  background-size:32px 32px;background-position:-1px -1px;
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 55%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 55%,transparent 100%)}
.sb-grid.faint::before{--grid-line:var(--grid-line-faint)}
/* ~150ms crossfade only while the theme toggle is switching; off for reduced motion */
@media (prefers-reduced-motion:no-preference){
  html.theme-fade,html.theme-fade *,html.theme-fade *::before{transition:background-color .15s ease,color .15s ease,border-color .15s ease,fill .15s ease,stroke .15s ease!important}
}
/* Pressed state for every button on the site, app, admin and sign-in pages (under 100ms). The color change works
   for everyone, reduced motion included; only the 1px move is inside the no-preference query. */
/* ("html" prefix: outranks the :hover rules in the page stylesheets, which load after this file.) */
html .btn:active{filter:none;background:var(--btn-hover)}
html .btn.line:active,html .btn.ghost:active,html .theme-toggle:active,html [data-theme-toggle]:active,html .btn-secondary:active,html .call-btn:active,html .xl-btn.secondary:active,html .ce-btn.ghost:active{background:var(--s3)}
html .btn.danger:active{filter:brightness(.9);background:var(--red)}
html .btn-primary:active,html .xl-btn.primary:active,html .ce-btn:not(.ghost):active,html .plain-btn:active{filter:brightness(.88)}
@media (prefers-reduced-motion:no-preference){
  .btn:active,.btn-primary:active,.btn-secondary:active,.xl-btn:active,.ce-btn:active,.call-btn:active,.plain-btn:active,.theme-toggle:active,[data-theme-toggle]:active{transform:translateY(1px);transition:transform 60ms ease}
}
