
:root{
  --paper:#f3f2ee; --paper-2:#e8e6e0; --warm:#f7f6f2; --ink:#121216; --muted:#5c5b66; --rule:rgba(18,18,22,.14);
  --forest:#121216; --forest-deep:#0d0d12; --night:#060608; --lime:#ff7ad9; --lime-btn:#dd3fc9; --signal:#6d2cf2;
  --moss:#9d9ca9; --mut-dark:#9d9ca9; --line-dark:rgba(243,242,238,.14); --glow:rgba(109,44,242,.18);
  --sans:"Haas","Helvetica Neue",Helvetica,Arial,sans-serif; --serif:"Financier","Iowan Old Style",Georgia,serif;
  --body:"Haas","Helvetica Neue",Helvetica,Arial,sans-serif; --mono:"Haas","Helvetica Neue",Helvetica,Arial,sans-serif;
  --seam:linear-gradient(90deg,#2233ff,#6d2cf2 36%,#dd3fc9 68%,#ff8a4c);
  --seam-dark:linear-gradient(90deg,#7d8bff,#b48cff 36%,#ff6fd8 68%,#ffa36e);
  --rail:280px; --measure:66ch; --r-md:6px; --r-sm:4px; --gutter:clamp(26px,5vw,72px);
  --bf-ink:#060608; --bf-ink-2:#0d0d12; --bf-ink-3:#16161d; --bf-line:rgba(243,242,238,.14); --bf-line-strong:rgba(243,242,238,.32);
  --bf-on-ink:#f3f2ee; --bf-on-ink-muted:#9d9ca9; --bf-paper:#f3f2ee; --bf-paper-2:#e8e6e0; --bf-paper-line:rgba(18,18,22,.14);
  --bf-on-paper:#121216; --bf-on-paper-muted:#5c5b66; --bf-blue:#2233ff; --bf-violet:#6d2cf2; --bf-magenta:#dd3fc9; --bf-pink:#ff6fa6; --bf-coral:#ff8a4c; --bf-cyan:#3cc6ff; --bf-focus:#8fa0ff;
  --bf-serif:"Financier","Iowan Old Style",Georgia,serif; --bf-sans:"Haas","Helvetica Neue",Helvetica,Arial,sans-serif; --bf-sans-display:"Haas Display","Haas","Helvetica Neue",Helvetica,Arial,sans-serif;
  --bf-gutter:clamp(16px,4.2vw,64px); --bf-maxw:1320px; --bf-measure:40rem; --bf-ease:cubic-bezier(.2,.7,.1,1); --bf-s-label:.75rem; --bf-s-small:.875rem; --bf-s-body:1rem;
  --bf-s-1:clamp(1.95rem,3.8vw,3.5rem); --bf-s-2:clamp(1.5rem,2.5vw,2.2rem); --bf-s-3:clamp(1.18rem,1.55vw,1.42rem); --bf-r-btn:6px; --bf-r-panel:6px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:var(--forest);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--forest);color:var(--paper);padding:8px 12px;z-index:50}
.skip:focus{left:8px}
h1,h2,h3,h4{font-family:var(--sans);font-weight:600;line-height:1.12;letter-spacing:-0.015em;margin:0}
h1{font-size:clamp(30px,4.5vw,52px)}
h2{scroll-margin-top:70px;font-size:clamp(22px,2.6vw,30px);margin-top:2.6rem;margin-bottom:.8rem}
h3{font-size:20px;margin-top:1.6rem;margin-bottom:.5rem}
p{margin:0 0 1.05em}
.turn{font-style:normal;color:var(--signal)}
h1 .turn,h2 .turn{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.on-forest .turn{color:var(--lime)}
.label{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--signal)}
.on-forest .label{color:var(--lime)}
button,.btn{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;border:1px solid var(--lime-btn);background:var(--lime-btn);color:var(--ink);padding:14px 24px;border-radius:var(--r-sm);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.7em;line-height:1;transition:box-shadow .25s,transform .2s}
button:hover,.btn:hover{box-shadow:0 12px 30px var(--glow);transform:translateY(-1px)}
.btn.quiet,button.quiet{background:transparent;color:var(--ink);border-color:var(--rule);box-shadow:none}
.btn.quiet:hover,button.quiet:hover{box-shadow:none;border-color:var(--ink)}
.on-forest .btn,.on-forest button{background:var(--lime-btn);color:var(--ink);border-color:var(--lime-btn)}
.on-forest .btn.quiet,.on-forest button.quiet{background:transparent;color:var(--paper);border-color:var(--line-dark)}

/* top bar */
.top{position:sticky;top:0;z-index:20;background:rgba(247,245,238,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(22,39,27,.1);display:flex;align-items:center;gap:1rem;padding:.6rem 1.2rem}
.top .brand{font-family:var(--sans);font-weight:600;color:var(--ink);text-decoration:none;font-size:1rem}
.top .brand .by{color:var(--muted);font-weight:400}
.top .brand .short{display:none}
.top nav{margin-left:auto;display:flex;gap:3px;align-items:center;background:rgba(22,39,27,.04);border:1px solid rgba(22,39,27,.14);border-radius:var(--r-md);padding:3px}
.top nav a{font-family:var(--mono);font-size:.63rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);opacity:.85;padding:.44rem 1.05rem;border-radius:var(--r-sm);text-decoration:none;white-space:nowrap;transition:background .22s,opacity .22s}
.top nav a:hover{background:rgba(22,39,27,.08);opacity:1}
.top .maptoggle{display:none;font-family:var(--mono);font-size:.63rem;letter-spacing:.1em;text-transform:uppercase}

/* rail */
.rail{position:fixed;top:var(--topbar,57px);left:0;bottom:0;width:var(--rail);overflow:auto;background:var(--paper-2);border-right:1px solid var(--rule);padding:1.2rem 1rem 3rem}
.rail h4{font-size:10px;font-family:var(--mono);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:1.3rem 0 .5rem}
.railsearch input{width:100%;font-size:.9rem;padding:.5rem .6rem;border:1px solid var(--rule);background:var(--paper)}
.railblock{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--forest);padding:.9rem .9rem .8rem;margin-top:.9rem}
.railblock h4{margin:0 0 .5rem}
.rail .cont{display:block;text-decoration:none;color:var(--ink);font-family:var(--sans);font-weight:600;font-size:.95rem;line-height:1.25}
.rail .cont .label{display:block;margin-bottom:.25rem}
.rail details.stage{border-top:1px solid var(--rule)}
.rail details.stage summary{list-style:none;cursor:pointer;display:flex;gap:.5rem;align-items:baseline;padding:.55rem .3rem;font-family:var(--sans);font-size:.92rem;font-weight:500;color:var(--ink)}
.rail details.stage summary::-webkit-details-marker{display:none}
.rail details.stage summary .num{font-family:var(--mono);font-size:.68rem;color:var(--signal)}
.rail details.stage summary .cnt{margin-left:auto;font-family:var(--mono);font-size:.68rem;color:var(--muted)}
.rail details.stage[open] summary .cnt{color:var(--forest)}
.rail details.stage ol{padding-bottom:.4rem}
.rail ol{list-style:none;margin:0;padding:0}
.rail li a{display:flex;gap:.55rem;align-items:baseline;padding:.34rem .4rem;border-radius:3px;text-decoration:none;color:var(--ink);font-size:.9rem;font-family:var(--sans)}
.rail li a:hover{background:var(--paper)}
.rail li a.active{background:var(--forest);color:var(--paper);border-radius:var(--r-sm)}
.rail .num{font-family:var(--mono);font-size:.72rem;color:var(--muted);min-width:1.6em}
.rail li a.active .num{color:var(--lime)}
.rail .done{margin-left:auto;font-family:var(--mono);font-size:.78rem;color:var(--forest);font-weight:500}
.rail li a.active .done{color:var(--lime)}
.rail .progress{height:4px;background:var(--rule);border-radius:2px;margin:.4rem 0 0}
.rail .progress i{display:block;height:100%;background:var(--forest);border-radius:2px}

/* main */
main{margin-left:var(--rail);min-height:100vh;background:linear-gradient(180deg,rgba(255,255,255,.2),transparent 26%,transparent 74%,rgba(22,39,27,.018))}
.wrap{max-width:calc(var(--measure) + 4rem);padding:3rem 2rem 6rem}
.wrap.wide{max-width:1240px}
.hero{background:var(--night);color:var(--paper)}
.hero .wrap{padding-top:4.5rem;padding-bottom:4rem;max-width:calc(var(--measure) + 12rem)}
.hero h1{font-size:clamp(38px,6.4vw,80px);max-width:14ch;line-height:1.02}
.hero h1 .acc{display:block}
.hero p.lede{font-size:clamp(17px,1.75vw,21px);max-width:46ch;margin-top:30px;color:var(--mut-dark);line-height:1.5}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--signal);margin-bottom:18px}
.on-forest .kicker,.on-forest .label{color:var(--lime)}
.lede{font-size:1.15rem;color:#2E3A32}
.stages{list-style:none;padding:0;margin:1rem 0 0;counter-reset:s}
.stages li{display:grid;grid-template-columns:2.4rem 1fr;gap:.6rem;padding:.9rem 0;border-top:1px solid var(--rule)}
.stages li:last-child{border-bottom:1px solid var(--rule)}
.stages .n{font-family:var(--mono);color:var(--signal);font-size:11px;letter-spacing:.2em;padding-top:.4rem}
.stages b{font-family:var(--sans);font-weight:600}
.stages p{margin:.2rem 0 0;color:#3B463F}

/* lesson */
.lesson-head{margin-bottom:1.2rem}
.rulehead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-bottom:1px solid var(--rule);padding-bottom:14px;margin-bottom:clamp(28px,4vw,44px)}
.rulehead .kicker{margin:0}
.rulehead .num{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.on-forest .rulehead{border-color:var(--line-dark)} .on-forest .rulehead .num{color:var(--mut-dark)}
.acc{font-style:normal;color:var(--signal)}
h1 .acc,h2 .acc{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.on-forest h1 .acc,.on-forest h2 .acc,.hero h1 .acc,.dochead h1 .acc,.panel.dark h2 .acc{color:var(--lime)}
.on-forest .acc,.hero .acc{color:var(--lime)}
.standfirst{font-family:var(--body);font-style:normal;font-size:clamp(18px,1.9vw,21px);line-height:1.5;color:var(--muted);max-width:44ch;margin:0 0 clamp(28px,4vw,44px);letter-spacing:-.012em;color:var(--ink)}
.standfirst b{font-family:var(--mono);font-style:normal;font-weight:500;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--signal);display:block;margin-bottom:10px}
.inset{border-left:2px solid var(--lime-btn);padding:.2rem 0 .2rem 20px;margin:1.8rem 0}
.inset .label{display:block;margin-bottom:.5rem}
.inset p{color:var(--ink)}
.inset.quote p{font-family:var(--body);font-style:normal;font-size:1.02rem;line-height:1.55}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin:1.8rem 0}
@media (max-width:760px){.twocol{grid-template-columns:1fr} .step.decide{margin:0 -1.2rem;padding:1.2rem 1.2rem .8rem} .stephead{flex-wrap:wrap} .stephead .stepnote{margin-left:0;text-align:left;max-width:none;flex-basis:100%} .confrow{grid-template-columns:repeat(5,1fr)}}
.twocol ul{padding-left:1.1rem;margin:.4rem 0 0}
.twocol li{margin:.35rem 0}

/* decision panel */
.decision{scroll-margin-top:70px;border-radius:0;background:var(--night);color:var(--paper);margin:2.6rem 0 0;padding:34px 32px;border-top:3px solid var(--lime-btn);position:relative;overflow:hidden}
.decision::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 85% at 50% 0%,rgba(127,184,15,.10),transparent 68%);pointer-events:none}
.decision > *{position:relative}
.decision h2{margin-top:0;color:var(--paper);font-size:clamp(25px,3.2vw,36px)}
.decision .sub{color:#CFD6CD;margin:.4rem 0 1.4rem;max-width:56ch}
.decision h3{color:var(--lime);font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.22em;text-transform:uppercase;margin:1.6rem 0 .6rem}
.step{border-top:1px solid var(--line-dark);padding:1.3rem 0 .4rem}
.step.decide{background:rgba(247,245,238,.04);margin:0 -32px;padding:1.3rem 32px .8rem;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark)}
.stephead{display:flex;align-items:baseline;gap:.9rem;margin-bottom:.9rem;font-family:var(--sans);font-weight:600;font-size:1.05rem;color:var(--paper);list-style:none;cursor:default}
.stephead .num{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--lime)}
.stephead .stepnote{font-family:var(--body);font-weight:400;font-size:.88rem;color:var(--mut-dark);margin-left:auto;text-align:right;max-width:52%}
details.step summary.stephead{cursor:pointer} details.step summary::-webkit-details-marker{display:none}
.bigfield{min-height:6.5rem;font-size:1.12rem;line-height:1.5}
.tabs{display:inline-flex;gap:3px;background:rgba(247,245,238,.06);border:1px solid var(--line-dark);border-radius:var(--r-md);padding:3px;margin-bottom:.9rem}
.on-forest .tabs .tab,.tabs .tab{background:transparent;border:0;border-color:transparent;color:var(--paper);opacity:.75;padding:.5rem 1rem;border-radius:var(--r-sm);box-shadow:none}
.on-forest .tabs .tab.on,.tabs .tab.on{background:var(--lime-btn);color:var(--ink);opacity:1} .tabs .tab:hover{box-shadow:none;transform:none;opacity:1}
.pane{border:1px solid var(--line-dark);padding:1rem 1.1rem;margin-bottom:.4rem}
.pane .ex{font-family:var(--body);font-style:normal;font-size:1.08rem;line-height:1.5;margin:.3rem 0 .5rem}
.pane .fine{color:var(--mut-dark)}
.confscale{margin-top:.2rem}
.confrow{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}
.confcell{position:relative;display:block;text-align:center;font-family:var(--mono);font-size:.9rem;padding:.7rem 0;border:1px solid var(--line-dark);background:rgba(247,245,238,.05);color:var(--paper);cursor:pointer;min-height:44px;user-select:none}
.confcell input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.confcell:has(input:focus-visible){outline:3px solid var(--lime);outline-offset:2px}
.confcell.on{background:var(--lime-btn);border-color:var(--lime-btn);color:var(--ink);font-weight:500}
.conflabels{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut-dark);margin-top:.4rem}
.on-paper .confcell{background:var(--paper);border-color:var(--rule);color:var(--ink)} .on-paper .conflabels{color:var(--muted)}
.decision .section-title{font-family:var(--sans);font-weight:600;font-size:1.15rem;color:var(--paper);margin:2rem 0 .3rem;padding-top:1.6rem;border-top:1px solid rgba(244,241,232,.18)}
.decision .section-title:first-of-type{border-top:0;padding-top:0;margin-top:1rem}
.q{margin:.9rem 0}
.q label{display:block;font-family:var(--sans);font-size:.98rem;margin-bottom:.4rem;color:var(--paper)}
textarea,input[type=text],select{width:100%;font-family:var(--body);font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--paper);border-radius:var(--r-sm);padding:.65rem .75rem;line-height:1.5}
textarea{min-height:5.2rem;resize:vertical}
input[type=email]{width:100%;font-family:var(--body);font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--paper);border-radius:var(--r-sm);padding:.65rem .75rem;line-height:1.5}
.on-paper input[type=email]{border-color:var(--rule)}
.on-paper textarea,.on-paper input[type=text],.on-paper select{border-color:var(--rule)}
.summary{display:grid;grid-template-columns:2fr 1fr;gap:.8rem}
@media (max-width:760px){.summary{grid-template-columns:1fr}}
.tools{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.2rem}
.compare{margin-top:1rem;background:rgba(247,245,238,.05);border:1px solid var(--line-dark);border-radius:0;padding:1rem 1.1rem}
.compare p{margin:.4rem 0}
.compare .label{color:var(--lime);display:block;margin-bottom:.3rem}
.compare[hidden]{display:none}
.saved{font-family:var(--mono);font-size:.75rem;color:#B9C6BC;margin-top:.8rem}
.actions{padding-left:1.1rem;margin:.4rem 0 0}
.actions li{margin:.45rem 0}
.pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2.8rem;padding-top:1.4rem;border-top:1px solid var(--rule);flex-wrap:wrap}
.pager .btn small{display:none}

/* workbook / lists */
.wbsec{border-top:1px solid var(--rule);padding:1.6rem 0}
.score{width:100%;border-collapse:collapse;font-size:.95rem}
.score th,.score td{text-align:left;padding:.6rem .4rem;border-bottom:1px solid var(--rule);vertical-align:top}
.score th{font-family:var(--mono);font-weight:500;font-size:.78rem;color:var(--muted)}
.score select{width:4.5rem}
.totals{font-family:var(--sans);font-weight:600;margin-top:1rem}
.note{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--forest);border-radius:0;padding:24px 26px;margin:1.6rem 0}
.strategy h2{border-top:1px solid var(--rule);padding-top:1.4rem}
.strategy .empty{color:var(--muted)}
pre.out{white-space:pre-wrap;font-family:var(--body);background:var(--paper);border:1px solid var(--rule);padding:1rem;border-radius:0}
.on-paper .q label,.panel .q label,.wbbody .q label,.docsheet .q label{color:var(--ink)}
.decision .q label,.builder .q label,.on-forest .q label{color:var(--paper)}
.on-forest form .q label,.decision form .q label{color:var(--paper)}
.guide{background:rgba(247,245,238,.05);border:1px solid var(--line-dark);border-radius:0;padding:1rem 1.1rem;margin:.6rem 0 1rem}
.guide summary{cursor:pointer;font-family:var(--sans);font-weight:500;color:var(--paper);list-style:none}
.guide summary::-webkit-details-marker{display:none}
.guide summary::before{content:"+ ";color:var(--lime)}
.guide[open] summary::before{content:"\2212 "}
.deeper{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--forest);border-radius:0;padding:24px 26px;margin:1.8rem 0}
.deeper summary{cursor:pointer;font-family:var(--sans);font-weight:600;list-style:none;color:var(--ink)}
.deeper summary::-webkit-details-marker{display:none}
.deeper summary::before{content:"+ ";color:var(--forest)}
.deeper[open] summary::before{content:"\2212 "}
.deeper summary small{display:block;font-family:var(--body);font-weight:400;color:var(--muted);font-size:.9rem;margin-top:.2rem}
.deeper .twocol{margin-top:1rem}
.deeper h3{margin-top:1.2rem}
.guide p,.guide li{color:#DDE3DA;font-size:.95rem}
.guide ul{padding-left:1.1rem;margin:.5rem 0 0}
.crit{list-style:none;padding:0;margin:.4rem 0 0}
.crit li{display:flex;gap:.6rem;align-items:flex-start;margin:.4rem 0;font-size:.95rem}
.crit input{margin-top:.3rem;accent-color:var(--lime);width:1rem;height:1rem;flex:none}
.rating{display:inline-block;white-space:nowrap;font-family:var(--mono);font-size:.78rem;padding:.2rem .55rem;border-radius:3px;border:1px solid currentColor;margin-left:.5rem;vertical-align:middle}
.r-none{color:#B9C6BC}.r-rough{color:#E9C46A}.r-working{color:#BFD7C5}.r-strong{color:var(--lime)}
.on-paper .r-none{color:#5C665F}.on-paper .r-rough{color:#7A5200}.on-paper .r-working{color:#3E6E4C}.on-paper .rating.r-strong{color:#1E5A2B;background:var(--lime);border-color:var(--lime)}
.on-paper .decrow.r-strong{color:inherit;background:transparent}
.read{margin-top:.6rem;padding-left:0;list-style:none}
.read li{font-size:.92rem;margin:.3rem 0;padding-left:1.2rem;position:relative;color:#DDE3DA}
.read li::before{content:"";position:absolute;left:0;top:.5em;width:.55em;height:.55em;border-radius:50%;background:#E9C46A}
.read li.ok::before{background:var(--lime)}
.on-paper .read li{color:var(--ink)}
.align{width:100%;border-collapse:collapse;margin-top:1rem}
.align td,.align th{padding:.7rem .4rem;border-bottom:1px solid var(--rule);vertical-align:top;text-align:left;font-size:.95rem}
.align th{font-family:var(--mono);font-weight:500;font-size:.78rem;color:var(--muted)}
.dot{display:inline-block;width:.7em;height:.7em;border-radius:50%;margin-right:.5em;vertical-align:middle}
.d-ok{background:#2E7D4F}.d-warn{background:#E9A93B}.d-none{background:#B9B2A3}
.readiness{background:var(--forest-deep);color:var(--paper);padding:34px 32px;border-radius:0;margin:1.2rem 0;border-top:3px solid var(--lime-btn)}
.readiness b{font-family:var(--sans);font-size:1.3rem;display:block}
.fine{font-size:.9rem;color:var(--muted)}

.foot{margin-left:var(--rail);border-top:1px solid var(--rule);background:var(--night);color:var(--mut-dark)}
.foot p b{color:var(--paper)}
.foot a{color:var(--lime)}
.foot .wrap{padding:1.4rem 2rem 2rem}
.foot p{margin:0;font-size:.9rem;color:var(--mut-dark)}
.foot .wrap{padding:2.2rem 2rem 2.6rem}
@media (max-width:1023px){
  .foot{margin-left:0}
  .top{padding:.55rem .8rem;gap:.6rem}
  .top .brand{font-size:.95rem;white-space:nowrap}
  .top .brand .long,.top .brand .by{display:none}
  .top .brand .short{display:inline}
  .top nav{margin-left:auto}
  .top nav{gap:0;flex-wrap:nowrap;padding:2px;min-width:0}
  .top nav a{padding:.4rem .6rem}
  .top nav a{font-size:.82rem;white-space:nowrap}
  .top .maptoggle{padding:.35rem .55rem;font-size:.82rem;white-space:nowrap}
  .rail{transform:translateX(-100%);transition:transform .2s;z-index:30}
  .rail.open{transform:none}
  main{margin-left:0}
  .top .maptoggle{display:inline-block;background:transparent;color:var(--ink);border-color:var(--rule);padding:.4rem .7rem}
  .wrap{padding:2.2rem 1.2rem 5rem}
  .wrap:not(.wide) > .decision{margin-left:-1.2rem;margin-right:-1.2rem}
  .decision{padding:2rem 1.2rem}
}
@media (max-width:480px){
  .top nav .nav-course{display:none}
  .top .brand{font-size:.9rem}
}
@media (max-width:400px){
  .top .brand{display:none}
}
/* tables scroll inside their own box on narrow screens instead of pushing the page */
@media (max-width:760px){
  table.align,table.grid,table.score{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  table.align td,table.align th{min-width:9rem}
  table.grid td,table.grid th{min-width:9rem}
  .readiness .saved{word-break:break-word}
}
/* on-this-page column, large screens only */
.toc{display:none}
@media (min-width:1400px){
  .wrap{max-width:calc(var(--measure) + 4rem + 260px)}
  .hero .wrap{max-width:calc(var(--measure) + 12rem)}
  .withtoc{display:grid;grid-template-columns:minmax(0,calc(var(--measure) + 0rem)) 220px;gap:2.5rem;align-items:start}
  .toc{display:block;position:sticky;top:84px;font-size:.85rem;border-left:1px solid var(--rule);padding-left:1rem}
  .toc ol{list-style:none;margin:.4rem 0 0;padding:0}
  .toc li{margin:.4rem 0}
  .toc a{text-decoration:none;color:var(--muted)} .toc a:hover{color:var(--ink);text-decoration:underline}
  .withtoc .decision{margin-left:-2rem;margin-right:0}
}
/* the decision workspace breaks out of the reading column when it holds a table or a wide builder */
@media (min-width:1180px){
  .decision:has(.grid),.decision:has(.pairgrid){margin-left:-1.25rem;margin-right:-1.25rem;padding-left:2.2rem;padding-right:2.2rem;max-width:none}
  .decision:has(.grid) .step.decide,.decision:has(.pairgrid) .step.decide{margin-left:-2.2rem;margin-right:-2.2rem;padding-left:2.2rem;padding-right:2.2rem}
  .grid{min-width:0}
}
@media (min-width:1400px){
  .withtoc:has(.decision .grid){grid-template-columns:minmax(0,1fr) 220px}
  .withtoc:has(.decision .grid) > div:first-child{min-width:0}
  .ctable td textarea{min-height:3.4rem}
}
/* box strips */
.strip{margin:1.6rem 0 2rem}
.strip .cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(124px,1fr));gap:.55rem}
.strip .cell{background:var(--paper);border-radius:0;padding:22px 20px 24px;border:1px solid var(--rule);border-top:3px solid var(--forest)}
.strip .cell .n{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--signal);margin-bottom:14px}
.strip .cell b{display:block;font-family:var(--sans);font-weight:600;font-size:1.05rem;line-height:1.2;margin-bottom:.5rem;letter-spacing:-.015em}
.strip .cell p{margin:0;font-size:.86rem;color:var(--muted);line-height:1.45}
.strip.dark .cell{background:rgba(247,245,238,.06);border-color:var(--line-dark)} .strip.dark .cell .n{color:var(--lime)} .strip.dark .cell p{color:var(--mut-dark)}
.pull{font-family:var(--sans);font-weight:600;font-size:1.35rem;line-height:1.2;letter-spacing:-.01em;margin:2rem 0;padding-left:1rem;border-left:3px solid var(--lime-btn)}
@media (max-width:760px){.strip .cells{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.strip .cells{grid-template-columns:1fr}}
/* builders */
.builder{background:rgba(247,245,238,.05);border:1px solid var(--line-dark);border-radius:0;padding:1.1rem 1.2rem 1.2rem;margin:.6rem 0 1.4rem}
.builder h3{margin-top:0}
.builder .sub{margin:.3rem 0 1rem;font-size:.95rem}
.brow{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:.6rem;align-items:end;margin:.5rem 0}
.brow label{font-size:.8rem}
.brow.spec{grid-template-columns:1fr 2fr 1fr;align-items:center}
.brow.two{grid-template-columns:1fr auto}
.brow.arch{grid-template-columns:1.2fr 1.2fr auto;align-items:center}
.brow.arch label{color:var(--paper);font-size:.9rem}
.brow input[type=text]{margin:0}
.brow input[type=range]{width:100%;accent-color:var(--lime-btn)}
.builder .label{display:block;margin-bottom:.25rem}
.chart{background:var(--paper);border-radius:0;padding:.8rem;margin:.8rem 0}
.chart .fine{color:var(--muted)}
.grid{width:100%;border-collapse:separate;border-spacing:.4rem 0}
.grid th{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);text-align:left;padding:.2rem .3rem}
.grid td{vertical-align:top}
.grid input[type=checkbox]{accent-color:var(--lime-btn);width:1.05rem;height:1.05rem}
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.board .col{background:rgba(247,245,238,.06);border-radius:var(--r-sm);padding:.6rem}
.board .card{background:var(--paper);color:var(--ink);border-radius:var(--r-sm);padding:.5rem .6rem;margin:.4rem 0;display:flex;justify-content:space-between;gap:.4rem;font-size:.92rem}
.board .brow{grid-template-columns:1fr auto}
.chip{display:inline-block;background:rgba(247,245,238,.1);border-radius:999px;padding:.2rem .7rem;margin:.2rem .2rem 0 0;color:var(--paper)}
button.x{background:transparent;border:0;color:inherit;padding:0 .2rem;font-size:1rem;letter-spacing:0;box-shadow:none;cursor:pointer}
button.x:hover{box-shadow:none;transform:none;color:var(--lime)}
.mv{white-space:nowrap}
@media (max-width:760px){.brow{grid-template-columns:1fr 1fr}.board{grid-template-columns:1fr 1fr}.brow.spec{grid-template-columns:1fr}
  .grid,.align,.score{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:normal}
  .grid tbody,.align tbody,.score tbody{display:table;min-width:560px;width:100%}
  .grid thead,.align thead,.score thead{display:table;min-width:560px;width:100%}
  .grid textarea{min-height:2.8rem}
  .rulehead{flex-wrap:wrap}
  .summary{grid-template-columns:1fr}}
@media (max-width:480px){.board{grid-template-columns:1fr}.brow{grid-template-columns:1fr}.pager{flex-direction:column;align-items:stretch}.pager .btn{justify-content:center}}
/* print-ready documents */
.wline{border-bottom:1px solid var(--rule);height:1.9rem}
.wbprint{break-inside:avoid;page-break-inside:avoid;padding:1rem 0 .4rem;border-top:1px solid var(--rule)}
.wbprint h3{margin-top:.2rem}
.wbprint p.q{margin:.8rem 0 .2rem;font-size:.95rem}
.stagehead{break-before:page;page-break-before:always;margin-top:0;padding-top:1rem}
.printdoc .stagehead:first-of-type{break-before:auto;page-break-before:auto}
.score td.cell{width:5.5rem;border-bottom:1px solid var(--rule)}
@media print{
  @page{size:A4;margin:16mm 16mm 18mm}
  .noprint,.top,.rail,.foot,.pager,.tools,.maptoggle,.saved{display:none!important}
  main{margin:0}
  body{background:#fff;color:#000;font-size:11pt;line-height:1.5}
  .wrap{max-width:none;padding:0}
  h1{font-size:26pt} h2{font-size:15pt;margin-top:1.4rem} h3{font-size:12pt}
  .hero,.decision,.readiness,.compare,.guide{background:#fff!important;color:#000!important;border:1px solid #999;border-radius:0}
  .on-forest .turn,.on-forest .label,.on-forest .kicker,.decision h3{color:#000!important}
  .inset{border-left:3px solid #000}
  textarea,input,select{border:1px solid #999;background:#fff}
  a{color:#000;text-decoration:none}
  .strategy h2,.strategy h3{break-after:avoid}
  .wbsec,.strategy section{break-inside:avoid}

  .top,.rail,.pager,.tools,.maptoggle{display:none!important}
  main{margin:0}
  .decision{background:none;color:var(--ink);border-top:2px solid var(--ink)}
  textarea{border:1px solid #999}
}

/* ---------- workspace components ---------- */
.dash{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.8rem;margin:1rem 0 1.4rem}
.panel{overflow-wrap:anywhere;background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--forest);padding:20px 22px 22px;min-width:0}
.panel.dark{background:var(--night);color:var(--paper);border-top-color:var(--lime-btn)} .panel.dark .label{color:var(--lime)} .panel.dark a{color:var(--lime)}
.panel .ph{margin:0 0 .8rem;font-size:1.02rem} .panel .ph .fine{font-weight:400;margin-left:.4rem}
.panel .big{display:block;font-family:var(--sans);font-weight:600;font-size:clamp(24px,3vw,34px);letter-spacing:-.015em;line-height:1.05;margin:.3rem 0 .5rem} .panel .big small{font-size:.5em;color:var(--muted);margin-left:.15em}
.stats{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)} .stats b{font-family:var(--sans);font-size:1.05rem;letter-spacing:0;text-transform:none;color:inherit;margin-right:.3em} .panel.dark .stats{color:var(--mut-dark)} .panel.dark .stats b{color:var(--paper)} .stats.col{flex-direction:column;gap:.5rem}
.span4{grid-column:span 4} .span6{grid-column:span 6} .span8{grid-column:span 8} .span12{grid-column:span 12}
.vrow{display:grid;grid-template-columns:minmax(120px,1fr) auto 2fr auto;gap:.8rem;align-items:baseline;padding:.55rem 0;border-top:1px solid var(--rule);font-size:.95rem} .vrow:first-of-type{border-top:0} .vrow .what{color:var(--muted)} .vrow em{color:var(--muted)}
.decrow{display:grid;grid-template-columns:minmax(140px,1.2fr) auto;gap:.6rem;align-items:baseline;padding:.5rem .6rem;border-top:1px solid var(--rule);transition:opacity .15s,background .15s}
.decrow .name{font-family:var(--sans);font-weight:500;text-decoration:none;color:var(--ink)} .decrow .meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.decrow .ans{grid-column:1 / -1;font-size:.92rem;color:var(--muted)} .decrow .edit{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);grid-column:2;justify-self:end}
.dot{display:inline-block;width:.6em;height:.6em;border-radius:50%;margin-right:.45em;background:#B9B2A3;vertical-align:middle} .r-rough .dot{background:#E9A93B} .r-working .dot{background:#7FB08C} .r-strong .dot{background:#2E7D4F}
.dmap{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.8rem} .dcol .label{margin-bottom:.3rem} .dcol{min-width:0}
.dcol .decrow{grid-template-columns:minmax(0,1fr);overflow-wrap:anywhere;gap:.15rem;padding:.45rem .5rem;border:1px solid var(--rule);border-top:1px solid var(--rule);margin-bottom:.35rem;background:var(--paper)} .dcol .decrow.dim{opacity:.32} .dcol .decrow.rel{background:var(--paper-2);border-color:var(--forest)}
.tabs{max-width:100%;flex-wrap:wrap}
.tabs.paper{background:rgba(22,39,27,.04);border-color:rgba(22,39,27,.14)} .tabs.paper .tab{color:var(--ink)} .tabs.paper .tab.on{background:var(--forest);color:var(--paper)}
details.wbrow{border-top:1px solid var(--rule)} details.wbrow summary{list-style:none;cursor:pointer} details.wbrow summary::-webkit-details-marker{display:none} details.wbrow .decrow.inrow{border-top:0} details.wbrow[open] .edit::after{content:" \00b7 close"} .wbbody{padding:.4rem .6rem 1.4rem;border-top:1px dashed var(--rule)} .wbbody .bigfield{min-height:5rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:.8rem;margin-top:.6rem} .tile{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--forest);padding:20px 22px} .tile h3{margin:0 0 .4rem;font-size:1.05rem} .tile p{font-size:.94rem;color:var(--muted);margin:0 0 .8rem} .tile .status{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;margin:.2rem 0 .9rem} .status.ok .dot{background:#2E7D4F} .status.warn .dot{background:#E9A93B} .tile .tools{margin:0} .tile pre.out{margin-top:.8rem;max-height:22rem;overflow:auto}
.linkbtn{background:none;border:0;padding:0;color:var(--forest);text-decoration:underline;font:inherit;letter-spacing:0;text-transform:none;box-shadow:none;cursor:pointer} .linkbtn:hover{box-shadow:none;transform:none}
.rel{border:1px solid var(--rule);border-left:3px solid #B9B2A3;padding:14px 18px;margin:.6rem 0} .rel.ok{border-left-color:#2E7D4F} .rel.warn{border-left-color:#E9A93B} .relhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;margin-bottom:.4rem;font-family:var(--sans);font-weight:600} .relhead a{text-decoration:none;color:var(--ink)} .relhead .arrow{color:var(--muted);font-weight:400} .relhead .verdict{margin-left:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)} .rel p{margin:0;font-size:.95rem;color:var(--muted)}
.docsheet{background:var(--paper);border:1px solid var(--rule);padding:0 0 1rem;margin-top:1rem} .dochead{background:var(--night);color:var(--paper);padding:44px 40px 36px} .dochead .label{color:var(--lime)} .dochead h1{margin:.5rem 0 .6rem;font-size:clamp(30px,5vw,56px)} .docmeta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut-dark)}
.docsec{padding:30px 46px 14px;border-top:1px solid var(--rule)} .docsec h2{margin:0 0 1rem} .docsec h2 .num{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--signal);margin-right:14px;vertical-align:middle}
.docitem{margin:0 0 1.9rem;max-width:62ch}
.docitem h3{margin:0 0 .35rem;font-size:.82rem;font-family:var(--mono);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.docitem .answer{font-size:1.12rem;line-height:1.55;margin:0}
.docitem .docmetaline{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:.5rem 0 0}
.docitem .empty{color:var(--muted);margin:0}
.doclist{margin:.3rem 0 0;padding-left:1.1rem} .doclist li{margin:.3rem 0;font-size:.98rem}
.docsheet h2{font-size:clamp(20px,2.2vw,26px)}
.strip .cells.two{grid-template-columns:1fr 1fr}
@media (max-width:760px){.strip .cells.two{grid-template-columns:1fr}}
.demobar{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--night);color:var(--paper);padding:14px 20px;margin:0 0 1.4rem;border-left:3px solid var(--lime-btn)}
.demobar b{color:var(--lime)} .demobar span{font-size:.95rem}

details.menu{position:relative;display:inline-block} details.menu summary{list-style:none} details.menu summary::-webkit-details-marker{display:none} .menuitems{position:absolute;right:0;top:calc(100% + 6px);background:var(--paper);border:1px solid var(--rule);min-width:16rem;z-index:5;display:flex;flex-direction:column} .menuitems button{background:transparent;color:var(--ink);border:0;border-bottom:1px solid var(--rule);border-radius:0;text-align:left;padding:.8rem 1rem;box-shadow:none} .menuitems button:hover{background:var(--paper-2);box-shadow:none;transform:none}
.scorerow{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:1rem;align-items:center;padding:.8rem 0;border-top:1px solid var(--rule)} .scorerow .area{font-size:.98rem} .fivecells{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-top:.3rem} .fivecells .confcell{padding:.55rem 0;min-height:40px}
@media (max-width:1023px){.dash{grid-template-columns:repeat(6,minmax(0,1fr))} .span4,.span6,.span8,.span12{grid-column:span 6} .dmap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.dash{grid-template-columns:1fr} .span4,.span6,.span8,.span12{grid-column:span 1} .dmap{grid-template-columns:1fr} .dcol .decrow.dim{opacity:1} .vrow{grid-template-columns:1fr auto} .vrow .what,.vrow .mv{grid-column:1 / -1} .scorerow{grid-template-columns:1fr} .docsec,.dochead{padding-left:20px;padding-right:20px} .tiles{grid-template-columns:1fr} .panel{padding:16px 16px 18px}}
@media print{.docsheet{border:0} .dochead{background:none;color:#000;padding:0 0 12px} .dochead .label,.docmeta{color:#000} .docsec{padding:16px 0 4px} .rulehead,.menu{display:none}}

/* product proof, local nav, compare */
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:1rem 0 0}
.proofcell > .label{display:block;margin-bottom:.5rem}
.proofcell .decision.demo{padding:20px 20px 18px;margin:0}
.proofcell .decision.demo .stephead{margin-bottom:.6rem}
.bigfield.fake{background:var(--paper);color:var(--ink);padding:.7rem .8rem;border-radius:var(--r-sm);font-size:1rem;line-height:1.45;min-height:0}
.proofcell .confcell{padding:.45rem 0;min-height:36px;font-size:.8rem}
.proofcell .chart.demo{border:1px solid var(--rule);margin:0}
.proofcell .tile.demo{margin:0}
.proofcell > .fine{margin:.6rem 0 0}
.localnav{position:sticky;top:var(--topbar,57px);z-index:5;display:flex;gap:.3rem;flex-wrap:wrap;background:rgba(247,245,238,.92);backdrop-filter:blur(10px);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:.5rem 0;margin:1.2rem 0}
.localnav a{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--ink);padding:.45rem .8rem;border:1px solid transparent}
.localnav a:hover{border-color:var(--rule);background:var(--paper)}
.cmpgrid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:.6rem} .cmpgrid .ex{font-family:var(--body);font-style:normal;font-size:1.06rem;line-height:1.5;margin:.4rem 0 0}
h2[id^=stage-]{scroll-margin-top:120px}
/* builder tables stacked on phones */
@media (max-width:640px){
  .proof{grid-template-columns:1fr}
  .cmpgrid{grid-template-columns:1fr}
  .grid,.grid tbody,.grid tr,.grid td{display:block;width:100%;min-width:0}
  .grid thead{display:none}
  .grid tr{border:1px solid var(--line-dark);padding:.5rem .6rem;margin:.5rem 0}
  .grid td{padding:.25rem 0}
  .grid td::before{content:attr(data-label);display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);margin-bottom:.2rem}
  .grid td[style*="text-align:center"]{text-align:left!important}
}

/* person and offer pairing */
.pairgrid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.paircol > .label{margin-bottom:.4rem}
.pairgrid .q label small{display:block;font-family:var(--body);font-size:.82rem;color:var(--mut-dark);margin:.15rem 0 .3rem}
.pairgrid .q label .answers{display:inline-block;margin-left:.6rem;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut-dark)}
.pairgrid .q label .answers.ok .dot{background:#7fb80f} .pairgrid .q label .answers.warn .dot{background:#E9A93B}
.builder .note{background:rgba(247,245,238,.05);border-color:var(--line-dark);color:var(--paper)} .builder .note .label{color:var(--lime)}
@media (max-width:760px){.pairgrid{grid-template-columns:1fr}}

/* personality sliders */
.brow.spec{grid-template-columns:1fr 2fr 1fr auto}
.brow.spec .strength{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut-dark);white-space:nowrap;min-width:4.6rem;text-align:right}
.brow.spec .strength.mid{color:var(--paper)} .brow.spec .strength.hi{color:var(--lime)}
.brow.arch2{grid-template-columns:14rem 1fr 2.4rem;align-items:center;color:var(--paper)}
.brow.arch2 .pct{font-family:var(--mono);font-size:.8rem;color:var(--mut-dark);text-align:right}
@media (max-width:760px){.brow.spec{grid-template-columns:1fr 1fr}.brow.spec input[type=range]{grid-column:1 / -1}.brow.spec .strength{text-align:left}.brow.arch2{grid-template-columns:1fr auto}.brow.arch2 input[type=range]{grid-column:1 / -1}}

/* evidence layer */
.basisrow{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:.2rem}
.basiscell{position:relative;display:block;text-align:center;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;padding:.65rem .2rem;border:1px solid var(--line-dark);background:rgba(247,245,238,.05);color:var(--paper);cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center}
.basiscell input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.basiscell.on{background:var(--lime-btn);border-color:var(--lime-btn);color:var(--ink)}
.basiscell.on.b-assumption{background:#E9A93B;border-color:#E9A93B}
.basiscell:has(input:focus-visible){outline:3px solid var(--lime);outline-offset:2px}
.basisnote{margin:.4rem 0 0;color:var(--mut-dark)}
.on-paper .basiscell{background:var(--paper);border-color:var(--rule);color:var(--ink)} .on-paper .basisnote{color:var(--muted)}
.minibasis{display:flex;gap:.3rem;margin-top:.3rem}
.minibasis label{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;padding:.3rem .55rem;border:1px solid var(--line-dark);color:var(--mut-dark);cursor:pointer;position:relative}
.minibasis label.on{background:var(--lime-btn);color:var(--ink);border-color:var(--lime-btn)} .minibasis input{position:absolute;opacity:0;inset:0;margin:0}
.bmark{color:var(--signal)} .on-forest .bmark,.panel.dark .bmark{color:var(--lime)}
.riskmark{display:inline-block;width:1.1em;height:1.1em;line-height:1.1em;text-align:center;background:#E9A93B;color:#16271b;border-radius:50%;font-size:.72em;margin-left:.35em}
.decrow.risky{border-left:3px solid #E9A93B;padding-left:.45rem}
.vrow.risky{border-left:3px solid #E9A93B;padding-left:.6rem}
.mat{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.8rem}
.matstep{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:.4rem .7rem;border:1px solid var(--line-dark);color:var(--mut-dark)}
.matstep.on{background:var(--lime-btn);border-color:var(--lime-btn);color:var(--ink)}
@media (max-width:760px){.basisrow{grid-template-columns:1fr 1fr}}

.docparts{margin:.7rem 0 0;border-left:2px solid var(--rule);padding-left:16px}
.docpart{margin:0 0 .8rem}
.docpart .plabel{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.docpart p{margin:0;font-size:1rem;line-height:1.55}
@media print{.docparts{border-left:1px solid #999}}

.decrow .ans.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
details.wbrow[open] .decrow .ans.clamp{-webkit-line-clamp:unset;display:block}
.deeper .decrow .ans.clamp{-webkit-line-clamp:3}

.ctable td textarea{min-height:3rem;font-size:.92rem}
.ctable select{font-size:.9rem}
@media (min-width:761px){.ctable{table-layout:fixed}.ctable th:nth-child(1),.ctable td:nth-child(1){width:16%}.ctable th:nth-child(2),.ctable td:nth-child(2){width:11%}.ctable th:nth-child(6),.ctable td:nth-child(6){width:12%}}

/* save state */
.savebadge{display:inline-flex;align-items:center;gap:.15rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-left:auto;white-space:nowrap}
.savebadge .dot{width:.55em;height:.55em;background:#3E8E5A}
.savebadge.busy .dot{background:#E9A93B} .savebadge.bad{color:#8A2B12} .savebadge.bad .dot{background:#C4462A}
.savebadge .linkbtn{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#8A2B12}
.top nav{margin-left:.8rem}
@media (max-width:900px){.savebadge{font-size:0;gap:0;padding:.5rem .3rem;margin-left:auto} .savebadge .dot{width:9px;height:9px} .savebadge .linkbtn{display:none} .savebadge.bad{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;font-size:.72rem;gap:.45rem;white-space:normal;background:#fff4ef;border:1px solid #C4462A;border-radius:var(--r-sm);padding:.75rem .9rem;box-shadow:0 6px 24px rgba(0,0,0,.12)} .savebadge.bad .linkbtn{display:inline;font-size:.72rem}}
/* traffic lights */
.l{display:inline-flex;align-items:center;justify-content:center;min-width:1.3em;height:1.3em;padding:0 .3em;border-radius:999px;font-family:var(--mono);font-size:.62rem;line-height:1;color:#16271b;margin-left:.2em}
.l.bare{min-width:.6em;width:.6em;height:.6em;padding:0;border-radius:50%;margin-left:.45em;flex:none}
.l-green{background:#3E8E5A;color:#fff} .l-amber{background:#E9A93B} .l-red{background:#C4462A;color:#fff} .l-grey{background:#C6C9BB}
.lights{margin-left:auto;display:inline-flex;gap:.2em}
.rail li a{display:flex;align-items:center}
.rail li a .l.bare{margin-left:auto}
.legend{margin-top:.8rem;display:flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:center}
.vlist{margin-top:.4rem}

.tabs.sectabs{display:flex;flex-wrap:wrap;margin-bottom:1rem}
.tabs.sectabs .tab{font-family:var(--sans);font-size:.92rem;letter-spacing:0;text-transform:none;padding:.55rem .9rem;display:inline-flex;align-items:center}
.tabs.sectabs .tab .l.bare{margin-left:.5em}
@media (min-width:1180px){
  .step.think.twocol-ready{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
  .step.think.twocol-ready .stephead{grid-column:1 / -1}
}

.sub2{border:1px solid var(--line-dark);padding:16px 18px;margin:0 0 .8rem}
.sub2 .label{color:var(--lime)}
.sub2.ai{border-left:3px solid var(--lime-btn);background:rgba(127,184,15,.06)}
.sub2 .pane{border:0;padding:.2rem 0 0}
.sub2 .tabs{margin-bottom:.6rem}

@media (max-width:1240px) and (min-width:1024px){.dmap{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.dmap{grid-template-columns:minmax(0,1fr)}}

@media (max-width:640px){ .top nav .nav-strategy{display:none} }

@media (max-width:400px){ .decision{margin-left:0;margin-right:0;padding-left:16px;padding-right:16px} .step.decide{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px} .decision,.builder,.sub2{overflow-wrap:anywhere} }


/* italics are reserved for hero headlines */
#view em, .rail em, .foot em, .panel em, .decrow em, .docitem em, .vrow em{font-style:normal;color:var(--muted)}
#view h1 em,#view h2 em{font-style:italic;color:inherit}
.on-forest em,.decision em{color:var(--mut-dark)}

.l,.dot,i{font-style:normal}
h1 .acc,h2 .acc,h1 .turn,h2 .turn{font-style:italic}

/* 2026-09-30 review fixes */
.board{grid-template-columns:repeat(2,minmax(0,1fr))}
.board .card{align-items:flex-start}
.board .card>span:first-child{min-width:0;overflow-wrap:anywhere}
.board .brow{grid-template-columns:minmax(0,1fr) auto}
.board .brow input{min-width:0}
button.x{min-width:30px;min-height:30px;display:inline-flex;align-items:center;justify-content:center;padding:0}
.chip button.x{min-width:26px;min-height:26px}
@media (max-width:560px){.board{grid-template-columns:minmax(0,1fr)} .brow.arch{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .brow.arch label{grid-column:1 / -1} .brow.arch input[type=text]{min-width:0}}
@media (max-width:420px){.brow.arch{grid-template-columns:minmax(0,1fr)} .decrow{grid-template-columns:minmax(0,1fr)} .decrow .meta{white-space:normal} .decrow .edit{justify-self:start}}
.confcell{min-width:24px}
.grid.goals td{min-width:7rem}
.privacy{margin:.8rem 0 0;max-width:40rem}
.on-forest .privacy{color:var(--mut-dark)}
.foot .stamp{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;color:var(--muted);opacity:.7;margin-left:.4rem;white-space:nowrap}
.fameta{margin:.3rem 0 .9rem;color:var(--muted);font-size:.86rem}
.proofcell .confcell{min-width:0}
.decision > .rulehead{flex-wrap:wrap;row-gap:.35rem}
.decision > .rulehead .num{white-space:normal;min-width:0}
.dcol .decrow .meta{white-space:normal}
.strip .cell b,.strip .cell .n{overflow-wrap:anywhere;hyphens:auto}
.crit input[type=checkbox],ul.crit input[type=checkbox]{width:20px;height:20px}
input[type=range]{min-height:28px}

/* ================= Brighter Future design system ================= */
body{font-size:17px;line-height:1.6;text-rendering:optimizeLegibility}
a{color:var(--ink)}
:focus-visible{outline:2px solid var(--bf-focus);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:clamp(36px,5.2vw,68px);line-height:.98;letter-spacing:-.028em}
h2{font-size:clamp(27px,3.1vw,40px);line-height:1.04}
h3{font-weight:400;font-size:21px;line-height:1.2;letter-spacing:-.01em}
h4{font-family:var(--sans);font-weight:500}
.hero h1{font-size:clamp(46px,7.4vw,104px);line-height:.92;letter-spacing:-.03em;font-weight:300}
h1 .acc,h2 .acc,h1 .turn,h2 .turn{font-family:var(--serif);font-style:italic;font-weight:300;letter-spacing:-.01em;background:var(--seam);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
.on-forest h1 .acc,.on-forest h2 .acc,.hero h1 .acc,.dochead h1 .acc,.panel.dark h2 .acc,.on-forest h1 .turn,.on-forest h2 .turn,.decision h2 .turn,.decision h2 .acc{background:var(--seam-dark);-webkit-background-clip:text;background-clip:text;color:transparent}
.acc,.turn{color:var(--signal)}
.label,.kicker,.rulehead .num,.stages .n,.rail h4,.rail .num,.rail details.stage summary .num,.rail details.stage summary .cnt{font-family:var(--sans);font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.kicker,.label{font-size:12px}
.kicker{color:var(--muted)} .label{color:var(--muted)}
.on-forest .kicker,.on-forest .label,.hero .kicker{color:var(--lime)}
.lede{color:#2d2c33}
.hero{background:var(--night)}
.hero p.lede{color:var(--mut-dark)}
.stages b,.pull{font-family:var(--serif);font-weight:400}
/* buttons, after the studio system */
button,.btn{font-family:var(--sans);font-weight:500;font-size:.95rem;letter-spacing:0;text-transform:none;min-height:46px;padding:.75rem 1.3rem;border-radius:6px;background:var(--ink);border-color:var(--ink);color:var(--paper);box-shadow:none}
button:hover,.btn:hover{background:#000;border-color:#000;box-shadow:none;transform:none}
.btn.quiet,button.quiet{background:transparent;color:var(--ink);border-color:var(--rule)}
.btn.quiet:hover,button.quiet:hover{background:transparent;border-color:var(--ink)}
.on-forest .btn,.on-forest button,.hero .btn,.decision button:not(.quiet):not(.x):not(.linkbtn),.panel.dark button:not(.quiet){background:var(--paper);color:var(--night);border-color:var(--paper)}
.on-forest .btn:hover,.on-forest button:hover,.hero .btn:hover{background:#fff;border-color:#fff}
.on-forest .btn.quiet,.on-forest button.quiet,.hero .btn.quiet{background:transparent;color:var(--paper);border-color:var(--line-strong,rgba(243,242,238,.32))}
button.x,button.linkbtn{background:transparent;border:0;color:inherit;min-height:0}
.tabs .tab,.top nav a,.maptoggle{letter-spacing:0;text-transform:none}
.confcell.on,.basiscell.on,.minibasis label.on,.matstep.on,.on-forest .tabs .tab.on,.tabs .tab.on{background:var(--lime-btn);border-color:var(--lime-btn);color:#fff}
.decision,.readiness,.panel.dark{border-top:0;position:relative}
.decision::before,.readiness::before,.panel.dark::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--seam)}
.railblock{border-top:0;position:relative} .railblock::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--seam)}
.rail li a.active{background:var(--ink)} .rail li a.active .num,.rail li a.active .done{color:var(--lime)}
.rail .progress i{background:var(--seam)}
.inset{border-left:2px solid var(--lime-btn)}
.demobar{border-left-color:var(--lime-btn)}
/* course bar, carrying the studio mark */
.top{background:rgba(243,242,238,.92);border-bottom:1px solid var(--rule);gap:.9rem;padding:.55rem 1.2rem;min-height:60px}
.top .bfbrand{display:inline-flex;color:var(--ink);flex:none}
.top .bfbrand svg{height:30px;width:auto;display:block}
.top .topsep{width:1px;height:22px;background:var(--rule);flex:none}
.top .brand{font-family:var(--serif);font-weight:400;font-size:1.08rem;letter-spacing:-.01em;color:var(--ink)}
.top nav{background:transparent;border:0;padding:0;gap:.2rem}
.top nav a{font-family:var(--sans);font-size:.95rem;opacity:1;padding:.4rem .7rem;border-radius:0;position:relative}
.top nav a::after{content:"";position:absolute;left:.7rem;right:.7rem;bottom:.15rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.1,1)}
.top nav a:hover{background:transparent} .top nav a:hover::after{transform:scaleX(1)}
.savebadge{font-family:var(--sans);letter-spacing:.08em}
@media (min-width:901px){.savebadge{font-size:.72rem}}
.top .maptoggle{font-family:var(--sans);text-transform:none;letter-spacing:0;font-size:.9rem;min-height:38px;padding:.4rem .75rem}
@media (max-width:1100px){.top .brand .long{display:none}.top .brand .short{display:inline}}
@media (max-width:760px){.top .topsep,.top .brand{display:none}.top .bfbrand svg{height:26px}}
@media (max-width:420px){.top .bfbrand svg{height:22px}}
/* footer from the studio site */
.foot.site-footer{color:var(--bf-on-ink);font-family:var(--bf-sans);margin-left:var(--rail)}
.site-footer a{color:var(--bf-on-ink);text-decoration:none}
.site-footer p{margin:0}
.site-footer .footer-cta__h{font-family:var(--bf-serif);font-weight:300;color:var(--bf-on-ink);margin:0}
.site-footer .footer-cta__h em{font-style:italic;background:var(--seam-dark);-webkit-background-clip:text;background-clip:text;color:transparent}
.site-footer .footer-course{margin-top:44px;padding-top:20px;border-top:1px solid var(--bf-line);font-size:.875rem;color:var(--bf-on-ink-muted);max-width:56rem}
.site-footer .footer-course b{color:var(--bf-on-ink);font-weight:500}
.site-footer .footer-course a{text-decoration:underline;text-underline-offset:3px}
.site-footer .copy-btn{background:transparent;border:0;padding:0;color:var(--bf-on-ink);font:inherit;min-height:0;letter-spacing:0;text-transform:none;cursor:pointer}
.site-footer .copy-btn:hover{background:transparent}
.site-footer .stamp{color:var(--bf-on-ink-muted)}
@media (max-width:1023px){.foot.site-footer{margin-left:0}}
.site-footer{background:var(--bf-ink);border-top:1px solid var(--bf-line);padding-top:clamp(56px,7vw,96px);padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));overflow:hidden}
.footer-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);row-gap:40px}
.footer-news{grid-column:1 / span 4;display:flex;flex-direction:column;gap:18px}
.footer-news .h3{font-size:clamp(1.6rem,2.4vw,2.1rem)}
.footer-news p{color:var(--bf-on-ink-muted);max-width:28rem}
.footer-col{display:flex;flex-direction:column;gap:10px;font-size:.95rem}
.footer-col .bf-label{margin-bottom:6px}
.footer-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.footer-col:nth-of-type(2){grid-column:6 / span 2}
.footer-col:nth-of-type(3){grid-column:8 / span 2}
.footer-col:nth-of-type(4){grid-column:10 / -1}
.footer-mark{margin-top:clamp(48px,6vw,88px);color:var(--bf-on-ink)}
.footer-mark svg{width:clamp(180px,22vw,300px);height:auto}
.footer-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:28px;padding-top:20px;border-top:1px solid var(--bf-line);font-size:var(--bf-s-small);color:var(--bf-on-ink-muted)}
.footer-base nav{display:flex;gap:20px;flex-wrap:wrap}
.footer-base a:hover{color:var(--bf-on-ink)}
.copy-btn{display:inline-flex;align-items:center;gap:8px;text-align:left}
.copy-btn .copied{font-size:var(--bf-s-label);letter-spacing:.1em;text-transform:uppercase;color:var(--bf-on-ink-muted)}
@media (max-width:900px){.footer-news{grid-column:1 / -1}.footer-col:nth-of-type(n){grid-column:span 4}}
@media (max-width:560px){.footer-col:nth-of-type(n){grid-column:span 6}}
.contact-small .copy-btn{color:var(--bf-on-ink);border-bottom:1px solid var(--bf-line-strong);font-size:inherit}
.site-footer{padding-top:clamp(72px,9vw,128px)}
.footer-news .h3{font-size:clamp(1.8rem,3vw,2.6rem);font-weight:300;line-height:1.05}
.site-footer{padding-top:0;border-top:0}
.footer-cta{position:relative;isolation:isolate;overflow:hidden;border-bottom:1px solid var(--bf-line);min-height:clamp(420px,58vh,620px);display:flex;align-items:flex-end}
.footer-cta .hero__canvas{z-index:-2}
.footer-cta__shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(6,6,8,.78) 0%,rgba(6,6,8,.35) 50%,rgba(6,6,8,.05) 80%),linear-gradient(180deg,rgba(6,6,8,.85) 0%,rgba(6,6,8,0) 30%,rgba(6,6,8,0) 75%,rgba(6,6,8,.6) 100%)}
.footer-cta__inner{width:100%;padding-block:clamp(72px,9vw,128px) clamp(48px,6vw,88px);display:flex;flex-direction:column;gap:clamp(18px,2vw,28px)}
.footer-cta__h{font-family:var(--bf-serif);font-weight:300;font-size:clamp(2.4rem,6vw,5.6rem);line-height:.98;letter-spacing:-.025em;max-width:14ch;text-wrap:balance}
.footer-cta__row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px}
.footer-cta__row p{color:var(--bf-on-ink-muted);max-width:30rem}
.site-footer > .bf-wrap{padding-top:clamp(48px,6vw,80px)}
.footer-line{grid-column:1 / span 4;font-family:var(--bf-serif);font-weight:300;font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.3;max-width:24rem}
.footer-grid > .footer-col:nth-of-type(1){grid-column:6 / span 2}
.footer-grid > .footer-col:nth-of-type(2){grid-column:8 / span 2}
.footer-grid > .footer-col:nth-of-type(3){grid-column:10 / -1}
.footer-mark{margin-top:clamp(56px,7vw,112px)}
.footer-mark svg{width:100%;height:auto;display:block;opacity:.95}
@media (max-width:900px){.footer-line{grid-column:1 / -1}.footer-grid > .footer-col:nth-of-type(n){grid-column:span 4}}
@media (max-width:560px){.footer-grid > .footer-col:nth-of-type(n){grid-column:span 6}}
.footer-mark svg{width:clamp(180px,26vw,360px)}
.mobile-nav__icons .copy-btn{font-size:.9rem;color:var(--bf-on-ink-muted);margin-left:4px}
main.page-contact ~ .site-footer .footer-cta{display:none}
@media (pointer:coarse){.footer-col a,.site-footer .copy-btn,.contact-small .copy-btn{position:relative}.footer-col a::before,.site-footer .copy-btn::before,.contact-small .copy-btn::before{content:"";position:absolute;inset:-9px -4px}}
.footer-col a,.site-footer .copy-btn{min-height:24px;display:inline-flex;align-items:center}
.footer-cta--quiet{padding-block:clamp(48px,6vw,80px)!important;min-height:0!important;background:var(--bf-ink-2)}
.footer-cta--quiet .footer-cta__h{font-size:clamp(1.8rem,3.2vw,2.6rem)!important}
.footer-cta--quiet .footer-cta__shade{display:none}
main.page-404 ~ .site-footer .footer-cta{display:none}
@media (min-width:901px){.footer-line{grid-column:1 / span 4}.footer-grid > .footer-col:nth-of-type(1){grid-column:5 / span 2}.footer-grid > .footer-col:nth-of-type(2){grid-column:7 / span 2}.footer-grid > .footer-col:nth-of-type(3){grid-column:9 / span 1}.footer-grid > .footer-col:nth-of-type(4){grid-column:10 / -1}}
@media (min-width:901px) and (max-width:1180px){.footer-grid > .footer-col:nth-of-type(3){grid-column:9 / span 2}.footer-grid > .footer-col:nth-of-type(4){grid-column:11 / -1}}
.footer-grid{row-gap:32px}
.footer-col{gap:8px}
.footer-exp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 28px}
.footer-exp a{white-space:nowrap}
@media (min-width:901px){.footer-line{grid-column:1 / span 4}.footer-grid > .footer-col:nth-of-type(1){grid-column:5 / span 2}.footer-grid > .footer-col:nth-of-type(2){grid-column:7 / span 4}.footer-grid > .footer-col:nth-of-type(3){grid-column:11 / -1}.footer-grid > .footer-col:nth-of-type(4){grid-column:auto}}
@media (min-width:901px) and (max-width:1180px){.footer-line{grid-column:1 / -1}.footer-grid > .footer-col:nth-of-type(1){grid-column:1 / span 3}.footer-grid > .footer-col:nth-of-type(2){grid-column:4 / span 6}.footer-grid > .footer-col:nth-of-type(3){grid-column:10 / -1}}
@media (max-width:900px){.footer-grid > .footer-col:nth-of-type(2){grid-column:1 / -1}}
@media (max-width:420px){.footer-exp a{white-space:normal}}
@media (max-width:900px){.footer-grid > .footer-col:nth-of-type(1){grid-column:1 / span 6;grid-row:2}.footer-grid > .footer-col:nth-of-type(3){grid-column:7 / -1;grid-row:2}.footer-grid > .footer-col:nth-of-type(2){grid-column:1 / -1;grid-row:3}}
@media (max-width:420px){.footer-grid > .footer-col:nth-of-type(3){font-size:.85rem}}
@media (max-width:900px){.footer-grid > .footer-col:nth-of-type(3) .copy-btn{overflow-wrap:anywhere;text-align:left}}
@media (max-width:420px){.footer-grid > .footer-col:nth-of-type(1){grid-column:1 / span 5}.footer-grid > .footer-col:nth-of-type(3){grid-column:6 / -1}}
.mobile-nav__icons .copy-btn{padding:0 16px;min-height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#f3f2ee;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mobile-nav__icons .copy-btn{border-radius:var(--bf-r-btn)}
.footer-cta{background:radial-gradient(60% 90% at 85% 30%,rgba(109,44,242,.55),transparent 70%),radial-gradient(50% 80% at 60% 110%,rgba(255,111,166,.35),transparent 70%),radial-gradient(40% 60% at 100% 100%,rgba(60,198,255,.3),transparent 70%),var(--bf-ink)}
.footer-cta__shade{background:linear-gradient(90deg,rgba(6,6,8,.72) 0%,rgba(6,6,8,.2) 55%,rgba(6,6,8,0) 80%),linear-gradient(180deg,rgba(6,6,8,.7) 0%,rgba(6,6,8,0) 28%,rgba(6,6,8,0) 80%,rgba(6,6,8,.45) 100%)!important}
.footer-cta .hero__canvas{opacity:1;filter:saturate(1.35) brightness(1.15)}
.footer-cta__h em{color:inherit;background:none;-webkit-text-fill-color:currentColor}
.footer-cta--quiet{background:radial-gradient(70% 120% at 90% 0%,rgba(109,44,242,.45),transparent 70%),radial-gradient(50% 100% at 70% 120%,rgba(255,111,166,.28),transparent 70%),var(--bf-ink-2)!important}
.site-footer .bf-wrap{max-width:var(--bf-maxw);margin-inline:auto;padding-inline:var(--bf-gutter)}
.site-footer .bf-label{font-family:var(--bf-sans);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bf-on-ink-muted)}
.bf-btn{display:inline-flex;align-items:center;gap:.7rem;min-height:48px;padding:.75rem 1.35rem;border-radius:6px;font-family:var(--bf-sans);font-weight:500;font-size:.95rem;line-height:1;border:1px solid transparent;text-decoration:none;letter-spacing:0;text-transform:none;transition:background .25s,color .25s,border-color .25s}
.bf-btn svg{width:16px;height:16px;flex:none;transition:transform .3s}
.bf-btn:hover svg{transform:translateX(3px)}
.bf-btn--light{background:var(--bf-on-ink);color:var(--bf-ink)} .bf-btn--light:hover{background:#fff}
.bf-btn--ghost{border-color:var(--bf-line-strong);color:var(--bf-on-ink)} .bf-btn--ghost:hover{border-color:var(--bf-on-ink)}
.bf-btn-row{display:flex;flex-wrap:wrap;gap:12px}
.site-footer .bf-btn--light{color:var(--bf-ink)}
.site-footer .bf-btn--light:hover{color:var(--bf-ink)}
.site-footer .footer-grid{grid-template-columns:repeat(12,minmax(0,1fr))}
.site-footer .footer-line{grid-column:1 / -1;font-family:var(--bf-serif);font-weight:300;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.2;color:var(--bf-on-ink);max-width:34rem}
.site-footer .footer-col:nth-of-type(1){grid-column:1 / span 3}
.site-footer .footer-col:nth-of-type(2){grid-column:4 / span 6}
.site-footer .footer-col:nth-of-type(3){grid-column:10 / -1}
.site-footer .copy-btn{overflow-wrap:anywhere}
@media (max-width:900px){.site-footer .footer-grid > .footer-col:nth-of-type(1),.site-footer .footer-grid > .footer-col:nth-of-type(2),.site-footer .footer-grid > .footer-col:nth-of-type(3){grid-column:1 / -1;grid-row:auto}.site-footer .footer-grid > .footer-col:nth-of-type(2) .footer-links,.site-footer .footer-grid > .footer-col:nth-of-type(2) ul{columns:2}}
.big{font-family:var(--serif);font-weight:300;letter-spacing:-.02em}
.ph{font-family:var(--serif);font-weight:400;font-size:1.3rem;letter-spacing:-.01em}
.stages li,.strip .cell{border-top-color:var(--ink)}
@media (max-width:560px){.top .bfbrand{width:27px;overflow:hidden}.top .bfbrand svg{height:27px;width:164px;max-width:none;flex:none}.top{gap:.6rem;padding:.5rem .9rem}}
#posmap g.pt:focus{outline:none}#posmap g.pt:focus-visible circle{stroke:var(--bf-violet,#6d2cf2);stroke-width:4}
.site-footer .copy-btn{word-break:break-all;overflow-wrap:anywhere}
.hbars{display:grid;gap:.5rem;margin:.4rem 0 0}.hrow{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 3.2rem;gap:.8rem;align-items:center;font-size:.92rem}.hbarwrap{display:grid;gap:3px}.hbar{display:block;height:8px;border-radius:3px;background:var(--ink)}.hbar.after{background:var(--bf-magenta,#dd3fc9)}.hval{color:var(--muted,#5c5b66);font-size:.85rem;white-space:nowrap}@media(max-width:560px){.hrow{grid-template-columns:1fr;gap:.25rem}.hval{justify-self:start}}

/* h2 that sits where an h3 would look right (heading order fixed for screen readers, look unchanged) */
h2.as-h3{font-size:21px;font-weight:400;line-height:1.2;letter-spacing:-.01em;margin-top:1.6rem;margin-bottom:.5rem}
@media print{h2.as-h3{font-size:12pt}}

/* links inside the dark gate's privacy note */
.on-forest .privacy a{color:var(--paper);text-decoration:underline;text-underline-offset:2px}

/* Light field, shared with From Story to Stage (hero and gate) */
.lfx{position:relative;overflow:hidden;isolation:isolate}
.lfx>canvas.fxc{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-1;pointer-events:none}
.lfx>canvas.fxc.is-fallback{background:radial-gradient(60% 55% at 72% 50%,rgba(109,44,242,.7),transparent 70%),radial-gradient(40% 45% at 84% 70%,rgba(255,138,76,.55),transparent 70%),radial-gradient(35% 40% at 66% 30%,rgba(34,51,255,.7),transparent 70%);opacity:.75}
.lfx::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(6,6,8,.92) 0%,rgba(6,6,8,.72) 38%,rgba(6,6,8,0) 70%)}
@media (max-width:760px){.lfx::after{background:linear-gradient(180deg,rgba(6,6,8,.35),rgba(6,6,8,.88) 60%)}}
@media print{.lfx>canvas.fxc,.lfx::after{display:none}}
/* keep text clear of the field's bright seam (it sits at about 63% across) */
@media (min-width:761px){.lfx.hero .lede,.lfx.hero .fine{max-width:32rem}.lfx.decision .sub,.lfx.decision .privacy,.lfx.decision #gate-msg{max-width:34rem}}
/* Rule (1 October 2026): no gradient inside text. Italic accents take the heading's own colour, as in From Story to Stage. Gradients stay on surfaces, rules and bars. */
h1 .acc,h2 .acc,h1 .turn,h2 .turn,.site-footer .footer-cta__h em{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:inherit!important;-webkit-text-fill-color:currentColor}

/* report a problem dialog */
.reportdlg{border:1px solid var(--rule);border-radius:var(--r-sm,6px);padding:28px;max-width:34rem;width:calc(100% - 32px);background:var(--paper);color:var(--ink)}
.reportdlg::backdrop{background:rgba(6,6,8,.55)}
.reportdlg textarea,.reportdlg input[type=email]{border-color:var(--rule)}
.site-footer .linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-transform:none;letter-spacing:0;cursor:pointer}
.reportdlg .q label{color:var(--ink);display:block;margin-bottom:.35rem;font-weight:500} .reportdlg .fine{color:var(--muted)}

/* beta tag in the course bar */
.brand .beta{display:inline-block;margin-left:.55rem;padding:2px 7px;border:1px solid currentColor;border-radius:999px;font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;line-height:1.4;vertical-align:middle;opacity:.8}

/* ===== Lesson layout from the Story System (October 2026) ===== */
.setup{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.32rem;line-height:1.4;letter-spacing:-.005em;color:var(--ink);margin:0 0 1.1rem}
.phases{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .5rem;margin:1.1rem 0 0;font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.phases .ph{color:var(--muted);text-decoration:none;padding:5px 10px;border:1px solid var(--rule);border-radius:999px}
.phases a.ph:hover{color:var(--ink);border-color:var(--ink)}
.phases .ph.on{color:var(--paper);background:var(--ink);border-color:var(--ink)}
.phases .ph-sep{width:14px;height:1px;background:var(--rule)}
.lmap{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:.4rem 0 1rem;padding:0}
.lmap li{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border:1px solid var(--rule);border-radius:999px;padding:5px 11px 5px 6px;display:flex;align-items:center;gap:.45rem}
.lmap li span{color:var(--signal)}
.lcards{display:grid;gap:8px;margin:0 0 1.4rem}
.lcard{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:1.2rem;background:var(--warm,#f7f6f2);border:1px solid var(--rule);border-radius:6px;padding:16px 20px}
.lcard p{margin:0}
.lc-k{display:flex;flex-direction:column;gap:4px}
.lc-n{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--signal);line-height:1}
.lc-k b{font-family:var(--serif);font-weight:400;font-size:1.15rem;line-height:1.2;letter-spacing:-.005em}
.exrows{display:grid;gap:0;margin:.2rem 0 1rem;border-top:1px solid var(--rule)}
.exrow{display:grid;grid-template-columns:10rem minmax(0,1fr);gap:1rem;padding:10px 0;border-bottom:1px solid var(--rule)}
.exrow p{margin:0}
.ex-k{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);padding-top:.25rem}
.exbox{margin:1rem 0 1.6rem;border:1px solid var(--rule);border-radius:6px;background:var(--warm,#f7f6f2)}
.exbox>summary{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:14px 18px;cursor:pointer;list-style:none}
.exbox>summary::-webkit-details-marker{display:none}
.exbox>summary .ex-len{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.exbox>summary .ex-len::after{content:" +"}
.exbox[open]>summary .ex-len::after{content:" \2212"}
.exbox .inset{margin:0;border-radius:0 0 6px 6px}
@media (max-width:640px){.lcard,.exrow{grid-template-columns:1fr;gap:.4rem}}
@media print{.phases{display:none}.exbox{border:0}.exbox>summary{display:none}.exbox:not([open])>*:not(summary){display:block}}

.lesson-head .phases,.lesson-head .phases .ph{font-family:"Haas","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:11px;font-weight:500;letter-spacing:.16em;line-height:1.2}
.exrow--h{grid-template-columns:1fr}
.exrow--h p{font-family:var(--serif);font-size:1.1rem;padding-top:.4rem}
/* reading-size text is never italic (studio rule), so the setup line is upright display serif */
.wrap p.setup{font-family:var(--serif);font-style:normal;font-weight:300;font-size:1.5rem;line-height:1.3;letter-spacing:-.01em;margin:0 0 1.2rem}
.lc-n{font-style:normal}
.lesson-head .phases{margin-bottom:1.6rem}

/* ===== Footer, matched to the studio site (2 October 2026). Studio .fx classes renamed .sfx here ===== */
.site-footer .footer-cta{min-height:clamp(420px,58vh,620px)}
.footer-cta .hero__canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-2;opacity:1;filter:saturate(1.35) brightness(1.15)}
.footer-cta .hero__canvas.is-fallback{display:none}
.footer-cta__h em{font-style:italic;color:inherit!important;background:none!important;-webkit-text-fill-color:currentColor}
.sfx{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,5vw,96px)}
.sfx__lead{display:flex;flex-direction:column;gap:28px}
.sfx__line{font-family:var(--bf-serif);font-weight:300;font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.25;max-width:22rem;margin:0;color:var(--bf-on-ink)}
.sfx__icons{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.site-footer .icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border-radius:50%;border:1px solid var(--bf-line-strong);background:transparent;color:var(--bf-on-ink);cursor:pointer;transition:border-color .25s,background .25s}
.site-footer .icon-btn svg{width:18px;height:18px}
.site-footer .icon-btn:hover{border-color:currentColor;background:rgba(255,255,255,.06)}
.copy-btn--icon .copied{position:absolute;left:0;top:calc(100% + 8px);white-space:nowrap;font-size:.7rem}
.sfx__news{display:inline-flex;align-items:center;gap:8px;margin-left:8px;font-size:var(--bf-s-small);color:var(--bf-on-ink-muted)!important;text-decoration:none}
.sfx__news svg{width:13px;height:13px}
.sfx__news:hover{color:var(--bf-on-ink)!important}
.sfx__cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.8fr);gap:clamp(24px,3vw,48px)}
.sfx__col{display:flex;flex-direction:column;gap:12px;min-width:0}
.sfx__col .bf-label{margin:0 0 6px}
.sfx__col a{color:var(--bf-on-ink);opacity:.86;font-size:.95rem;line-height:1.35;text-decoration:none;transition:opacity .2s}
.sfx__col a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.sfx__exp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px}
@media (min-width:1181px){.sfx{grid-template-columns:minmax(0,1fr) auto}.sfx__cols{grid-template-columns:repeat(3,max-content);column-gap:clamp(40px,4.4vw,72px)}.sfx__exp{grid-template-columns:1fr}}
@media (max-width:1180px){.sfx{grid-template-columns:1fr;gap:48px}.sfx__lead{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px}}
@media (max-width:820px){.sfx__cols{grid-template-columns:repeat(2,minmax(0,1fr))}.sfx__col--wide{grid-column:1 / -1}}
@media (max-width:520px){.sfx__lead{flex-direction:column;align-items:flex-start}.sfx__cols{grid-template-columns:1fr;gap:36px}.sfx__exp{grid-template-columns:1fr}.sfx__news{margin-left:0;flex-basis:100%;margin-top:6px}}
.footer-mark{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:clamp(56px,6vw,96px)}
.footer-base{margin-top:22px;padding-top:22px}
.footer-base nav a{opacity:.9}
.footer-base nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}

/* ===== Home page, evolved from the studio site's Learn page (2 October 2026) ===== */
.hero .home-meta{margin:1.4rem 0 0;font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--moss)}
.home .label{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0}
.home-sec{padding:clamp(56px,7vw,104px) 0 0}
.home-sec h2{margin:14px 0 0;max-width:17ch}
.home-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,72px);align-items:end;margin-bottom:clamp(28px,3.4vw,48px)}
.home-lead p{font-size:clamp(1.02rem,1.2vw,1.12rem);line-height:1.6;margin:0 0 .8rem}
.home-out{border:1px solid var(--rule);border-radius:6px;padding:clamp(18px,2vw,28px);background:var(--warm,#f7f6f2)}
.home-out .label{margin-bottom:14px}
.home-out ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 32px}
.home-out li{position:relative;padding-left:22px;line-height:1.45}
.home-out li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:linear-gradient(90deg,#2233ff,#dd3fc9)}
.home-steps{list-style:none;margin:clamp(24px,3vw,40px) 0 0;padding:clamp(20px,2vw,28px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);border-top:1px solid var(--ink)}
.home-steps .n{display:block;font-family:var(--serif);font-weight:300;font-size:2.2rem;line-height:1;margin-bottom:16px}
.home-steps h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;line-height:1.2;margin:0 0 8px}
.home-steps p{margin:0;color:var(--muted);line-height:1.55}
.home-toc{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.home-toc li{border-bottom:1px solid var(--rule)}
.home-toc a{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:16px 24px;align-items:baseline;padding:18px 0;color:inherit;text-decoration:none}
.home-toc .k{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.home-toc .t b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.2}
.home-toc .t span{display:block;color:var(--muted);margin-top:4px}
.home-toc .r{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.home-toc a:hover b{text-decoration:underline;text-underline-offset:4px}
.home-cards{display:flex;flex-direction:column;gap:clamp(16px,2vw,24px)}
.home-card{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:clamp(20px,3vw,48px);padding:clamp(16px,1.6vw,20px);border:1px solid var(--rule);border-radius:6px;background:var(--warm,#f7f6f2)}
.home-card__art{position:relative;border-radius:4px;min-height:200px;overflow:hidden;background:radial-gradient(60% 80% at 75% 30%,rgba(109,44,242,.6),transparent 70%),radial-gradient(50% 70% at 30% 110%,rgba(221,63,201,.4),transparent 70%),radial-gradient(40% 60% at 100% 100%,rgba(255,138,76,.35),transparent 70%),#060608}
.home-card:nth-child(2) .home-card__art{background:radial-gradient(60% 80% at 25% 30%,rgba(34,51,255,.55),transparent 70%),radial-gradient(50% 70% at 80% 110%,rgba(60,198,255,.35),transparent 70%),#060608}
.home-card__art span{position:absolute;left:18px;bottom:14px;font-family:var(--serif);font-weight:300;font-size:2.6rem;line-height:1;color:#f3f2ee}
.home-card__main{display:flex;flex-direction:column;gap:10px;padding-block:clamp(4px,1vw,12px)}
.home-card__main h3{font-family:var(--serif);font-weight:300;font-size:clamp(1.7rem,2.6vw,2.4rem);line-height:1.05;letter-spacing:-.014em;margin:0}
.home-card__main p{margin:0;color:var(--muted);max-width:44ch}
.home-card__main .btn{align-self:flex-start;margin-top:auto}
.home > .home-sec:last-child{padding-bottom:clamp(56px,7vw,104px)}
@media (max-width:900px){.home-head{grid-template-columns:1fr;align-items:start}.home-out ul{grid-template-columns:1fr}.home-steps{grid-template-columns:1fr}.home-toc a{grid-template-columns:1fr;gap:6px}.home-card{grid-template-columns:1fr}.home-card__art{min-height:120px}}
/* studio footer: keep lead line and ghost button as on the studio site */
.site-footer .sfx p.sfx__line{font-size:clamp(1.3rem,1.8vw,1.6rem);font-style:normal;line-height:1.25;max-width:22rem;color:var(--bf-on-ink)}
.site-footer .footer-cta a.bf-btn--ghost{color:var(--bf-on-ink)!important;border-color:var(--bf-line-strong);background:rgba(10,10,12,.25)}
.site-footer .footer-cta a.bf-btn--ghost:hover{border-color:var(--bf-on-ink)}
.home-head--top{align-items:start}
