/* ============================================================================
   Cambridge Housing Map — Design Tokens
   Single source of truth for color, type, spacing, radius, elevation, and the
   confidence-tier visual system. Port these into your codebase (CSS custom
   properties, a JS/TS theme object, Tailwind config, etc.).
   ============================================================================ */

:root {
  /* ---- Surfaces & ink (civic, warm-neutral, low-saturation) ---- */
  --paper:        #f4f4f2;  /* app background */
  --panel:        #ffffff;  /* cards, rails, panels */
  --ink:          #23262d;  /* primary text */
  --ink-2:        #565d68;  /* secondary text */
  --ink-3:        #8a909a;  /* tertiary text / labels */
  --line:         #e6e6e2;  /* borders, dividers */
  --line-2:       #f0f0ed;  /* subtle inner dividers */

  /* ---- Accent (civic indigo). The ONLY chromatic hue in the base theme. ---- */
  --accent:       #4a55a6;  /* primary actions, focus, 6-story eligibility */
  --accent-soft:  #eef0f8;  /* accent tint backgrounds (eligibility callout) */

  /* ---- Masthead (header) ---- */
  --masthead-a:   #22262f;  /* gradient edge */
  --masthead-b:   #2a3040;  /* gradient center */
  --masthead-glow: rgba(112,126,216,.52);  /* centered brand glow */
  --masthead-rule: rgba(99,112,201,.42);   /* 2px bottom hairline */

  /* ---- Type ---- */
  --font:  "Public Sans", system-ui, -apple-system, sans-serif; /* UI + body */
  --mono:  "IBM Plex Mono", ui-monospace, monospace;            /* labels, data, provenance */
  /* Serif option used in the editorial variation: "Source Serif 4", Georgia, serif */

  /* Type scale (px). Slide/print mins do not apply — this is screen UI. */
  --t-display: 29px;  /* hero headline (welcome) */
  --t-h2:      19px;  /* panel title */
  --t-h3:      10.5px;/* section eyebrow (mono, uppercase, .06em tracking) */
  --t-body:    14px;  /* default */
  --t-sm:      12.5px;/* meta, captions */
  --t-xs:      11px;  /* fine print, provenance */
  --t-stat:    24px;  /* big numbers ("85 proposed") */

  /* Weights: 400 body · 500 mono/labels · 600 emphasis · 700 headings · 800 stats */

  /* ---- Spacing scale (the "comfortable" rhythm; see density modes) ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 28px;

  /* ---- Radius ---- */
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 13px;
  --r-pill: 999px;

  /* ---- Elevation ---- */
  --shadow: 0 1px 2px rgba(20,22,28,.05), 0 6px 22px rgba(20,22,28,.09);
  --shadow-lg: 0 1px 2px rgba(20,22,28,.06), 0 24px 60px rgba(20,22,28,.20);

  /* ---- Map: zoning eligibility layer ---- */
  --elig-6:  #4a55a6;  /* 6-story-eligible parcels (fill @ .20, stroke @ 1px) */
  --elig-4:  #8b94a3;  /* 4-story-by-right parcels (fill @ .10) */
  --fade-outside: rgba(31,32,36,.28); /* mask dimming areas OUTSIDE Cambridge */
}

/* ============================================================================
   CONFIDENCE TIERS  —  the load-bearing visual system.
   A single graphite hue; MEANING is encoded by TREATMENT, not color, so the
   ramp reads as data-quality (not advocacy). A "Rumored" entry must never look
   like a "Confirmed" one. Draw order: Rumored (bottom) → Confirmed (top).
   ============================================================================ */
:root {
  --graphite:     #2b2f36;  /* Confirmed */
  --graphite-mid: #646c7a;  /* In review */
  --graphite-lt:  #9aa1ac;  /* Reported / Rumored outline */
}

/* Map markers (Leaflet circleMarker equivalents) and legend dots:
   Confirmed  → fill graphite,       opacity 1,    2px WHITE stroke (reads solid, credible)
   In review  → fill graphite-mid,   opacity .95,  1.5px white stroke
   Reported   → fill #fff (hollow),  2px graphite-mid stroke  (outline only)
   Rumored    → fill #fff, opacity .55, 1.5px DASHED graphite-lt stroke (faded, subdued)

   List cards carry a left border in the tier accent ramp:
   Confirmed #2b2f36 · In review #646c7a · Reported #9aa1ac · Rumored #c9ced5
*/

/* ============================================================================
   DENSITY MODES (tweakable). Default = comfortable (values above).
   .sp-cozy tightens paddings ~30%; .sp-spacious loosens ~35%.
   ============================================================================ */

/* ============================================================================
   MOOD PALETTES (tweakable). Each swaps accent + surface warmth together.
   civic  : --accent #4a55a6  --paper #f4f4f2  (default, cool)
   slate  : --accent #4d5564  --paper #ececef  (neutral)
   clay   : --accent #9a5b3f  --paper #f2eee6  (warm)
   harbor : --accent #2f7d86  --paper #eceff0  (teal)
   ============================================================================ */