.app{grid-template-rows:52px auto;gap:8px}
.topbar{gap:12px}
.topbar .view-link{margin-left:0;font-size:14px;border-radius:5px}
.topbar #homeButton{margin-left:auto}
.topbar .view-link.active{color:#ffd1b1;background:#394650}
.topbar #notesButton{margin-left:0}
.diagnostics-view{display:grid;grid-template-rows:45px minmax(0,1fr);gap:8px;min-width:0;min-height:0}
.home-view{display:block;padding:28px 0;align-self:start}
.home-heading{margin:15px 0 25px}
.home-heading h1{font-size:32px;line-height:1.2;margin:8px 0;letter-spacing:-.7px}
.home-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.home-option{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;gap:22px;min-height:255px;text-align:left;padding:28px 22px;background:#27323c;border:1px solid #5a6a77;border-radius:12px;color:#edf4f8;font-size:16px}
.home-option:hover{background:#303e49;border-color:#ffa56d}
.home-option img{width:95px;height:160px;object-fit:contain;filter:drop-shadow(0 5px 8px #0006)}
.home-option-copy>span{display:block}
.home-option-copy strong{display:block;font-size:28px;line-height:1.25;margin:7px 0 10px}
.home-option-copy>span:not(.option-label):not(.option-detail){color:#c6d5df;line-height:1.5}
.home-option .option-label{font-size:14px;letter-spacing:1.4px;color:#ffb181;font-weight:700}
.home-option .option-detail{font-size:14px;color:#91aab9;margin-top:18px}
.guide-option{border-color:#4a7581;background:#22323b}
.guide-option .option-label{color:#8cd5e2}
.home-guide-symbol{color:#8cd5e2;display:flex;flex-direction:column;gap:12px;align-items:center;font:600 14px ui-monospace,monospace}
.home-guide-symbol svg{width:110px;height:50px}
.guide-view{display:block;min-width:0;padding:10px 0 20px;align-self:start}
.guide-toolbar{display:flex;align-items:center;gap:10px;padding:8px 0 12px;position:sticky;top:0;z-index:6;background:var(--bg)}
.guide-toolbar label{font-size:14px;color:#b4c8d4}
.guide-toolbar select{color:#edf5fa;background:#25333e;border:1px solid #607681;border-radius:6px;padding:9px 10px;font-size:16px;min-width:0;width:min(370px,100%)}
.guide-toolbar .secondary{font-size:14px}
.guide-toolbar .active{border-color:#91d1db;background:#304d56;color:#c0f1f7}
.lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 0 17px}
.lesson-heading h1{font-size:28px;line-height:1.2;margin:6px 0 0;letter-spacing:-.6px}
.lesson-heading .eyebrow{font-size:13px;color:#9bd6df;letter-spacing:1px}
.lesson-tabs{display:flex;gap:6px;margin:0 0 14px}
.lesson-tabs button{font-size:16px;min-height:43px;line-height:1.25;padding:9px 18px;border:1px solid #516b7b;border-radius:6px;background:#222f3a;color:#bdcdd7}
.lesson-tabs .active{border-color:#a6dbe3;background:#375762;color:#f0fcff}
.lesson-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,440px);gap:20px;align-items:start;padding:22px;border:1px solid #485e6d;border-radius:10px;background:#25313c;min-width:0}
.lesson-pane h2{font-size:18px;line-height:1.3;margin:0 0 8px;color:#f0f6fa;font-weight:650}
.lesson-pane p{font-size:16px;line-height:1.6;margin:0 0 22px;color:#c5d6e1}
.lesson-copy p:last-child{margin-bottom:0}
.lesson-figure{margin:0;border:1px solid #92b1a1;border-radius:8px;overflow:hidden;background:#eef4ef;color:#244537}
.lesson-figure svg{display:block;width:100%;height:auto}
.lesson-figure figcaption{font-size:14px;line-height:1.4;padding:10px 13px;background:#dce8df;border-top:1px solid #b6cabd}
.signal-pane{grid-template-columns:minmax(180px,.75fr) minmax(300px,1.25fr)}
.signal-controls label{display:flex;justify-content:space-between;gap:12px;font-size:16px;margin:3px 0 10px}
.signal-controls output{font:600 17px ui-monospace,monospace;color:#ffd0b0;white-space:nowrap}
.signal-controls input{width:100%;min-height:40px;accent-color:#ff925b;cursor:pointer}
.healthy-reading{background:#172631;border:1px solid #4f7082;border-radius:7px;padding:15px;margin-top:17px}
.healthy-reading span{display:block;font-size:14px;color:#a3becd;margin-bottom:7px}
.healthy-reading strong{font:600 20px/1.5 ui-monospace,monospace;color:#f0f7fc;overflow-wrap:anywhere}
.signal-pane .signal-explanation{grid-column:1/-1;margin-bottom:0;font-size:16px}
.tests-pane{grid-template-columns:1fr 1fr;gap:20px}
.identify-note{grid-column:1/-1;padding-bottom:15px;border-bottom:1px solid #465b69}
.identify-note p{margin-bottom:0}
.lesson-tests{grid-column:1/-1}
.lesson-tests ol{counter-reset:lesson;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lesson-tests li{font-size:16px;line-height:1.5;padding:13px;border:1px solid #4c6372;border-radius:7px;background:#1c2a35}
.lesson-tests li strong{display:block;color:#ffbb91;font-size:16px;margin-bottom:5px}
.lesson-tests li strong:before{counter-increment:lesson;content:counter(lesson) '. ';color:#9db6c5}
.lesson-tests li span{display:block;color:#cbdce6}
.fault-clues,.lesson-sources{grid-column:1/-1;border-top:1px solid #486272;padding-top:14px;font-size:16px}
.fault-clues summary,.lesson-sources summary{cursor:pointer;color:#9fd3dd;font-size:16px}
.fault-clues ul{margin:12px 0 0;padding-left:22px;color:#cedfe8;line-height:1.6}
.fault-clues li+li{margin-top:8px}
.lesson-sources p{margin:12px 0;font-size:14px}
.guide-view a{color:#aadce9;text-underline-offset:3px;font-size:14px}
.comparison-intro{font-size:16px;line-height:1.6;color:#c5d7e3;margin:0 0 16px;max-width:820px}
.comparison-table{border:1px solid #54717f;border-radius:8px;overflow:hidden}
.comparison-table table{width:100%;border-collapse:collapse;text-align:left;background:#22313c;font-size:16px;line-height:1.5}
.comparison-table th,.comparison-table td{padding:14px 13px;border-bottom:1px solid #425d6d;vertical-align:top}
.comparison-table thead{background:#365362;font-size:14px;color:#dfeef5}
.comparison-table tbody th{color:#ffc79f;font-size:16px;font-weight:650;min-width:135px}
.comparison-table tbody td{color:#c3d7e4}
.comparison-table tbody tr:last-child th,.comparison-table tbody tr:last-child td{border-bottom:0}
.comparison-cautions{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:18px 0 12px}
.comparison-cautions p{margin:0;font-size:16px;line-height:1.55;color:#c3d8e5;background:#273944;border-left:3px solid #85c0d2;padding:14px}
.comparison-cautions strong{display:block;color:#e5f3f9;margin-bottom:6px}
.comparison-links{display:flex;gap:14px;flex-wrap:wrap;padding:5px 0}
.sheet{isolation:isolate}
.mission.fault-found{border-color:#72ba89}
.mission.fault-found .progress-track span{background:#88dba0}
.mission.fault-found .mission-meta #stepCounter{color:#a1e0b5}
.mission.fault-found .primary,.diagnosis-correct .primary,.result .primary{background:#91dda7;color:#163722}
.mission.repair-verified{background:linear-gradient(110deg,#264734,#1b3028);border-color:#9ce3b2}
.mission.repair-verified h1{color:#a6edbb}
.diagnosis-correct{border-color:#8bd5a2}
.sheet #feedback.diagnosis-feedback{padding:12px;border-radius:7px;font-size:16px;line-height:1.5}
.sheet #feedback.success{color:#aff0c2;background:#173d28;border:1px solid #66ae7e}
.sheet #feedback.success:before{content:'✓ ';font-weight:750}
.sheet #feedback.error{color:#ffd0c4;background:#452b2c;border:1px solid #b2746b}
.result{border-color:#83d69f;background:#21392c}
.result .eyebrow,.result h2{color:#a5ebbb}
.success-check{width:66px;height:66px;display:grid;place-items:center;margin:18px auto 0;border-radius:50%;color:#173523;background:#9be5b0;box-shadow:0 0 0 7px #589b6c27;font-size:45px;font-weight:750;line-height:1}
.result .celebration-label{color:#b0eac0;font-weight:700;font-size:14px;letter-spacing:.4px;margin:8px 0 0}
.result .result-stats{border-color:#517c60;background:#1a3023}
.result .result-stats span{color:#aad0b5}
.fireworks{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:4;border-radius:inherit}
.firework-spark{position:absolute;display:block;width:5px;height:5px;border-radius:50%;background:var(--spark);box-shadow:0 0 5px var(--spark);opacity:0;animation:fireworkBurst 1.1s cubic-bezier(.1,.55,.3,1) var(--delay) both}
@keyframes fireworkBurst{0%{opacity:0;transform:translate(0,0) scale(.25)}15%{opacity:1}70%{opacity:.85}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.4)}}
@media(max-width:900px){.home-options{gap:12px}.home-option{grid-template-columns:85px minmax(0,1fr);gap:14px;padding:22px 16px}.home-option img{width:80px}.home-guide-symbol svg{width:80px}.home-option-copy strong{font-size:25px}.lesson-pane{grid-template-columns:minmax(0,1fr) minmax(270px,1fr)}.lesson-tests ol{grid-template-columns:1fr}}
@media(max-width:767px){
 .app{grid-template-rows:43px auto;gap:5px;min-height:100svh}
 .topbar{gap:5px}.topbar .view-link{padding:6px;font-size:14px}
 .diagnostics-view{grid-template-rows:36px auto;gap:5px}
 .home-view{padding:14px 0 25px}.home-heading{margin:16px 0 19px}.home-heading h1{font-size:27px}
 .home-options{grid-template-columns:1fr;gap:14px}.home-option{grid-template-columns:86px minmax(0,1fr);min-height:195px;padding:20px 16px;gap:15px}
 .home-option img{width:78px;height:137px}.home-option-copy strong{font-size:26px;margin:5px 0 7px}.home-option .option-detail{margin-top:12px;font-size:14px}
 .home-guide-symbol svg{width:84px}.home-guide-symbol{font-size:13px}
 .guide-view{padding:6px 0 20px}.guide-toolbar{gap:6px;padding:7px 0 9px}.guide-toolbar select{font-size:16px;padding:8px 5px;flex:1;width:auto}.guide-toolbar label{font-size:14px}.guide-toolbar .secondary{padding:9px 8px}
 .lesson-heading{gap:10px;flex-wrap:wrap;padding:10px 0 13px}.lesson-heading h1{font-size:24px}.lesson-heading .eyebrow{font-size:12px;letter-spacing:.6px}.lesson-heading .primary{font-size:14px;padding:9px 12px}
 .lesson-tabs{gap:5px;margin-bottom:10px}.lesson-tabs button{flex:1;font-size:14px;min-height:42px;padding:8px 5px}
 .lesson-pane{grid-template-columns:minmax(0,1fr);gap:17px;padding:15px;border-radius:8px}.lesson-pane p{font-size:16px;line-height:1.5;margin-bottom:17px}.lesson-copy p:last-child{margin:0}
 .lesson-figure figcaption{font-size:14px;padding:9px 11px}.signal-pane{grid-template-columns:minmax(0,1fr)}.healthy-reading{margin-top:7px;padding:10px 12px}.healthy-reading strong{font-size:19px}.signal-pane .signal-explanation{font-size:16px;margin:0}
 .identify-note,.lesson-tests,.fault-clues,.lesson-sources{grid-column:auto}.tests-pane{gap:15px}.lesson-tests ol{grid-template-columns:1fr;gap:9px}.lesson-tests li{padding:11px}
 .comparison-table table,.comparison-table tbody,.comparison-table tr{display:block}.comparison-table thead{display:none}.comparison-table tr{padding:14px;border-bottom:1px solid #5a7888}.comparison-table tr:last-child{border-bottom:0}
 .comparison-table tbody th{display:block;padding:0 0 9px;border:0;font-size:18px}.comparison-table td{display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px;padding:4px 0;border:0;font-size:16px}.comparison-table td:before{content:attr(data-label);font-size:14px;font-weight:650;color:#9eb9ca;line-height:1.7}
 .comparison-cautions{grid-template-columns:1fr;gap:12px}.comparison-intro{font-size:16px}
}
@media(max-width:340px){.home-option{grid-template-columns:65px minmax(0,1fr);padding:18px 11px;gap:11px}.home-option img,.home-guide-symbol svg{width:62px}.home-option-copy strong{font-size:23px}.guide-toolbar{flex-wrap:wrap}.guide-toolbar select{min-width:130px}.topbar .brand{font-size:16px}.topbar #notesButton{font-size:12px;padding:5px}.lesson-heading h1{font-size:22px}.lesson-pane{padding:12px}.comparison-table td{grid-template-columns:70px minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.firework-spark{display:none;animation:none!important}}
