/* The academy owns its layout, never the live battle's HUD or saved settings. */
.tutorial-viewbar [data-training-guide]{outline:1px solid #90e5ff;outline-offset:3px;box-shadow:0 0 14px #69ceff44;color:#d7f7ff}
.tutorial-waypoint circle{fill:#79e8df13;stroke:#90eee5;stroke-width:.045;stroke-dasharray:.12 .08}.tutorial-waypoint path{stroke:#b3fff2;stroke-width:.045;fill:none}.tutorial-waypoint text{fill:#aefff0!important;font-size:.22px!important;stroke:none!important;letter-spacing:.02px}
body.frontend-tutorial .masthead,body.frontend-tutorial .sound-access,body.frontend-tutorial #online-status{display:none!important}
#tutorial-screen{max-width:none;padding:0;min-height:100svh;background:linear-gradient(110deg,#030c14f5,#081622eb),url('./assets/backgrounds/classic-hd.webp') center/cover fixed;color:#d9eaf2}
.tutorial-shell{max-width:1920px;margin:auto;padding:0 28px 24px}
.tutorial-header{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:100px;border-bottom:1px solid #244452;margin-bottom:28px}
.tutorial-brand{display:flex;align-items:center;gap:16px;min-width:0}.tutorial-brand>svg{width:42px;height:42px;fill:none;stroke:#80d9f7;stroke-width:1.1;filter:drop-shadow(0 0 9px #67cffd55)}
#tutorial-screen .eyebrow{font:600 10px Rajdhani,sans-serif;letter-spacing:.19em;color:#6facc3;margin:0 0 8px}
.tutorial-header h1{font:500 clamp(19px,2vw,27px) Orbitron,Rajdhani,sans-serif;letter-spacing:.035em;margin:0;color:#e0f2fa;text-shadow:0 0 18px #70bdff24}
.tutorial-header-actions{display:flex;align-items:center;gap:10px}.tutorial-header-actions button{font-size:13px;padding:9px 15px}.tutorial-total{font:12px Rajdhani,sans-serif;color:#7fa8b9;margin-right:10px;white-space:nowrap}
#tutorial-screen button{border-radius:0 7px 0 0;cursor:pointer}#tutorial-screen button:focus-visible,#tutorial-screen summary:focus-visible{outline:2px solid #87e4ff;outline-offset:3px}#tutorial-screen button:disabled{cursor:default;opacity:.4}
.tutorial-welcome{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(250px,1fr);gap:60px;align-items:center;max-width:1270px;padding:24px 28px 38px;margin:auto}
.tutorial-welcome h2{font:500 clamp(24px,2.8vw,38px)/1.4 Orbitron,Rajdhani,sans-serif;margin:12px 0 18px}.tutorial-welcome h2 span{color:#87cfe9}.tutorial-welcome p{font-size:16px;line-height:1.65;max-width:670px;color:#99b3c2}.tutorial-welcome .primary{margin-top:10px;padding:13px 26px}.tutorial-welcome aside{padding:25px;border-left:1px solid #356a80;background:linear-gradient(100deg,#10314566,transparent)}
.tutorial-simulation{font:10px Orbitron,sans-serif;letter-spacing:.12em;color:#9ee5c0}.tutorial-welcome strong{display:block;font:500 21px/1.6 Orbitron,sans-serif;margin-top:18px}.tutorial-welcome aside p{font-size:13px}.tutorial-hub-progress{height:3px;background:#203744;display:block;margin-top:22px}.tutorial-hub-progress i{height:100%;background:#9ee5c0;display:block;box-shadow:0 0 10px #8bdabc66}
.tutorial-curriculum{max-width:1500px;margin:auto}.tutorial-curriculum>section{margin:18px 0 32px}.tutorial-section-heading{display:flex;gap:14px;align-items:baseline;margin-bottom:13px}.tutorial-section-heading h2{font:500 13px Orbitron,sans-serif;letter-spacing:.09em;margin:0}.tutorial-section-heading>span{font-size:12px;color:#698f9f}
.tutorial-lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.tutorial-lesson-card{display:flex;flex-direction:column;gap:15px;text-align:left;position:relative;padding:22px!important;min-height:200px;background:linear-gradient(125deg,#112d3bb0,#081723a0);border:1px solid #244758!important;border-top-color:#437b91!important;transition:border-color .15s,background .15s}.tutorial-lesson-card:hover{background:#153342db;border-color:#79cce5!important}.tutorial-lesson-card.is-complete{border-top-color:#88d6ae!important}.tutorial-card-top{display:flex;justify-content:space-between;gap:12px;font:9px Orbitron,sans-serif;letter-spacing:.07em;color:#77aec4}.tutorial-card-top small{font:12px Rajdhani,sans-serif;color:#a3c6d5}.tutorial-lesson-card>strong{font:500 16px Orbitron,Rajdhani,sans-serif;color:#d8f0ff}.tutorial-card-summary{font:14px/1.5 Rajdhani,sans-serif;color:#9cb8c9}.tutorial-card-link{font:13px Rajdhani,sans-serif;color:#7fd7ef;margin-top:auto;display:flex;justify-content:space-between;align-items:center}.tutorial-card-link b{font-size:22px;font-weight:400}.tutorial-footer{max-width:1500px;margin:30px auto 0;padding-top:17px;border-top:1px solid #203c4b;color:#648798;font-size:12px}
.tutorial-layout{display:grid;grid-template-columns:208px minmax(0,1fr);gap:22px;align-items:start}.tutorial-main{min-width:0}.tutorial-rail{position:sticky;top:14px;display:flex;flex-direction:column;gap:4px}.tutorial-rail h2{font:9px Orbitron,sans-serif;letter-spacing:.12em;color:#6f9caf;margin:22px 10px 7px}.tutorial-rail button{background:transparent;border:1px solid transparent;text-align:left;display:flex;align-items:center;gap:9px;padding:9px 8px;font-size:13px;color:#99b8c8}.tutorial-rail button:hover{background:#17354577}.tutorial-rail button[aria-current]{background:#123444aa;border-color:#3c7a90;color:#d7f3ff}.tutorial-qualification{font:9px Orbitron,sans-serif;color:#638a9d;min-width:20px}.tutorial-qualification.is-complete{color:#92deb3}.tutorial-rail small{display:block;color:#77a693;font-size:10px;margin-top:2px}.tutorial-rail .tutorial-back{border-color:#244758;color:#a7d7ea;padding:10px}
.tutorial-exercise{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:18px;align-items:start}.tutorial-coach{padding:22px;background:linear-gradient(135deg,#112c3cdb,#081722e8);border:1px solid #2a4c5e;border-top:2px solid #6ab7d7;position:sticky;top:14px}.tutorial-step-track{display:flex;gap:4px;margin:14px 0 22px}.tutorial-step-track i{height:3px;background:#284451;flex:1}.tutorial-step-track .done{background:#94d6b4}.tutorial-step-track .current{background:#70c7f1;box-shadow:0 0 10px #70c7f166}.tutorial-coach h2{font:500 17px/1.5 Orbitron,Rajdhani,sans-serif;margin:0 0 15px;color:#d8f1ff}.tutorial-instruction{font:15px/1.65 Rajdhani,sans-serif;color:#adc4d0;margin-bottom:18px}.tutorial-hint{border-block:1px solid #294a5a;padding:12px 0;font:13px/1.5 Rajdhani,sans-serif}.tutorial-hint summary{color:#7fc5df;cursor:pointer}.tutorial-hint p{margin:12px 0 0;color:#a6c1cf}.tutorial-feedback{font:12px/1.5 Rajdhani,sans-serif;color:#82a8b9;margin:17px 0;min-height:18px}.tutorial-feedback.is-error{color:#ffaea5}.tutorial-action-list{display:flex;flex-direction:column;gap:9px}.tutorial-action-list button{padding:12px 13px;text-align:left;background:#143348;border-color:#396c83;color:#cfedfc;font:600 14px/1.5 Rajdhani,sans-serif}.tutorial-action-list button small{display:block;font:12px/1.4 Rajdhani,sans-serif;color:#85acbf;margin-top:5px}.tutorial-coach-footer{display:flex;flex-direction:column;gap:9px;border-top:1px solid #294958;padding-top:18px;margin-top:20px}.tutorial-coach-footer button{width:100%;font-size:13px;padding:11px}.tutorial-safe-note{font:11px/1.5 Rajdhani,sans-serif;color:#648b9f;margin:17px 0 0}.tutorial-step-confirmed{color:#9ee3ba;font:14px/1.6 Rajdhani,sans-serif}.tutorial-step-confirmed span{font-size:20px;margin-right:6px}.tutorial-action-note{font-size:13px;color:#8cbfd2;line-height:1.6}
.tutorial-move-controls>div,.tutorial-point-controls>div{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.tutorial-move-controls label,.tutorial-point-controls label{font-size:12px;color:#91b7cb;display:flex;flex-direction:column;gap:7px}.tutorial-move-controls input,.tutorial-move-controls select,.tutorial-point-controls input{width:100%;min-width:0;padding:9px;font-size:14px}.tutorial-move-controls button,.tutorial-point-controls button{width:100%;font-size:13px;padding:10px}.tutorial-point-controls p{font-size:13px;color:#9dc5d9;line-height:1.5}.tutorial-point-controls .quiet{margin-top:7px}
.tutorial-simulator{min-width:0;border:1px solid #294b5e;background:#030d18}.tutorial-battle-hud{min-height:64px;padding:10px 15px;display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:12px;align-items:center;background:linear-gradient(90deg,#0b233655,#091928);border-bottom:1px solid #294b5e;font:9px/1.5 Orbitron,sans-serif;text-align:center;letter-spacing:.045em}.tutorial-team-a{color:#79d2ff;text-align:left}.tutorial-team-b{color:#ef8790;text-align:right}.tutorial-battle-hud [data-training-phase]{font-size:13px;color:#d5e9f6;display:block}.tutorial-battle-hud small{font:9px Rajdhani,sans-serif;color:#7499ad;display:block;margin-top:4px;letter-spacing:.09em}.tutorial-viewbar{display:flex;flex-wrap:wrap;gap:5px 10px;align-items:center;padding:9px 10px;border-bottom:1px solid #244452;background:#0a1b27}.tutorial-viewbar button{font-size:11px;padding:6px 8px;min-height:30px}.tutorial-viewbar button[aria-pressed=true]{border-color:#8bd9f1;background:#19455c;box-shadow:0 0 9px #6fcbff44}.tutorial-viewbar label{display:flex;gap:5px;align-items:center;font-size:11px;color:#91b5c8;white-space:nowrap}.tutorial-viewbar input{accent-color:#6dceeb;margin:0}.tutorial-board-wrap{position:relative;overflow:hidden}.tutorial-board{display:block;width:100%;height:clamp(370px,56vh,760px);min-height:0;border:0;background:#07121e;touch-action:none}.tutorial-inspection{position:absolute;bottom:14px;left:14px;max-width:min(340px,calc(100% - 28px));padding:13px 17px;background:#071a29ee;border:1px solid #43788f;pointer-events:none;font:12px/1.8 Rajdhani,sans-serif;color:#9dbfd2}.tutorial-inspection>strong{display:block;color:#d6ecf8;font-family:Orbitron,sans-serif;font-size:12px}.tutorial-inspection>span{display:block}.tutorial-inspection b{font-size:10px;color:#8fdac2;margin-right:4px}.tutorial-table-footer{display:flex;justify-content:space-between;gap:15px;padding:10px 14px;border-top:1px solid #244452;font:11px Rajdhani,sans-serif;letter-spacing:.04em;color:#79afc7}.tutorial-log{padding:13px 14px;border-top:1px solid #244452;font:12px/1.6 Rajdhani,sans-serif;color:#7d9daf}.tutorial-log summary{cursor:pointer}.tutorial-log ol{padding-left:20px;color:#a2bac9;max-height:160px;overflow:auto}
.tutorial-complete{border:1px solid #3b6b7b;background:linear-gradient(135deg,#123440b0,#071622a0);padding:clamp(28px,5vw,70px);min-height:430px}.tutorial-complete-emblem{display:grid;place-items:center;width:64px;height:64px;border:1px solid #64c8ac;border-radius:50%;font-size:32px;color:#a3f0cd;box-shadow:0 0 35px #56b49f22;margin-bottom:30px}.tutorial-complete h2{font:500 clamp(22px,3vw,36px)/1.6 Orbitron,sans-serif;margin:17px 0}.tutorial-complete h2 span{color:#a3e4c2}.tutorial-complete p:not(.eyebrow){font:16px/1.7 Rajdhani,sans-serif;color:#a3c1ce;max-width:700px}.tutorial-complete>div{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.tutorial-complete button{padding:12px 20px;font-size:14px}
.tutorial-fleet-stage{min-width:0}.tutorial-fleet-coach{padding:20px 24px;margin-bottom:20px;border:1px solid #376174;border-top:2px solid #70bddb;background:#102936d9}.tutorial-fleet-coach>p{color:#a1bdcb;font-size:14px;line-height:1.6}.tutorial-fleet-coach ol{display:grid;grid-template-columns:repeat(2,1fr);padding:0;list-style:none;gap:10px 22px;margin:18px 0}.tutorial-fleet-coach li{border-left:2px solid #335468;padding:10px 14px;background:#0c1c2780}.tutorial-fleet-coach li strong{font:500 12px/1.6 Orbitron,sans-serif;color:#bddae9}.tutorial-fleet-coach li p{font:13px/1.6 Rajdhani,sans-serif;color:#8baabc;margin:8px 0 0}.tutorial-fleet-coach li[data-complete=true]{border-color:#8bdbac}.tutorial-fleet-coach li[data-complete=true] strong{color:#94deba}.tutorial-fleet-coach button{font-size:13px;margin:0 9px 5px 0;padding:10px 16px}.tutorial-fleet-coach [data-fleet-check]{border-color:#70baca;background:#1c4553;color:#d9f4ff}.tutorial-fleet-builder{min-width:0}.tutorial-fleet-builder .fb-shell{max-width:none}
@media(max-width:1400px){.tutorial-layout{grid-template-columns:180px minmax(0,1fr);gap:15px}.tutorial-exercise{grid-template-columns:250px minmax(0,1fr);gap:12px}.tutorial-coach{padding:18px}.tutorial-shell{padding-inline:20px}.tutorial-header-actions button{padding:8px 11px}.tutorial-battle-hud{font-size:8px;gap:8px}}
@media(max-width:1100px){.tutorial-layout{display:block}.tutorial-rail{position:static;display:flex;flex-direction:row;overflow:auto;margin-bottom:18px;padding-bottom:8px}.tutorial-rail h2{display:none}.tutorial-rail button{flex-shrink:0;max-width:180px}.tutorial-rail small{display:none}.tutorial-board{height:58vh}.tutorial-header{gap:14px}.tutorial-total{display:none}}
@media(max-width:720px){.tutorial-shell{padding:0 12px 20px}.tutorial-header{min-height:94px;margin-bottom:20px;align-items:start;padding:20px 0;flex-wrap:wrap}.tutorial-brand>svg{width:30px;height:30px}.tutorial-header h1{font-size:18px}.tutorial-header-actions{margin-left:46px}.tutorial-header-actions button{font-size:12px}.tutorial-welcome{display:block;padding:8px 5px 20px}.tutorial-welcome h2{font-size:24px}.tutorial-welcome aside{margin-top:25px;padding:18px}.tutorial-welcome strong{font-size:17px}.tutorial-lesson-grid{grid-template-columns:1fr 1fr;gap:10px}.tutorial-lesson-card{padding:16px!important;min-height:220px;gap:13px}.tutorial-lesson-card>strong{font-size:13px;line-height:1.5}.tutorial-card-top{flex-wrap:wrap;font-size:8px}.tutorial-card-summary{font-size:13px}.tutorial-exercise{display:flex;flex-direction:column}.tutorial-coach{position:static;width:100%;box-sizing:border-box}.tutorial-coach-footer{flex-direction:row}.tutorial-coach-footer button{width:50%;font-size:12px}.tutorial-simulator{width:100%}.tutorial-board{height:55vh;min-height:320px}.tutorial-safe-note{margin-top:12px}.tutorial-battle-hud{padding:10px;font-size:7px;grid-template-columns:1fr 1fr 1fr}.tutorial-battle-hud [data-training-phase]{font-size:11px}.tutorial-battle-hud small{font-size:8px}.tutorial-fleet-coach{padding:16px}.tutorial-fleet-coach ol{grid-template-columns:1fr}.tutorial-complete{min-height:360px;padding:24px}.tutorial-complete button{font-size:12px;padding:11px 13px}}
@media(max-width:400px){.tutorial-lesson-grid{grid-template-columns:1fr}.tutorial-lesson-card{min-height:180px}.tutorial-brand{gap:10px}.tutorial-header-actions{margin-left:40px}}
@media(prefers-reduced-motion:reduce){.tutorial-lesson-card{transition:none}}
[data-voice-caption] [data-voice-word]{transition:color .06s ease,text-shadow .06s ease}
[data-voice-caption] .is-speaking{color:#ffe3a0;text-shadow:0 0 5px #f7c85d99,0 0 13px #c9933159}
@media(prefers-reduced-motion:reduce){[data-voice-caption] [data-voice-word]{transition:none}}
.tutorial-voice{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;padding:12px 18px;margin:-12px 0 24px;border:1px solid #305467;border-left:2px solid #7ccbe8;background:linear-gradient(100deg,#102b39c9,#07141ec0);color:#b7d2df}.tutorial-voice-officer{display:flex;align-items:center;gap:12px}.tutorial-voice-officer>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid #5d9fb7;border-radius:50%;color:#a1e2f9;text-shadow:0 0 10px #74d1ed;font-size:21px}.tutorial-voice-officer strong{display:block;font:500 15px/1.7 Orbitron,sans-serif;color:#d6edfa}.tutorial-voice-officer small{display:block;font:10px/1.5 Rajdhani,sans-serif;letter-spacing:.12em;color:#83a6b9}.tutorial-voice-controls{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-left:auto}.tutorial-voice-controls button{font:600 12px/1.4 Rajdhani,sans-serif;padding:8px 12px;min-height:36px;white-space:nowrap}.tutorial-voice-controls label{display:flex;align-items:center;gap:6px;font:13px/1.5 Rajdhani,sans-serif}.tutorial-voice-controls input[type=checkbox]{accent-color:#8dc9df}.tutorial-voice-volume input{width:85px;accent-color:#8dc9df}.tutorial-voice-volume output{min-width:30px;font-variant-numeric:tabular-nums}.tutorial-voice [data-tutorial-voice-status]{font:11px/1.5 Rajdhani,sans-serif;letter-spacing:.04em;color:#8cb2c4;flex-basis:100%}.tutorial-voice button:focus-visible,.tutorial-voice input:focus-visible{outline:2px solid #b9f1ff;outline-offset:3px}
.tutorial-fleet-coach li[aria-current=step]{border-left-color:#8fdcf4;background:#153545a0}.tutorial-fleet-coach li[aria-current=step] strong{color:#d4f2ff}
@media(max-width:720px){.tutorial-voice{padding:12px;margin-top:0;gap:12px}.tutorial-voice-controls{margin-left:0;gap:8px}.tutorial-voice-controls button{min-height:40px}.tutorial-voice-officer strong{font-size:13px}.tutorial-voice-volume{flex-wrap:wrap}.tutorial-voice-volume input{width:80px}}
