/* Fortior design tokens — the single authoritative definition.
   Loaded by public/index.html (marketing) and public/admin/index.html
   (admin), before each page's inline <style>, so page rules can build on
   these values. Each page keeps its own legacy names (--paper, --ink,
   --text, --brass ...) as aliases of the tokens below; do not redefine
   --fortior-* tokens in the pages.

   Themes: light values live on :root, dark values on [data-theme="dark"].
   Both pages set data-theme="dark" on <html> pre-paint (dark is the
   default identity), so these values resolve before first render.

   Breakpoints cannot be custom properties inside @media. The shared
   constants are: 880px (sidebar becomes a drawer, both surfaces),
   640px (phone layout), 480px (small phone). Use these literals. */

:root{
  /* ---------- brand (theme-invariant) ---------- */
  --fortior-brand-ivory:#F5F3EE;
  --fortior-brand-black:#080808;
  --fortior-brand-brass:#a9814e;      /* decorative only: 3.1:1 as text */
  --fortior-brand-brass-deep:#7a5c35;
  /* Dark-theme interaction fills. Theme-invariant on purpose: existing
     [data-theme="dark"] rules reference them directly. */
  --fortior-hover:#FFFFFF;
  --fortior-active:#EAE7E0;

  /* ---------- surfaces (light) ---------- */
  --fortior-bg-primary:#f5efe4;
  --fortior-bg-primary-rgb:245,239,228;
  --fortior-bg-secondary:#ece4d3;
  --fortior-bg-surface:#ffffff;
  --fortior-bg-elevated:#ffffff;
  --fortior-overlay:rgba(20,18,15,0.45);

  /* ---------- text (light). All >= 4.5:1 on every light surface. ---------- */
  --fortior-text-primary:#262420;
  --fortior-text-secondary:#4a463d;
  --fortior-text-muted:#645e52;
  --fortior-text-inverse:#f5efe4;

  /* ---------- borders (light) ---------- */
  --fortior-border-subtle:rgba(38,36,32,0.08);
  --fortior-border:#e0d6c1;
  --fortior-border-strong:#c9bca0;

  /* ---------- accent: restrained brass in light, ivory in dark ---------- */
  --fortior-accent:var(--fortior-brand-brass);
  --fortior-accent-strong:var(--fortior-brand-brass-deep);
  --fortior-accent-rgb:169,129,78;

  /* ---------- primary action (solid buttons) ---------- */
  --fortior-action-bg:#262420;
  --fortior-action-fg:#f5efe4;
  --fortior-action-bg-hover:#3d3a33;
  --fortior-action-bg-active:#4a463d;

  /* ---------- interaction states ---------- */
  --fortior-focus:#7a5c35;
  --fortior-focus-ring:2px solid var(--fortior-focus);
  --fortior-focus-offset:2px;
  --fortior-state-hover:rgba(38,36,32,0.05);
  --fortior-state-selected:rgba(169,129,78,0.14);
  --fortior-disabled-opacity:0.5;

  /* ---------- status (light): text colour + subtle fill ---------- */
  --fortior-success:#2f6b45;  --fortior-success-bg:rgba(47,107,69,0.10);
  --fortior-warning:#85590f;  --fortior-warning-bg:rgba(133,89,15,0.10);
  --fortior-danger:#a0402f;   --fortior-danger-bg:rgba(160,64,47,0.10);
  --fortior-info:#3d5a80;     --fortior-info-bg:rgba(61,90,128,0.10);
  --fortior-on-danger:#ffffff;
  --fortior-on-success:#ffffff;

  /* ---------- typography ---------- */
  --fortior-font-display:'Cormorant Garamond', Georgia, serif;
  --fortior-font-sans:'Hanken Grotesk', system-ui, sans-serif;
  --fortior-font-mono:'IBM Plex Mono', ui-monospace, monospace;
  --fortior-text-2xs:0.68rem;
  --fortior-text-xs:0.75rem;
  --fortior-text-sm:0.85rem;
  --fortior-text-base:1rem;
  --fortior-text-lg:1.15rem;
  --fortior-text-xl:1.4rem;
  --fortior-text-2xl:1.9rem;
  --fortior-text-3xl:clamp(1.8rem, 3.5vw, 2.6rem);
  --fortior-text-display:clamp(2.6rem, 5.4vw, 4.4rem);
  --fortior-weight-regular:400;
  --fortior-weight-medium:500;
  --fortior-weight-semibold:600;
  --fortior-weight-bold:700;
  --fortior-leading-tight:1.15;
  --fortior-leading-snug:1.35;
  --fortior-leading-body:1.6;
  --fortior-tracking-label:0.06em;

  /* ---------- spacing (4px base) ---------- */
  --fortior-space-1:4px;
  --fortior-space-2:8px;
  --fortior-space-3:12px;
  --fortior-space-4:16px;
  --fortior-space-5:20px;
  --fortior-space-6:24px;
  --fortior-space-7:32px;
  --fortior-space-8:40px;
  --fortior-space-9:56px;
  --fortior-space-10:88px;

  /* ---------- controls ---------- */
  --fortior-control-h-sm:32px;
  --fortior-control-h-md:40px;
  --fortior-control-h-lg:48px;
  --fortior-touch-min:44px;

  /* ---------- radii: restrained, identical in both themes ---------- */
  --fortior-radius-xs:2px;
  --fortior-radius-sm:4px;
  --fortior-radius-md:6px;
  --fortior-radius-lg:8px;
  --fortior-radius-xl:12px;
  --fortior-radius-pill:999px;

  /* ---------- elevation: light only; dark separates with borders ---------- */
  --fortior-shadow-sm:0 1px 2px rgba(38,36,32,0.05);
  --fortior-shadow-md:0 4px 14px -6px rgba(38,36,32,0.12);
  --fortior-shadow-lg:0 12px 28px -12px rgba(38,36,32,0.18);
  --fortior-shadow-overlay:0 24px 56px -16px rgba(20,18,15,0.35);

  /* ---------- layout ---------- */
  --fortior-content-max:1180px;
  --fortior-prose-max:64ch;
  --fortior-sidebar-w:220px;
  --fortior-sidebar-w-collapsed:64px;

  /* ---------- motion ---------- */
  --fortior-duration-fast:120ms;
  --fortior-duration-base:180ms;
  --fortior-duration-slow:250ms;
  --fortior-ease-standard:cubic-bezier(.2,0,0,1);
  --fortior-ease-out:cubic-bezier(.16,1,.3,1);
}

[data-theme="dark"]{
  --fortior-bg-primary:#080808;
  --fortior-bg-primary-rgb:8,8,8;
  --fortior-bg-secondary:#101010;
  --fortior-bg-surface:#151515;
  --fortior-bg-elevated:#1C1C1C;
  --fortior-overlay:rgba(0,0,0,0.6);

  --fortior-text-primary:#F5F3EE;
  --fortior-text-secondary:#C8C6C1;
  --fortior-text-muted:#8D8B87;
  --fortior-text-inverse:#080808;

  --fortior-border-subtle:#1c1c1c;
  --fortior-border:#262626;
  --fortior-border-strong:#353535;

  --fortior-accent:var(--fortior-brand-ivory);
  --fortior-accent-strong:#C8C6C1;
  --fortior-accent-rgb:245,243,238;

  --fortior-action-bg:var(--fortior-brand-ivory);
  --fortior-action-fg:var(--fortior-brand-black);
  --fortior-action-bg-hover:var(--fortior-hover);
  --fortior-action-bg-active:var(--fortior-active);

  --fortior-focus:#F5F3EE;
  --fortior-state-hover:rgba(255,255,255,0.05);
  --fortior-state-selected:rgba(255,255,255,0.09);

  --fortior-success:#6fcf97;  --fortior-success-bg:rgba(111,207,151,0.14);
  --fortior-warning:#d1a35c;  --fortior-warning-bg:rgba(209,163,92,0.14);
  --fortior-danger:#e8836f;   --fortior-danger-bg:rgba(232,131,111,0.12);
  --fortior-info:#8fb0d9;     --fortior-info-bg:rgba(143,176,217,0.12);
  /* Dark status fills are light; white text on them fails contrast. */
  --fortior-on-danger:#080808;
  --fortior-on-success:#080808;

  --fortior-shadow-sm:none;
  --fortior-shadow-md:none;
  --fortior-shadow-lg:none;
  --fortior-shadow-overlay:0 24px 56px rgba(0,0,0,0.6);
}

/* ---------- shared base: identical on both surfaces ---------- */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.skip-link{
  position:absolute; left:8px; top:-48px; z-index:10000;
  background:var(--fortior-action-bg); color:var(--fortior-action-fg);
  padding:10px 16px; border-radius:var(--fortior-radius-sm);
  font-family:var(--fortior-font-sans); font-size:var(--fortior-text-sm); font-weight:var(--fortior-weight-semibold);
  text-decoration:none; transition:top var(--fortior-duration-fast) ease;
}
.skip-link:focus{top:8px;}