/* ===========================================================================
   tokens.css — the concept-B design system, extracted as CSS custom properties.
   Sourced verbatim from Command-Briefing-concept-b-skin.html (concept-b light
   "Conservatory Editorial" palette + Collection-E status roles + Elisian identity).
   Screens & components reference these tokens ONLY — no magic values elsewhere.
   =========================================================================== */

:root{
  /* --- Surfaces --- */
  --bg-board:#FFFFFF;   /* primary background — white */
  --bg-panel:#FFFFFF;
  --bg-soft:#F4FAFC;
  --glass-1:rgba(255,255,255,0.66);
  --glass-2:rgba(255,255,255,0.85);
  --glass-3:rgba(255,255,255,0.95);
  /* Page backdrop behind the board — tokenized so palette scenarios can reskin it */
  --backdrop-a:#EEF5F9; --backdrop-b:#F3ECF7; --backdrop-c:#DFE9F0;

  /* --- Ink (foreground / muted family) --- */
  --ink-0:#141829;   /* headings, darkest */
  --ink-1:#1A1F33;   /* body */
  --ink-2:#3E4557;   /* secondary */
  --ink-3:#5F6675;   /* muted */
  --ink-4:#AEB4C0;   /* faint */

  /* --- Rules / borders --- */
  --border:#DBE6EC;
  --rule:rgba(29,35,105,0.10);
  --rule-strong:rgba(29,35,105,0.16);
  /* Larger component cards — stronger outline + hover treatment (against white bg) */
  --card-border:#C3D2DE;
  --card-border-hover:#A7BCCE;
  --card-glow:0 10px 26px -10px rgba(29,35,105,0.20);

  /* --- Primary — deep indigo --- */
  --pri:#1D2369;
  --pri-top:#2A3080;
  --pri-glow:rgba(29,35,105,0.28);
  --pri-tint:rgba(29,35,105,0.05);

  /* --- Control-active — neutral blue-grey for selected/active controls + the
         user avatar (darker on hover). Cool/operational, non-brand. */
  --control-active:#5C6C82;
  --control-active-hover:#45526A;
  --control-active-soft:rgba(92,108,130,0.14);
  --control-active-softer:rgba(92,108,130,0.08);

  /* Nav "resting logo" glyph gradient — tokenized so palettes can reskin the brand mark */
  --logo-a:#49547e; --logo-b:#3d4871;
  /* "Activated brand" gradient (glyph pop + Ask-Elisian button) — tokenized so a palette
     can keep it in-family instead of blending primary→accent into an off-hue. */
  --glyph-a:var(--pri-top); --glyph-b:var(--pri); --glyph-c:var(--aria-deep);

  /* --- Elisian — orchid identity --- */
  --aria:#B568C1;
  --aria-top:#C77FD1;
  --aria-deep:#8E4C9A;
  --aria-soft:#F0E1F3;
  --aria-sky:#F4FAFC;
  --aria-glow:rgba(181,104,193,0.28);

  /* --- Collection-E status roles --- */
  --success:#5C9E33;      --success-solid:#3F6E22;
  --caution:#E1A126;      --caution-solid:#8A5E0E;   --caution-border:#B5851A;
  --danger:#D84326;       --danger-solid:#A8331C;
  --progress:#4A88A6;     --progress-solid:#356379;
  --info:#64798F;         --info-solid:#46566A;
  --leasing:#8285C2;      --leasing-solid:#54588F;

  /* --- Type (concept-b demo font system) --- */
  --sans:'Geist', system-ui, -apple-system, sans-serif;              /* body / UI */
  --mono:'Spline Sans Mono', ui-monospace, SFMono-Regular, monospace;/* labels / codes / tabular */
  --display:'Schibsted Grotesk', var(--sans);                        /* editorial headings */
  --figure:'Hanken Grotesk', var(--sans);                            /* KPI + rent numerals */
  --brand:'Unna', Georgia, serif;                                    /* brand wordmark */

  /* --- Type scale --- */
  --fs-hero:34px;
  --fs-figure:26px;
  --fs-title:15px;
  --fs-body:12.5px;
  --fs-eyebrow:11px;
  --fs-mono-sm:10px;

  /* --- Spacing --- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:14px; --sp-5:16px; --sp-6:18px;
  --sp-7:20px; --sp-8:22px; --sp-9:26px; --sp-10:34px;

  /* --- Radius --- */
  --r-sm:6px; --r-md:9px; --r-lg:12px; --r-xl:16px; --r-pill:20px;

  /* --- Shadow --- */
  --sh-panel:0 40px 80px -30px rgba(20,24,50,.35);
  --sh-toast:0 8px 26px rgba(20,24,50,.16);
  --sh-btn-pri:0 2px 10px var(--pri-glow);
  --sh-btn-aria:0 2px 10px var(--aria-glow);

  /* --- z-index --- */
  --z-content:2;
  --z-toast:5;
  --z-scenario:40;
  --z-dev:50;

  /* --- Motion (mirrors the design system's motion.easing / duration) --- */
  --dur-fast:150ms;
  --dur-base:220ms;
  --dur-slow:300ms;
  --ease-in-out:cubic-bezier(.65,0,.35,1);     /* smooth symmetric open/close */
  --ease-standard:cubic-bezier(.4,0,.2,1);      /* general UI */
  --ease-emphasized:cubic-bezier(.34,1.4,.5,1); /* gentle settle on expand */
  --hover-delay:180ms;   /* intent delay: a quick graze won't trigger panel hovers */
  --hover-slow:.32s;     /* eased hover for primary AI panels/controls */
}

*{box-sizing:border-box; margin:0; padding:0}
html,body{height:100%}
.mono{font-family:var(--mono); font-weight:500}   /* small mono labels less narrow */
.up{text-transform:uppercase; letter-spacing:.12em}
[hidden]{display:none !important}
