/* =====================================================================
   Leitco — tokens
   ---------------------------------------------------------------------
   LAYER 1 of 3. Declares custom properties and NOTHING ELSE, so it is
   safe to drop into any page in the estate — including the two big
   self-contained apps, which have their own component vocabularies.

     leitco-tokens.css   this file. Safe everywhere.
     leitco-chrome.css   shared header + tabs. All classes lc- prefixed,
                         so they cannot collide. Safe everywhere.
     leitco-ui.css       the component library (.card .btn .tile .pill).
                         ONLY for pages we own — never viewer.html or
                         tool.html, whose classes clash by 6 and 11 names
                         respectively.

   Change a colour here and it moves in the dashboard, the tracker, the
   point cloud viewer and the zoning tool at once. That is the whole
   reason this file exists.
   ===================================================================== */
:root{
  /* ---- brand ---- */
  --charcoal:#33343A;   /* primary dark surface                         */
  --charcoal-dp:#26272C;/* hovers on dark. Was #1C1D21 — too heavy      */
  --gold:#C9A961;       /* the accent                                   */
  --gold-lt:#DEBC75;    /* hover                                        */
  --gold-br:#F0C070;    /* focus ring on dark                           */
  --gold-dk:#6A4E12;    /* gold text on light, passes contrast          */
  --champagne:#E8D9A8;  /* muted text on charcoal                       */
  --cream:#F4EBD3;      /* pale gold fill                               */

  /* ---- neutrals ---- */
  --ink:#2D2D2D;
  --mut:#6A6A6E;
  --paper:#F7F7F6;
  --line:#DEDEE0;
  --white:#fff;
  --card:#FFFFFF;       /* zoning names the card fill explicitly        */
  --beige:#EAE6DE;      /* zoning: zone-reference banding               */
  --taupe:#55575E;      /* zoning: secondary dark                       */
  --taupe-lt:#C6C6CA;   /* zoning: dividers on dark                     */
  --blue:#0033A0;       /* zoning: statutory / map link blue            */

  /* ---- surfaces over 3D ---- */
  --panel:rgba(28,29,33,.92);      /* viewer: floating tool panels      */
  --pline:rgba(255,255,255,.14);   /* viewer: their hairline borders    */

  /* ---- semantic ---- */
  --ok:#3F6B3F;      --ok-bg:#E7F0E7;
  --warn:#8A5A00;    --warn-bg:#F4EBD3;
  --stop:#8C3A2B;    --stop-bg:#F7E9E6;   --stop-ink:#7A2E22;

  /* ---- the tab bar sits on paper, not charcoal ----
     Darker than the header inverted the hierarchy: navigation ended up
     weightier than the masthead it hangs from. */
  --tab-bg:#EFEEEC;
  --tab-ink:#33343A;

  /* ---- type ---- */
  --f-ui:Arial,Helvetica,sans-serif;
  --f-mark:Georgia,serif;
  --f-num:Consolas,'Courier New',monospace;

  /* ---- shape ---- */
  --r:3px; --r-sm:2px; --r-pill:20px;
  --rule:3px;

  /* ---- spacing ---- */
  --s1:5px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:28px; --s7:40px;

  --lift:0 1px 2px rgba(28,29,33,.06);
  --lift-2:0 4px 14px rgba(28,29,33,.13);

  /* 1080 left content at ~42% of a wide monitor, so the grid read as the
     subject and the work read as an island. */
  --wrap-w:1280px;
}