.csl{max-width:46rem;font-size:var(--t-body);--cone-l:var(--lesson);--cone-m:var(--vid);--cone-s:var(--accent);--tone:var(--civics-accent);--hue:var(--ink);line-height:1.6}.csl .filters{position:absolute}.csl p{margin:.7rem 0}.csl h1{font-size:var(--t-display);letter-spacing:-.02em;font-weight:700;line-height:1.1}.csl h2{font-size:var(--t-h2);letter-spacing:-.01em;font-weight:700}.csl h3{font-size:var(--t-h3);margin-top:1.4rem;font-weight:700}.csl .tc-panel{font-size:var(--t-body);margin:1rem 0}.csl .tc-panel>h3:first-child{margin-top:0}.csl .muted{color:var(--ink-2)}.csl .after-h{margin-top:.2rem}.csl .small{font-size:var(--t-ui);margin:0}.csl button{min-height:44px}.csl button:disabled,.csl button[aria-disabled=true]{opacity:.45;cursor:default}.csl .row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.csl .row.spaced{margin-top:.8rem}.csl .row.between{justify-content:space-between}.csl details{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);margin:.8rem 0;padding:.6rem .9rem}.csl summary{cursor:pointer;font-family:var(--font-sans);font-weight:700}.csl-hero h1{margin:0 0 6px}.csl-hero .sub{max-width:36rem;color:var(--ink-2);margin:.7rem 0}.csl-hero a{text-decoration:underline}.csl .cones{gap:.35rem;margin:0 0 14px;display:flex}.csl .cones span{border-radius:1rem;flex:1;height:.55rem}.csl .cones .l{background:var(--cone-l)}.csl .cones .m{background:var(--cone-m)}.csl .cones .s{background:var(--cone-s)}.csl .cones .t{background:var(--tone)}.csl .plan{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);margin:1.2rem 0 0;padding:.9rem 1.1rem}.csl .plan strong{font-family:var(--font-sans)}.csl .plan ol{margin:.3rem 0 0;padding-left:1.3rem}.csl .plan li{margin:.15rem 0}.csl .station{scroll-margin-top:calc(var(--tc-header-h) + 16px);margin-top:3rem}.csl .station[data-hue=l]{--hue:var(--cone-l)}.csl .station[data-hue=m]{--hue:var(--cone-m)}.csl .station[data-hue=s]{--hue:var(--cone-s)}.csl .station[data-hue=t]{--hue:var(--tone)}.csl .station-head{border-bottom:3px solid var(--hue);align-items:baseline;gap:.8rem;padding-bottom:.5rem;display:flex}.csl .num{font-family:var(--font-sans);font-weight:800;font-size:var(--t-display);color:var(--hue);line-height:1}.csl .notes{background:var(--surface);border-left:5px solid var(--hue);border-radius:0 var(--r-md) var(--r-md) 0;margin:1rem 0;padding:.8rem 1.1rem}.csl .notes p:first-child{margin-top:0}.csl .notes p:last-child{margin-bottom:0}.csl .trap{font-size:var(--t-ui);background:color-mix(in srgb, var(--lesson) 14%, var(--surface));border-radius:var(--r-md);margin:.9rem 0;padding:.6rem .9rem}.csl .trap.near{margin-top:.4rem}.csl .trap b{color:var(--lesson)}.csl .stage{background:var(--chrome-bg);color:var(--chrome-ink);border-radius:var(--r);padding:1rem;position:relative;overflow:hidden}.csl .stage-view{aspect-ratio:19/10;border-radius:var(--r-md);background:#fff;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.csl .stage-view svg{width:100%;height:100%;display:block}.csl .fix{background:#000;border-radius:50%;width:12px;height:12px;margin:-6px 0 0 -6px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 3px #fff}.csl .stage .count{font-family:var(--font-mono);font-weight:700;font-size:var(--t-h2);min-width:3ch}.csl .stage .msg{color:var(--chrome-ink-muted);font-size:var(--t-ui);margin:.6rem 0 0}.csl .stage button.primary{background:var(--chrome-ink);color:var(--chrome-bg)}.csl .stage button:focus-visible{outline-color:var(--chrome-ink)}.csl .mixer{grid-template-columns:1fr;gap:1rem;display:grid}@media (width>=600px){.csl .mixer{grid-template-columns:1fr 11rem}}.csl .slider{grid-template-columns:7.5rem 1fr 2.6rem;align-items:center;gap:.6rem;margin:.5rem 0;display:grid}.csl .slider label{font-family:var(--font-sans);font-weight:700}.csl .slider output{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-2)}.csl input[type=range]{width:100%}.csl .slider.l input{accent-color:var(--cone-l)}.csl .slider.m input{accent-color:var(--cone-m)}.csl .slider.s input{accent-color:var(--cone-s)}.csl input.tone{accent-color:var(--tone)}.csl .swatch{border-radius:var(--r);border:1px solid var(--rule);min-height:9rem;font-family:var(--font-sans);font-size:var(--t-code);align-items:flex-end;padding:.6rem;display:flex}.csl .swatch span,.csl .sim-grid span{background:color-mix(in srgb, var(--field) 85%, transparent);color:var(--ink);border-radius:var(--r-sm);padding:.1rem .45rem}.csl .challenges{flex-wrap:wrap;gap:.4rem;margin-top:.4rem;display:flex}.csl .challenges button,.csl .presets button{font-size:var(--t-ui);min-height:38px;padding:.35rem .8rem}.csl .fb{font-size:var(--t-ui);margin:.6rem 0 0}.csl .fb.ok{color:var(--cool)}.csl .fb.no{color:var(--lesson)}.csl .stages{grid-template-columns:1fr;gap:.6rem;margin:1rem 0;display:grid}@media (width>=600px){.csl .stages{grid-template-columns:1fr 1fr}}.csl .stagebox{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);padding:.8rem 1rem}.csl .stagebox h3{margin:0 0 .3rem}.csl .stagebox p{margin:.2rem 0}.csl .pair{font-family:var(--font-sans);align-items:center;gap:.5rem;margin:.3rem 0;font-weight:700;display:flex}.csl .pair i{border:1px solid var(--rule);border-radius:50%;width:1.4rem;height:1.4rem;display:inline-block}.csl #simPanel h3{margin:0}.csl .sim-grid{grid-template-columns:repeat(4,1fr);gap:.5rem;margin:.8rem 0;display:grid}.csl .sim-grid div{aspect-ratio:1;border-radius:var(--r-md);font-family:var(--font-sans);font-size:var(--t-meta);text-align:center;justify-content:center;align-items:flex-end;padding:.25rem;display:flex}.csl .sim-on .sim-grid{filter:url(#deutan)}.csl .path{counter-reset:p;flex-direction:column;gap:.35rem;margin:1rem 0;padding:0;list-style:none;display:flex}.csl .path li{counter-increment:p;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-md);padding:.5rem .8rem .5rem 2.6rem;position:relative}.csl .path li:before{content:counter(p);font-family:var(--font-sans);color:var(--hue);font-weight:800;position:absolute;top:.5rem;left:.75rem}.csl .path small{color:var(--ink-2);line-height:1.4;display:block}.csl .tone-readout{font-family:var(--font-sans);font-weight:800;font-size:var(--t-display);color:var(--tone);font-variant-numeric:tabular-nums;line-height:1}.csl .presets{flex-wrap:wrap;gap:.4rem;margin:.8rem 0;display:flex}.csl .presets button[aria-pressed=true]{background:var(--tone);border-color:var(--tone);color:var(--on-solid)}.csl .tone-note{color:var(--ink-2);font-size:var(--t-ui)}.csl .fig{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);margin:1rem 0;padding:.8rem}.csl .fig-scroll{overflow-x:auto}.csl .fig svg{width:100%;min-width:640px;height:auto;display:block}.csl .fig figcaption{color:var(--ink-2);font-size:var(--t-ui);margin-top:.5rem}.csl .fig text{fill:var(--ink);font-family:var(--font-sans);font-size:var(--t-ui)}.csl .fig .q{fill:var(--ink-2);font-size:var(--t-code)}.csl .fig .b{font-weight:700}.csl .fig .ln{fill:none;stroke:var(--ink-2);stroke-width:1.5px}.csl .fig .lead{stroke:var(--ink-2);stroke-width:1px;stroke-dasharray:3 3}.csl .fig .rule{stroke:var(--rule)}.csl .fig .band{fill:var(--paper)}.csl .fig .mem{fill:var(--paper);stroke:var(--ink-2);stroke-width:1.25px}.csl .quiz .q{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);margin:.9rem 0;padding:1rem}.csl .q p.stem{font-family:var(--font-sans);margin-top:0;font-weight:700}.csl .opts{flex-direction:column;gap:.4rem;display:flex}.csl .opts button{font:inherit;text-align:left;cursor:pointer;background:var(--field);color:var(--ink);border:2px solid var(--rule);border-radius:var(--r-md);padding:.55rem .8rem}.csl .opts button.right{border-color:var(--cool);background:var(--cool-soft)}.csl .opts button.wrong{border-color:var(--lesson);background:color-mix(in srgb, var(--lesson) 14%, var(--surface))}.csl .score{font-family:var(--font-sans);color:var(--ink-2);font-weight:700}.csl .done-row{font-family:var(--font-sans);color:var(--ink-2);align-items:center;gap:.6rem;margin-top:1.2rem;display:flex}.csl .done-row input{width:1.4rem;height:1.4rem;accent-color:var(--cool);flex:none}.csl .exit{background:var(--ink);color:var(--page);border-radius:var(--r);margin-top:3rem;padding:1.2rem}.csl .exit h2{color:var(--page)}.csl-foot{font-family:var(--font-sans);font-size:var(--t-ui);color:var(--ink-2);margin:2rem 0 0}@media (prefers-reduced-motion:reduce){.csl *{transition:none!important;animation:none!important}}
