/* A clear world view, with contextual tools instead of a permanent control deck. */
#mapPanel,#bottom,.drag-hint,.mobile-buttons,#touchView,#touchFunction,#touchInteract,#touchAction{display:none!important}
#hud{inset:15px 15px auto auto!important;width:auto}#hud .connection{margin:0!important;gap:6px}#hud .connection button{width:32px;height:32px}
body.playing #languageToggle,.touch-mode.playing #languageToggle{top:15px;right:100px;min-height:32px}
#modalToolbar #languageToggle{position:static;min-height:40px}#modalToolbar+#modalBody h2{padding-right:0}
#interaction{bottom:36px!important;left:50%;max-width:calc(100vw - 110px);padding:12px 18px;pointer-events:none}
.touch-mode #interaction{left:18px;transform:none;max-width:calc(100vw - 125px)}
#touchLook{right:18px!important;bottom:max(18px,env(safe-area-inset-bottom))!important}
#roamTimer{position:fixed;inset:0 0 auto;height:4px;z-index:85;background:#10202c;box-shadow:0 1px 12px #0008;pointer-events:none}
#roamTimer i{position:absolute;inset:0;transform-origin:left;background:linear-gradient(90deg,#498bff,#72f4dc);box-shadow:0 0 12px #52cbff}
#roamTimer span{position:absolute;top:8px;left:50%;transform:translateX(-50%);font:9px monospace;letter-spacing:1.3px;white-space:nowrap;color:#d7e9ff;text-shadow:0 1px 4px #000}
#roamTimer.paused i{opacity:.45}#roamTimer.due{animation:practiceDue 1s infinite alternate}
#scoreHUD{position:fixed;left:18px;top:19px;z-index:65;pointer-events:none;text-shadow:0 2px 10px #000c;color:#f1fff9}
#scoreHUD>span{display:block;font:8px monospace;letter-spacing:2px;color:#b6d8e9}#scoreHUD>strong{font:600 clamp(23px,3vw,32px) 'Space Grotesk',sans-serif;display:block;transform:scale(calc(1 + var(--score-pulse,0)*.12));transform-origin:left}
#scoreHUD>small{display:block;color:#74eaff;font:10px monospace;min-height:14px;letter-spacing:1px}
#scoreHUD.on-fire>strong{color:#9df5ff;filter:drop-shadow(0 0 13px #269bff)}#scoreHUD.on-fire>small{color:#ffdc83}
[data-point-bursts]{position:absolute;top:25px;left:100%;min-width:170px}.point-burst{position:absolute;white-space:nowrap;color:#b3fff2;font:700 17px monospace;animation:pointFly 1.6s both}
.combo-flare{position:fixed;inset:0;pointer-events:none;z-index:62;border:2px solid #62caff66;box-shadow:inset 0 -90px 100px -85px #398fff,inset 0 0 80px -60px #b3f9ff;animation:comboFlash 1s both}
#keyboardTutorial{position:fixed;inset:0;z-index:58;pointer-events:none;background:linear-gradient(0deg,#020916bd,transparent 58%)}
.tutorial-copy{position:absolute;bottom:7vh;left:50%;transform:translateX(-50%);width:min(620px,90vw);padding:22px 26px;background:linear-gradient(135deg,#061727ef,#08111fe8);border:1px solid #5eb8ff80;border-radius:14px;box-shadow:0 0 65px #0a66be30;color:#edf8ff;pointer-events:auto}
.tutorial-copy>span{font:9px monospace;letter-spacing:3px;color:#6dc6ff}.tutorial-copy h2{font:500 clamp(23px,4vw,35px) 'Space Grotesk';margin:12px 0}.tutorial-copy p{font-size:14px;line-height:1.6;color:#c7e4fc}.tutorial-copy small{font:10px monospace;color:#83abc9}.tutorial-copy>div{display:flex;justify-content:space-between;margin-top:18px;gap:10px}.tutorial-copy button{border:1px solid #5fc5ff66;background:#143858;color:#eafaff;border-radius:6px;padding:10px 16px}.tutorial-copy button:last-child{background:transparent}
.tutorial-key-hint{display:block;font:700 24px monospace;letter-spacing:2px;color:#69bfff;text-shadow:0 0 18px #208cffa0;margin:10px 0 3px}
body.tutorial-mode #interaction,body.tutorial-mode #mobileControls,body.tutorial-mode #hud,body.tutorial-mode #languageToggle,body.tutorial-mode #crosshair{visibility:hidden!important}
.context-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px}.context-tools button{display:flex;align-items:center;gap:14px;padding:14px;background:#0c1d2c;border:1px solid #55717c;border-radius:9px;text-align:left}.context-tools button b{font:25px monospace;color:#92d5ff}.context-tools button.selected{background:#133e59;border-color:#77d7ff;box-shadow:0 0 22px #249bff40}.context-tools button.selected:after{content:'◀';margin-left:auto;color:#7cdcff}
body.keyboard-mode #scoreHUD{z-index:70}body.keyboard-mode .typing-heading{top:92px}body.keyboard-mode .typing-stats{top:20px;right:22px}
body.keyboard-mode #liftStatus{display:none!important}
body.projection-flight #resultFoot:after{content:' · SPACE / ENTER / ESC TO RETURN'}
.typing-overlay[data-session-mode="practice"][data-typing-paused="true"] .typing-reader{background:#09192bf2;border:1px solid #5bb8ff}
[hidden]{display:none!important}
@keyframes pointFly{0%{opacity:0;transform:translate(0,12px) scale(.6)}15%{opacity:1;transform:translate(10px,0) scale(1.2)}100%{opacity:0;transform:translate(45px,-65px) scale(.9)}}
@keyframes comboFlash{0%{opacity:0}18%{opacity:1}100%{opacity:0}}@keyframes practiceDue{to{background:#4397e9}}
@media(max-width:600px){#scoreHUD{top:18px;left:12px}#scoreHUD>span{font-size:7px}#scoreHUD>small{font-size:8px}#roamTimer span{top:70px;font-size:8px;background:#081727b8;padding:4px 8px;border-radius:8px}.tutorial-copy{bottom:25px;padding:16px 20px}.tutorial-copy p{font-size:12px}.tutorial-copy>div{margin-top:12px}.tutorial-copy button{font-size:11px;padding:10px}.typing-stats{gap:11px!important}.typing-stats strong{font-size:19px!important}.typing-stats span{font-size:7px!important}.typing-heading{max-width:88vw}.typing-heading h2{font-size:23px!important}.context-tools button{padding:12px 10px;gap:9px;font-size:12px}.point-burst{font-size:13px}}
@media(prefers-reduced-motion:reduce){.combo-flare{display:none}.point-burst{animation-duration:.4s}}
@media(max-height:520px){.tutorial-copy{bottom:10px;padding:10px 18px;width:min(530px,85vw)}.tutorial-copy>span{font-size:8px}.tutorial-key-hint{font-size:17px;margin:5px 0}.tutorial-copy h2{font-size:19px;margin:4px 0}.tutorial-copy p{font-size:11px;line-height:1.4;margin:6px 0}.tutorial-copy>div{margin-top:7px}.tutorial-copy button{padding:7px 12px;font-size:10px}}
