@import url('https://api.fontshare.com/v2/css?f[]=general-sans@400,500,600,700&display=swap');
:root,[data-theme=light]{--bg:oklch(97.5% .008 80);--surface:oklch(100% 0 0);--soft:oklch(94.5% .014 245);--ink:oklch(25% .04 248);--muted:oklch(47% .025 250);--line:oklch(25% .04 248 / .13);--accent:oklch(40% .10 250);--onaccent:oklch(100% 0 0);--shadow:0 12px 40px oklch(25% .04 248 / .06);--font-body:'General Sans',sans-serif;--font-display:'General Sans',sans-serif;--text-xs:clamp(.75rem,.72rem + .15vw,.82rem);--text-sm:clamp(.875rem,.83rem + .2vw,.95rem);--text-base:clamp(1rem,.97rem + .15vw,1.06rem);--text-lg:clamp(1.125rem,1rem + .6vw,1.4rem);--text-xl:clamp(1.5rem,1.2rem + 1.2vw,2.15rem);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--r-sm:6px;--r-md:12px;--r-lg:20px}
[data-theme=dark]{--bg:oklch(19% .018 250);--surface:oklch(23% .023 250);--soft:oklch(28% .034 250);--ink:oklch(94% .01 80);--muted:oklch(74% .018 245);--line:oklch(94% .01 80 / .16);--accent:oklch(80% .08 245);--onaccent:oklch(20% .03 250);--shadow:0 12px 40px oklch(10% .02 248 / .15)}
body{font-family:var(--font-body);font-size:var(--text-base);background:var(--bg);color:var(--ink)}.shell{max-width:1280px;margin:auto;padding-inline:var(--space-8)}header{min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);border-bottom:1px solid var(--line)}.brand{border:0;background:none;padding:var(--space-2) 0;display:flex;align-items:center;gap:var(--space-3);color:var(--ink);font-size:var(--text-lg);font-weight:600}.brand svg{width:32px;height:32px}.brand small{display:block;font-size:var(--text-xs);font-weight:400;color:var(--muted);text-align:left}.nav{display:flex;gap:var(--space-2);align-items:center}.nav button,.quiet{border:0;background:transparent;color:var(--muted);padding:var(--space-3);font-size:var(--text-sm)}.nav button:hover,.quiet:hover{color:var(--ink);background:var(--soft);border-radius:var(--r-sm)}.nav .selected{color:var(--ink);font-weight:600}.theme{font-size:var(--text-lg)!important;width:44px;padding:0!important}.preview-bar{display:flex;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-4);color:var(--muted);font-size:var(--text-xs)}.preview-bar span:first-child{font-weight:600;letter-spacing:.06em;text-transform:uppercase}.main{padding-block:var(--space-8);min-height:640px}.eyebrow{font-size:var(--text-xs);letter-spacing:.11em;text-transform:uppercase;font-weight:600;color:var(--muted);margin-bottom:var(--space-4)}h1{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;line-height:1.25;letter-spacing:-.035em}h2{font-size:var(--text-lg);line-height:1.35;font-weight:600;letter-spacing:-.02em}h3{font-size:var(--text-base);font-weight:600}.muted,.sub{color:var(--muted)}.sub{margin-top:var(--space-4);max-width:58ch}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--space-16);align-items:center;padding-block:var(--space-8) var(--space-12)}.hero h1{max-width:19ch}.askform{margin-top:var(--space-8)}label{display:block;font-size:var(--text-sm);font-weight:500;margin-bottom:var(--space-2)}.inputrow{display:flex;gap:var(--space-2);padding:var(--space-2);border:1px solid var(--line);background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow)}input,textarea{min-width:0;max-width:100%;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--space-3);font-size:var(--text-base)}.inputrow input{border:0;flex:1}.btn{padding:var(--space-3) var(--space-5);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:var(--text-sm);font-weight:500;transition:background .15s,transform .15s}.btn:hover{background:var(--soft)}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--accent);color:var(--onaccent);border-color:var(--accent)}.btn.primary:hover{filter:brightness(.93)}.micro{font-size:var(--text-xs);color:var(--muted);line-height:1.6}.askform .micro{margin-top:var(--space-3)}.actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}.editorial{background:var(--soft);padding:var(--space-8);border-radius:var(--r-lg)}.big-index{font-size:var(--text-xl);font-weight:500;letter-spacing:-.04em}.rule{height:1px;background:var(--line);margin-block:var(--space-6)}.editorial p{font-size:var(--text-sm)}.section-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding-block:var(--space-6);border-top:1px solid var(--line)}.lesson-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.lesson-item{padding:var(--space-6);border:1px solid var(--line);background:var(--surface);text-align:left;border-radius:var(--r-md);color:var(--ink);display:grid;grid-template-columns:1fr auto;gap:var(--space-4)}.lesson-item:hover{border-color:var(--accent)}.lesson-item h3{margin-bottom:var(--space-2)}.lesson-item .micro{grid-column:1}.arrow{grid-column:2;grid-row:1/3;align-self:center;font-size:var(--text-lg)}.notice{padding:var(--space-4);background:var(--soft);border-radius:var(--r-sm);margin-top:var(--space-4);font-size:var(--text-sm);line-height:1.6}.breadcrumb{display:flex;gap:var(--space-3);align-items:center;font-size:var(--text-sm);color:var(--muted);margin-bottom:var(--space-6)}.breadcrumb button{padding:0;background:none;border:0;color:var(--muted)}.lesson-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-8)}.lesson-head .sub{margin-top:var(--space-2)}.badge{white-space:nowrap;font-size:var(--text-xs);padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--r-sm)}.lesson-grid{display:grid;grid-template-columns:235px minmax(0,1fr);gap:var(--space-8)}.stepnav{display:flex;flex-direction:column;gap:var(--space-2)}.stepnav button{display:flex;align-items:center;gap:var(--space-3);background:transparent;border:0;border-radius:var(--r-sm);color:var(--muted);padding:var(--space-3);text-align:left;font-size:var(--text-sm)}.stepnav button.active{background:var(--soft);color:var(--ink);font-weight:600}.step-number{font-variant-numeric:tabular-nums;font-size:var(--text-xs);width:20px;flex:none}.side-note{margin-top:var(--space-8);padding:var(--space-4);font-size:var(--text-sm);color:var(--muted);border-top:1px solid var(--line)}.stage{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}.stage-meta{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--line);font-size:var(--text-xs);color:var(--muted)}.stage-body{padding:var(--space-8);min-height:310px}.stage-body h2{font-size:var(--text-xl);margin-bottom:var(--space-4)}.stage-body p{max-width:64ch}.cue{margin-block:var(--space-6);padding:var(--space-5);background:var(--soft);border-radius:var(--r-md);font-size:var(--text-lg);font-weight:500;line-height:1.5;overflow-wrap:anywhere}.practice{display:flex;gap:var(--space-3);align-items:flex-start;color:var(--muted);font-size:var(--text-sm)}.practice strong{white-space:nowrap;color:var(--ink)}.stage-controls{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);border-top:1px solid var(--line)}.progress{height:3px;background:var(--line)}.progress span{display:block;height:100%;background:var(--accent);transition:width .2s}.below-stage{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);margin-top:var(--space-6)}.below-stage p{font-size:var(--text-sm)}audio{width:100%;height:40px;margin-top:var(--space-3)}.source{display:inline-block;font-size:var(--text-xs);color:var(--muted);padding-block:var(--space-3);min-height:44px}.source:hover{color:var(--accent)}.centered{max-width:750px;margin:var(--space-8) auto}.completion{padding:var(--space-10);border:1px solid var(--line);background:var(--surface);border-radius:var(--r-lg)}.completion h1{margin-bottom:var(--space-4)}.completion .actions{margin-top:var(--space-8)}.nextlesson{margin-top:var(--space-8);padding:var(--space-6);border-radius:var(--r-md);background:var(--soft)}.nextlesson p{margin-top:var(--space-3)}.sponsor{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-3);margin-top:var(--space-8);padding-top:var(--space-4);border-top:1px solid var(--line);font-size:var(--text-xs);color:var(--muted)}.sponsor strong{font-weight:500;letter-spacing:.05em}.modalback{position:fixed;inset:0;background:oklch(15% .02 250 / .45);display:grid;place-items:center;z-index:30;padding:var(--space-4)}.modal{max-width:640px;width:100%;max-height:90dvh;overflow:auto;background:var(--surface);border-radius:var(--r-lg);padding:var(--space-8);box-shadow:var(--shadow)}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5)}.modal h2{margin:0}.modal .choice{display:block;width:100%;text-align:left;margin-top:var(--space-3)}.modal p{font-size:var(--text-sm)}.modal ol{padding-left:var(--space-6);font-size:var(--text-sm);line-height:1.8}.modal input,.modal textarea{width:100%;margin-block:var(--space-3);font-size:var(--text-sm)}.modal textarea{min-height:140px}.owner-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);margin-top:var(--space-8)}.panel{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--space-6);background:var(--surface)}.panel h2{margin-bottom:var(--space-4)}.panel p,.panel li{font-size:var(--text-sm);line-height:1.65}.panel ul,.panel ol{padding-left:var(--space-5)}.signal{display:flex;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3);border-bottom:1px solid var(--line);font-size:var(--text-sm)}.signal b{font-variant-numeric:tabular-nums}.eventlist{font-size:var(--text-xs);color:var(--muted);max-height:220px;overflow:auto}.eventrow{padding-block:var(--space-2);border-bottom:1px solid var(--line)}footer{display:flex;justify-content:space-between;gap:var(--space-6);padding-block:var(--space-6);border-top:1px solid var(--line);font-size:var(--text-xs);color:var(--muted)}footer a{min-height:44px;display:inline-flex;align-items:center}footer p{max-width:70ch;font-size:var(--text-xs)}.footerlinks{display:flex;gap:var(--space-4);flex-wrap:wrap}.screen-enter{animation:appear .18s ease-out}@keyframes appear{from{opacity:.3;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:800px){.shell{padding-inline:var(--space-5)}header{min-height:84px}.hero{gap:var(--space-8);grid-template-columns:1fr;padding-top:var(--space-4)}.editorial{padding:var(--space-6)}.lesson-grid{grid-template-columns:1fr}.stepnav{flex-direction:row;overflow:auto;padding-bottom:var(--space-2)}.stepnav button{white-space:nowrap}.side-note{display:none}.owner-layout{grid-template-columns:1fr}.main{padding-top:var(--space-4)}.below-stage{grid-template-columns:1fr}.nav{gap:0}.nav button{padding:var(--space-2)}.preview-bar span:last-child{display:none}}
@media(max-width:480px){.brand{font-size:var(--text-base)}.brand small{font-size:var(--text-xs)}.brand svg{width:26px}.nav .lessons-nav{display:none}.hero{padding-bottom:var(--space-8)}.lesson-list{grid-template-columns:1fr}.inputrow{flex-wrap:wrap}.inputrow .primary{width:100%}.inputrow input{width:100%;min-height:44px}.lesson-head{display:block}.badge{display:inline-block;margin-top:var(--space-3)}.stage-body{padding:var(--space-5);min-height:330px}.stage-meta,.stage-controls{padding:var(--space-4)}.stage-controls{flex-wrap:wrap}.stage-controls .quiet{order:3;width:100%}.cue{font-size:var(--text-base)}.practice{display:block}.practice strong{display:block;margin-bottom:var(--space-2)}.completion{padding:var(--space-6)}.completion .actions{flex-direction:column}.completion .actions button{width:100%}.modal{padding:var(--space-5)}footer{display:block}.section-head{align-items:flex-start}.stage-meta span:last-child{display:none}.main{min-height:500px}}
@media(max-width:800px){.hero,.lesson-grid,.below-stage,.owner-layout{grid-template-columns:minmax(0,1fr)}.lesson-grid>*,.owner-layout>*,.below-stage>*{min-width:0}}