/* The one font every app needs arrives with the tokens, so no app can drift onto a fallback. */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Marcellus&display=swap");

/* JRE portal-family design tokens — THE single source of truth for the look.
   Served by the Merge Portal at https://portal.jorgensonrealestate.com/tokens.css and
   loaded by every portal app via <link rel="stylesheet"> in its app/layout.tsx (the
   portal itself uses href="/tokens.css"). Edit here, push jre-portal, every app repaints.
   Keep this file to the font import + custom properties ONLY (on :root, optionally inside a
   media query) — no other selectors, no rules — so no app can accidentally take layout from it. Canonical names after the 2026-09-17 reconciliation:
   --warm (not --need), --good (not --fresh), --bad, --ink-inverse (text on accent fills).

   2026-09-23 "Fresh" (Kasey picked it from the look-refresh audit; SERHANT. S.MPLE / Compass
   comparison): cool off-white ground instead of cream, Plus Jakarta Sans for everything (the
   most legible choice for older agents, current enough for younger ones), JRE blue as the brand
   with four soft "tool washes" that tell tools apart, rounder shapes, a six-step type scale and
   one control spec. Marcellus stays for the wordmark only. Full rules: DESIGN_SYSTEM.md. */
:root{
  --font-display:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-ui:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* Numerals share the UI face; add font-variant-numeric:tabular-nums where digits align. */
  --font-mono:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-brand:"Marcellus",Georgia,serif;

  /* Six-step type scale. Nothing an agent reads is under --fs-caption; --fs-label is for
     UPPERCASE letter-spaced labels only. These are the PHONE/TABLET sizes; computers get the
     same scale x0.9 (block below). */
  --fs-label:13px; --fs-caption:15px; --fs-body:17px; --fs-title:20px; --fs-number:34px; --fs-page:40px;
  /* --ui-scale: 1 on touch screens, .9 on computers. Any size an app still hard-codes should be
     written calc(Npx*var(--ui-scale,1)) so it shrinks in step with the tokens. */
  --ui-scale:1;

  --paper:#F3F5FB; --surface:#FFFFFF; --surface-2:#EDF0F7; --line:#DFE4EF;
  --rail:#EDF0F8;                 /* app sidebar: one step recessed from the page, never a dark slab */
  --ink:#111A2C; --ink-2:#3A4660; --ink-3:#586580; --ink-inverse:#FFFFFF;
  --accent:#2D5789; --accent-soft:#E5EDFA; --accent-ink:#1E4478;
  --accent-strong:#2D5789;        /* big solid brand panels (e.g. the dashboard stats card); stays deep in dark */
  --warm:#A5541A; --warm-soft:#FDEBDD;
  --good:#17775A; --good-soft:#E3F3EB;
  --bad:#B3382C; --bad-soft:#FBE7E4;
  /* Tool washes: soft fills that tell tools/sections apart (t = the matching icon/ink color). */
  --wash-blue:#E8EFFC; --wash-green:#E3F3EB; --wash-apricot:#FDEBDD; --wash-violet:#EEE8FB;
  --tint-blue:#2D5789; --tint-green:#17775A; --tint-apricot:#A5541A; --tint-violet:#5B45A8;
  --shadow:0 1px 2px rgba(17,26,44,.04),0 8px 24px rgba(17,26,44,.06);
  --radius:14px; --radius-sm:10px; --radius-lg:18px;
  --control-h:48px; --chip-h:44px;
  color-scheme:light;
}
/* "One notch smaller" on computers (Kasey 10/7/26: "a little bit too big overall"). Everything
   x0.9 when the main pointer is a mouse/trackpad and the window is at least 768 wide. Phones and
   tablets (touch = pointer:coarse, incl. the Open House iPad) never match, so they keep 44px taps
   and 16px+ inputs. The 768 floor (not 1024) is on purpose: an app framed inside the portal
   measures the FRAME, which is ~250px narrower than the screen, and must shrink with the portal
   around it. screen-only, so printing is unchanged. */
@media screen and (hover:hover) and (pointer:fine) and (min-width:768px){
  :root{
    --ui-scale:.9;
    --fs-label:11.7px; --fs-caption:13.5px; --fs-body:15.3px; --fs-title:18px; --fs-number:30.6px; --fs-page:36px;
    --control-h:43.2px; --chip-h:39.6px;
  }
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#0C1120; --surface:#141B2D; --surface-2:#1A2236; --line:#252F48;
    --rail:#0A0E1A;
    --ink:#EEF2FA; --ink-2:#B9C3D9; --ink-3:#8D98B2; --ink-inverse:#0C1120;
    --accent:#8AB2F2; --accent-soft:#1B2844; --accent-ink:#B1CBF6;
    --accent-strong:#27497D;
    --warm:#E9A26B; --warm-soft:#33251A;
    --good:#5CC79F; --good-soft:#142C27;
    --bad:#EE8577; --bad-soft:#3A1F1C;
    --wash-blue:#18243E; --wash-green:#142C27; --wash-apricot:#33251A; --wash-violet:#221C3B;
    --tint-blue:#8AB2F2; --tint-green:#5CC79F; --tint-apricot:#E9A26B; --tint-violet:#B3A1F0;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.32);
    color-scheme:dark;
  }
}