/* Tribed-owned pages only (home, /blog, offer pages). Coach sites keep their own specs.
   v2: light and dark palettes from one token set. Light is the default, dark follows
   the OS, and <html data-theme="light|dark"> (set by tribed-theme.js) overrides both.
   Keeps the `:root:root` specificity of v1 so page-level :root blocks still lose.
   Identity unchanged: charcoal/green, Geist, buttons 10px, cards 16px, inputs 8px. */

@font-face{font-family:Geist;src:url('/assets/geist-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Geist;src:url('/assets/geist-bold.ttf') format('truetype');font-weight:600 800;font-display:swap}

/* ---------- light (default) ---------- */
:root:root {
  color-scheme: light;
  --bg:#F6F7F7; --paper:#F6F7F7; --bg-2:#EDF0EF;
  --panel:#FFFFFF; --surface:#FFFFFF; --wash:#EDF0EF;
  --panel-2:#EDF0EF; --surface-2:#EDF0EF;
  --text:#0E1211; --ink:#0E1211; --soft:#3B4441; --mut:#5C6964; --muted:#5C6964;
  --line:#DCE2DF; --line-2:#E8ECEA; --line-soft:#E8ECEA; --line-strong:#BFC8C3;
  --accent:#00FF84; --button:#00FF84; --accent-ink:#04160C; --accentText:#04160C; --button-ink:#04160C;
  --accent-hover:#35FF9C;
  --link:#0B7A47; --link-hover:#075C35; --accent-fg:#0B7A47;
  --accent-dim:rgba(0,200,110,.14); --accent-soft:#E1FAEC; --soft-accent:#E1FAEC;
  --accent-line:rgba(0,160,90,.45); --accent-glow:rgba(0,200,110,.10);
  --ok-bg:#E1FAEC; --ok-ink:#0B7A47;
  --err-ink:#9B2C1B; --err-bg:#FBE7E3;
  /* glass washes: white-alpha in dark, ink-alpha in light */
  --glass:rgba(14,18,17,.03); --glass-2:rgba(14,18,17,.06); --glass-line:rgba(14,18,17,.16);
  --grid-line:rgba(14,18,17,.05);
  --topbar:rgba(246,247,247,.82); --menu:rgba(246,247,247,.98);
  --shadow:0 1px 2px rgba(14,18,17,.05),0 10px 30px -18px rgba(14,18,17,.25);
  --shadow-lg:0 30px 70px -40px rgba(14,18,17,.25);
  --grain:0;
  --sans:Geist,system-ui,-apple-system,'Segoe UI',sans-serif; --serif:var(--sans);
  --font-body:var(--sans); --font-head:var(--sans);
  --r-btn:10px; --r-card:16px; --radius:16px;
}

/* ---------- dark ---------- */
@media (prefers-color-scheme: dark) {
  :root:root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg:#08090A; --paper:#08090A; --bg-2:#0B0C0E;
    --panel:#101113; --surface:#101113; --wash:#101113;
    --panel-2:#15171A; --surface-2:#15171A;
    --text:#F5F6F7; --ink:#F5F6F7; --soft:#C7CBD1; --mut:#A5ADB8; --muted:#A5ADB8;
    --line:#30343A; --line-2:#22262B; --line-soft:#22262B; --line-strong:#454C55;
    --accent:#00FF84; --button:#00FF84; --accent-ink:#04160C; --accentText:#04160C; --button-ink:#04160C;
    --accent-hover:#64FFB4;
    --link:#5DF0A6; --link-hover:#8CF7C1; --accent-fg:#00FF84;
    --accent-dim:rgba(0,255,132,.12); --accent-soft:#10291D; --soft-accent:#10291D;
    --accent-line:rgba(0,255,132,.30); --accent-glow:rgba(0,255,132,.10);
    --ok-bg:#10291D; --ok-ink:#91EAB7;
    --err-ink:#FFB4AD; --err-bg:#351E1E;
    --glass:rgba(255,255,255,.02); --glass-2:rgba(255,255,255,.05); --glass-line:rgba(255,255,255,.28);
    --grid-line:rgba(255,255,255,.028);
    --topbar:rgba(8,9,10,.72); --menu:rgba(8,9,10,.98);
    --shadow:none;
    --shadow-lg:0 30px 70px -40px rgba(0,0,0,.7);
    --grain:.035;
  }
}
/* The phone (.device) and terminal (.term) mock-ups are dark screens in both
   themes, so they take the dark tokens whatever the page uses. */
:root:root[data-theme="dark"],
html :is(.device,.term) {
  color-scheme: dark;
  --bg:#08090A; --paper:#08090A; --bg-2:#0B0C0E;
  --panel:#101113; --surface:#101113; --wash:#101113;
  --panel-2:#15171A; --surface-2:#15171A;
  --text:#F5F6F7; --ink:#F5F6F7; --soft:#C7CBD1; --mut:#A5ADB8; --muted:#A5ADB8;
  --line:#30343A; --line-2:#22262B; --line-soft:#22262B; --line-strong:#454C55;
  --accent:#00FF84; --button:#00FF84; --accent-ink:#04160C; --accentText:#04160C; --button-ink:#04160C;
  --accent-hover:#64FFB4;
  --link:#5DF0A6; --link-hover:#8CF7C1; --accent-fg:#00FF84;
  --accent-dim:rgba(0,255,132,.12); --accent-soft:#10291D; --soft-accent:#10291D;
  --accent-line:rgba(0,255,132,.30); --accent-glow:rgba(0,255,132,.10);
  --ok-bg:#10291D; --ok-ink:#91EAB7;
  --err-ink:#FFB4AD; --err-bg:#351E1E;
  --glass:rgba(255,255,255,.02); --glass-2:rgba(255,255,255,.05); --glass-line:rgba(255,255,255,.28);
  --grid-line:rgba(255,255,255,.028);
  --topbar:rgba(8,9,10,.72); --menu:rgba(8,9,10,.98);
  --shadow:none;
  --shadow-lg:0 30px 70px -40px rgba(0,0,0,.7);
  --grain:.035;
}

/* ---------- base (unchanged from v1 except tokens) ---------- */
html body { font-family:var(--sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased; }
html :is(button,input,select,textarea) { font-family:inherit; }
html :is(.button,.btn,.nav-cta) { border-radius:var(--r-btn); }
html :is(.button,.btn-fill,.btn-primary) { background:var(--accent);color:var(--accent-ink); }
html :is(.button,.btn-fill,.btn-primary):hover { background:var(--accent-hover);color:var(--accent-ink); }
html :focus-visible { outline:2px solid var(--link);outline-offset:4px; }
html input::placeholder,html textarea::placeholder { color:var(--muted);opacity:1; }
html .offer-page h1,html .offer-page h2 { font-weight:600;letter-spacing:-.035em; }
html .offer-page .button { border-radius:var(--r-btn);font-weight:600; }
html .offer-page .button:hover { background:var(--accent-hover);color:var(--accent-ink); }
html .booking-page { --ts-font-body:var(--sans);--ts-font-head:var(--sans);--ts-radius:16px; }
html .coaching-experience { color:var(--text); }
html .experience-canvas::before { background:var(--accent-soft); }
html .experience-followup,html .experience-phone { background:var(--surface);border-color:var(--line-strong);box-shadow:none; }
html .experience-phone { border-color:var(--soft); }
html .experience-speaker { background:var(--soft); }
html .coaching-experience :is(.experience-kicker,.experience-followup small,.experience-community small,.experience-greeting,.experience-guidance p,.experience-platforms) { color:var(--muted); }
html :is(.experience-brand>span,.experience-symbol,.experience-platforms>strong) { color:var(--link); }
html .experience-symbol { border-color:var(--line-strong); }
html .experience-lesson { background:var(--accent);color:var(--accent-ink); }
html .coaching-experience .experience-lesson :is(.experience-kicker,.experience-lesson-footer) { color:var(--accent-ink); }
html .experience-play { border-color:var(--accent-ink); }
html :is(.experience-guidance,.experience-community-mark) { background:var(--panel-2); }
html :is(.tour-screen,.tour-screen figcaption) { background:var(--surface);color:var(--muted); }
html .status.error { color:var(--err-ink);background:var(--err-bg); }
html[data-guide] .nextl a { color:var(--accent-ink);border-radius:var(--r-btn); }
html a[style*="background:var(--accent)"] { color:var(--accent-ink)!important; }

/* ---------- theme toggle (markup in tribed-theme.js comments) ---------- */
html .theme-toggle {
  display:inline-grid;place-items:center;width:34px;height:34px;padding:0;
  border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);
  cursor:pointer;transition:border-color .15s ease,color .15s ease;
}
html .theme-toggle:hover { color:var(--text);border-color:var(--line-strong); }
html .theme-toggle svg { width:16px;height:16px; }
html .theme-toggle .ico-moon { display:none; }
html[data-theme="dark"] .theme-toggle .ico-sun { display:none; }
html[data-theme="dark"] .theme-toggle .ico-moon { display:block; }
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .theme-toggle .ico-sun { display:none; }
  html:not([data-theme="light"]) .theme-toggle .ico-moon { display:block; }
}

/* ---------- homepage compat: literals in apex-home / index inline CSS mapped to tokens ----------
   Every selector below carries a hard-coded dark colour today. Overriding here means the
   Astro components need no edit for the light theme. Device and terminal mock-ups
   (.device, .d-*, .term) are left dark on purpose: they are screens, not surfaces. */
html :is(.device,.term) { color:var(--text); }
html .btn-primary:hover { background:var(--accent-hover); }
html .btn-ghost { background:var(--glass); }
html .btn-ghost:hover { border-color:var(--glass-line);background:var(--glass-2); }
html .nav.scrolled { background:var(--topbar);-webkit-backdrop-filter:saturate(160%) blur(12px);backdrop-filter:saturate(160%) blur(12px); }
html .mobile-menu { background:var(--menu); }
html .bg-field::before { background:radial-gradient(760px 460px at 80% -6%,var(--accent-glow),transparent 62%); }
html .bg-field::after { background-image:linear-gradient(to right,var(--grid-line) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-line) 1px,transparent 1px); }
html :is(.surface,.mq-pill,.cell .mini-chat,.term-bar) { background:var(--glass); }
html .cell:hover,html .show-card:hover,html .inhouse-card:hover { border-color:var(--accent-line); }
html .show-card:hover { box-shadow:var(--shadow-lg); }
html .cell.feature { background:radial-gradient(600px 220px at 0% 0%,var(--accent-glow),transparent 60%),var(--panel); }
html .cell.tint { background:linear-gradient(160deg,var(--accent-glow),transparent 55%),var(--panel); }
html .spot { background:radial-gradient(600px 260px at 100% 0%,var(--accent-glow),transparent 60%); }
html .price-reveal { border:1px solid var(--accent-line);background:radial-gradient(600px 220px at 0% 0%,var(--accent-glow),transparent 60%),var(--panel); }
html .closer-card { background:radial-gradient(700px 300px at 80% 0%,var(--accent-glow),transparent 62%),var(--panel); }
html .term-bar .badge { border-color:var(--accent-line); }
html .book-badge { color:var(--accent-ink);box-shadow:var(--shadow-lg); }
html .homepage-motion__canvas { background:var(--bg); }
html .homepage-motion__control:focus-visible { border-color:var(--line-strong);background:var(--bg);color:var(--text);outline-color:var(--link); }
html .cv-slider input::-webkit-slider-runnable-track { background:linear-gradient(to right,var(--accent) var(--fill,0%),var(--line) var(--fill,0%)); }
html .cv-slider input::-moz-range-track { background:var(--line); }
html .cv-track { background:var(--line-2); }
html .cv-track i { background:var(--muted); }
html .cv-advanced input[aria-invalid="true"],html .cv-error { color:var(--err-ink);border-color:var(--err-ink); }
/* Brand green used as TEXT (labels, numbers, check marks, inline links). #00FF84 is
   1.3:1 on the light ground, so it reads through --accent-fg: #0B7A47 on light, the
   unchanged brand green on dark. Button fills keep --accent. */
html :is(.ac,.stat .v em,.surface svg,.bonus-grid .cell .k,.cap .cap-n,.fit-dpu a,.rt .v,.value-number,.ladder-prompt span,.ladder-path strong) { color:var(--accent-fg); }
html :is(.fit-list li,.value-card li)::before { color:var(--accent-fg); }