:root{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:32px;--s6:48px;--s7:64px;--s8:96px;--paper:#f6f5f0;--white:#fffefa;--ink:#182a33;--muted:#56616a;--line:#d5d8d3;--accent:#cf4c23;--accent-dark:#a93816;--blue:#326a9a;--rust:#a75336;--radius-sm:4px;--radius-md:8px;--shadow-1:0 4px 16px #182a330c;color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{margin:0;overflow-x:hidden}button,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{cursor:default}button:active{background-color:#e4e7e1;transform:translateY(1px)}a{color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}h1,h2,h3,p,figure{margin:0}h1{letter-spacing:-.045em;max-width:18ch;font-size:clamp(2rem,5.5vw,3.25rem);font-weight:700;line-height:1.06}h2{letter-spacing:-.025em;font-size:1.5rem;line-height:1.2}h3{font-size:1.125rem;line-height:1.3}p{max-width:62ch}button{border-radius:var(--radius-sm);border:1px solid var(--line);min-height:44px;padding:var(--s2) var(--s3);background:0 0;font-weight:600}button:hover{border-color:var(--ink)}button:disabled{opacity:.6}.topbar{background:var(--ink);color:var(--white);padding:calc(var(--s3) + var(--sat)) max(clamp(20px,5vw,48px),var(--sal)) var(--s3);justify-content:space-between;align-items:center;gap:var(--s3);display:flex}.brand{letter-spacing:-.04em;font-size:1.125rem;font-weight:800;line-height:1.05}.brand span{display:block}.topbar .meta{color:#ced7d8}.topbar button{color:var(--white);border-color:#64727a;font-size:.875rem}.topbar button:active{background:#394a53}.layout{max-width:1200px;padding:var(--s5) max(clamp(20px,5vw,48px),var(--sal)) calc(var(--s7) + var(--sab));margin:auto}.lesson-intro{justify-content:space-between;align-items:flex-start;gap:var(--s4);margin-bottom:var(--s4);display:flex}.kicker,.meta{font-size:.75rem;font-weight:600;line-height:1.4}.kicker{color:var(--muted);margin-bottom:var(--s2)}.lesson-number{white-space:nowrap;color:var(--muted);padding-top:var(--s2);font-size:.75rem}.objective{margin-top:var(--s3);color:var(--muted);max-width:48ch;font-size:1rem}.play-layout{gap:var(--s5);grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);align-items:start;display:grid}.position-column,.decision-column{min-width:0}.position-figure{border-radius:var(--radius-md);background:#e7e9e3;border:1px solid #d4d8d1;position:relative;overflow:hidden}.media-stage{aspect-ratio:4/3;background:#e9ebe5;place-items:center;display:grid;position:relative}.media-stage img{object-fit:contain;width:100%;height:100%;display:block;position:absolute;inset:0}.media-loading{color:var(--muted);padding:var(--s4);text-align:center;font-size:.875rem}.media-stage.loaded .media-loading{display:none}.media-stage.failed{aspect-ratio:4/3;min-height:300px;padding:var(--s3);flex-direction:column;justify-content:center;display:flex;overflow:auto}.media-stage.failed .media-loading{padding:var(--s2);font-size:.8125rem}.media-stage.failed .button-row{margin-top:var(--s2)}.media-stage.failed img{display:none}.media-stage.failed .media-loading{display:block}.position-figure figcaption{padding:var(--s3);justify-content:space-between;gap:var(--s3);background:var(--white);color:var(--muted);border-top:1px solid var(--line);align-items:center;font-size:.75rem;display:flex}.development-label{color:#44534e;white-space:nowrap;background:#e3e5dd;border-radius:3px;padding:4px 8px;font-size:.6875rem;font-weight:700}.player-key{gap:var(--s3);margin:var(--s3) 0;color:var(--muted);flex-wrap:wrap;font-size:.75rem;display:flex}.player-key span{align-items:center;gap:var(--s2);display:flex}.swatch{background:var(--blue);border:1px solid var(--ink);border-radius:3px;width:16px;height:16px;display:inline-block}.swatch.player{background:repeating-linear-gradient(135deg,var(--blue) 0 4px,#d4e5ee 4px 6px)}.swatch.opponent{background-color:var(--rust);background-image:radial-gradient(#f0d5c6 1px,#0000 1px);background-size:5px 5px}.inspect{text-align:left;background:0 0;width:100%;font-size:.875rem}.inspect[aria-expanded=true]{background:#e7e9e3}.inspection{padding:var(--s3) 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.9375rem}.decision-column{padding-top:var(--s1)}.state-heading{justify-content:space-between;align-items:center;gap:var(--s3);margin-bottom:var(--s3);display:flex}.state-heading .meta{color:var(--muted)}.state-description{margin-top:var(--s2);color:var(--muted);font-size:.9375rem}.prompt{margin-top:var(--s5);margin-bottom:var(--s3);font-size:1.125rem}.actions{gap:var(--s2);display:grid}.choice{gap:var(--s3);text-align:left;background:var(--white);width:100%;padding:var(--s3);grid-template-columns:24px 1fr;align-items:center;min-height:76px;font-size:1rem;font-weight:600;line-height:1.4;display:grid}.choice-letter{width:24px;height:24px;color:var(--muted);border:1px solid #b6beb9;border-radius:50%;place-items:center;font-size:.75rem;display:grid}.choice.selected{border:2px solid var(--ink);background:#e9ede7;padding:15px}.choice.selected .choice-letter{background:var(--ink);color:#fff;border-color:var(--ink)}.response{margin-top:var(--s4);padding-top:var(--s4);border-top:2px solid var(--ink)}.response h3{margin:var(--s2) 0}.response p{font-size:.9375rem}.response .rationale{color:var(--muted);margin-top:var(--s2)}.primary{background:var(--accent);border-color:var(--accent);color:#fff;width:100%;min-height:52px;margin-top:var(--s4)}.primary:hover{background:var(--accent-dark);border-color:var(--accent-dark)}.primary:active{background:var(--accent-dark)}.quiet-note{color:var(--muted);margin-top:var(--s3);font-size:.75rem}.sequence-section{border-top:1px solid var(--line);margin-top:var(--s6);padding-top:var(--s4)}.section-heading{justify-content:space-between;align-items:center;gap:var(--s3);margin-bottom:var(--s3);display:flex}.section-heading h2{font-size:1.125rem}.text-button{min-height:44px;padding:var(--s2);text-underline-offset:4px;border-color:#0000;font-size:.8125rem;text-decoration:underline}.timeline{gap:var(--s2);margin:0;padding:0;list-style:none;display:grid}.timeline li{gap:var(--s2);grid-template-columns:28px minmax(0,1fr) auto;align-items:center;font-size:.875rem;display:grid}.timeline-index{color:var(--muted);font-size:.75rem}.timeline button{font-size:.75rem}.empty-sequence{color:var(--muted);font-size:.875rem}.end-cue{border-top:1px solid var(--line);margin-top:var(--s4);padding-top:var(--s4)}.end-cue p{margin-top:var(--s2)}.button-row{gap:var(--s2);margin-top:var(--s3);flex-wrap:wrap;display:flex}.button-row button{flex:1}.pack-panel{margin-top:var(--s6);border-top:2px solid var(--ink);padding-top:var(--s4)}.pack-items{gap:var(--s3);margin-top:var(--s3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.pack-item{text-align:left;padding:var(--s3);background:0 0;min-height:116px;display:block}.pack-item[aria-current=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.pack-item .meta{margin-bottom:var(--s2);color:var(--muted);display:block}.pack-item[aria-current=true] .meta{color:#cbd4d4}.pack-item strong{font-size:1rem;line-height:1.3;display:block}.pack-item:active{background:#dfe4de}.storage-message{color:var(--muted);padding-top:var(--s4);margin-top:var(--s4);border-top:1px solid var(--line);font-size:.75rem}.notice{padding:var(--s3);margin-bottom:var(--s4);background:#ebe5d9;border:1px solid #bfb59d;font-size:.875rem}dialog{border:1px solid var(--line);border-radius:var(--radius-md);width:min(680px,100% - 32px);max-height:calc(100dvh - 48px);padding:var(--s4);background:var(--paper);color:var(--ink)}dialog::backdrop{background:#12232bc0}.dialog-heading{justify-content:space-between;align-items:center;gap:var(--s3);margin-bottom:var(--s4);display:flex}.comparison{gap:var(--s4);display:grid}.comparison figure img{aspect-ratio:4/3;object-fit:contain;background:#e7e9e3;width:100%;display:block}.comparison figcaption{padding-top:var(--s2);font-size:.875rem}.comparison figcaption strong{display:block}.saved-branches{margin-top:var(--s4);gap:var(--s2);display:grid}.branch-button{text-align:left;font-size:.875rem}.boot-message{padding:48px 24px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}::view-transition-old(root){animation-duration:.18s}::view-transition-new(root){animation-duration:.18s}@media (width<=760px){.layout{padding-top:var(--s4)}.play-layout{gap:var(--s4);grid-template-columns:minmax(0,1fr)}.lesson-intro{margin-bottom:var(--s4)}h1{font-size:2.125rem}.objective{font-size:.9375rem}.decision-column{padding-top:0}.state-heading{margin-bottom:var(--s2)}.prompt{margin-top:var(--s4)}.media-stage{aspect-ratio:4/3}.pack-items{grid-template-columns:1fr}.pack-item{min-height:88px}.sequence-section,.pack-panel{margin-top:var(--s5)}.topbar .meta{display:none}.lesson-number{font-size:.6875rem}.position-figure figcaption{align-items:flex-start}.timeline li{grid-template-columns:20px minmax(0,1fr) auto}.timeline button{padding:var(--s2)}.brand{font-size:1rem}}@media (width>=761px){.lesson-intro{margin-bottom:var(--s5)}.position-column{top:var(--s4);position:sticky}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}::view-transition-old(root){animation:none!important}::view-transition-new(root){animation:none!important}}@media (forced-colors:active){button,.position-figure,.choice-letter{border:1px solid buttontext}.primary,.pack-item[aria-current=true]{color:highlighttext;background:highlight}.swatch{forced-color-adjust:none}}.media-stage.failed{aspect-ratio:auto;overflow-wrap:anywhere;align-items:stretch;min-width:0;height:auto;min-height:clamp(220px,55vw,360px);overflow:visible}.media-stage.failed .media-loading{text-align:left;max-width:100%}.media-stage.failed .button-row{flex-wrap:wrap;width:100%;min-width:0}.media-stage.failed .button-row button{white-space:normal;overflow-wrap:anywhere;flex:10rem;min-width:0}.position-figure figcaption{flex-wrap:wrap;align-items:start}.position-figure figcaption>span:first-child{flex:11rem;min-width:0}.development-label{white-space:normal;overflow-wrap:anywhere;max-width:100%}.choice{grid-template-columns:auto minmax(0,1fr)}.choice-letter{width:1.65em;min-width:1.65em;height:1.65em;font-size:.875em;line-height:1}.explored-label{color:var(--muted);grid-column:2;font-size:.75rem;font-weight:500}.choice.explored{background:#e9ece6}.comparison-tabs{gap:var(--s2);margin-bottom:var(--s3);display:flex}.comparison-tabs button{flex:1}.comparison-tabs [aria-pressed=true]{background:var(--ink);color:var(--white);border-color:var(--ink)}.comparison-viewport .position-figure{margin-bottom:var(--s3)}.stacked-comparison{border-top:1px solid var(--line);padding-top:var(--s3)}summary{cursor:pointer;min-height:44px;padding:var(--s2) 0}.stacked-comparison section{margin-top:var(--s4)}.section-heading,.state-heading{flex-wrap:wrap}.state-heading .meta{white-space:normal}.topbar{flex-wrap:wrap}.topbar button{max-width:100%}.lesson-number{white-space:normal}.lesson-intro{gap:var(--s3)}.media-stage{aspect-ratio:3/2}.media-stage img{object-fit:contain}.objective{margin-top:var(--s2)}.layout{padding-top:var(--s4)}.lesson-intro{margin-bottom:var(--s3)}h1{max-width:24ch;font-size:clamp(1.75rem,5vw,2.5rem)}.kicker{font-size:.6875rem}.inspection p+p{margin-top:var(--s3)}@media (width<=760px){.lesson-intro{margin-bottom:var(--s3)}h1{font-size:1.75rem;line-height:1.12}.objective{font-size:.875rem}.play-layout{gap:var(--s3)}.player-key{gap:var(--s2) var(--s3);margin:var(--s2) 0}.position-column>.inspect{width:auto;display:inline-block}.position-column>.text-button{margin-left:var(--s2)}.prompt{margin-top:var(--s3)}.choice{min-height:68px}.comparison-viewport h3{margin-top:var(--s3)}}.position-figure figcaption{gap:var(--s2);padding:12px;font-size:.75rem}.position-figure figcaption>span:first-child{flex:7rem}.development-label{flex:0 auto}.lesson-number{flex-shrink:0}.section-heading .button-row{margin-top:0}.section-heading .button-row button{flex:none}.comparison-viewport{min-width:0}.comparison-viewport h3{overflow-wrap:anywhere}.stacked-comparison summary{list-style-position:inside}.offline-panel{border-top:1px solid var(--line);margin-top:var(--s5);padding-top:var(--s4)}.offline-panel h2{font-size:1.125rem}.offline-panel .button-row{max-width:28rem}.offline-panel progress{width:100%;max-width:28rem;height:12px;margin-top:var(--s3);accent-color:var(--accent);display:block}.save-status{color:var(--muted);margin-bottom:var(--s3);font-size:.75rem}.save-status p{margin:0}.save-status.save-warning{padding:var(--s3);color:var(--ink);background:#f0e8d9;border:1px solid #a69777;font-size:.875rem}.save-status button{margin-top:var(--s2);background:var(--white)}.media-readiness{padding:var(--s3);margin-bottom:var(--s3);background:#e8ece7;font-size:.875rem}.next-lesson{width:100%;margin-top:var(--s3);min-height:48px}.record-link{min-height:44px;padding:var(--s2);text-underline-offset:4px;display:block}.preserved-exchange{padding:var(--s3);border:1px solid var(--line);font-size:.875rem}.preserved-exchange h3{margin-bottom:var(--s2)}@media (width<=760px){.topbar{padding-top:calc(12px + var(--sat));padding-bottom:12px}.layout{padding-top:var(--s3)}h1{max-width:26ch;font-size:1.5rem}.lesson-intro{margin-bottom:var(--s3)}.objective{font-size:.8125rem}.media-stage{aspect-ratio:1.9}.position-figure figcaption{padding:8px 12px}.player-key{column-gap:var(--s2);font-size:.6875rem}.position-column>.inspect,.position-column>.text-button{padding-left:var(--s2);padding-right:var(--s2);font-size:.8125rem}.state-heading h2{font-size:1.25rem}.save-status{margin-bottom:var(--s2)}.state-description{font-size:.875rem}.choice{min-height:64px;padding:12px;font-size:.9375rem}.prompt{margin-top:var(--s3);margin-bottom:var(--s2);font-size:1rem}}.backup-controls{padding-bottom:var(--s4);margin-bottom:var(--s2);border-bottom:1px solid var(--line)}.objective,.quiet-note,.player-key,.media-stage.failed .media-loading{font-size:.875rem}.kicker,.development-label,.lesson-number{font-size:.75rem}@media (width<=760px){.objective,.player-key,.position-column>.inspect,.position-column>.text-button{font-size:.875rem}.kicker,.development-label{font-size:.75rem}}dialog{scroll-padding-top:calc(var(--dialog-header-height,96px) + var(--s3));padding-top:0}.dialog-heading{z-index:3;background:var(--paper);padding:calc(var(--s4) + var(--s2)) 0 var(--s3);border-bottom:1px solid var(--line);flex-wrap:wrap;position:sticky;top:0}.dialog-heading h2{overflow-wrap:anywhere;flex:12rem;min-width:0}.dialog-heading button{white-space:normal;overflow-wrap:anywhere;flex:none;max-width:100%}
