/* ==================================================================
   LINTH — Master Tokens  (v0.1 · 2026-07-02)
   Product: vertical LLM-native workflow engine for renewable-energy
   & data-center developers (Linth — Q15 resolved 2026-07-16; built as "Blackberry").

   Composition: Model ML structural bones × Cartlidge Levene voice ×
   provenance wedge. Decisions locked 2026-07-02 (session
   07012026-design-assistant, board 05):
     D1 mono = Geist Mono · D2 register = Inter UI + mono data
     D3 accent = bramble #4A2545, PROVENANCE ROLES ONLY
     D4 wordmark = Concept B "ledger rule"
   Light is canonical (the lender-document genre + Model ML app);
   dark is a SEED (Model ML app-dark was never captured — values
   below marked SEED are honest extrapolations, not evidence).
   ================================================================== */

/* ---------- Fonts ----------
   All faces load from Google Fonts (SIL OFL / free):
   Inter (UI) · Geist Mono (data/identity) · Newsreader (one greeting).
   In HTML previews:
   https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500;700&family=Inter:wght@400;500;600;700&family=Newsreader:ital,wght@0,400;1,400&display=swap */

:root {
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --font-serif: 'Newsreader', Georgia, serif;           /* the ONE serif moment: home greeting */
  --font-doc: Arial, Helvetica, sans-serif;             /* export register — Office-native plain */
}

/* ---------- Light (CANONICAL) ---------- */
:root,
[data-theme='light'] {
  /* Ground — Model ML CSS-confirmed two-tone */
  --paper: #F5F5F4;            /* app ground, sidebar, secondary-button fill */
  --surface: #FFFFFF;          /* canvas, cards, modals, table body */

  /* Ink + alpha hierarchy (the whole text/border system) */
  --ink: #292524;              /* primary text, icon strokes, primary buttons, tooltips */
  --ink-60: rgba(41, 37, 36, 0.60);   /* secondary text, icons */
  --ink-40: rgba(41, 37, 36, 0.40);   /* muted, placeholders, memoized */
  --hairline: rgba(41, 37, 36, 0.10); /* THE border. 1px. everywhere */
  --hover: rgba(41, 37, 36, 0.05);    /* row/item hover band */
  --active: rgba(41, 37, 36, 0.09);   /* selected nav item, active chip */
  --text-on-ink: #F5F5F4;

  /* Warm stones — spare neutrals (dividers, quiet chips, illustration) */
  --stone-1: #DFDED1;
  --stone-2: #D3D2C2;
  --stone-3: #BFBDA9;
  --stone-4: #969481;

  /* ACCENT — bramble ink. PROVENANCE ROLES ONLY (D3).
     Permitted: citation markers/superscripts · source pills · the
     cited-tick · span-highlight in source popovers.
     Prohibited: buttons, nav, links-in-chrome, hovers, decoration.
     Buttons and nav are ALWAYS ink. */
  --bramble: #4A2545;
  --bramble-hover: #63315C;
  --bramble-soft: rgba(74, 37, 69, 0.08);

  /* Semantic — state only, micro-doses (pills, dots, callout text);
     never fills of large regions */
  --run-blue: #2E5FC4;         /* cell Running/Preparing dot, selected-cell outline */
  --ok-green: #1E7A46;         /* connected, save confirmed */
  --ok-green-bg: #D9F2E1;
  --warn-rust: #A6511F;        /* warnings, ABSTENTIONS, checkpoint-pending */
  --warn-rust-bg: rgba(224, 113, 58, 0.10);
  --danger: #B42318;           /* destructive, TIE-OUT BREAKS */
  --danger-bg: rgba(180, 35, 24, 0.07);
  --keep-beige-bg: #F3ECD9;    /* decision pill: Keep (Model ML estimate) */
  --keep-beige-text: #8A6A2B;

  /* Provenance state map (the wedge — aliases, use these in components) */
  --prov-cited: var(--bramble);
  --prov-cited-soft: var(--bramble-soft);
  --prov-abstained: var(--warn-rust);
  --prov-abstained-bg: var(--warn-rust-bg);
  --prov-break: var(--danger);
  --prov-break-bg: var(--danger-bg);
  --prov-running: var(--run-blue);
  --prov-memoized: var(--ink-40);
  --prov-checkpoint: var(--warn-rust);
}

/* ---------- Dark (SEED — unverified, Model ML app-dark never captured) ---------- */
[data-theme='dark'] {
  --paper: #171412;            /* SEED: warm near-black ground */
  --surface: #0C0A09;          /* SEED: from Model ML dark-brand #0C0A09 (CONFIRMED as brand) */
  --ink: #E7E5E4;
  --ink-60: rgba(231, 229, 228, 0.62);
  --ink-40: rgba(231, 229, 228, 0.40);
  --hairline: rgba(255, 255, 255, 0.08);
  --hover: rgba(255, 255, 255, 0.05);
  --active: rgba(255, 255, 255, 0.09);
  --text-on-ink: #171412;

  --bramble: #A06B9A;          /* SEED: bramble lightened for dark legibility */
  --bramble-hover: #B583AF;
  --bramble-soft: rgba(160, 107, 154, 0.14);

  --run-blue: #6E96E8;
  --ok-green: #58B879;
  --ok-green-bg: rgba(88, 184, 121, 0.14);
  --warn-rust: #D98A55;
  --warn-rust-bg: rgba(217, 138, 85, 0.12);
  --danger: #E06A5F;
  --danger-bg: rgba(224, 106, 95, 0.12);

  --prov-cited: var(--bramble);
  --prov-cited-soft: var(--bramble-soft);
  --prov-abstained: var(--warn-rust);
  --prov-abstained-bg: var(--warn-rust-bg);
  --prov-break: var(--danger);
  --prov-break-bg: var(--danger-bg);
  --prov-running: var(--run-blue);
  --prov-memoized: var(--ink-40);
  --prov-checkpoint: var(--warn-rust);
}

/* ---------- Typography scale ---------- */
:root {
  /* UI (Inter) — Model ML rhythm: tight, calm */
  --text-meta: 11px;           /* timestamps, counts, tooltips, band labels */
  --text-ui: 13px;             /* DEFAULT — sidebar, table cells, buttons */
  --text-body: 14px;           /* form labels, prose in panels */
  --text-section: 15px;        /* section headers (600) */
  --text-title-object: 18px;   /* grid/modal titles (600) */
  --text-title-page: 26px;     /* page titles (600) */
  --text-greeting: 30px;       /* the serif moment (Newsreader 400 italic) */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;          /* mono wordmark/figures emphasis only */

  --leading-ui: 1.4;
  --leading-reading: 1.55;
  --tracking-ui: -0.01em;
  --tracking-wordmark: -0.03em;  /* mass, not scatter (anti-Constellator) */
  --tracking-caps: 0.10em;       /* mono uppercase micro-labels */

  /* Data/figures are ALWAYS mono with tabular numerals */
  --text-figure-jump: 26px;    /* key figures jump an order of magnitude (CL P3) */

  /* ---------- Spacing · radius · borders ---------- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px;
  --space-4: 16px; --space-5: 24px; --space-6: 32px;

  --radius-s: 4px;             /* checkboxes, small chips */
  --radius-m: 6px;             /* menu items, cards (dense) */
  --radius-l: 8px;             /* buttons, inputs, cards (default) */
  --radius-xl: 12px;           /* modals */
  --radius-pill: 99px;         /* source pills + tag chips ONLY — never buttons */

  --border: 1px solid var(--hairline);   /* the only border weight */

  /* ---------- Elevation (flat grammar) ----------
     NO shadows on cards or buttons — hairlines carry structure.
     Shadow exists only on floating layers. */
  --shadow-float: 0 4px 16px rgba(41, 37, 36, 0.10);   /* popover, menu, floating bar */
  --shadow-modal: 0 16px 48px rgba(41, 37, 36, 0.18);
  --backdrop-dim: rgba(0, 0, 0, 0.35);

  /* ---------- Z ladder ---------- */
  --z-sticky: 10; --z-popover: 30; --z-drawer: 40;
  --z-modal: 50; --z-toast: 60; --z-menu: 65; --z-tooltip: 70;

  /* ---------- Motion (calm-instant; NO bounce anywhere) ---------- */
  --dur-0: 0ms; --dur-1: 70ms; --dur-2: 140ms; --dur-3: 300ms; --dur-4: 560ms;
  /* cell running-dot lives in @keyframes bb-pulse below (graduated from the
     prototype pages, derivation D-17) */
  --ease-smooth: cubic-bezier(0.45, 0.05, 0.55, 0.95);   /* default */
  --ease-delay: cubic-bezier(0.65, 0.05, 0.36, 1);       /* tooltip reveal (300ms delay first) */
  --ease-swing: cubic-bezier(0, 0.55, 0.45, 1);          /* panel expand */

  /* ---------- Icons (Lucide-class, round caps) ---------- */
  --icon-s: 12px; --icon-m: 14px; --icon-l: 16px; --icon-xl: 18px; --icon-hero: 24px;
  --icon-stroke: 1.5;

  /* ---------- Shell geometry (Model ML bones) ---------- */
  --shell-sidebar: 248px;
  --shell-rail: 52px;
  --shell-header: 56px;
  --shell-subtabs: 44px;
  --shell-row-grid: 52px;      /* + Short/Medium/Wrapped density options */
  --shell-row-list: 56px;
  --shell-row-sidebar: 34px;
}

/* ---------- Base element styles (for previews & prototypes) ---------- */
html { background: var(--paper); color: var(--ink); }
body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: var(--text-ui);
  line-height: var(--leading-ui);
  letter-spacing: var(--tracking-ui);
  -webkit-font-smoothing: antialiased;
}
code, kbd, .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.wordmark {
  font-family: var(--font-mono);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wordmark);
  text-transform: lowercase;
}
/* Concept B ledger rule: the wordmark stands on a hairline running to one filled node */
.wordmark-rule { display: flex; align-items: center; margin-top: 4px; }
.wordmark-rule::before { content: ''; flex: 1; height: 1.25px; background: var(--ink); }
.wordmark-rule::after  { content: ''; width: 7px; height: 7px; background: var(--ink); }

/* Focus ring — keyboard only; ink, not accent (accent = provenance only) */
:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; border-radius: inherit; }

/* Citation marker — where the bramble lives */
.cite {
  font-family: var(--font-mono);
  font-size: 9.5px;
  vertical-align: super;
  color: var(--prov-cited);
  font-weight: var(--weight-bold);
}

/* Cell running-dot pulse (the ONLY looping motion; graduated per D-17) */
@keyframes bb-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}