/* First Frame — shared light glass SaaS design system.
 * Loaded by every product route. !important is intentional for legacy pages whose
 * page-local styles are declared after this file; these tokens remain authoritative. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

:root{
  --bg:#eef0f4!important;--bg2:#f6f7f9!important;--surface:#ffffff!important;
  --card:#ffffff!important;--card2:#f6f7f9!important;
  --border:#e6e8ec!important;--border2:#d7dae1!important;
  --text:#14151a!important;--txt:#14151a!important;--muted:#6b7280!important;--dim:#3f4350!important;
  --gold:#f5a623!important;--gold2:#d8890d!important;--gold-dim:#b86e00!important;--gold-lite:#9a5d00!important;
  --iris:#6c5ce7!important;--iris2:#8b7cff!important;--pink:#ff6b9a!important;
  --sky:#4c9ffe!important;--mint:#2ec4a6!important;--good:#16a34a!important;
  --warn:#d97706!important;--bad:#dc2626!important;--coral:#dc2626!important;
  --grad:linear-gradient(110deg,#6c5ce7,#8b7cff 56%,#b5a9ff)!important;
  --display:'Plus Jakarta Sans','Inter',sans-serif!important;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
  --shadow-sm:0 8px 24px rgba(20,20,40,.05);--shadow-md:0 18px 44px rgba(20,20,40,.07);
  --shadow-shell:0 30px 60px rgba(20,20,40,.06);
}

/* Device-local learning profile shared by every audience track. */
.ff-profile{max-width:1380px;margin:18px auto;padding:16px 20px;display:grid;grid-template-columns:minmax(190px,.7fr) 2fr auto;gap:18px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-sm)}
.ff-profile>div:first-child b{display:block;font-size:13px}.ff-profile>div:first-child span{display:block;margin-top:4px;color:var(--muted);font-size:11px}.ff-skills{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.ff-skills label{display:flex;justify-content:space-between;gap:6px;font-size:10px;color:var(--dim);margin-bottom:4px}.ff-skills meter{display:block;width:100%;height:8px}.ff-profile button{min-height:44px;padding:8px 14px;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--text);font:700 12px Inter;cursor:pointer}

/* The Dark Room inherits shared components but deliberately uses an NLE/DI surface. */
[data-surface="pro"]{--bg:#090b0d!important;--surface:#0f1215!important;--card:#14181c!important;--card2:#191e23!important;--border:#3f4852!important;--border2:#596570!important;--text:#f2f4f5!important;--txt:#f2f4f5!important;--dim:#c1c8ce!important;--muted:#9ca5ae!important;--iris:#77d6c2!important;--iris2:#9fe8d8!important;--gold:#efb85c!important;--shadow-sm:0 1px 0 rgba(255,255,255,.035)!important;background:var(--bg);color:var(--text);color-scheme:dark}
[data-surface="pro"] .eve-gnav{background:rgba(9,11,13,.9)!important;border-color:var(--border)!important}
[data-surface="pro"] .eve-gnav .gbrand,[data-surface="pro"] .eve-gnav .gt:hover{color:var(--text)!important}
[data-surface="pro"] .eve-gnav .gt{color:var(--dim)!important}[data-surface="pro"] .eve-gnav .gt.on{color:#07110f!important;background:var(--iris)!important}
[data-surface="pro"] .ff-profile,[data-surface="pro"] .panel,[data-surface="pro"] .card{background:var(--card)!important;color:var(--text)!important;border-color:var(--border)!important}

@media(max-width:820px){.ff-profile{grid-template-columns:1fr}.ff-skills{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.ff-skills{grid-template-columns:1fr}}
.ff-command-button{min-width:44px!important;min-height:44px!important}

html{background:var(--bg);color-scheme:light}
body{font-family:var(--sans)!important;background:var(--bg)!important;color:var(--text)!important}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(900px 560px at 88% -8%,rgba(108,92,231,.10),transparent 62%),radial-gradient(760px 520px at 5% 5%,rgba(76,159,254,.09),transparent 58%),radial-gradient(680px 480px at 52% 104%,rgba(255,107,154,.07),transparent 62%)}
.aura{background:radial-gradient(950px 600px at 88% -8%,rgba(108,92,231,.10),transparent 62%),radial-gradient(800px 540px at 4% 4%,rgba(76,159,254,.08),transparent 58%),radial-gradient(700px 500px at 52% 104%,rgba(255,107,154,.06),transparent 62%),var(--bg)!important}
.aura::before{opacity:.25!important;filter:blur(110px)!important}.grain{opacity:.12!important;mix-blend-mode:multiply}

h1,h2,h3,h4,.story-title,.fn,.brand,.eb,.nm,.rn,.tool-name,.metric-value,.readiness strong,.legacy-score,.meter,.stat .n,.pstat .n{font-family:var(--display)!important;color:var(--text)!important;letter-spacing:-.035em!important}
p,li,label{color:inherit}.lead b,.sub b,.note b,.rf b,.flow b,.flags b,.contest-card b,.starter b,.scope-list b,.priority b,.sign b{color:var(--text)!important}
a{color:inherit}.g{-webkit-text-fill-color:transparent!important}

/* Reusable shell and controls */
.app-shell{max-width:1240px;margin:24px auto;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.86);border-radius:26px;box-shadow:var(--shadow-shell);overflow:hidden}
.glass{background:rgba(255,255,255,.62)!important;border:1px solid rgba(255,255,255,.82)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 20px 50px rgba(59,45,120,.10)!important;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.btn-primary,.start,.eve-cont,.story-flow-btn,.footer-inner .btn,.official{background:#14151a!important;color:#fff!important;border-color:#14151a!important;border-radius:100px!important;box-shadow:0 10px 24px rgba(20,21,26,.16)!important}
.btn-primary:hover,.start:hover,.eve-cont:hover,.story-flow-btn:hover,.official:hover{background:#292b33!important;box-shadow:0 14px 30px rgba(20,21,26,.2)!important}
.btn-secondary,.btn-ghost{background:#fff!important;color:var(--text)!important;border:1px solid var(--border2)!important;border-radius:100px!important;box-shadow:var(--shadow-sm)!important}
button,input,select,textarea{font-family:var(--sans)}
input,select,textarea{background:#fff!important;color:var(--text)!important;border-color:var(--border2)!important}
input::placeholder,textarea::placeholder{color:#9ca3af!important}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid rgba(108,92,231,.42)!important;outline-offset:3px!important}
:where(button,.btn,.btn-primary,.btn-secondary,.btn-ghost,.start,.eve-cont,.story-flow-btn,.teach){min-height:44px}
.ff-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);transition:transform .15s ease,border-color .15s ease}.ff-card:hover{transform:translateY(-2px);border-color:#bdb6ff}.ff-chip{display:inline-flex;align-items:center;min-height:28px;padding:4px 10px;border:1px solid var(--border);border-radius:999px;background:var(--card2);color:var(--dim);font-size:12px}.ff-input{min-height:44px;border:1px solid var(--border2);border-radius:12px;background:#fff;padding:0 14px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.ff-modal-open{overflow:hidden}.ff-overlay{position:fixed;inset:0;z-index:2000;display:none;align-items:flex-start;justify-content:center;padding:12vh 18px 30px;background:rgba(20,21,26,.28);backdrop-filter:blur(10px)}.ff-overlay.open{display:flex}.ff-palette,.ff-shortcuts{width:min(650px,100%);background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:0 28px 80px rgba(20,21,40,.18);overflow:hidden}.ff-search{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border)}.ff-search input{flex:1;border:0!important;outline:0!important;box-shadow:none!important;font-size:16px}.ff-search kbd,.ff-palette footer kbd,.ff-command-button kbd,.ff-shortcuts kbd{font:600 11px Inter;color:var(--muted);background:var(--card2);border:1px solid var(--border);border-radius:6px;padding:3px 6px}.ff-results{max-height:min(55vh,520px);overflow:auto;padding:8px}.ff-result{width:100%;min-height:54px;display:flex;align-items:center;gap:12px;border:0;border-radius:11px;background:transparent;text-align:left;padding:8px;cursor:pointer}.ff-result.active,.ff-result:hover{background:#f1efff}.ff-result-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#ece9ff;color:var(--iris);font-weight:800}.ff-result span:nth-child(2){display:grid;gap:2px;flex:1}.ff-result b{font-size:13px}.ff-result small{color:var(--muted);font-size:10px}.ff-result kbd{color:var(--muted)}.ff-palette footer{display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--border);font-size:10px;color:var(--muted)}.ff-empty{display:grid;gap:6px;text-align:center;padding:45px;color:var(--muted)}.ff-command-button{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 10px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--dim);cursor:pointer}.ff-shortcuts{position:relative;padding:30px}.ff-close{position:absolute;right:18px;top:18px;width:44px;border:0;border-radius:50%;background:var(--card2);font-size:22px}.ff-overline{color:var(--iris);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.ff-shortcuts h2{font-size:28px;margin:9px 45px 22px 0}.ff-shortcuts dl{margin:0}.ff-shortcuts dl div{display:flex;justify-content:space-between;align-items:center;min-height:52px;border-top:1px solid var(--border)}.ff-shortcuts dt{color:var(--dim)}.ff-toast-region{position:fixed;right:20px;bottom:20px;z-index:2200;display:grid;gap:8px}.ff-toast{padding:12px 16px;border-radius:12px;background:#14151a;color:#fff;box-shadow:0 12px 30px rgba(20,21,26,.18);opacity:0;transform:translateY(8px);transition:.15s}.ff-toast.show{opacity:1;transform:none}.ff-skeleton{position:relative;overflow:hidden;background:#e9ebf0!important;color:transparent!important;border-radius:9px}.ff-skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);animation:ff-shimmer 1.2s infinite}@keyframes ff-shimmer{to{transform:translateX(100%)}}
.text-action{display:inline;border:0;background:transparent;color:#5145cd;text-decoration:underline;text-underline-offset:3px;padding:5px 2px;cursor:pointer;font-weight:700}

/* Shared cards and legacy dark surfaces */
.panel,.card,.acard,.stage,.learnbox,.pstat,.stat,.route,.mc,.tool,.metric,.sign,.soon,.intake,.filmbar,.scorestrip,.cc,.rev,.shot-card,.beat-card,.act,.an-box,.context,.recap,.gate,.handoff,.footer-inner,.room-mock,.starter,.contest-card,.flow,.file-meta,.legacy,.closing,.diff .col,.crewcard,.big,.showcase{background:var(--card)!important;border-color:var(--border)!important;box-shadow:var(--shadow-sm)!important;color:var(--text)!important}
.card:hover,.acard:hover,.stage:hover,.tool:hover,.route:hover{border-color:#bdb6ff!important;box-shadow:var(--shadow-sm)!important;transform:translateY(-2px)}
.card2,.track,.progress,.meter-track,.curve-wrap,.chart,.prompt,.source,.code,.context-chip{background:var(--card2)!important;border-color:var(--border)!important}
.showcase,.big,.summary,.callout{background:#fff!important;border-color:var(--border)!important;box-shadow:var(--shadow-sm)!important}
.crewcard{background:rgba(255,255,255,.72)!important}.legacy{background:rgba(255,255,255,.72)!important}
.track,.progress{background:#e8eaf0!important}.footer-cta{background:linear-gradient(180deg,rgba(238,240,244,0),rgba(238,240,244,.96) 42%)!important}

/* Light typography for formerly white-on-dark local selectors */
.rh .t,.crewcard .nm,.stage h3,.acard h3,.showcase h2,.showcase p b,.intake h2,.contest-card b,.starter b,.panel h2,.cat h2,.big h2,.card h4,.soon h3,.scope-list b,.drop strong,.metric-value,.priority b,.secondary>summary,.sign b,.filmbar .fn,.cc .rn,.cc .hl,.rev h3,.shot-card h3,.act h2,.logo-row h1,.idea-block .txt,.story-title{color:var(--text)!important}
.logline,.action,.reason p,.meaning p,.prompt,.prompt b,.cc .nt,.diff p,.truth,.readiness .eyebrow{color:var(--dim)!important}
.kick,.kicker,.eyebrow,.lab,.tag,.tg,.raw,.citation,.chip{color:#5b4bd8!important}
.warn,.status{color:#9a5d00!important}.error{color:var(--bad)!important}

/* Shared pipeline chrome */
.eve-topbar{position:static!important;top:auto!important;background:rgba(255,255,255,.82)!important;border-color:var(--border)!important;box-shadow:0 1px 0 rgba(20,21,26,.03)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
.eve-topbar .eb{color:var(--text)!important}.eve-steps .pn{background:#fff!important;border-color:var(--border2)!important;color:var(--muted)!important}.eve-steps .ps.cur .pn{background:var(--iris)!important;color:#fff!important;border-color:var(--iris)!important}.eve-steps .ps.cur .pl{color:var(--text)!important}.eve-steps .pline{background:var(--border2)!important}

/* Accessible glossary tooltip, charts, and badges */
.source-badge,.badge,.chip,.pill,.citation,.teach,.lesson,.tool-link{background:#f5f3ff!important;border-color:#d9d4ff!important;color:#5145cd!important}
code{color:#5b4bd8!important}.axis,.axis-lab,.curve-label{fill:#6b7280!important}.curve-line{stroke:#6c5ce7!important}.beat-dot{fill:#fff!important;stroke:#6c5ce7!important}
.ff-breadcrumb{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:20px;font-size:12px;color:var(--muted)}.ff-breadcrumb a{color:#5145cd;text-decoration:none}.ff-doc-layout{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:34px}.ff-toc{position:sticky;top:84px;align-self:start;border-left:1px solid var(--border);padding-left:16px}.ff-toc b{display:block;margin-bottom:9px;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.ff-toc a{display:block;min-height:36px;padding:8px 0;color:var(--muted);font-size:12px;text-decoration:none}.ff-toc a:hover,.ff-toc a.active{color:var(--iris)}

footer{border-color:var(--border)!important;color:var(--muted)!important}
@media(max-width:820px){.ff-cmd-label,.ff-command-button kbd{display:none}.ff-command-button{margin-left:auto;width:44px;justify-content:center}.ff-overlay{padding-top:8vh}.ff-doc-layout{grid-template-columns:1fr}.ff-toc{position:relative;top:auto;order:-1;display:flex;overflow:auto;gap:12px;border-left:0;border-bottom:1px solid var(--border);padding:0 0 10px}.ff-toc b{display:none}.ff-toc a{white-space:nowrap}}
@media(max-width:520px){.glass-stage{transform:scale(.9);transform-origin:center}.pipe{gap:5px}.pipe .node{min-width:0}.pipe .bubble{width:58px;height:58px}}
@media(max-width:1288px){.app-shell{margin:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
