/* auto-generated: scripts/review.py theme dori
   the client's design system -> the review dashboard skin. Re-run after a re-brand. */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,400..600;1,400..500&family=Lora:ital,wght@0,400..600;1,400..600&display=swap");
:root{
  /* Palette — Riviera (sky paper, navy ink, tangerine accent). Kept as-is:
       the colour system tested well. The redesign changes type + layout, not
       the palette. */
    --bg:         #E9EEF0;
    --bg2:        #D9E5E8;
    --paper:      #F4F7F8;
    --ink:        #1E2A35;
    --ink-2:      #2D3D4D;
    --accent:     #F08A28;
    --accent-2:   #D87510;
    --line:       #CFD7DB;
    --line-2:     #B9C5CB;
    --muted:      #5A6B77;
    --night:      #15212B;
    --night-line: #2A3845;
    --night-mute: #7C8C97;
    --green:      #1F8A3F;
    /* AAA-safe ink for text on the orange accent (≈7.2:1). White tops out at
       ~2:1 on this tangerine, so every primary CTA uses deep navy text, not
       white — accessibility over the "most CTAs use white text" convention. */
    --ink-on-accent: #0E171E;

    /* On-dark surface tokens — light text/elements on the navy sections
       (Performance proof + CTA card). Tokenised so the dark palette shifts
       from one place, per CLAUDE.md "no hardcoded colours in selector bodies". */
    --on-night:      var(--bg);
    --on-night-soft: #BFCBD3;
    --accent-hi:     #FF9C44;
    --green-hi:      #5BC97A;
    --white:         #fff;

    /* Typography — warm editorial pairing. Lora (calm, brushed serif) for
       display — replaced Fraunces 2026-06-10, whose wonky display cuts read
       off-brand — Inter for body + UI. `--font-mono` aliases the sans so
       legacy label selectors inherit Inter instead of a monospace voice. */
    --font-display: "Lora", Georgia, "Times New Roman", serif;
    --font-sans:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono:    var(--font-sans);

    /* Fluid type scale — Perfect-Fourth-ish. Display headings use clamp();
       body stays in rem so browser zoom never clips (WCAG 1.4.4). */
    --fs-h1:   clamp(2.6rem, 1.7rem + 3.8vw, 4.75rem);
    --fs-h2:   clamp(2rem, 1.5rem + 2.1vw, 3.1rem);
    --fs-h3:   clamp(1.4rem, 1.2rem + 0.85vw, 1.85rem);
    --fs-h4:   1.2rem;
    --fs-lead: clamp(1.15rem, 1.05rem + 0.45vw, 1.35rem);
    --fs-body: 1.0625rem;

    /* Layout. --rail is kept for the not-yet-reworked inner pages; the home
       redesign uses --measure (a calm reading column) instead of the rail. */
    --rail:      220px;
    --gutter:    clamp(22px, 4vw, 56px);
    --container: 1180px;
    --measure:   62ch;
    --space-section: clamp(76px, 9vw, 132px);

    /* Radii — softened for warmth. */
    --r-sm:   6px;
    --r:      10px;
    --r-lg:   18px;
    --r-pill: 999px;

    /* Soft depth — subtle and warm, never a hard drop-shadow. */
    --shadow-soft: 0 2px 8px color-mix(in oklab, var(--ink) 8%, transparent);
    --shadow-md:   0 10px 30px color-mix(in oklab, var(--ink) 11%, transparent);
    --shadow-lift: 0 22px 50px color-mix(in oklab, var(--ink) 17%, transparent);
    --shadow-card: 0 16px 44px color-mix(in oklab, var(--ink) 12%, transparent);

    /* Faint per-section surface wash — a light top band settling into the page
       base, token-derived so the palette still re-skins from the primitives. */
    --grad-section: linear-gradient(180deg,
        color-mix(in oklab, var(--paper) 60%, var(--bg)) 0%,
        var(--bg) 52%);

    /* Motion. */
    --ease: cubic-bezier(0.22, 1, 0.36, 1);

    /* Hand-drawn underline — the one warm accent moment. An SVG stroke used
       as a mask so the colour stays var(--accent), not a gradient fill. */
    --underline-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M4 10 C42 4 74 13 104 8 C134 3 168 12 196 6' fill='none' stroke='%23000' stroke-width='4.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --rail: 150px; --gutter: 32px;
  --rail: 100%; --gutter: 24px;
  --gutter: 20px;
  /* map the design system onto the dashboard chrome */
  --bg: var(--color-surface, #f6f7f8);
  --panel: var(--color-page-background, #ffffff);
  --panel2: var(--color-surface-high, #eef1f4);
  --line: var(--color-border, #e4e8ec);
  --ink: var(--color-heading, #1a2430);
  --muted: var(--color-muted, #7a8593);
  --accent: var(--color-accent, #d9a441);
  --font: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
  --serif: var(--font-serif, Georgia, serif);
}