:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--warm-white:#fafaf9;--white:#fff;--ink:#171717;--ink-soft:#4f4a47;--tan:tan;--tan-line:#bfa073;--line:#e2ded6;--brick:#8b3a3a;--brick-deep:#6d2d2d;--forest:#567d46;--forest-deep:#416034;--terra:#e2725b;--stone:#92a6c1;--stone-line:#788fae;--stone-deep:#667487;--brick-ground:#833737;--brick-tint:#ddc8c7;--forest-ground:#405d34;--forest-tint:#c6d2c0;--terra-line:#cb5841;--terra-deep:#ac5745;--sky:#87ceeb;--sky-line:#71adc6;--accent-keep-time:var(--brick);--accent-read-build-rhythm:var(--forest);--accent-train-your-hands:var(--terra);--accent-learn-the-instruments:var(--tan);--display:"Big Shoulders Display", "Barlow Condensed", Oswald, Impact, sans-serif;--body:"Barlow Condensed", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--warm-white:#171717;--white:#232320;--ink:#fafaf9;--ink-soft:#bdb6ad;--tan:#2e2c28;--tan-line:#3a3733;--line:#3a3733;--brick:#e2725b;--brick-deep:#8b3a3a;--forest:#7ca368;--forest-deep:#7ca368;--terra:#e2725b;--stone:#92a6c1;--stone-line:#667487;--stone-deep:#92a6c1;--brick-ground:#833737;--brick-tint:#ddc8c7;--forest-ground:#405d34;--forest-tint:#c6d2c0;--terra-line:#cb5841;--terra-deep:#ac5745;--sky:#0a303f;--sky-line:#0d3c4e}}body{color:var(--ink);background:var(--warm-white);font-family:var(--body);margin:0}h1,h2,h3{font-family:var(--display);font-weight:800}:focus-visible{outline:3px solid var(--forest);outline-offset:3px}@font-face{font-family:Big Shoulders Display;font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/big-shoulders-display-800-latin.woff2)format("woff2")}@font-face{font-family:Barlow Condensed;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/barlow-condensed-400-latin.woff2)format("woff2")}@font-face{font-family:Barlow Condensed;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-condensed-600-latin.woff2)format("woff2")}@font-face{font-family:Barlow Condensed;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-condensed-700-latin.woff2)format("woff2")}:root{--accent:var(--accent-read-build-rhythm);--tan-soft:#e8dbc8;--forest-light:#7ca368;--forest-wash:#cfe1d4;--on-ink:var(--warm-white);--on-ink-muted:#bdb6ad;--on-ink-accent:#7ca368;--veil-faint:#ffffff0b;--veil:#ffffff14;--veil-line:#ffffff29;--veil-strong:#fff3;--veil-edge:#ffffff47;--green:#117a55;--green-ink:#0e6648;--green-line:#8dcab2;--green-soft:#e6f6ef;--red:#b72e2e;--red-ink:#8f2424;--red-line:#e1aaa5;--red-soft:#fff0ef;--paper:#fafaf9;--paper-ink:#171717;--shadow:0 18px 48px #1717171a;--radius-lg:24px;--radius-md:16px;--radius-sm:10px}@media (prefers-color-scheme:dark){:root{--tan-soft:var(--tan);--forest-light:#7ca368;--forest-wash:#26351f;--on-ink-muted:#4f4a47;--on-ink-accent:#416034;--veil-faint:#0000000b;--veil:#00000014;--veil-line:#00000029;--veil-strong:#0003;--veil-edge:#00000047;--green:#6fcf97;--green-ink:#6fcf97;--green-line:#2f6b4d;--green-soft:#1f3a2d;--red:#f08a8a;--red-ink:#f08a8a;--red-line:#7a3a3a;--red-soft:#3d2222;--shadow:0 18px 48px #00000073}}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--warm-white);color:var(--ink);font-family:var(--body);margin:0;line-height:1.5}button,select,input{font:inherit}button,select,label,a{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,[tabindex="-1"]:focus-visible{outline:3px solid var(--forest);outline-offset:3px}.app-shell{min-height:100vh;overflow:hidden}.skip-link{z-index:100;background:var(--white);color:var(--ink);border-radius:8px;padding:10px 14px;font-weight:800;position:fixed;top:12px;left:16px;transform:translateY(-160%)}.skip-link:focus{transform:translateY(0)}.site-header{justify-content:space-between;align-items:center;gap:24px;width:min(1180px,100% - 32px);margin:0 auto;padding:20px 0;display:flex}.site-header>p{color:var(--ink);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:.82rem;font-weight:800;display:none}.brand-lockup{color:var(--ink);align-items:center;gap:11px;text-decoration:none;display:inline-flex}.brand-lockup>span:last-child{line-height:1.05;display:grid}.brand-lockup strong{font-family:var(--display);letter-spacing:.02em;text-transform:uppercase;font-size:1.85rem;font-weight:800}.brand-lockup em{color:var(--forest-deep);font-style:normal}.brand-lockup small{color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;margin-top:4px;font-size:.68rem;font-weight:800}.brand-mark{object-fit:cover;border-radius:13px;flex:0 0 44px;width:44px;height:44px;display:block;box-shadow:inset 0 -4px #0000001f}.hero{background:var(--ink);width:min(1180px,100% - 32px);color:var(--on-ink);box-shadow:var(--shadow);border-radius:30px;gap:28px;margin:8px auto 0;padding:clamp(34px,6vw,72px) clamp(24px,6vw,72px);display:grid;position:relative;overflow:hidden}.hero:after{border:56px solid var(--veil-faint);content:"";border-radius:50%;width:330px;height:330px;position:absolute;top:-120px;right:-90px}.hero-copy,.hero-lesson{z-index:1;position:relative}.eyebrow{color:var(--forest-deep);letter-spacing:.16em;text-transform:uppercase;margin:0 0 8px;font-size:.75rem;font-weight:900}.hero h1{font-family:var(--display);letter-spacing:-.055em;margin:0;font-size:clamp(2.55rem,9vw,5.5rem);font-weight:800;line-height:.96}.hero h1 span{color:var(--on-ink-accent)}.hero-copy>p:last-child{max-width:590px;color:var(--on-ink-muted);margin:24px 0 0;font-size:clamp(1rem,2vw,1.16rem)}.hero-lesson{align-self:end;gap:10px;display:grid}.hero-lesson>div{border:1px solid var(--veil-line);background:var(--veil);border-radius:14px;grid-template-columns:46px 1fr;align-items:center;gap:12px;padding:11px 14px;display:grid}.hero-lesson>div>span{background:var(--accent);width:38px;height:38px;font-family:var(--display);border-radius:10px;place-items:center;font-size:1.2rem;font-weight:900;display:grid}.hero-lesson p{color:var(--on-ink-muted);margin:0;font-size:.85rem;display:grid}.hero-lesson strong{color:var(--on-ink);font-size:.95rem}.mode-wrap{width:min(1080px,100% - 32px);margin:26px auto 0}.mode-tabs{border:1px solid var(--line);background:var(--tan-soft);border-radius:18px 18px 0 0;grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.mode-tabs button{text-align:left;cursor:pointer;background:0 0;border:0;grid-template-rows:auto auto;grid-template-columns:28px 1fr;align-items:center;column-gap:6px;min-height:72px;padding:12px;display:grid;position:relative}.mode-tabs button+button{border-left:1px solid #1717171f}.mode-tabs button>span{color:var(--ink);text-align:center;grid-row:1/3;font-size:1.3rem}.mode-tabs button strong{color:var(--ink);line-height:1.2}.mode-tabs button small{color:var(--ink-soft);display:none}.mode-tabs button.is-active{background:var(--white)}.mode-tabs button.is-active:after{background:var(--accent);content:"";border-radius:4px 4px 0 0;height:4px;position:absolute;bottom:0;left:18px;right:18px}.mode-tabs button.is-active>span{color:var(--accent)}.setup-panel{border:1px solid var(--line);border-radius:0 0 var(--radius-lg) var(--radius-lg);background:var(--white);border-top:0;gap:18px;padding:22px;display:grid;box-shadow:0 10px 26px #1717170f}.setup-heading h2,.trainer-topline h2,.quick-lesson h2,.result-card h2{color:var(--ink);font-family:var(--display);letter-spacing:-.035em;margin:0}.setup-heading h2{font-size:1.4rem}.level-control,.scope-control,.reference-toggle,.system-note{min-width:0}.level-control{gap:6px;display:grid}.level-control>span,.scope-control legend{color:var(--ink);letter-spacing:.05em;text-transform:uppercase;font-size:.8rem;font-weight:900}.level-control select{border:1px solid var(--tan-line);background:var(--white);width:100%;min-height:48px;color:var(--ink);border-radius:10px;padding:0 42px 0 12px;font-weight:800}.level-control small,.reference-toggle small{color:var(--ink-soft);font-size:.76rem}.scope-control{border:0;margin:0;padding:0}.scope-options{grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;display:grid}.scope-options label{border:1px solid var(--tan-line);background:var(--white);min-height:48px;color:var(--ink);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:8px;font-size:.84rem;font-weight:800;display:flex;position:relative}.scope-options label.is-selected{border-color:var(--accent);background:var(--forest-wash);box-shadow:inset 0 0 0 1px var(--accent)}.scope-options input{opacity:0;position:absolute}.scope-options label:has(input:focus-visible){outline:3px solid var(--forest);outline-offset:3px}.scope-icon{align-items:flex-end;gap:2px;height:20px;display:flex}.scope-icon i{background:currentColor;border-radius:3px;width:4px}.scope-icon i:first-of-type{height:10px}.scope-icon i:nth-of-type(2){height:14px}.scope-icon i:nth-of-type(3){height:10px}.scope-icon i:nth-of-type(4){height:17px}.scope-icon b{font-family:var(--display);margin-right:1px;font-size:1rem;line-height:1}.reference-toggle{cursor:pointer;grid-template-columns:42px 1fr;align-content:center;column-gap:10px;min-height:56px;display:grid;position:relative}.reference-toggle input{opacity:0;position:absolute}.reference-toggle>span{background:var(--tan-line);border-radius:20px;grid-row:1/3;align-self:center;width:42px;height:24px;transition:background .12s;position:relative}.reference-toggle>span:after{background:var(--white);content:"";border-radius:50%;width:18px;height:18px;transition:transform .12s;position:absolute;top:3px;left:3px;box-shadow:0 2px 6px #0003}.reference-toggle input:checked+span{background:var(--green)}.reference-toggle input:checked+span:after{transform:translate(18px)}.reference-toggle:has(input:focus-visible)>span{outline:3px solid var(--forest);outline-offset:3px}.reference-toggle strong{color:var(--ink);font-size:.9rem}.system-note{background:var(--tan-soft);border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:12px;font-size:.78rem;display:grid}.system-note span{color:var(--ink-soft);text-transform:uppercase}.system-note strong{color:var(--ink)}.system-note code{background:var(--white);color:var(--forest-deep);border-radius:6px;padding:4px 7px;font-family:Cascadia Mono,Consolas,monospace;font-weight:800}.trainer-card{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--white);box-shadow:var(--shadow);margin-top:22px;padding:clamp(20px,4vw,38px)}.trainer-topline{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.trainer-topline h2{font-size:clamp(1.55rem,5vw,2.2rem)}.example-count{background:var(--tan-soft);color:var(--ink);border-radius:999px;flex:none;padding:7px 11px;font-size:.74rem;font-weight:900}.notation-panel{border:1px solid var(--tan-line);border-radius:var(--radius-md);background:var(--paper);margin-top:20px;overflow:hidden}.notation-scroll{width:100%;overflow-x:auto}.notation-canvas{min-height:172px;color:var(--paper-ink)}.notation-canvas svg{display:block}.reference-panel{border:1px solid var(--tan-line);border-radius:var(--radius-md);background:var(--warm-white);margin-top:14px;padding:14px}.reference-panel.compact{background:var(--tan-soft)}.mini-heading{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px;display:flex}.mini-heading span{color:var(--ink);letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;font-weight:900}.mini-heading small{color:var(--ink-soft);text-align:right;font-size:.72rem}.count-reference{gap:10px;padding-bottom:3px;display:flex;overflow-x:auto}.reference-beat{flex:1 0 185px;min-width:185px}.beat-label{color:var(--ink-soft);text-transform:uppercase;margin-bottom:4px;font-size:.66rem;font-weight:800;display:block}.reference-counts{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.reference-counts span{border:1px solid var(--line);background:var(--white);min-height:36px;color:var(--ink);border-radius:7px;place-items:center;font-family:Cascadia Mono,Consolas,monospace;font-size:.95rem;font-weight:900;display:grid}.reference-counts span.sounds{border-color:var(--accent);background:var(--forest-deep);color:var(--on-ink)}.reference-counts span.silent{color:var(--ink-soft)}.reveal-panel{border:1px dashed var(--tan-line);border-radius:var(--radius-md);background:var(--warm-white);grid-template-columns:1fr auto;align-items:center;gap:6px 12px;margin-top:16px;padding:16px;display:grid}.reveal-panel.is-revealed{border-style:solid;border-color:var(--on-ink-accent);background:var(--forest-wash)}.reveal-label{color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;font-size:.68rem;font-weight:900}.reveal-panel>strong{color:var(--ink);font-family:var(--display);grid-column:1;font-size:clamp(1.25rem,5vw,1.85rem)}.reveal-panel>button{grid-area:1/2/3}.primary-button,.secondary-button,.quiet-button{cursor:pointer;border-radius:11px;min-height:46px;padding:10px 16px;font-weight:900}.primary-button{border:1px solid var(--accent);background:var(--forest-deep);color:var(--on-ink);box-shadow:0 5px 0 var(--forest-deep)}.primary-button:hover{background:var(--forest-deep);transform:translateY(1px);box-shadow:0 4px #00000047}.secondary-button{border:1px solid var(--ink);background:var(--white);color:var(--ink)}.secondary-button:hover,.quiet-button:hover{background:var(--tan-soft)}.quiet-button{border:1px solid var(--tan-line);color:var(--ink);background:0 0}.explanation{border-left:4px solid var(--ink);background:var(--tan-soft);border-radius:0 10px 10px 0;grid-template-columns:32px 1fr;gap:10px;margin-top:12px;padding:13px 14px;display:grid}.lesson-icon{background:var(--ink);width:26px;height:26px;color:var(--on-ink);font-family:var(--display);border-radius:50%;place-items:center;font-weight:900;display:grid}.explanation p,.feedback-panel p{color:var(--ink-soft);gap:2px;margin:0;font-size:.9rem;display:grid}.explanation strong,.feedback-panel strong{color:var(--ink)}.practice-actions{grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;display:grid}.practice-actions .primary-button{grid-column:1/-1}.challenge-progress{border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--ink);color:var(--on-ink);margin:calc(-1*clamp(20px,4vw,38px)) calc(-1*clamp(20px,4vw,38px)) 26px;padding:15px clamp(20px,4vw,38px) 0}.progress-copy{justify-content:space-between;gap:10px;margin-bottom:11px;font-size:.76rem;font-weight:700;display:flex}.challenge-progress progress{background:var(--veil-strong);border:0;border-radius:10px;width:100%;height:6px;display:block;overflow:hidden}.challenge-progress progress::-webkit-progress-bar{background:var(--veil-strong)}.challenge-progress progress::-webkit-progress-value{background:var(--accent)}.challenge-progress progress::-moz-progress-bar{background:var(--accent)}.answer-grid{gap:10px;margin-top:16px;display:grid}.answer-choice{border:2px solid var(--tan-line);background:var(--white);text-align:left;cursor:pointer;border-radius:13px;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;min-height:64px;padding:10px 12px;display:grid}.answer-choice:hover:not(:disabled){border-color:var(--ink);background:var(--tan-soft)}.answer-choice:disabled{color:var(--ink);cursor:default;opacity:1}.choice-key{background:var(--tan-soft);width:30px;height:30px;color:var(--ink);border-radius:8px;place-items:center;font-size:.76rem;font-weight:900;display:grid}.answer-choice strong{font-family:Cascadia Mono,Consolas,monospace;font-size:clamp(.95rem,3vw,1.12rem)}.choice-result{color:inherit;text-transform:uppercase;font-size:.68rem;font-weight:900}.answer-choice.is-correct{border-color:var(--green);background:var(--green-soft);color:var(--green-ink)}.answer-choice.is-correct .choice-key{background:var(--green);color:var(--on-ink)}.answer-choice.is-incorrect{border-color:var(--red);background:var(--red-soft);color:var(--red-ink)}.answer-choice.is-incorrect .choice-key{background:var(--red);color:var(--on-ink)}.feedback-panel{border-radius:14px;grid-template-columns:36px 1fr;align-items:center;gap:12px;margin-top:16px;padding:15px;display:grid}.feedback-panel.is-waiting{border:1px dashed var(--tan-line);background:var(--warm-white);display:block}.feedback-panel.is-correct{border:1px solid var(--green-line);background:var(--green-soft)}.feedback-panel.is-incorrect{border:1px solid var(--red-line);background:var(--red-soft)}.feedback-icon{background:var(--green);width:34px;height:34px;color:var(--on-ink);border-radius:50%;place-items:center;font-weight:900;display:grid}.feedback-panel.is-incorrect .feedback-icon{background:var(--red)}.feedback-panel .primary-button{grid-column:1/-1}.result-card{text-align:center;position:relative;overflow:hidden}.result-card:before{background:repeating-linear-gradient(90deg, var(--accent) 0 38px, var(--ink) 38px 76px);content:"";height:11px;position:absolute;inset:0 0 auto}.result-badge{border:10px solid var(--forest-wash);background:var(--forest-deep);width:110px;height:110px;color:var(--on-ink);box-shadow:0 0 0 2px var(--accent);border-radius:50%;place-items:center;margin:12px auto 20px;display:grid}.result-badge span{font-family:var(--display);font-size:1.7rem;font-weight:900}.result-card h2{max-width:680px;margin:0 auto;font-size:clamp(1.7rem,6vw,2.6rem)}.result-message{max-width:590px;color:var(--ink-soft);margin:14px auto 0}.result-stats{grid-template-columns:repeat(3,1fr);gap:8px;max-width:620px;margin:24px auto;display:grid}.result-stats div{border:1px solid var(--line);background:var(--warm-white);border-radius:12px;padding:12px 8px}.result-stats dt{color:var(--ink-soft);text-transform:uppercase;font-size:.68rem;font-weight:900}.result-stats dd{color:var(--ink);font-family:var(--display);margin:4px 0 0;font-size:1.4rem;font-weight:900}.result-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.result-footnote{color:var(--ink-soft);margin:22px 0 0;font-size:.76rem}.quick-lesson{border-left:7px solid var(--accent);border-radius:0 var(--radius-md) var(--radius-md) 0;background:var(--ink);width:min(1080px,100% - 32px);color:var(--on-ink);gap:14px;margin:24px auto 60px;padding:24px;display:grid}.quick-lesson h2{color:var(--on-ink);font-size:clamp(1.5rem,5vw,2rem)}.quick-lesson>p{color:var(--on-ink-muted);margin:0}.site-footer{background:var(--ink);color:var(--on-ink-muted);gap:18px;padding:30px max(20px,50% - 590px);font-size:.78rem;display:grid}.site-footer>div{display:grid}.site-footer .shop-link{color:inherit;text-underline-offset:2px;text-decoration:underline}.site-footer .shop-link:hover{color:var(--on-ink)}.site-footer strong{color:var(--on-ink);font-family:var(--display);font-size:1.25rem}.site-footer span{color:var(--on-ink-muted);text-transform:uppercase;font-size:.68rem}.site-footer .foot-links{flex-wrap:wrap;gap:10px;display:flex}.site-footer .foot-btn{background:var(--veil);color:var(--on-ink);border:1px solid var(--veil-edge);border-radius:8px;align-items:center;gap:6px;padding:7px 14px;font-size:.75rem;font-weight:700;text-decoration:none;transition:all .15s;display:inline-flex}.site-footer .foot-btn:hover{background:var(--veil-line);border-color:var(--on-ink)}.site-footer .foot-btn.foot-ico{border-radius:50%;gap:0;padding:8px;line-height:0}.site-footer .foot-btn.foot-ico svg{width:16px;height:16px;display:block}.support-dialog{border:2px solid var(--ink);border-radius:var(--radius-md);background:var(--white);width:min(560px,100vw - 32px);color:var(--ink);box-shadow:var(--shadow);padding:20px}.support-dialog::backdrop{background:#1717178f}.support-dialog h2{color:var(--ink);font:800 1.15rem var(--display);margin:0 0 8px}.support-dialog .support-dialog-lede,.support-dialog .support-dialog-hint{color:var(--ink-soft);margin:0 0 12px;font-size:.86rem}.support-dialog .support-dialog-hint{margin:12px 0 0}.support-dialog .support-dialog-label{color:var(--ink);font-size:.78rem;font-weight:800;display:block}.support-dialog textarea{border:2px solid var(--line);border-radius:var(--radius-sm);background:var(--warm-white);width:100%;color:var(--ink);font:inherit;resize:vertical;margin-top:6px;padding:10px;font-size:.85rem;display:block}.support-dialog textarea:focus-visible{outline:3px solid var(--forest);outline-offset:3px;border-color:var(--accent)}.support-dialog .support-dialog-actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.support-dialog .foot-btn{border:1px solid var(--veil-edge);background:var(--ink);min-height:44px;color:var(--on-ink);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:8px 14px;font-size:.75rem;font-weight:700;text-decoration:none;transition:all .15s;display:inline-flex}.support-dialog .foot-btn:hover{background:var(--ink);border-color:var(--accent)}.site-footer p{margin:0}@media (width<=699px){.hero{gap:16px;padding:20px 20px 22px}.hero h1{font-size:clamp(2rem,8.5vw,2.6rem)}.hero-copy>p:last-child{display:none}.hero-lesson{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hero-lesson>div{text-align:center;grid-template-columns:1fr;justify-items:center;gap:6px;padding:9px 6px}.hero-lesson>div>span{width:28px;height:28px;font-size:.95rem}.hero-lesson strong{font-size:.8rem}.hero-lesson p{font-size:.68rem}}@media (width>=700px){.site-header>p{display:block}.hero{grid-template-columns:minmax(0,1.55fr) minmax(270px,.75fr)}.mode-tabs button{grid-template-columns:34px 1fr;min-height:82px;padding:14px 24px}.mode-tabs button small{display:block}.setup-panel{grid-template-columns:1.15fr 1.35fr 1.25fr;align-items:center}.setup-heading{grid-column:1/-1}.system-note{grid-column:1/-1;justify-self:end;margin-top:-6px}.practice-actions{grid-template-columns:auto auto 1fr}.practice-actions .primary-button{grid-column:auto;justify-self:end}.answer-grid{grid-template-columns:1fr 1fr}.feedback-panel .primary-button{grid-area:1/3;min-width:150px}.feedback-panel:not(.is-waiting){grid-template-columns:36px 1fr auto}.quick-lesson{grid-template-columns:.8fr 1.2fr;align-items:center;padding:30px 36px}.site-footer{grid-template-columns:1fr 1.35fr 1fr;align-items:center}.site-footer p:last-child{text-align:right}}@media (width>=980px){.setup-panel{grid-template-columns:1fr 1.25fr 1.1fr 1fr auto}.setup-heading,.system-note{grid-column:auto;justify-self:stretch;margin:0}.setup-heading h2{font-size:1.25rem}}@media (width<=520px){.site-header,.hero,.mode-wrap,.quick-lesson{width:min(100% - 20px,1180px)}.site-header{padding:13px 0}.brand-mark{flex-basis:40px;width:40px;height:40px}.hero{border-radius:22px}.mode-tabs button{text-align:center;grid-template-columns:1fr;justify-items:center;padding:10px 6px}.mode-tabs button>span{display:none}.mode-tabs button strong{font-size:.84rem}.setup-panel,.trainer-card{padding:16px}.trainer-topline{display:grid}.example-count{justify-self:start}.reveal-panel{grid-template-columns:1fr}.reveal-panel>button,.reveal-panel>strong{grid-area:auto/1}.mini-heading{display:grid}.mini-heading small{text-align:left}.progress-copy{display:grid}.result-stats{grid-template-columns:1fr}.result-actions{display:grid}.site-footer{padding-left:20px;padding-right:20px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}.audit-shell{width:min(1240px,100% - 32px);margin:0 auto;padding:44px 0 64px}.audit-header{border-radius:var(--radius-lg);background:var(--ink);color:var(--on-ink);box-shadow:var(--shadow);justify-content:space-between;align-items:end;gap:32px;padding:38px;display:flex}.audit-header h1{font-family:var(--display);letter-spacing:-.055em;margin:4px 0 8px;font-size:clamp(2.3rem,6vw,4.7rem);line-height:.98}.audit-header p:last-child{max-width:720px;color:var(--on-ink-muted);margin:0}.audit-header a{border:1px solid var(--veil-edge);color:var(--on-ink);border-radius:999px;flex:none;padding:10px 16px;font-weight:800;text-decoration:none}.audit-status{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--line);grid-template-columns:repeat(4,minmax(110px,1fr)) 2.2fr;gap:1px;margin:18px 0;display:grid;overflow:hidden}.audit-status>*{background:var(--white);margin:0;padding:18px}.audit-status div{display:grid}.audit-status div span{color:var(--ink);font-family:var(--display);font-size:1.85rem;font-weight:900;line-height:1}.audit-status small,.audit-status p{color:var(--ink-soft);font-size:.76rem}.audit-status p strong{color:var(--ink);display:block}.audit-principles{border-radius:var(--radius-md);background:var(--forest-wash);grid-template-columns:.75fr 1.25fr;align-items:start;gap:28px;margin:18px 0 24px;padding:28px 32px;display:grid}.audit-principles h2{color:var(--ink);font-family:var(--display);margin:4px 0 0;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.05}.audit-principles ul{gap:6px;margin:0;padding-left:20px;display:grid}.audit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.audit-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--white);min-width:0;overflow:hidden;box-shadow:0 10px 26px #1717170f}.audit-card-heading{border-bottom:1px solid var(--line);grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:18px 20px;display:grid}.audit-card-heading>span{background:var(--tan-soft);width:38px;height:38px;color:var(--ink);border-radius:50%;place-items:center;font-weight:900;display:grid}.audit-card-heading h2,.audit-card-heading p{margin:0}.audit-card-heading h2{color:var(--ink);font-family:var(--display);font-size:1.24rem}.audit-id{color:var(--ink-soft);font-family:Consolas,Courier New,monospace;font-size:.68rem}.audit-card-heading>strong{background:var(--green-soft);color:var(--green);white-space:nowrap;border-radius:999px;padding:6px 9px;font-size:.68rem}.audit-notation{padding:6px 14px 0}.audit-notation .notation-scroll{background:var(--paper);border:0}.audit-reference{border-radius:var(--radius-sm);background:var(--tan-soft);margin:0 18px;padding:12px}.audit-reference>span,.audit-answer>span{color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px;font-size:.66rem;font-weight:900;display:block}.audit-answer{border:1px solid var(--forest-light);border-radius:var(--radius-sm);background:var(--forest-wash);justify-content:space-between;align-items:center;gap:16px;margin:12px 18px;padding:12px 14px;display:flex}.audit-answer>span{margin:0}.audit-answer strong{color:var(--forest-deep);font-family:var(--display);font-size:1.28rem}.audit-details{border-top:1px solid var(--line);margin:0;display:grid}.audit-details div{border-bottom:1px solid var(--line);grid-template-columns:122px 1fr;gap:14px;padding:10px 18px;display:grid}.audit-details div:last-child{border-bottom:0}.audit-details dt{color:var(--ink-soft);text-transform:uppercase;font-size:.71rem;font-weight:900}.audit-details dd{margin:0;font-size:.78rem}.audit-footer{border-left:5px solid var(--accent);border-radius:var(--radius-sm);background:var(--white);margin-top:20px;padding:24px 28px}.audit-footer strong{color:var(--ink)}.audit-footer p{color:var(--ink-soft);margin:5px 0 0}@media (width<=860px){.audit-header,.audit-principles{grid-template-columns:1fr}.audit-header{align-items:start;display:grid}.audit-header a{justify-self:start}.audit-status{grid-template-columns:repeat(2,1fr)}.audit-status p{grid-column:1/-1}.audit-grid{grid-template-columns:1fr}}@media (width<=520px){.audit-shell{width:min(100% - 20px,1240px);padding-top:20px}.audit-header{padding:24px 20px}.audit-status{grid-template-columns:1fr 1fr}.audit-card-heading{grid-template-columns:auto 1fr}.audit-card-heading>strong{grid-column:2;justify-self:start}.audit-details div{grid-template-columns:1fr;gap:3px}}.hero .eyebrow,.quick-lesson .eyebrow{color:var(--forest-light)}.assignment-banner{border:1px solid var(--accent);border-radius:var(--radius-sm);background:var(--forest-wash);color:var(--ink);border-left-width:5px;gap:4px;margin:0 0 4px;padding:14px 16px;display:grid}.assignment-banner strong{font-size:1rem}.assignment-banner span{color:var(--ink);font-size:.86rem}.assignment-banner small{color:var(--ink-soft);font-size:.76rem}.link-error{border:1px solid var(--red);border-radius:var(--radius-sm);background:var(--red-soft);color:var(--ink);border-left-width:5px;gap:4px;margin:0 0 4px;padding:14px 16px;display:grid}.link-error strong{color:var(--red);font-size:.95rem}.link-error span{font-size:.88rem}.link-error small{color:var(--ink-soft);font-size:.76rem}.student-id-field{text-align:left;gap:6px;max-width:340px;margin:18px auto 0;display:grid}.student-id-field span{color:var(--ink-soft);font-size:.78rem;font-weight:700}.student-id-field input{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--white);color:var(--ink);font:inherit;padding:10px 12px;font-size:.92rem}.student-id-field input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.result-assignment{color:var(--ink);margin:6px 0 0;font-size:.95rem}.result-submit{color:var(--ink-soft);margin:14px 0 0;font-size:.82rem}.result-code{color:var(--ink-soft);gap:4px;margin:10px 0 0;font-size:.76rem;display:grid}.result-code code{color:var(--ink);letter-spacing:.04em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}.result-code small{font-size:.72rem}.setup-panel select:disabled,.setup-panel input:disabled{opacity:.65;cursor:not-allowed}.scope-control label:has(input:disabled){opacity:.65;cursor:not-allowed}.student-id-field.setup-identity{max-width:none;margin:4px 0 0}.student-id-field small{color:var(--ink-soft);font-size:.76rem}.mode-tabs button.is-locked{opacity:.55;cursor:not-allowed}.mode-tabs button.is-locked small{color:var(--forest-deep)}.practice-locked-note{border:1px dashed var(--line);border-radius:var(--radius-sm);background:var(--forest-wash);color:var(--ink);margin:0 0 4px;padding:12px 16px;font-size:.82rem}.answer-choice.is-chosen{border-color:var(--ink);background:var(--tan-soft);color:var(--ink)}.answer-choice.is-chosen .choice-key{background:var(--ink);color:var(--on-ink)}.feedback-panel.is-held{border:1px solid var(--tan-line);background:var(--tan-soft)}.feedback-panel.is-held .feedback-icon{background:var(--ink)}.result-retry-note{color:var(--ink-soft);margin:12px 0 0;font-size:.82rem}.result-step{color:var(--ink-soft);margin:4px 0 0;font-size:.8rem;font-weight:700}.result-missed{border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:var(--radius-sm);background:var(--forest-wash);text-align:left;gap:2px;max-width:420px;margin:16px auto 0;padding:12px 16px;display:grid}.result-missed strong{color:var(--forest-deep);text-transform:uppercase;letter-spacing:.04em;font-size:.78rem}.result-missed span{color:var(--ink);font-size:.9rem;font-weight:700}.result-review{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--white);text-align:left;margin:20px 0 0}.result-review>summary{cursor:pointer;color:var(--ink);padding:14px 16px;font-size:.88rem;font-weight:900}.result-review>summary:focus-visible{outline:3px solid var(--forest);outline-offset:-3px}.result-review[open]>summary{border-bottom:1px solid var(--line)}.review-list{gap:16px;margin:0;padding:16px;list-style:none;display:grid}.review-list>li{border:1px solid var(--line);border-left:5px solid var(--green);border-radius:var(--radius-sm);background:var(--white);padding:12px 14px}.review-list>li.is-incorrect{border-left-color:var(--red)}.review-head{align-items:center;gap:8px;margin-bottom:8px;display:flex}.review-index{background:var(--tan-soft);width:26px;height:26px;color:var(--ink);border-radius:50%;place-items:center;font-size:.78rem;font-weight:900;display:grid}.review-mark{background:var(--green);width:22px;height:22px;color:var(--on-ink);border-radius:50%;place-items:center;font-size:.76rem;font-weight:900;display:grid}.review-list>li.is-incorrect .review-mark{background:var(--red)}.review-verdict{text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-size:.72rem;font-weight:900}.review-answers{flex-wrap:wrap;gap:8px 24px;margin:10px 0 0;display:flex}.review-answers dt{text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-size:.7rem;font-weight:700}.review-answers dd{color:var(--ink);margin:2px 0 0;font-family:Cascadia Mono,Consolas,monospace;font-size:.95rem;font-weight:900}.review-why{color:var(--ink-soft);margin:10px 0 0;font-size:.8rem}
