/* LRL soft look — fleet layer (CM 2026-11-02: "roll it out to all sites").
 * freud-style: near-white canvas, near-black text, chocolate-brown ONLY for primary pills and
 * badges, Inter body + Urbanist headings, pill buttons, rounded cards, soft fills over borders.
 * Hosted once on the hub and loaded by lrl-shell.js on every Lazy Research Lad site
 * (opt out per page with data-soft="off" on the shell <script>). Text contrast ≥ 6.9:1.
 * Source of truth: research-suite/lrl-soft.css. Studio adds public/soft-design.css on top. */
/* fonts: linked in each page's <head> by inject.mjs (no @import: it delayed the whole sheet) */

html[data-lrl-soft] {
  --soft-canvas:#fcfbfa; --soft-surface:#ffffff; --soft-fill:#f2efec; --soft-track:#e6e0db;
  --soft-ink:#1f1915; --soft-ink-2:#3a332e; --soft-mute:#575049; --soft-line:#e8e3df;
  --soft-btn:#4f3422; --soft-btn-ink:#ffffff; --soft-tint:#f7f4f1; --soft-pad:#e8ddd9;
  --soft-t-orange:#a94f0c; --soft-t-coral:#b23a2a; --soft-t-lilac:#5f49c4;
  --soft-olive:#9bb068; --soft-orange:#ed7e1c; --soft-lilac:#a694f5; --soft-coral:#fe814b;
  --soft-shadow:0 1px 2px rgba(31,25,21,.05),0 10px 30px -18px rgba(31,25,21,.25);
  --lrl-display:'Urbanist',system-ui,sans-serif; --lrl-display-w:800; --lrl-soft-shapes:1;
}
/* Site tokens → soft palette. On <html> AND <body>: some sites declare their colours on body, which
   would beat anything inherited from <html>. Values point at --soft-*, so dark mode follows for free. */
html[data-lrl-soft], html[data-lrl-soft] body {
  /* the shared product-design tokens every site already reads */
  --product-accent:var(--soft-btn)!important; --product-accent-dark:var(--soft-pad)!important;
  --product-canvas:var(--soft-canvas)!important; --product-surface:var(--soft-surface)!important;
  --product-soft:var(--soft-fill)!important; --product-ink:var(--soft-ink)!important;
  --product-muted:var(--soft-mute)!important; --product-line:var(--soft-line)!important;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif!important;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif!important;
  --serif:'Urbanist',system-ui,sans-serif!important; --font-display:'Urbanist',system-ui,sans-serif!important;
  --r:20px!important; --r-sm:14px!important; --r-lg:28px!important; --r-pill:999px!important;
  --radius:20px!important; --radius-sm:14px!important; --radius-lg:28px!important;
  /* generic names several sites use for the same roles (Guidebooks, Studio, static sites) */
  --bg:var(--soft-canvas)!important; --card:var(--soft-surface)!important; --surface:var(--soft-surface)!important;
  --ink:var(--soft-ink)!important; --ink2:var(--soft-ink-2)!important; --ink-2:var(--soft-ink-2)!important;
  --ink3:var(--soft-mute)!important; --ink-mute:var(--soft-mute)!important; --muted:var(--soft-mute)!important;
  --line:var(--soft-line)!important; --accent:var(--soft-btn)!important;
  /* the older Lazy Research Lad family (its dark values were purple-navy and clashed with the soft look) */
  --paper:var(--soft-canvas)!important; --paper-2:var(--soft-surface)!important; --paper-3:var(--soft-fill)!important;
  --bg-elev:var(--soft-surface)!important; --bg-soft:var(--soft-fill)!important; --bg-tint:var(--soft-tint)!important;
  --bg-2:var(--soft-fill)!important; --surface2:var(--soft-fill)!important; --surface-2:var(--soft-fill)!important;
  --panel:var(--soft-surface)!important; --chip:var(--soft-fill)!important; --code-bg:var(--soft-fill)!important;
  --ink-soft:var(--soft-ink-2)!important; --ink-faint:var(--soft-mute)!important;
  --text:var(--soft-ink-2)!important; --text-h:var(--soft-ink)!important;
  --text-secondary:var(--soft-ink-2)!important; --text-tertiary:var(--soft-mute)!important;
  --bar-text:var(--soft-ink)!important; --bar-muted:var(--soft-mute)!important;
  --line-soft:var(--soft-line)!important; --border:var(--soft-line)!important;
  --accent-bg:var(--soft-tint)!important; --accent-light:var(--soft-tint)!important; --accent-border:var(--soft-track)!important;
  --grad-soft:linear-gradient(135deg,var(--soft-fill),var(--soft-tint))!important;
  /* old accent trio, as readable text colours on the soft canvas (≥4.5:1 in both themes) */
  --coral:var(--soft-t-orange)!important; --magenta:var(--soft-t-coral)!important; --violet:var(--soft-t-lilac)!important;
  /* the old brand gradient tokens: one flat brown, so gradient buttons and selected chips become the soft pill */
  --grad:linear-gradient(var(--soft-btn),var(--soft-btn))!important; --grad-warm:linear-gradient(var(--soft-btn),var(--soft-btn))!important;
  --accent2:var(--soft-t-lilac)!important; --warm:var(--soft-t-orange)!important;
}
/* native checkboxes, radios, sliders and progress bars: brown, not browser blue */
html[data-lrl-soft] { accent-color:var(--soft-btn); }
/* Research Book's decorative opening quote before page titles (old editorial look) */
html[data-lrl-soft] .hero h1::before { content:none!important; }
html[data-lrl-soft]:is([data-theme="dark"],.dark,:has(body.dark),:has(body[data-theme="dark"])) {
  --soft-canvas:#1c1714; --soft-surface:#26201c; --soft-fill:#322a24; --soft-track:#3d342d;
  --soft-ink:#f7f2ee; --soft-ink-2:#e4dbd4; --soft-mute:#c4b8ae; --soft-line:#40362f;
  --soft-btn:#eadfd6; --soft-btn-ink:#2a1d14; --soft-tint:#221c18; --soft-pad:#eadfd6;
  --soft-t-orange:#f3a35f; --soft-t-coral:#f79a86; --soft-t-lilac:#c3b5ff;
  --soft-shadow:0 1px 2px rgba(0,0,0,.3),0 12px 30px -18px rgba(0,0,0,.6);
}

/* type */
html[data-lrl-soft] body { font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; color:var(--soft-ink); }
html[data-lrl-soft] :is(h1,h2,h3) { font-family:'Urbanist',system-ui,sans-serif!important; font-weight:800!important; letter-spacing:-.02em!important; color:var(--soft-ink)!important; font-style:normal; }
html[data-lrl-soft] :is(h1,h2) :is(em,i) { font-style:normal!important; font-family:inherit!important; color:var(--soft-ink-2)!important; }

/* primary actions: one chocolate pill; secondary: soft fill pill. Wide buttons only, never icons. */
html[data-lrl-soft] :is(.btn,.button,[class*="btn-"],[class~="btn"],button[type="submit"]):not(.lrl-ib):not([role="switch"]):not([role="tab"]) { border-radius:999px!important; }
html[data-lrl-soft] :is(.btn-fill,.btn-primary,.primary,.btn-accent,.cta,[class*="btn-solid"]):not(.lrl-ib) { background:var(--soft-btn)!important; color:var(--soft-btn-ink)!important; border-color:transparent!important; box-shadow:none!important; background-image:none!important; }
html[data-lrl-soft] :is(.chip,.pill,.tag,[class*="chip"]):not(svg *) { border-radius:999px!important; }

/* fields */
html[data-lrl-soft] :is(input[type=text],input[type=search],input[type=email],input[type=url],input[type=number],input:not([type]),textarea,select):not([class*="lrl"]) { border-radius:16px!important; }
html[data-lrl-soft] textarea { border-radius:20px!important; }
html[data-lrl-soft] :is(input,textarea,select):focus-visible { outline:none!important; box-shadow:0 0 0 4px color-mix(in srgb,var(--soft-olive) 35%,transparent)!important; }

/* cards: rounder corners, softer edge */
html[data-lrl-soft] :is(.card,.panel,[class$="-card"],[class*="-card "],[class$="-panel"],.modal,[role="dialog"]):not(.lrl-side *):not(svg *) { border-radius:24px!important; }

/* the shared side menu + top bar */
html[data-lrl-soft] .lrl-side { background:var(--soft-canvas)!important; border-right:0!important; font-family:'Inter',system-ui,sans-serif!important; }
html[data-lrl-soft] .lrl-side .lrl-brand span { font-family:'Urbanist',system-ui,sans-serif!important; font-weight:800; }
html[data-lrl-soft] .lrl-side .lrl-btn { border-radius:999px!important; background:var(--soft-btn)!important; color:var(--soft-btn-ink)!important; min-height:42px; font-weight:600; }
html[data-lrl-soft] .lrl-study, html[data-lrl-soft] .lrl-tray { border-radius:22px!important; border:0!important; background:var(--soft-fill)!important; }
html[data-lrl-soft] .lrl-study b, html[data-lrl-soft] .lrl-study strong { font-family:'Inter',system-ui,sans-serif!important; font-weight:700!important; }
html[data-lrl-soft] .lrl-st { border-radius:999px!important; color:var(--soft-mute)!important; }
html[data-lrl-soft] .lrl-st .n { width:24px!important; height:24px!important; border:0!important; background:var(--soft-track)!important; color:var(--soft-ink)!important; }
html[data-lrl-soft] .lrl-st.cur, html[data-lrl-soft] .lrl-st.cur .t { color:var(--soft-ink)!important; }
html[data-lrl-soft] .lrl-st.cur .n { background:var(--soft-btn)!important; color:var(--soft-btn-ink)!important; }
html[data-lrl-soft] .lrl-st.done .n { background:var(--soft-olive)!important; color:#fff!important; }
html[data-lrl-soft] .lrl-st .t small, html[data-lrl-soft] .lrl-stages ul .j small { color:var(--soft-mute)!important; }
html[data-lrl-soft] .lrl-stages ul a { border-left:0!important; border-radius:16px!important; margin:2px 0; color:var(--soft-ink)!important; }
html[data-lrl-soft] .lrl-stages ul a[aria-current] { background:var(--soft-surface)!important; box-shadow:var(--soft-shadow); padding-left:16px!important; font-weight:600; }
html[data-lrl-soft] :is(.lrl-tog,.lrl-hide) { border-radius:50%!important; }
html[data-lrl-soft] .lrl-top { background:color-mix(in srgb,var(--soft-canvas) 90%,transparent)!important; border-bottom-color:var(--soft-line)!important; }
html[data-lrl-soft] .lrl-ib, html[data-lrl-soft] .lrl-actions .lrl-kept { border-radius:999px!important; border-color:var(--soft-line)!important; }
html[data-lrl-soft] .lrl-menu { border-radius:20px!important; border:0!important; box-shadow:var(--soft-shadow),0 0 0 1px var(--soft-line)!important; }
html[data-lrl-soft] .lrl-menu :is(a,button) { border-radius:14px!important; }
html[data-lrl-soft] .lrl-next { border-radius:24px!important; }
html[data-lrl-soft] [data-lrl-subnav]>:is(a,button) { border-radius:999px!important; }

/* body copy that sites set in a serif reads as Inter; JS (lrl-shell softFonts) catches hard-coded Georgia */
html[data-lrl-soft] :is(.lede,.lead,.intro,.subtitle,.hero-sub,.sub) { font-family:'Inter',system-ui,sans-serif!important; }
html[data-lrl-soft] :is(h1,h2,h3) :is(em,i,span):not(svg *) { font-family:inherit!important; font-style:normal!important; }

html[data-lrl-soft]:is([data-theme="dark"],.dark,:has(body.dark),:has(body[data-theme="dark"])) .product-accent-fill { color:var(--soft-btn-ink)!important; }
html[data-lrl-soft] .lrl-top .sep { color:var(--soft-mute)!important; }
html[data-lrl-soft] :is(.skip-link,.skip,.skiplink) { background:var(--soft-btn)!important; color:var(--soft-btn-ink)!important; }

/* the shell's own buttons + every site's tab rows: pills */
html[data-lrl-soft] .lrl-btn { border-radius:999px!important; }
html[data-lrl-soft] :is([role="tab"],.tab,.tabs>button,.tabs>a,.nav-tab,.navbtn):not(.lrl-side *) { border-radius:999px!important; }
/* sample-mode notice (gate bootstrap): a quiet floating pill, not a dark green band */
html[data-lrl-soft] #lrl-sample-bar { left:50%!important; right:auto!important; bottom:14px!important; transform:translateX(-50%); width:max-content; max-width:calc(100% - 24px); border-radius:999px!important; background:var(--soft-ink)!important; color:var(--soft-canvas)!important; font:500 13.5px/1.45 Inter,system-ui,sans-serif!important; padding:10px 20px!important; box-shadow:var(--soft-shadow); }
html[data-lrl-soft] #lrl-sample-bar a { color:inherit!important; font-weight:600; }
@media (max-width:640px) { html[data-lrl-soft] #lrl-sample-bar { border-radius:20px!important; font-size:12.5px!important; bottom:10px!important; padding:9px 14px!important; } }
/* phones: ResearchFlow's header keeps just its name (the top bar already says the stage) */
@media (max-width:640px) {
  html[data-lrl-soft] .wizard-header .wizard-logo, html[data-lrl-soft] .wizard-header .wizard-stage-counter { display:none!important; }
  html[data-lrl-soft] .wizard-header { justify-content:flex-start!important; text-align:left!important; padding:14px 16px!important; }
  html[data-lrl-soft] .wizard-header .wizard-subtitle { font-size:13px!important; }
}