/* ============================================================
   Cantillon Research: daily brief stylesheet (phase 3, 27 Oct 2026)

   One stylesheet for every brief from 20 August 2026 on (the
   reader-first format). inject_chrome.py links it after the page's
   own <style>, so on older briefs it wins at equal specificity, and
   new briefs built from _brief-template.html carry no inline CSS.

   Colours come from tokens only. The values below are the opt-in
   dark theme; assets/theme.css (linked after this file) swaps in
   the light palette by default.
   ============================================================ */

:root{
  --bg:#0a0a0b; --bg-2:#0f0f11; --bg-3:#141417;
  --border:rgba(255,255,255,.1);
  --gold:#c5a250; --gold-light:#e2c47a;
  --text-1:#f0ede6; --text-2:#c9c5be; --text-3:#a7a39c;
  --bull:#3fbf7f; --bear:#e0665a; --warn:#e5a800;
  --sans:system-ui,-apple-system,"Segoe UI",sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
body{background:var(--bg);color:var(--text-1);font-family:var(--sans);font-weight:400;font-size:1rem;line-height:1.65;margin:0}
a{color:var(--gold)}
.wrap{max-width:780px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left,0px)) 0 max(20px,env(safe-area-inset-right,0px))}

/* ── Hero ─────────────────────────────────────────────── */
.hero{padding:clamp(2rem,5vw,3.2rem) 0 1.6rem;border-bottom:1px solid var(--border)}
.eyebrow{font-size:.92rem;font-weight:600;color:var(--gold);margin:0 0 .9rem;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.eyebrow::before,.eyebrow::after{display:none !important}
.free-badge{display:inline-block;font-size:.8rem;font-weight:700;color:var(--bull);background:color-mix(in srgb,var(--bull) 12%,transparent);border:0;border-radius:5px;padding:.15rem .55rem;margin:0}
.brief-title{font-size:clamp(1.9rem,4.2vw,2.75rem);font-weight:800;line-height:1.08;letter-spacing:-.022em;margin:0 0 1rem;color:var(--text-1)}
.brief-title em{font-style:normal;color:var(--gold)}
.brief-sub{font-size:1.14rem;line-height:1.6;color:var(--text-2);max-width:62ch;margin:0 0 1.4rem}
.brief-sub strong{color:var(--text-1);font-weight:650}
.brief-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;font-size:.88rem;color:var(--text-3);padding:0;margin:0}
.brief-meta span{color:var(--text-1);font-weight:500}

/* ── Sections ─────────────────────────────────────────── */
.section{padding:2.4rem 0 0}
.section-head{font-size:1.3rem;font-weight:750;line-height:1.25;letter-spacing:-.01em;color:var(--text-1);margin:0 0 1rem;padding:0;border:0}
.section-head::before{display:none !important}
.section p.lead-read,.lead-read{font-size:1.02rem;line-height:1.7;color:var(--text-2);margin:0 0 .8rem}
.section p.lead-read strong,.lead-read strong{color:var(--text-1);font-weight:650}

/* "If you read nothing else": the whole session in five lines */
.section.tldr{padding-top:1.8rem}
.section.tldr .section-head{font-size:1rem;font-weight:700;color:var(--gold);margin-bottom:.6rem}
.section.tldr .board{border:1px solid var(--border);border-radius:12px;overflow:hidden;border-collapse:separate;border-spacing:0;background:var(--bg-2)}
.section.tldr .board td{padding:.85rem 1rem;font-size:1rem;line-height:1.55;color:var(--text-2);border-bottom:1px solid var(--border);vertical-align:top}
.section.tldr .board tr:last-child td{border-bottom:0}
.section.tldr .board td strong{color:var(--text-1);font-weight:650}
.section.tldr .board td.rk{width:4.6rem;padding-right:0}

/* Action labels. inject_chrome.py wraps the label text of each row
   as <span class="act act-sell">Sell</span>, keyed on the word. */
.act{display:inline-block;min-width:3.6rem;text-align:center;font-size:.82rem;font-weight:700;line-height:1.5;border-radius:5px;padding:.1rem .5rem;color:var(--text-3);background:var(--bg-3)}
.act-buy{color:var(--bull);background:color-mix(in srgb,var(--bull) 13%,transparent)}
.act-sell{color:var(--bear);background:color-mix(in srgb,var(--bear) 13%,transparent)}
.act-wait{color:var(--warn);background:color-mix(in srgb,var(--warn) 15%,transparent)}
.act-skip{color:var(--text-3);background:var(--bg-3)}

/* ── Market update ────────────────────────────────────── */
.mkt{padding:2rem 0 1.6rem;border-bottom:1px solid var(--border)}
.mkt-head{font-size:1.3rem;font-weight:750;color:var(--text-1);margin:0 0 1rem}
.mkt-lead{background:var(--bg-2);border:1px solid var(--border);border-left:3px solid var(--gold);border-radius:0 10px 10px 0;padding:1rem 1.2rem}
.mkt-lead .lbl{font-size:.9rem;font-weight:700;color:var(--gold);margin:0 0 .35rem}
.mkt-lead p{font-size:1rem;line-height:1.65;color:var(--text-2);margin:0}
.mkt-lead p strong{color:var(--text-1);font-weight:650}
.mkt-hits{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.mkt-hits li{position:relative;padding:0 0 0 1.1rem;font-size:.98rem;line-height:1.6;color:var(--text-2)}
.mkt-hits li::before{content:"";position:absolute;left:.1rem;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.mkt-hits b{font-size:.98rem;color:var(--text-1);font-weight:700;margin-right:.35rem}
.mkt-quiet{font-size:1rem;color:var(--text-2)}

/* ── Where the market is ──────────────────────────────── */
.regime-bar{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;padding:0;border:0;margin:0}
.chip{display:flex;flex-direction:column;gap:.15rem;padding:.7rem .85rem;border:1px solid var(--border);border-radius:10px;background:var(--bg-2)}
.chip-k{font-size:.84rem;color:var(--text-3)}
.chip-v{font-size:1.02rem;font-weight:700;color:var(--text-1)}
.chip-v.gold{color:var(--gold)} .chip-v.bull{color:var(--bull)} .chip-v.bear{color:var(--bear)} .chip-v.warn{color:var(--warn)}
.regime-read{padding:1rem 0 0;font-size:1.02rem;line-height:1.7;color:var(--text-2);margin:0}
.regime-read strong{color:var(--text-1);font-weight:650}

/* ── Tables: board, books, watch/avoid, breadth ───────── */
.board,.books,.wa,.breadth{width:100%;border-collapse:collapse;font-size:.95rem;margin:.4rem 0 0}
.board th,.books th,.wa th,.breadth th{text-align:left;padding:.6rem .75rem;background:var(--bg-2);color:var(--text-3);font-size:.84rem;font-weight:600;border-bottom:1px solid var(--border)}
.board td,.books td,.wa td,.breadth td{padding:.7rem .75rem;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:top;line-height:1.55}
.board tr:last-child td,.books tr:last-child td,.wa tr:last-child td,.breadth tr:last-child td{border-bottom:0}
.board .tk,.wa .tk{color:var(--text-1);font-weight:700}
.board .rk{color:var(--text-3);font-weight:700}
.board .lv{color:var(--text-1);font-weight:650}
.board .dim,.dim{color:var(--text-3)}
.board td.why{font-size:.95rem;color:var(--text-1);line-height:1.6}
.board .stats{display:block;font-size:.84rem;color:var(--text-3);margin-top:.3rem;line-height:1.55}
.board .lock{color:var(--text-3);font-weight:600;white-space:nowrap}
.board.full td,.board.full th{font-size:.92rem}
.books .bk{color:var(--text-1);font-weight:650}
.books .rd{font-size:.9rem;font-weight:600}
.breadth .m{color:var(--text-1);font-weight:650}
.dir-l,.up,.open{color:var(--bull)} .dir-s,.dn,.fail{color:var(--bear)} .dir-n,.rk.warn-k{color:var(--warn)}
td.dir-l,td.dir-s,td.dir-n{font-weight:650}

.watch-one{font-size:1rem;line-height:1.65;color:var(--text-2);margin:1rem 0 0;padding:.85rem 1.1rem;background:var(--bg-2);border:0;border-left:3px solid var(--gold);border-radius:0 10px 10px 0}
.watch-one strong{color:var(--text-1);font-weight:650}

/* ── Execution blocks ─────────────────────────────────── */
.exec{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:1.2rem 1.25rem;margin:1rem 0}
.exec-h{font-size:1.08rem;font-weight:750;color:var(--text-1);margin:0 0 .7rem}
.exec-h .b{color:var(--bull)} .exec-h .s{color:var(--bear)} .exec-h .n{color:var(--warn)}
.exec-lead{font-size:1rem;line-height:1.65;color:var(--text-1);margin:0 0 .9rem;padding:0 0 .9rem;border-bottom:1px solid var(--border)}
.exec-lead b{font-weight:700;color:var(--gold)}
.exec-grid{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:.55rem 1rem;font-size:.97rem}
.exec-k{color:var(--text-3);font-weight:600}
.exec-v{color:var(--text-2);line-height:1.6}
.exec-v strong{color:var(--text-1);font-weight:700}

/* ── The one number ───────────────────────────────────── */
.one-num{background:var(--bg-2);border:2px solid var(--gold);border-radius:12px;padding:1.3rem 1.4rem;margin:.4rem 0}
.one-num .lbl{font-size:.92rem;font-weight:700;color:var(--gold);margin:0 0 .3rem}
.one-num .big{font-size:2.3rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--text-1);margin:0 0 .6rem}
.one-num p{font-size:1rem;line-height:1.65;color:var(--text-2);margin:0}
.one-num p strong{color:var(--text-1);font-weight:650}
.one-num p + p{margin-top:.6rem}

/* ── Charts ───────────────────────────────────────────── */
.chart{margin:1rem 0 0;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--bg-2)}
.chart img{display:block;width:100%;height:auto;border:0;border-radius:0}
.chart figcaption{font-size:.9rem;line-height:1.55;color:var(--text-2);padding:.6rem .8rem;border-top:1px solid var(--border)}
.chart figcaption b{color:var(--text-1);font-weight:700}
.chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:.4rem}
.chart-grid .chart{margin:0}

/* ── Legend and footnote ──────────────────────────────── */
.legend{font-size:.95rem;line-height:1.75;color:var(--text-2);padding:0;margin:0}
.legend b{display:block;color:var(--text-1);font-weight:700;margin-top:.7rem}
.legend b:first-child{margin-top:0}
.disclaimer{font-size:.86rem;line-height:1.7;color:var(--text-3);padding:2rem 0;border-top:1px solid var(--border);margin:3rem 0 0}

/* ── Paywall gate and free sign-up ────────────────────── */
.is-locked{display:none}
.paywall-gate{background:var(--bg-2);border:1px solid var(--border);border-radius:14px;padding:2.2rem clamp(1rem,4vw,2rem);margin:2.6rem 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.9rem}
.paywall-eyebrow{font-size:.9rem;font-weight:700;color:var(--gold);margin:0}
.gate-title{font-size:clamp(1.3rem,2.6vw,1.65rem);font-weight:750;line-height:1.2;color:var(--text-1);margin:0;max-width:30ch}
.gate-text{font-size:1rem;line-height:1.6;color:var(--text-2);max-width:52ch;margin:0}
.gate-form{display:flex;gap:.5rem;width:100%;max-width:420px}
.gate-form input,.cta-form input{flex:1;min-width:0;font:inherit;font-size:1rem;padding:.75rem .9rem;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text-1)}
.gate-form button,.cta-form button{font:inherit;font-size:.98rem;font-weight:650;padding:.75rem 1.1rem;border-radius:8px;border:1px solid var(--gold);background:var(--gold);color:var(--bg);cursor:pointer;white-space:nowrap}
.gate-form button:hover,.cta-form button:hover{background:var(--gold-light)}
.gate-error{display:none;font-size:.9rem;color:var(--bear)}
.gate-note{font-size:.92rem;color:var(--text-3)}
.gate-note a{font-weight:600}
.cta{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:1.4rem clamp(1rem,3vw,1.6rem);margin:1rem 0 0;text-align:center;width:100%}
.cta h3{font-size:1.2rem;font-weight:750;color:var(--text-1);margin:0 0 .4rem;line-height:1.25}
.cta p{font-size:.97rem;line-height:1.6;color:var(--text-2);max-width:48ch;margin:0 auto 1rem}
.cta-form{display:flex;gap:.5rem;max-width:420px;margin:0 auto;border:0;overflow:visible}
.cta .sub{font-size:.88rem;color:var(--text-3);margin-top:.7rem}

@media (max-width:640px){
  .exec-grid{grid-template-columns:1fr;gap:.15rem}
  .exec-k{margin-top:.5rem}
  .chart-grid{grid-template-columns:1fr}
  .gate-form,.cta-form{flex-direction:column}
  .section.tldr .board td.rk{width:4.2rem}
}

/* Older briefs build the gate form from inline styles. Bring them in line. */
#paywallGate #emailInput{background:var(--bg) !important;color:var(--text-1) !important;font-family:inherit !important;font-size:1rem !important;border:0 !important}
#paywallGate #unlockBtn{font-family:inherit !important;font-size:.98rem !important;background:var(--gold) !important;color:var(--bg) !important}
#paywallGate #pwdError{font-family:inherit !important;font-size:.9rem !important}
#paywallGate h2{font-family:inherit !important;font-weight:750}

/* Friday free edition: the sign-up box sits alone where the gate would be. */
.wrap > .cta{margin:2.6rem 0}

/* Today's Scan (scan.html, built from a brief): the Liquid 100 board has
   nine columns, so it runs a size smaller than a brief table. */
.board.l1 td,.board.l1 th{font-size:.86rem;padding:.5rem .55rem}
