:root{--bg:#f4f6f9;--panel:#fff;--border:#d4dae3;--navy:#1a3a6b;--crimson:#9e1b32;--text:#1c2b45;--sub:#5a6577;--green:#1f8a4c;--gold:#c77c0a}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif;font-size:15px}h1{text-align:center;color:var(--navy);border-bottom:3px solid var(--crimson);background:#fff;padding:11px;font-size:20px;font-weight:700}.subtitle{text-align:center;color:var(--sub);padding:6px 12px 4px;font-size:14px}#authScreen{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:78vh;padding:20px;display:flex}#authScreen h2{color:var(--navy);text-align:center;font-size:28px}#authScreen p{color:var(--text);text-align:center;max-width:720px;font-size:16px;line-height:1.8}.logo-badge{background:var(--navy);color:#fff;letter-spacing:1px;border-radius:8px;padding:10px 26px;font-size:24px;font-weight:700}.logo-badge span{background:var(--crimson);border-radius:5px;margin-left:6px;padding:3px 10px}#authBtn{background:var(--crimson);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:14px 48px;font-size:18px;font-weight:700}#authBtn:hover{opacity:.9}#mainApp{display:none}.layout{grid-template-columns:300px 1fr 320px;gap:10px;height:calc(100vh - 80px);padding:10px;display:grid}.col{flex-direction:column;gap:10px;min-height:0;display:flex;overflow:hidden}.col.right{overflow-y:auto}.panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:12px}.panel-title{color:var(--navy);letter-spacing:.5px;text-transform:uppercase;border-bottom:2px solid var(--crimson);justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:7px;font-size:14px;font-weight:700;display:flex}.sample-row{gap:8px;display:flex}.s-btn{border:2px solid var(--border);cursor:pointer;text-align:center;color:var(--sub);background:#f4f6f9;border-radius:6px;flex:1;padding:10px 5px;font-size:14px}.s-btn.sel{border-color:var(--crimson);color:var(--crimson);background:#fff;font-weight:700}.s-btn small{color:var(--sub);font-size:12px;font-weight:400;display:block}.viewer-wrap{background:#000;border-radius:6px;width:100%;position:relative;overflow:hidden}canvas{width:100%;display:block}.hud{color:#dfe6ee;text-shadow:0 1px 2px #000;pointer-events:none;font-family:monospace;font-size:13px;position:absolute;bottom:8px;left:8px}.scalebar{pointer-events:none;text-align:center;color:#fff;text-shadow:0 1px 2px #000;font-family:monospace;font-size:13px;position:absolute;bottom:12px;right:10px}.scalebar .bar{background:#fff;border:1px solid #000;height:4px;margin-top:2px}.topbar{color:#cfe6ff;text-shadow:0 1px 2px #000;pointer-events:none;font-family:monospace;font-size:13px;line-height:1.6;position:absolute;top:8px;left:8px}.magsteps{flex-wrap:wrap;gap:6px;margin-top:9px;display:flex}.mag-btn{border:1px solid var(--border);cursor:pointer;min-width:52px;color:var(--navy);text-align:center;background:#f4f6f9;border-radius:5px;flex:1;padding:9px 4px;font-size:14px;font-weight:700}.mag-btn.sel{border-color:var(--crimson);background:var(--crimson);color:#fff}.mag-btn small{color:inherit;opacity:.85;font-size:11px;font-weight:400;display:block}.mode-line{color:var(--sub);margin-top:7px;font-size:13px}.det-tabs{gap:6px;margin-bottom:8px;display:flex}.det-tabs button{border:1px solid var(--border);cursor:pointer;color:var(--sub);white-space:nowrap;background:#f4f6f9;border-radius:5px;flex:1;padding:9px 4px;font-size:14px}.det-tabs button.sel{border-color:var(--navy);color:var(--navy);background:#fff;font-weight:700}.det-tabs button:disabled{opacity:.4;cursor:not-allowed}.analyze-btn{background:var(--navy);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;width:100%;margin-top:8px;padding:12px;font-size:15px;font-weight:700}.analyze-btn:disabled{opacity:.4;cursor:not-allowed}.maps-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.map-cell{background:#05070b;border:1px solid #1a2330;border-radius:6px;position:relative;overflow:hidden}.map-cell canvas{width:100%;display:block}.map-cell .lab{text-shadow:0 1px 2px #000;font-family:monospace;font-size:15px;font-weight:700;position:absolute;top:5px;left:6px}.map-cell .pct{color:#fff;text-shadow:0 1px 2px #000;font-family:monospace;font-size:13px;position:absolute;bottom:5px;right:6px}.map-cell .cnt{color:#cfe6ff;text-shadow:0 1px 2px #000;font-family:monospace;font-size:12px;position:absolute;bottom:5px;left:6px}.note{color:var(--text);background:#f4f6f9;border-radius:6px;padding:9px;font-size:13px;line-height:1.7}.note b{color:var(--navy)}.placeholder{color:var(--sub);text-align:center;background:#f4f6f9;border-radius:6px;padding:18px;font-size:14px}.centre .panel{flex-direction:column;flex:1;min-height:0;display:flex}.centre .viewer-wrap{flex:1;min-height:0;display:flex}#cv{cursor:crosshair;flex:1;min-height:0}.quest{flex-direction:column;gap:5px;list-style:none;display:flex}.quest li{color:var(--sub);align-items:center;gap:7px;font-size:13px;line-height:1.4;display:flex}.quest li.done{color:var(--green)}.quest li .bx{border:2px solid var(--border);border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:17px;height:17px;font-size:11px;display:inline-flex}.quest li.done .bx{border-color:var(--green);background:var(--green);color:#fff}.scorebar{color:var(--sub);font-size:13px;font-weight:400}.scorebar b{color:var(--crimson);font-size:18px}.metric{border-bottom:1px dashed var(--border);justify-content:space-between;padding:5px 0;font-size:13px;display:flex}.metric .k{color:var(--sub)}.metric .v{color:var(--navy);font-weight:700}.spot-tbl{border-collapse:collapse;width:100%;margin-top:6px;font-family:monospace;font-size:12px}.spot-tbl th,.spot-tbl td{border:1px solid var(--border);text-align:right;padding:3px 5px}.spot-tbl th{color:var(--navy);background:#eef1f6}.spot-tbl td:first-child,.spot-tbl th:first-child{text-align:left}.spot-tbl tr.avg{background:#eafaf0;font-weight:700}.spot-prog{color:var(--sub);margin-top:6px;font-size:13px}.spot-prog b{color:var(--crimson)}#quizOverlay{backdrop-filter:blur(3px);z-index:1000;background:#080c14c7;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}#quizOverlay.show{display:flex}.quiz-card{border-top:5px solid var(--crimson);background:#fff;border-radius:14px;width:100%;max-width:560px;padding:26px;box-shadow:0 20px 60px #00000080}.quiz-card h3{color:var(--navy);margin-bottom:6px;font-size:22px}.quiz-card .q{margin:10px 0 16px;font-size:16px;line-height:1.6}.quiz-card .q b{color:var(--crimson)}.quiz-opts{flex-direction:column;gap:10px;display:flex}.quiz-opt{text-align:left;border:2px solid var(--border);cursor:pointer;background:#f8fafc;border-radius:10px;padding:14px 16px;font-size:15px;line-height:1.5}.quiz-opt:hover{border-color:var(--navy)}.quiz-opt b{color:var(--navy)}.quiz-opt.correct{border-color:var(--green);background:#1f8a4c1f}.quiz-opt.wrong{border-color:var(--crimson);background:#9e1b321a}.quiz-fb{margin-top:16px;font-size:14px;line-height:1.6;display:none}.quiz-fb.show{display:block}.quiz-fb.good{color:var(--green)}.quiz-fb.bad{color:var(--crimson)}.quiz-close{background:var(--navy);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;margin-top:18px;padding:13px;font-size:15px;font-weight:700;display:none}.quiz-close.show{display:block}@media (width<=1000px){.layout{grid-template-columns:1fr;height:auto}.col{overflow:visible}}.vto-back-bar{z-index:9999;backdrop-filter:blur(10px);background:#ffffffeb;border-bottom:1px solid #123a8624;align-items:center;gap:10px;padding:9px 18px;display:flex;position:fixed;top:0;left:0;right:0;box-shadow:0 2px 8px #09193812}.vto-back-bar a{color:#123a86;border:1px solid #123a8640;border-radius:999px;align-items:center;gap:7px;padding:6px 14px;font-size:12px;font-weight:700;text-decoration:none;display:inline-flex}.vto-back-bar span{color:#52627d;font-size:12px;font-weight:600}body{padding-top:48px!important}