:root {
 --bg-core:#05070a;
 --bg-deep:#010307;
 --panel:#050a10;
 --panel-strong:#071019;

 --text-main:#e8fbff;
 --text-muted:rgba(169,184,199,0.72);

 --accent:#63d7ff;
 --accent-soft:rgba(99,215,255,0.18);
 --accent-border:rgba(99,215,255,0.48);

 --danger:#d84cff;
 --danger-soft:rgba(216,76,255,0.18);
 --warning:#ffb347;

 --shadow-cyan:rgba(99,215,255,0.26);
 --shadow-danger:rgba(216,76,255,0.24);
}

* {
 cursor: none !important;
}

@keyframes pulse {
  0% {
    box-shadow:
      0 0 26px var(--shadow-cyan),
      -2px 0 8px var(--shadow-danger);
  }

  50% {
    box-shadow:
      0 0 42px var(--shadow-cyan),
      -4px 0 18px var(--shadow-danger);
  }

  100% {
    box-shadow:
      0 0 26px var(--shadow-cyan),
      -2px 0 8px var(--shadow-danger);
  }
}

body {
 margin:0;
 background: radial-gradient(circle at center, var(--bg-core) 0%, var(--bg-deep) 100%);
 font-family:Consolas, "Courier New", monospace;
 display:flex;
 justify-content:center;
 align-items:center;
 height:100vh;
 overflow:hidden;
}

#game {
 background:#05070a;
 border:1px solid rgba(99,215,255,0.22);
 box-shadow:0 0 22px rgba(99,215,255,0.14), 0 0 18px rgba(139,92,255,0.10);
 position: relative;
 z-index:1;
 opacity:1;
 transform:scale(1);
 filter:none;
 transition:
  opacity 0.45s ease,
  transform 0.45s ease,
  filter 0.45s ease;
}

#cursorCanvas {
 position:fixed;
 left:0;
 top:0;
 width:100vw;
 height:100vh;
 pointer-events:none;
 z-index:10000;
}

canvas { display:block; margin:0 auto; }

.game-legal-links {
 position:fixed;
 right:14px;
 bottom:10px;
 z-index:12000;
 display:flex;
 gap:12px;
 color:rgba(232,251,255,0.58);
 font-size:11px;
 line-height:1;
 pointer-events:auto;
}

.game-legal-links a {
 color:inherit;
 text-decoration:none;
}

.game-legal-links a:hover {
 color:var(--text-main);
}

#gameContainer {
 position:relative;
}

#cockpitLayout {
 position:relative;
}

#arenaColumn {
 position:relative;
 width:900px;
 margin:0 auto;
}

#ui {
 position:absolute;
 top:22px;
 left:22px;
 width:190px;
 min-height:400px;
 color:var(--text-main);
 background:
  linear-gradient(90deg, rgba(99,215,255,0.06), transparent 18px),
  linear-gradient(180deg, rgba(99,215,255,0.06), transparent 42px),
  rgba(5,10,16,0.82);
 border:1px solid rgba(99,215,255,0.34);
 border-left-color:rgba(216,76,255,0.46);
 box-shadow:
  0 0 18px rgba(99,215,255,0.18),
  -8px 0 22px rgba(139,92,255,0.12),
  inset 0 0 18px rgba(1,3,7,0.72);
 padding:14px 14px 12px;
 z-index:10;
 display:none;
 font-size:14px;
 line-height:1.35;
 box-sizing:border-box;
 overflow:hidden;
 backdrop-filter:blur(1px);
 clip-path:polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

#ui::before,
#ui::after {
 content:"";
 position:absolute;
 pointer-events:none;
}

#ui::before {
 inset:6px;
 border-top:1px solid rgba(99,215,255,0.22);
 border-bottom:1px solid rgba(99,215,255,0.12);
 opacity:0.9;
}

#ui::after {
 left:0;
 top:0;
 width:100%;
 height:100%;
 background:
  repeating-linear-gradient(
   180deg,
   rgba(255,255,255,0.035) 0,
   rgba(255,255,255,0.035) 1px,
   transparent 1px,
   transparent 9px
  );
 mix-blend-mode:screen;
 opacity:0.24;
}

#ui.ingame {
 left:max(-230px, calc(((900px - 100vw) / 2) + 14px));
 width:210px;
}

#menu {
 position:fixed;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 background:rgba(5,7,12,0.84);
 backdrop-filter:blur(2px);
 animation:pulse 5s infinite ease-in-out;
 color:var(--text-main);
 border:1px solid var(--accent-border);
 box-shadow:0 0 34px var(--shadow-cyan), -3px 0 18px var(--shadow-danger);
 padding:34px 38px;
 text-align:center;
 display:none;
 z-index:100;
 width:700px;
 height:540px;
 max-width:90vw;
 box-sizing:border-box;
 overflow:hidden;
}

.menuScreen {
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
}

.menuScreenStart .menuScreenHeader,
.menuScreenStart .menuScreenBody,
.menuScreenStart .menuActionGroup{
 flex:0 0 auto;
}

.menuScreenStart .menuScreenBody {
 justify-content:flex-start;
 overflow:visible;
 margin-top:16px;
}

.menuScreenStart .modeGrid {
 margin-top:0;
}

.menuScreenTutorial .menuScreenBody {
 justify-content:center;
}

.menuScreenFeedback .menuScreenBody {
 justify-content:flex-start;
 overflow-y:auto;
 overflow-x:hidden;
 padding-right:8px;
}

.menuScreenFeedback .menuScreenBody::-webkit-scrollbar{
 width:6px;
}

.menuScreenFeedback .menuScreenBody::-webkit-scrollbar-track{
 background:rgba(98,243,255,0.06);
 border-left:1px solid rgba(98,243,255,0.10);
}

.menuScreenFeedback .menuScreenBody::-webkit-scrollbar-thumb{
 background:rgba(98,243,255,0.46);
 box-shadow:0 0 8px var(--shadow-cyan);
}

.menuScreenFeedback .menuScreenBody::-webkit-scrollbar-thumb:hover{
 background:rgba(98,243,255,0.72);
}

.menuScreenFeedback .feedbackForm {
 display:grid;
 grid-template-columns:1fr;
 gap:10px;
 margin-top:14px;
 text-align:left;
}

.menuScreenFeedback .feedbackField textarea {
 width:100%;
 min-height:62px;
 max-height:62px;
 resize:none;
 overflow:hidden;
 box-sizing:border-box;
 background:rgba(5,7,12,0.74);
 color:var(--text-main);
 border:1px solid rgba(98,243,255,0.22);
 padding:9px 10px;
 font-family:inherit;
 font-size:11px;
 line-height:1.4;
 outline:none;
}

.menuScreenFeedback .feedbackSelect {
 height:34px;
 padding:0 10px;
}

.menuScreenFeedback .feedbackField label {
 margin-bottom:3px;
 font-size:9px;
}

.menuScreenFeedback .menuLogArchive {
 margin-top:0;
 margin-bottom:6px;
}

.menuScreenTutorial .menuLogArchive {
 margin-top:0;
}

.menuScreenTutorial .menuLogGrid {
 margin-top:16px;
}

.menuScreenFeedback .feedbackPrivacy {
 margin-top:4px;
 font-size:9px;
 line-height:1.35;
}

.menuScreenFeedback .feedbackRunContext{
 width:100%;
 margin:0 0 10px 0;
}

.menuScreenFeedback .feedbackRunContextTitle{
 margin:0 0 8px 0;
 text-align:center;
 color:var(--danger);
 font-size:9px;
 letter-spacing:2px;
 text-shadow:0 0 6px var(--shadow-danger);
}

.menuScreenFeedback .feedbackRunContextGrid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:5px 10px;
}

.menuScreenFeedback .feedbackRunContextGrid .menuLogRow{
 padding:5px 9px 5px 13px;
 min-height:24px;
}

.menuScreenFeedback .feedbackRunContextGrid .menuLogLabel,
.menuScreenFeedback .feedbackRunContextGrid .menuLogValue{
 font-size:9px;
}

.feedbackPanelNotice{
 width:100%;
 box-sizing:border-box;
 margin:0 0 10px 0;
 padding:9px 12px;
 color:var(--text-main);
 background:rgba(5,10,16,0.82);
 border:1px solid rgba(99,215,255,0.28);
 box-shadow:inset 0 0 10px rgba(1,3,7,0.66);
 font-size:10px;
 line-height:1.35;
 letter-spacing:1px;
 text-align:center;
 text-transform:uppercase;
}

.feedbackPanelNotice.warning{
 color:var(--danger);
 border-color:rgba(216,76,255,0.42);
 text-shadow:0 0 6px var(--shadow-danger);
}

.feedbackPanelNotice.info{
 color:var(--accent);
 border-color:rgba(99,215,255,0.42);
 text-shadow:0 0 6px var(--shadow-cyan);
}

.menuScreenPause .menuScreenBody{
 display:flex;
 flex-direction:column;
 gap:18px;
}

.pauseSnapshotGrid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:10px 28px;
 align-content:start;
}

.pauseActionsGrid{
 display:grid;
 grid-template-columns:repeat(2, minmax(180px, 1fr));
 gap:14px;
 justify-content:center;
 align-items:center;
}

.pauseActionsGrid button{
 width:100%;
}

.pauseExitButton{
 grid-column:1 / -1;
 justify-self:center;
 max-width:260px;
}

.menuScreenHeader {
 flex:0 0 auto;
}

.menuScreenBody {
 flex:1 1 auto;
 min-height:0;
 display:flex;
 flex-direction:column;
 justify-content:center;
 overflow:hidden;
}

.menuScreenActions {
 flex:0 0 auto;
 margin-top:24px;
 display:flex;
 justify-content:center;
 gap:12px;
 flex-wrap:wrap;
}

.menuScreenActions button {
 min-width:128px;
 height:34px;
 padding:0 14px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 box-sizing:border-box;
}

.menuActionGroup{
 margin-top:12px;
}

.menuActionLabel{
 margin-bottom:10px;
 color:var(--accent);
 font-size:10px;
 letter-spacing:1.6px;
 opacity:0.72;
 text-align:center;
}

.menuProtocolLabel{
 display:none;
}

.secondaryActionGrid{
 margin-top:0;
 display:grid;
 grid-template-columns:repeat(3, minmax(132px, 1fr));
 gap:8px 10px;
 max-width:520px;
 margin-left:auto;
 margin-right:auto;
}

.secondaryActionGrid button{
 width:100%;
 height:32px;
 min-width:0;
 font-size:11px;
}

.runLogActions{
 display:grid;
 grid-template-columns:128px minmax(110px, 1fr) 128px;
 gap:32px;
 justify-content:center;
 max-width:430px;
 margin-left:auto;
 margin-right:auto;
}

.runLogActions button{
 width:128px;
 margin:0;
}

.runLogBackButton{
 grid-column:1;
}

.runLogActions .dangerButton{
 grid-column:3;
}

#menu h2 {
 margin:0 0 8px;
 font-size:32px;
 letter-spacing:2px;
 position:relative;
 text-shadow:
  0 0 6px rgba(98,243,255,0.25),
  -1px 0 rgba(255,54,94,0.18);
 animation:titleFlicker 6s infinite;
}

.menuDataTitle {
 animation:titleFlicker 4.6s infinite;
 text-shadow:
  0 0 10px rgba(98,243,255,0.34),
  -1px 0 rgba(255,54,94,0.22);
}

.menuKicker {
 color:var(--danger);
 font-size:10px;
 letter-spacing:2px;
 margin-bottom:8px;
 text-shadow:0 0 8px var(--shadow-danger);
}

.menuLogGrid {
 display:grid;
 grid-template-columns:1fr;
 gap:9px;
 margin-top:22px;
 text-align:left;
}

.menuLogRow {
 position:relative;
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:18px;
 padding:10px 13px 10px 17px;
 border:1px solid rgba(98,243,255,0.16);
 background:rgba(5,7,12,0.38);
 box-shadow:0 0 10px rgba(98,243,255,0.06);
 overflow:hidden;
}

.menuLogRow::before {
 content:"";
 position:absolute;
 left:0;
 top:0;
 width:3px;
 height:100%;
 background:rgba(98,243,255,0.58);
 box-shadow:0 0 10px var(--shadow-cyan);
}

.menuLogLabel {
 color:var(--text-muted);
 font-size:11px;
 letter-spacing:1px;
}

.menuLogValue {
 color:var(--text-main);
 font-size:11px;
 letter-spacing:0.8px;
 font-weight:bold;
 text-align:right;
}

.feedbackForm {
 display:grid;
 grid-template-columns:1fr;
 gap:12px;
 margin-top:22px;
 text-align:left;
}

.feedbackField label {
 display:block;
 color:var(--text-muted);
 font-size:10px;
 letter-spacing:1.2px;
 margin-bottom:6px;
 text-transform:uppercase;
}

.feedbackField textarea {
 width:100%;
 min-height:62px;
 resize:vertical;
 box-sizing:border-box;
 background:rgba(5,7,12,0.74);
 color:var(--text-main);
 border:1px solid rgba(98,243,255,0.22);
 padding:9px 10px;
 font-family:inherit;
 font-size:11px;
 line-height:1.4;
 outline:none;
}

.feedbackField textarea:focus {
 border-color:var(--accent-border);
 box-shadow:0 0 12px rgba(98,243,255,0.14);
}

.feedbackSelect {
 width:100%;
 background:rgba(5,7,12,0.74);
 color:var(--text-main);
 border:1px solid rgba(98,243,255,0.22);
 padding:9px 10px;
 font-family:inherit;
 font-size:11px;
 outline:none;
}

.feedbackPrivacy {
 color:var(--text-muted);
 font-size:9px;
 line-height:1.35;
 opacity:0.7;
 text-align:center;
 margin-top:4px;
}

.menuLogArchive {
 margin-top:22px;
 color:var(--danger);
 font-size:10px;
 letter-spacing:1.6px;
 text-align:center;
 text-shadow:0 0 6px var(--shadow-danger);
}

.menuLogHighlight {
 border-color:rgba(255,54,94,0.34);
 background:rgba(255,54,94,0.055);
 box-shadow:
  0 0 14px rgba(255,54,94,0.10),
  0 0 10px rgba(98,243,255,0.06);
}

.menuLogHighlight::before {
 background:var(--danger);
 box-shadow:0 0 10px var(--shadow-danger);
}

.menu-subtitle {
 color:var(--accent);
 opacity:0.72;
 font-size:13px;
 margin-bottom:24px;
}

.systemStatus {
 margin-bottom:22px;
 color:var(--danger);
 font-size:11px;
 letter-spacing:1.4px;
 opacity:0.78;
 text-shadow:0 0 8px var(--shadow-danger);
}

.modeGrid {
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:10px 14px;
}

.modeButton {
 min-height:64px;
 font-size:15px;
 font-weight:bold;
 letter-spacing:1px;
 position:relative;
 overflow:hidden;
 text-align:left;
 padding-left:18px;
}

.modeButton::before {
 content:"";
 position:absolute;
 left:0;
 top:0;
 width:3px;
 height:100%;
 background:var(--accent);
 opacity:0.65;
 box-shadow:0 0 10px var(--shadow-cyan);
}

.modeButton:hover::before {
 background:var(--danger);
 opacity:0.9;
 box-shadow:0 0 10px var(--shadow-danger);
}

.modeButton small {
 display:block;
 margin-top:6px;
 font-size:11px;
 font-weight:normal;
 opacity:0.75;
}

.menuUtility {
 margin-top:20px;
 display:flex;
 justify-content:center;
 gap:12px;
}

.menuUtility button {
 font-size:11px;
 opacity:0.85;
}

#tooltip {
 position:fixed;
 max-width:260px;
 background:rgba(5,10,16,0.94);
 color:#a9b8c7;
 border:1px solid rgba(99,215,255,0.45);
 border-left-color:rgba(139,92,255,0.68);
 box-shadow:
  0 0 18px rgba(99,215,255,0.16),
  inset 0 0 16px rgba(1,3,7,0.72);
 padding:9px 11px 10px;
 display:none;
 pointer-events:none;
 z-index:1000;
 font-size:12px;
 line-height:1.38;
 text-align:left;
 clip-path:polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
}

#tooltip::before {
 content:"";
 position:absolute;
 left:0;
 top:8px;
 bottom:8px;
 width:2px;
 background:rgba(139,92,255,0.72);
 box-shadow:0 0 8px rgba(139,92,255,0.36);
}

.tooltipTitle {
 color:#9beaff;
 font-weight:700;
 letter-spacing:0.7px;
 margin-bottom:4px;
 text-transform:uppercase;
}

.tooltipBody {
 color:#a9b8c7;
 opacity:0.92;
}

button:hover {
 background:var(--accent-soft);
 color:var(--text-main);
 box-shadow:
  0 0 12px var(--shadow-cyan) inset,
  0 0 12px var(--shadow-cyan),
  -2px 0 8px var(--shadow-danger);
}

.dangerButton{
 color:var(--danger);
 border-color:rgba(255,54,94,0.62);
 background:rgba(255,54,94,0.055);
}

.dangerButton:hover{
 color:var(--text-main);
 background:rgba(255,54,94,0.18);
 border-color:var(--danger);
 box-shadow:
  0 0 12px rgba(255,54,94,0.22) inset,
  0 0 14px var(--shadow-danger);
}

.coreToast{
 position:fixed;
 left:calc(50% + 375px);
 top:calc(50% - 185px);
 transform:translateX(14px);
 z-index:520;
 min-width:250px;
 max-width:310px;
 padding:11px 16px;
 box-sizing:border-box;
 opacity:0;
 pointer-events:none;
 text-align:left;
 color:var(--text-main);
 background:rgba(5,7,12,0.94);
 border:1px solid var(--accent-border);
 box-shadow:
  0 0 22px var(--shadow-cyan),
  -2px 0 10px var(--shadow-danger);
 transition:
  opacity 0.18s ease,
  transform 0.18s ease;
}

.coreToast.gameOverContextToast{
 left:calc(50% + 455px);
 top:calc(50% - 185px);
 min-width:240px;
 max-width:260px;
}

.coreToast.visible{
 opacity:1;
 transform:translateX(0);
}

@media (max-width:1380px){
 .coreToast.gameOverContextToast{
  left:50%;
  right:auto;
  top:auto;
  bottom:26px;
  transform:translate(-50%, 12px);
  max-width:360px;
 }

 .coreToast.gameOverContextToast.visible{
  opacity:1;
  transform:translate(-50%, 0);
 }
}

@media (max-width:1100px){
 .coreToast{
  left:50%;
  right:auto;
  top:auto;
  bottom:26px;
  transform:translate(-50%, 12px);
  max-width:360px;
 }

 .coreToast.visible{
  opacity:1;
  transform:translate(-50%, 0);
 }
}

.coreToast::before{
 content:"";
 position:absolute;
 left:0;
 top:0;
 width:3px;
 height:100%;
 background:var(--accent);
 box-shadow:0 0 10px var(--shadow-cyan);
}

.coreToastKicker{
 color:var(--danger);
 font-size:9px;
 letter-spacing:1.8px;
 margin-bottom:4px;
 text-shadow:0 0 6px var(--shadow-danger);
}

.coreToastMessage{
 font-size:11px;
 letter-spacing:0.8px;
 text-transform:uppercase;
}

.coreConfirmOverlay{
 position:fixed;
 inset:0;
 z-index:500;
 display:flex;
 align-items:center;
 justify-content:center;
 background:
  radial-gradient(circle at center, rgba(98,243,255,0.06), transparent 42%),
  rgba(0,2,5,0.76);
 backdrop-filter:blur(3px);
}

.coreConfirmBox{
 width:430px;
 max-width:86vw;
 padding:26px 30px;
 box-sizing:border-box;
 text-align:center;
 color:var(--text-main);
 background:rgba(5,7,12,0.94);
 border:1px solid var(--accent-border);
 box-shadow:
  0 0 32px var(--shadow-cyan),
  -3px 0 16px var(--shadow-danger);
 animation:pulse 5s infinite ease-in-out;
}

.coreConfirmTitle{
 margin:0 0 12px 0;
 color:var(--text-main);
 font-size:24px;
 letter-spacing:2px;
 text-shadow:
  0 0 10px rgba(98,243,255,0.34),
  -1px 0 rgba(255,54,94,0.22);
}

.coreConfirmMessage{
 color:var(--text-muted);
 font-size:13px;
 line-height:1.5;
 margin:0 auto 22px auto;
 max-width:360px;
}

.coreConfirmActions{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:12px;
 margin-top:18px;
}

.coreConfirmActions button{
 width:100%;
 height:34px;
 margin:0;
}

#feedback {
 position:absolute;
 top:18px;
 right:18px;
 background:rgba(5,7,12,0.92);
 color:var(--text-main);
 padding:10px 14px;
 border:1px solid var(--accent-border);
 box-shadow:
  0 0 18px var(--shadow-cyan),
  -2px 0 10px var(--shadow-danger);
 display:none;
 z-index:120;
 font-size:11px;
 letter-spacing:1px;
 text-transform:uppercase;
 min-width:220px;
 max-width:310px;
 text-align:left;
}

#feedback::before {
 content:"SYSTEM ALERT";
 display:block;
 color:var(--danger);
 font-size:9px;
 letter-spacing:1.5px;
 margin-bottom:4px;
 text-shadow:0 0 6px var(--shadow-danger);
}

@keyframes feedbackIn {
 0% {
  opacity:0;
  transform:translateX(8px);
 }

 100% {
  opacity:1;
  transform:translateX(0);
 }
}

button {
 margin:5px;
 padding:10px;
 background:var(--panel-strong);
 color:var(--accent);
 border:1px solid var(--accent-border);
 font-family:inherit;
 letter-spacing:0.6px;
 text-transform:uppercase;
 font-size:11px;
}

.selected {
 background:var(--accent);
 color:#02030a;
 box-shadow:0 0 12px var(--shadow-cyan), -2px 0 8px var(--shadow-danger);
}

#stats {
 position:absolute;
 top:10px;
 left:10px;
 color:var(--accent);
 background:rgba(5,7,12,0.78);
 border:1px solid var(--accent-border);
 box-shadow:0 0 18px var(--shadow-cyan);
 padding:12px 14px;
 font-size:12px;
 line-height:1.45;
 z-index:80;
 width:190px;
 text-align:left;
}

#stats .statTitle {
 color:#fff;
 font-size:11px;
 letter-spacing:1px;
 margin-bottom:7px;
 opacity:0.85;
}

#stats .statRow {
 display:flex;
 justify-content:space-between;
 gap:12px;
}

#stats .statLabel {
 opacity:0.65;
}

#stats .statValue {
 color:#fff;
}

#hud {
 display:none;
}

.hudSection {
 position:relative;
 margin-bottom:12px;
 padding-bottom:10px;
 border-bottom:1px solid rgba(99,215,255,0.16);
}

.hudSection:last-child {
 margin-bottom:0;
 padding-bottom:0;
 border-bottom:none;
}

.hudSection::before {
 content:"";
 position:absolute;
 left:-6px;
 top:2px;
 width:3px;
 height:12px;
 background:rgba(216,76,255,0.62);
 box-shadow:0 0 8px rgba(216,76,255,0.46);
}

.hudTitle {
 color:var(--accent);
 font-size:10px;
 letter-spacing:1.4px;
 margin-bottom:8px;
 text-transform:uppercase;
 text-shadow:0 0 7px rgba(99,215,255,0.34);
}

.hudRow {
 display:flex;
 justify-content:space-between;
 gap:12px;
 font-size:12px;
 line-height:1.45;
 min-height:17px;
}

.hudLabel {
 color:rgba(169,184,199,0.72);
 text-transform:uppercase;
}

.hudValue {
 color:var(--text-main);
 text-shadow:0 0 5px rgba(99,215,255,0.16);
}

.hudBar {
 position:relative;
 height:6px;
 margin:3px 0 7px;
 overflow:hidden;
 background:
  repeating-linear-gradient(
   90deg,
   rgba(99,215,255,0.12) 0,
   rgba(99,215,255,0.12) 6px,
   rgba(5,10,16,0.72) 6px,
   rgba(5,10,16,0.72) 9px
  );
 border:1px solid rgba(99,215,255,0.18);
 box-shadow:inset 0 0 8px rgba(0,0,0,0.62);
}

.hudBar span {
 display:block;
 width:0;
 height:100%;
 background:linear-gradient(90deg, rgba(99,215,255,0.50), rgba(232,251,255,0.88));
 box-shadow:0 0 10px rgba(99,215,255,0.34);
 transition:width 0.12s linear;
}

.hudBarHp span {
 background:linear-gradient(90deg, rgba(255,179,71,0.50), rgba(232,251,255,0.86));
 box-shadow:0 0 10px rgba(255,179,71,0.24);
}

.hudBarShield span {
 background:linear-gradient(90deg, rgba(99,215,255,0.45), rgba(139,92,255,0.64));
}

.hudBarXp span {
 background:linear-gradient(90deg, rgba(139,92,255,0.48), rgba(216,76,255,0.72));
 box-shadow:0 0 10px rgba(216,76,255,0.28);
}

.hudDiagnostic {
 margin-top:10px;
 padding-top:8px;
 border-top:1px solid rgba(99,215,255,0.12);
 font-size:10px;
 line-height:1.5;
}

.hudDiagnostic div {
 display:flex;
 justify-content:space-between;
 gap:10px;
}

.hudDiagnostic span {
 color:rgba(169,184,199,0.58);
}

.hudDiagnostic strong {
 color:rgba(232,251,255,0.9);
 font-weight:700;
 text-align:right;
}

.hudDiagnostic .hudWarningValue {
 color:var(--warning);
 text-shadow:0 0 8px rgba(255,179,71,0.36);
}

.hudDiagnostic .hudFractureValue {
 color:var(--danger);
 text-shadow:0 0 8px rgba(216,76,255,0.36);
}

#skills {
 max-height:none;
 overflow:visible;
 padding-right:0;
 scrollbar-width:none;
}

#skills::-webkit-scrollbar {
 display:none;
}

.sectorHudPanel {
 font-size:11px;
}

.sectorPanelTitle {
 color:rgba(232,251,255,0.92);
 font-size:12px;
 line-height:1.2;
 margin-bottom:5px;
 text-transform:uppercase;
 letter-spacing:0.8px;
 text-shadow:0 0 8px rgba(99,215,255,0.18);
}

.sectorPanelTitle.anomaly,
.sectorRiskHint.anomaly {
 color:var(--danger);
 text-shadow:0 0 8px var(--shadow-danger);
}

.sectorPanelTitle.signal {
 color:var(--accent);
}

.sectorPanelBody {
 color:rgba(169,184,199,0.76);
 font-size:10px;
 line-height:1.35;
 margin-bottom:6px;
}

.sectorRewardRow,
.sectorProgressMeta {
 display:flex;
 justify-content:space-between;
 gap:8px;
 color:rgba(169,184,199,0.62);
 font-size:10px;
 text-transform:uppercase;
}

.sectorRewardRow strong {
 color:rgba(232,251,255,0.9);
 font-weight:700;
}

.sectorRiskHint {
 color:rgba(255,179,71,0.82);
 font-size:9px;
 line-height:1.25;
 margin-top:6px;
 text-transform:uppercase;
}

.sectorProgressBar span {
 background:linear-gradient(90deg, rgba(99,215,255,0.50), rgba(216,76,255,0.72));
}

#sectorHudRight {
 position:absolute;
 top:22px;
 right:max(-244px, calc(((900px - 100vw) / 2) + 14px));
 width:220px;
 box-sizing:border-box;
 padding:8px;
 z-index:10;
 display:none;
 flex-direction:column;
 gap:8px;
 color:var(--text-main);
 background:
  linear-gradient(270deg, rgba(99,215,255,0.055), transparent 24px),
  linear-gradient(180deg, rgba(99,215,255,0.045), transparent 52px),
  rgba(5,10,16,0.64);
 border:1px solid rgba(99,215,255,0.26);
 border-right-color:rgba(216,76,255,0.30);
 box-shadow:
  0 0 16px rgba(99,215,255,0.12),
  8px 0 20px rgba(139,92,255,0.08),
  inset 0 0 18px rgba(1,3,7,0.64);
 pointer-events:none;
 overflow:hidden;
}

#sectorHudRight.active {
 display:flex;
}

.sectorHudBox {
 position:relative;
 padding:10px 11px;
 background:
  linear-gradient(90deg, rgba(99,215,255,0.055), transparent 22px),
  rgba(5,10,16,0.82);
 border:1px solid rgba(99,215,255,0.30);
 box-shadow:0 0 14px rgba(99,215,255,0.12), inset 0 0 14px rgba(1,3,7,0.70);
 clip-path:polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));
 overflow:hidden;
}

.sectorHudBox::after {
 content:"";
 position:absolute;
 inset:5px;
 border-top:1px solid rgba(99,215,255,0.14);
 border-bottom:1px solid rgba(99,215,255,0.08);
 pointer-events:none;
}

.sectorLegendItem,
.sectorEventRow,
.runtimeFeedItem,
.stageNextRow {
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:8px;
 color:rgba(169,184,199,0.80);
 font-size:10px;
 line-height:1.35;
 margin-bottom:5px;
}

.sectorLegendItem {
 justify-content:flex-start;
}

.sectorLegendIcon,
.sectorEventIcon,
.sectorGridCellIcon {
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:16px;
 height:16px;
 flex:0 0 16px;
 color:var(--accent);
 border:1px solid rgba(99,215,255,0.30);
 transform:rotate(45deg);
 box-shadow:0 0 8px rgba(99,215,255,0.16);
}

.sectorLegendIcon span,
.sectorEventIcon span,
.sectorGridCellIcon span {
 display:block;
 transform:rotate(-45deg);
 font-size:10px;
 line-height:1;
}

.sectorLegendIcon.current,
.sectorGridCell.current .sectorGridCellIcon {
 color:#e8fbff;
 background:rgba(99,215,255,0.18);
}

.sectorLegendIcon.signal,
.sectorEventIcon.signal,
.sectorGridCell.signal .sectorGridCellIcon {
 color:var(--accent);
 border-color:rgba(99,215,255,0.62);
}

.sectorLegendIcon.anomaly,
.sectorEventIcon.anomaly,
.sectorGridCell.anomaly .sectorGridCellIcon {
 color:var(--danger);
 border-color:rgba(216,76,255,0.62);
 box-shadow:0 0 10px rgba(216,76,255,0.20);
}

.sectorLegendIcon.hostile,
.sectorGridCell.hostile .sectorGridCellIcon {
 color:#ff4a3d;
 border-color:rgba(255,74,61,0.54);
}

.sectorLegendIcon.unstable,
.sectorGridCell.unstable .sectorGridCellIcon {
 color:#8b5cff;
 border-color:rgba(139,92,255,0.54);
}

.sectorLegendIcon.unknown,
.sectorGridCell.unknown .sectorGridCellIcon {
 color:rgba(169,184,199,0.56);
 border-color:rgba(169,184,199,0.24);
}

.sectorEventStack {
 display:grid;
 gap:7px;
}

.sectorEventCard {
 border:1px solid rgba(99,215,255,0.16);
 background:rgba(1,3,7,0.34);
 padding:7px;
}

.sectorEventCard.anomaly {
 border-color:rgba(216,76,255,0.24);
}

.sectorEventName {
 color:rgba(232,251,255,0.90);
 font-size:11px;
 text-transform:uppercase;
}

.sectorEventMeta {
 color:rgba(169,184,199,0.62);
 font-size:9px;
 margin-top:3px;
 text-transform:uppercase;
}

.sectorMiniBar {
 height:4px;
 margin-top:6px;
 border:1px solid rgba(99,215,255,0.16);
 background:rgba(5,10,16,0.72);
 overflow:hidden;
}

.sectorMiniBar span {
 display:block;
 height:100%;
 width:0;
 background:linear-gradient(90deg, rgba(99,215,255,0.56), rgba(216,76,255,0.74));
}

.stageProgressTrack {
 display:grid;
 grid-template-columns:repeat(6, 1fr);
 gap:5px;
 margin-bottom:8px;
}

.stageNode {
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:3px;
 color:rgba(169,184,199,0.52);
 font-size:8px;
 text-transform:uppercase;
}

.stageNodeDot {
 width:16px;
 height:16px;
 display:flex;
 align-items:center;
 justify-content:center;
 border:1px solid rgba(99,215,255,0.22);
 border-radius:50%;
 color:rgba(169,184,199,0.68);
 font-size:8px;
}

.stageNode.reached {
 color:rgba(99,215,255,0.82);
}

.stageNode.reached .stageNodeDot {
 border-color:rgba(99,215,255,0.58);
 color:var(--accent);
 box-shadow:0 0 8px rgba(99,215,255,0.16);
}

.stageNode.current .stageNodeDot {
 border-color:rgba(216,76,255,0.74);
 color:var(--danger);
 box-shadow:0 0 10px rgba(216,76,255,0.22);
}

.runtimeFeedItem {
 justify-content:flex-start;
 font-size:9px;
 margin-bottom:4px;
 color:rgba(169,184,199,0.72);
}

.runtimeFeedTime {
 color:rgba(99,215,255,0.66);
 flex:0 0 auto;
}

#sectorGridPreview {
 display:grid;
 grid-template-columns:repeat(3, 1fr);
 gap:5px;
}

.sectorGridCell {
 position:relative;
 min-height:34px;
 display:flex;
 align-items:center;
 justify-content:center;
 background:rgba(1,3,7,0.42);
 border:1px solid rgba(99,215,255,0.16);
 overflow:hidden;
}

.sectorGridCell::before {
 content:attr(data-label);
 position:absolute;
 top:3px;
 left:4px;
 color:rgba(169,184,199,0.42);
 font-size:7px;
 line-height:1;
}

.sectorGridCell.current,
.sectorGridCell.signal {
 border-color:rgba(99,215,255,0.45);
 box-shadow:inset 0 0 10px rgba(99,215,255,0.08);
}

.sectorGridCell.anomaly,
.sectorGridCell.unstable {
 border-color:rgba(216,76,255,0.36);
}

.sectorGridCell.hostile {
 border-color:rgba(255,74,61,0.38);
}

#sectorPressureBanner {
 position:relative;
 width:100%;
 z-index:11;
 display:none;
 min-height:78px;
 box-sizing:border-box;
 padding:10px 18px 9px;
 text-align:center;
 color:#ff4a3d;
 background:
  linear-gradient(90deg, transparent 0 7%, rgba(255,74,61,0.13) 12% 88%, transparent 93%),
  rgba(5,7,12,0.86);
 border:1px solid rgba(255,74,61,0.48);
 box-shadow:0 0 20px rgba(255,74,61,0.16), inset 0 0 18px rgba(1,3,7,0.72);
 clip-path:polygon(6% 0, 94% 0, 100% 40%, 96% 100%, 4% 100%, 0 40%);
 pointer-events:none;
}

#sectorPressureBanner.active {
 display:flex;
 flex-direction:column;
 justify-content:center;
}

.sectorPressureTitle {
 font-size:13px;
 letter-spacing:1.6px;
 text-transform:uppercase;
 text-shadow:0 0 8px rgba(255,74,61,0.34);
}

.sectorPressureTimer {
 margin-top:2px;
 color:#ffb347;
 font-size:18px;
 letter-spacing:1.8px;
}

.sectorPressureBar {
 height:4px;
 margin:7px auto 6px;
 max-width:310px;
 background:rgba(5,10,16,0.70);
 border:1px solid rgba(255,74,61,0.30);
 overflow:hidden;
}

.sectorPressureBar span {
 display:block;
 height:100%;
 width:0;
 background:linear-gradient(90deg, rgba(255,74,61,0.70), rgba(216,76,255,0.72));
 box-shadow:0 0 10px rgba(255,74,61,0.24);
}

.sectorPressureSub {
 color:rgba(255,179,71,0.84);
 font-size:9px;
 letter-spacing:1px;
 text-transform:uppercase;
}

@media (max-width: 1400px) {
 #sectorHudRight {
  display:none !important;
 }

 #sectorPressureBanner {
  display:none !important;
 }
}

@media (max-width: 1080px) {
 #ui.ingame {
  width:190px;
 }

 #sectorPressureBanner {
  display:none !important;
 }
}

@media (min-width: 1401px) {
 #gameContainer:not(.startMode) #cockpitLayout {
  display:grid;
  grid-template-columns:210px 900px 220px;
  gap:12px;
  align-items:stretch;
  height:690px;
 }

 #gameContainer:not(.startMode) #arenaColumn {
  width:900px;
  height:690px;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
 }

 #gameContainer:not(.startMode) #game {
  flex:0 0 600px;
 }

 #gameContainer:not(.startMode) #ui {
  position:relative;
  top:auto;
  left:auto;
  width:210px;
  height:690px;
  min-height:0;
  max-height:none;
 }

 #gameContainer:not(.startMode) #ui.ingame {
  left:auto;
  width:210px;
 }

 #gameContainer:not(.startMode) #sectorHudRight {
  position:relative;
  top:auto;
  right:auto;
  width:220px;
  height:690px;
 }

 #gameContainer:not(.startMode) #sectorHudRight.active {
  display:flex;
 }

 #gameContainer:not(.startMode) #sectorPressureBanner {
  display:flex;
  flex:1 1 auto;
  visibility:hidden;
  opacity:0;
  transition:opacity 0.16s ease;
 }

 #gameContainer:not(.startMode) #sectorPressureBanner.active {
  visibility:visible;
  opacity:1;
 }
}

.skillItem {
 position:relative;
 color:rgba(232,251,255,0.86);
 font-size:12px;
 line-height:1.35;
 margin-bottom:5px;
 padding-left:10px;
 text-shadow:0 0 4px rgba(99,215,255,0.10);
}

.skillItem.hasModuleIcon {
 display:flex;
 align-items:center;
 gap:6px;
 min-height:18px;
 padding-left:0;
}

.skillItem::before {
 content:"";
 position:absolute;
 left:0;
 top:4px;
 width:4px;
 height:4px;
 border:1px solid rgba(99,215,255,0.44);
 background:rgba(99,215,255,0.14);
}

.skillItem.hasModuleIcon::before {
 display:none;
}

.moduleIcon {
 width:16px;
 height:16px;
 flex:0 0 16px;
 color:rgba(99,215,255,0.88);
 background:currentColor;
 opacity:0.9;
 filter:drop-shadow(0 0 5px rgba(99,215,255,0.28));
 -webkit-mask:var(--module-icon) center / contain no-repeat;
 mask:var(--module-icon) center / contain no-repeat;
}

.moduleIconSplitOutput {
 --module-icon:url("../../assets/ui/icons/modules/split_output.svg");
}

.moduleIconVelocityBoost {
 --module-icon:url("../../assets/ui/icons/modules/velocity_boost.svg");
}

.moduleIconIntegrityRepair {
 --module-icon:url("../../assets/ui/icons/modules/integrity_repair.svg");
}

.moduleIconFractureBurst {
 --module-icon:url("../../assets/ui/icons/modules/fracture_burst.svg");
}

.moduleIconBreachRounds {
 --module-icon:url("../../assets/ui/icons/modules/breach_rounds.svg");
}

.moduleIconNovaCore {
 --module-icon:url("../../assets/ui/icons/modules/nova_core.svg");
}

.skillItem:hover {
 color:var(--accent);
 text-shadow:0 0 8px var(--shadow-cyan);
}

.skillItem:hover .moduleIcon {
 color:var(--accent);
 opacity:1;
 filter:drop-shadow(0 0 8px rgba(99,215,255,0.48));
}

#debugOverlay {
 position:absolute;
 right:10px;
 top:10px;
 color:var(--accent);
 background:rgba(5,7,12,0.72);
 border:1px solid var(--accent-border);
 padding:6px 8px;
 font:12px Consolas, monospace;
 line-height:1.35;
 pointer-events:none;
 z-index:20;
 text-align:left;
 display:none;
}

#tutorialBox {
 position:fixed;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 background:rgba(5,7,12,0.92);
 color:var(--text-main);
 border:1px solid var(--accent-border);
 box-shadow:0 0 32px var(--shadow-cyan), -3px 0 16px var(--shadow-danger);
 padding:22px;
 z-index:200;
 text-align:left;
 max-width:360px;
 display:none;
}

#tutorialBox h2 {
 margin-top:0;
 text-align:center;
}

#tutorialBox button {
 display:block;
 margin:18px auto 0;
}

#levelOverlay {
 position: absolute;
 top: 18px;
 left: 50%;
 transform: translateX(-50%);
 display: flex;
 flex-direction: column;
 gap: 12px;
 z-index: 50;
 align-items: center;
 justify-content: center;
 max-width: 860px;
 width: 860px;
 pointer-events:auto;
}

.levelHeader {
 width: 100%;
 text-align: center;
 color: var(--text-main);
 background: rgba(5,7,12,0.78);
 border: 1px solid var(--accent-border);
 box-shadow: 0 0 18px var(--shadow-cyan), -2px 0 10px var(--shadow-danger);
 padding: 10px 12px;
 box-sizing: border-box;
}

.levelHeaderTitle {
 font-size: 14px;
 letter-spacing: 1.6px;
 color: var(--danger);
 text-shadow: 0 0 8px var(--shadow-danger);
}

.levelHeaderSubtitle {
 margin-top: 5px;
 font-size: 11px;
 color: var(--text-muted);
 letter-spacing: 0.8px;
}

.levelOptionsRow {
 display: flex;
 gap: 14px;
 align-items: stretch;
 justify-content: center;
 width: 100%;
}

.levelOption {
 width: 250px;
 min-height: 106px;
 padding: 12px 14px;
 border:1px solid var(--accent-border);
 color:var(--text-main);
 background:rgba(5,7,12,0.86);
 box-sizing: border-box;
 text-align: left;
 display: flex;
 flex-direction: column;
 justify-content: flex-start;
}

.levelOptionHeader {
 display:flex;
 align-items:flex-start;
 justify-content:space-between;
 gap:10px;
 min-height:21px;
}

.levelOptionName {
 color:rgba(232,251,255,0.96);
 font-size:14px;
 line-height:1.25;
 letter-spacing:0.2px;
 text-shadow:0 0 7px rgba(99,215,255,0.18);
}

.levelOptionKey {
 flex:0 0 auto;
 color:rgba(99,215,255,0.72);
 border:1px solid rgba(99,215,255,0.26);
 background:rgba(5,10,16,0.56);
 padding:1px 6px 2px;
 font-size:10px;
 line-height:1.2;
 letter-spacing:0.8px;
 text-shadow:0 0 5px rgba(99,215,255,0.18);
}

.levelOptionStatus {
 margin-top:6px;
 color:rgba(99,215,255,0.76);
 font-size:10px;
 line-height:1.2;
 letter-spacing:1.1px;
 text-transform:uppercase;
 text-shadow:0 0 6px rgba(99,215,255,0.18);
}

.levelOption small {
 display:block;
 margin-top:9px;
 font-size:12px;
 line-height:1.25;
 opacity:0.8;
 max-width:none;
}

.levelOption:hover {
 background:
  linear-gradient(90deg, rgba(99,215,255,0.10), rgba(5,10,16,0.02) 44%),
  rgba(5,10,16,0.96);
 color:var(--text-main);
 border-color:rgba(155,234,255,0.74);
 box-shadow:
  0 0 18px rgba(99,215,255,0.18) inset,
  0 0 14px rgba(99,215,255,0.28),
  -2px 0 10px rgba(139,92,255,0.28);
 outline:1px solid rgba(139,92,255,0.34);
 outline-offset:2px;
}

.levelOption:hover small {
 opacity:0.92;
}

.levelOption:hover .levelOptionKey {
 color:rgba(232,251,255,0.94);
 border-color:rgba(155,234,255,0.54);
}

.levelOption:hover .levelOptionStatus {
 color:rgba(155,234,255,0.92);
}

.levelOption.selected {
 background:var(--accent);
 color:#02030a;
}

/* ========================= */
/* PAUSE MENU COMPACT SHELL */
/* ========================= */

#menu.pauseMenuActive{
 width:680px;
 height:auto;
 min-height:0;
 padding:30px 36px;
 overflow:visible;
 background:rgba(5,7,12,0.92);
 backdrop-filter:blur(3px);
}

#menu.pauseMenuActive .menuScreen{
 height:auto;
 min-height:0;
}

#menu.pauseMenuActive .menuScreenPause{
 height:auto;
 min-height:0;
}

#menu.pauseMenuActive .menuScreenHeader{
 margin-bottom:18px;
}

#menu.pauseMenuActive .menuScreenBody{
 flex:0 0 auto;
 min-height:0;
 height:auto;
 justify-content:flex-start;
 overflow:visible;
}

#menu.pauseMenuActive .menu-subtitle{
 margin-bottom:14px;
}

#menu.pauseMenuActive .pauseSnapshotSection{
 width:100%;
 max-width:680px;
 margin:0 auto;
}

#menu.pauseMenuActive .menuLogArchive{
 margin:0 0 10px 6px;
 width:100%;
 text-align:left;
}

#menu.pauseMenuActive .pauseSnapshotGrid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:10px 18px;
 width:100%;
 margin:0;
}

#menu.pauseMenuActive .menuLogRow{
 padding:8px 12px 8px 16px;
}

#menu.pauseMenuActive .menuScreenActions{
 margin-top:22px;
 display:grid;
 grid-template-columns:repeat(2, minmax(180px, 1fr));
 gap:12px;
}

#menu.pauseMenuActive .menuScreenActions button{
 width:100%;
 margin:0;
}

#menu.pauseMenuActive .pauseExitButton{
 grid-column:1 / -1;
 justify-self:center;
 max-width:260px;
}

/* ========================= */
/* PAUSE SNAPSHOT TITLE FIX */
/* ========================= */

#menu.pauseMenuActive .pauseSnapshotSection{
 width:100%;
 max-width:606px;
 margin:0 auto;
}

#menu.pauseMenuActive .pauseSnapshotTitle{
 width:100%;
 margin:0 0 10px 0;
 padding-left:4px;
 text-align:center;
 color:var(--danger);
 font-size:10px;
 letter-spacing:2.4px;
 text-shadow:0 0 6px var(--shadow-danger);
}

#menu.pauseMenuActive .pauseSnapshotGrid{
 width:100%;
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:10px 18px;
 margin:0;
}

/* ========================= */
/* GAME OVER MENU SHELL */
/* ========================= */

#menu.gameOverMenuActive{
 width:760px;
 height:540px;
 min-height:0;
 padding:30px 36px;
 overflow:hidden;
 background:rgba(2,3,8,0.94);
 backdrop-filter:blur(3px);
}

#menu.gameOverContextScreen{
 width:760px;
 height:540px;
 min-height:0;
 padding:30px 36px;
 overflow:hidden;
 background:rgba(2,3,8,0.94);
 backdrop-filter:blur(3px);
}

#menu.gameOverContextScreen .menuScreen{
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
}

#menu.gameOverContextScreen .menuScreenHeader{
 flex:0 0 auto;
}

#menu.gameOverContextScreen .menuScreenBody{
 flex:1 1 auto;
 min-height:0;
 justify-content:flex-start;
 overflow:hidden;
}

#menu.gameOverContextScreen .menuScreenActions{
 flex:0 0 auto;
 margin-top:18px;
}

#menu.gameOverContextScreen .menuScreenFeedback .menuScreenBody{
 overflow-y:auto;
 overflow-x:hidden;
 padding-right:8px;
}

#menu.gameOverContextScreen .menuScreenHighscores .menuScreenBody{
 justify-content:flex-start;
 align-items:center;
}

#menu.gameOverContextScreen .highscoreTableBody{
 max-height:230px;
 overflow:hidden;
}

#menu.gameOverMenuActive .menuScreen{
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
}

#menu.gameOverMenuActive .menuScreenGameOver{
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
}

#menu.gameOverMenuActive .menuScreenHeader{
 margin-bottom:12px;
 flex:0 0 auto;
}

#menu.gameOverMenuActive .menuScreenBody{
 flex:1 1 auto;
 min-height:0;
 height:auto;
 justify-content:flex-start;
 overflow:hidden;
}

#menu.gameOverMenuActive .gameOverScroll{
 overflow-y:auto;
 overflow-x:hidden;
 padding:0 6px 6px 0;
 scrollbar-width:thin;
}

#menu.gameOverMenuActive .gameOverMainGrid{
 width:100%;
 max-width:760px;
 margin:0 auto;
 display:grid;
 grid-template-columns:minmax(0, 1.45fr) minmax(238px, 0.9fr);
 gap:14px;
 align-items:start;
}

#menu.gameOverMenuActive .menu-subtitle{
 margin-bottom:10px;
}

#menu.gameOverMenuActive .gameOverSection{
 width:100%;
 max-width:none;
 margin:0;
 flex:0 0 auto;
}

#menu.gameOverMenuActive .gameOverSectionTitle{
 width:100%;
 margin:0 0 10px 0;
 text-align:center;
 color:var(--danger);
 font-size:10px;
 letter-spacing:2.4px;
 text-shadow:0 0 6px var(--shadow-danger);
}

#menu.gameOverMenuActive .gameOverSummaryGrid{
 width:100%;
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:7px 12px;
 margin:0;
}

#menu.gameOverMenuActive .menuLogRow{
 min-height:32px;
 padding:6px 10px 6px 14px;
 box-sizing:border-box;
 gap:10px;
 overflow:visible;
 align-items:center;
}

#menu.gameOverMenuActive .menuLogValue{
 min-width:0;
 white-space:normal;
 text-align:right;
}

#menu.gameOverMenuActive .gameOverStageRow{
 grid-column:1 / -1;
 border-color:rgba(183,255,70,0.28);
 background:
  linear-gradient(90deg, rgba(183,255,70,0.08), rgba(98,243,255,0.04)),
  rgba(5,7,12,0.54);
}

#menu.gameOverMenuActive .gameOverStageSubRow{
 opacity:0.82;
 margin-top:-4px;
}

#menu.gameOverMenuActive .gameOverOverloadRow{
 border-color:rgba(255,54,94,0.42);
 background:
  linear-gradient(90deg, rgba(255,54,94,0.12), rgba(98,243,255,0.05)),
  rgba(5,7,12,0.62);
}

#menu.gameOverMenuActive .gameOverPilotSection{
 margin-top:0;
 margin-bottom:0;
}

#menu.gameOverMenuActive .highscoreSubmitBox{
 display:grid;
 grid-template-columns:1fr;
 gap:10px;
 align-items:center;
 width:100%;
}

#menu.gameOverMenuActive #highscoreCallsignInput{
 width:100%;
 height:44px;
 min-height:44px;
 box-sizing:border-box;
 background:rgba(5,7,12,0.78);
 color:var(--text-main);
 border:1px solid var(--accent-border);
 padding:0 12px;
 font-family:inherit;
 font-size:11px;
 letter-spacing:0.8px;
 outline:none;
 text-transform:uppercase;
}

#menu.gameOverMenuActive #highscoreCallsignInput::placeholder{
 color:rgba(232,251,255,0.48);
 text-transform:none;
}

#menu.gameOverMenuActive #highscoreCallsignInput:focus{
 border-color:var(--accent);
 box-shadow:
  0 0 12px rgba(98,243,255,0.16),
  -2px 0 8px rgba(255,54,94,0.12);
}

#menu.gameOverMenuActive .highscoreSubmitBox button{
 height:44px;
 min-height:44px;
 margin:0;
 white-space:nowrap;
 flex:0 0 auto;
 width:100%;
}

#menu.gameOverMenuActive .gameOverSubmitStatus{
 min-height:20px;
 margin-top:6px;
 color:var(--accent);
 opacity:0.78;
 font-size:11px;
 letter-spacing:0.8px;
 text-align:center;
}

#menu.gameOverMenuActive .gameOverPrivacyHint{
 margin-top:6px;
 color:var(--text-muted);
 font-size:9px;
 line-height:1.35;
 opacity:0.75;
 text-align:center;
}

#menu.gameOverMenuActive .gameOverActionsGrid{
 flex:0 0 auto;
 margin-top:10px;
 display:grid;
 grid-template-columns:repeat(2, minmax(180px, 1fr));
 gap:10px;
 justify-content:center;
}

@media (max-width: 900px), (max-height: 640px){
 #menu.gameOverMenuActive .gameOverMainGrid{
  grid-template-columns:1fr;
  max-width:640px;
 }

 #menu.gameOverMenuActive .highscoreSubmitBox{
  grid-template-columns:1fr auto;
 }
}

#menu.gameOverMenuActive .gameOverActionsGrid button{
 width:100%;
 min-height:44px;
 margin:0;
}

#menu.gameOverMenuActive .gameOverSubmitStatus.success{
 color:var(--accent);
 text-shadow:0 0 6px var(--shadow-cyan);
}

#menu.gameOverMenuActive .gameOverSubmitStatus.warning{
 color:var(--danger);
 text-shadow:0 0 6px var(--shadow-danger);
}

/* ========================= */
/* HIGH SCORE ARCHIVE */
/* ========================= */

.menuScreenHighscores .menuScreenBody{
 justify-content:flex-start;
 align-items:center;
}

.highscoreModeButtons{
 display:grid;
 grid-template-columns:repeat(4, 1fr);
 gap:8px;
 width:100%;
 max-width:610px;
 margin:14px auto 14px auto;
}

.highscoreModeButton{
 height:32px;
 margin:0;
 padding:0 8px;
 font-size:10px;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
}

.highscoreModeButton.active{
 background:var(--accent-soft);
 color:var(--text-main);
 box-shadow:
  0 0 12px var(--shadow-cyan) inset,
  0 0 10px rgba(98,243,255,0.18);
}

.highscoreTable{
 width:100%;
 max-width:610px;
 margin:0 auto;
 text-align:left;
 border:1px solid rgba(98,243,255,0.18);
 background:rgba(5,7,12,0.28);
 overflow:hidden;
}

.highscoreHeader,
.highscoreRow{
 display:grid;
 grid-template-columns:44px minmax(110px, 1fr) 74px 62px 82px 74px 48px;
 align-items:center;
 gap:0;
}

.highscoreHeader{
 min-height:30px;
 color:var(--danger);
 font-size:9px;
 letter-spacing:1.2px;
 text-transform:uppercase;
 border-bottom:1px solid rgba(98,243,255,0.18);
 background:rgba(255,54,94,0.035);
}

.highscoreHeader div{
 padding:8px 8px;
 overflow:hidden;
 white-space:nowrap;
 text-overflow:ellipsis;
}

.highscoreHeader div:nth-child(1),
.highscoreHeader div:nth-child(3),
.highscoreHeader div:nth-child(4),
.highscoreHeader div:nth-child(5),
.highscoreHeader div:nth-child(6),
.highscoreHeader div:nth-child(7){
 text-align:center;
}

.highscoreTableBody{
 max-height:230px;
 overflow:hidden;
}

.highscoreRow{
 min-height:30px;
 border-bottom:1px solid rgba(98,243,255,0.10);
}

.highscoreRow:last-child{
 border-bottom:none;
}

.highscoreRow:nth-child(1){
 background:rgba(255,54,94,0.055);
}

.highscoreCell{
 padding:8px 8px;
 color:var(--text-main);
 font-size:10px;
 letter-spacing:0.5px;
 overflow:hidden;
 white-space:nowrap;
 text-overflow:ellipsis;
}

.highscoreCell:nth-child(1),
.highscoreCell:nth-child(3),
.highscoreCell:nth-child(4),
.highscoreCell:nth-child(5),
.highscoreCell:nth-child(6),
.highscoreCell:nth-child(7){
 text-align:center;
}

.highscoreRankCell{
 color:var(--danger);
 font-weight:bold;
}

.highscoreScoreCell{
 color:var(--accent);
 font-weight:bold;
}

.highscoreBuildCell{
 color:var(--text-muted);
 font-size:9px;
 text-align:center;
}

.highscoreListStatus{
 min-height:18px;
 margin-top:10px;
 color:var(--accent);
 opacity:0.78;
 font-size:11px;
 letter-spacing:0.9px;
 text-align:center;
}

.highscoreListStatus.warning{
 color:var(--danger);
 text-shadow:0 0 6px var(--shadow-danger);
}

@keyframes titleFlicker {
  0%, 94%, 100% {
    opacity:1;
    transform:translateX(0);
  }

  95% {
    opacity:0.92;
    transform:translateX(-1px);
  }

  96% {
    opacity:0.7;
    transform:translateX(2px);
  }

  97% {
    opacity:1;
    transform:translateX(0);
  }
}

body::after{
 content:"";
 position:fixed;
 inset:0;
 pointer-events:none;
 background:
 repeating-linear-gradient(
   to bottom,
   rgba(255,255,255,0.015) 0px,
   rgba(255,255,255,0.015) 1px,
   transparent 2px,
   transparent 4px
 );
 opacity:0.18;
 mix-blend-mode:screen;
}

#gameContainer.startMode #game {
 opacity:0;
 filter:blur(8px);
 transform:scale(0.985);
}

#gameContainer.startMode #cursorCanvas {
 opacity:1;
}

#gameContainer.startMode::before {
 content:"";
 position:absolute;
 left:50%;
 top:50%;
 width:560px;
 height:560px;
 transform:translate(-50%,-50%);
 background:
  radial-gradient(circle at center,
   rgba(98,243,255,0.055) 0%,
   rgba(98,243,255,0.025) 34%,
   rgba(255,54,94,0.012) 52%,
   transparent 74%);
 filter:blur(10px);
 pointer-events:none;
 z-index:0;
}

#transitionLayer {
 position:absolute;
 inset:0;
 background:
  radial-gradient(circle at center, rgba(98,243,255,0.06), transparent 42%),
  rgba(0,2,5,0.86);
 z-index:300;
 display:none;
 align-items:center;
 justify-content:center;
 pointer-events:none;
 opacity:0;
 transition:opacity 0.18s ease;
}

#transitionLayer.active {
 display:flex;
 opacity:1;
}

.transitionBox {
 min-width:400px;
 max-width:560px;
 padding:24px 30px;
 background:rgba(5,7,12,0.92);
 border:1px solid var(--accent-border);
 box-shadow:
  0 0 28px var(--shadow-cyan),
  -3px 0 16px var(--shadow-danger);
 text-align:center;
}

.transitionTitle {
 color:var(--danger);
 font-size:13px;
 letter-spacing:2px;
 text-shadow:0 0 8px var(--shadow-danger);
 margin-bottom:10px;
 animation:titleFlicker 3.8s infinite;
}

.transitionSubtitle {
 color:var(--text-main);
 font-size:12px;
 letter-spacing:1.2px;
 opacity:0.9;
 margin-bottom:18px;
}

.transitionBar {
 height:3px;
 width:100%;
 background:rgba(98,243,255,0.12);
 overflow:hidden;
 position:relative;
}

.transitionBarFill {
 height:100%;
 width:0%;
 background:var(--accent);
 box-shadow:0 0 12px var(--shadow-cyan);
}

#transitionLayer.active .transitionBarFill {
 animation:transitionFill 0.72s ease-out forwards;
}

@keyframes transitionFill {
 0% {
  width:0%;
  transform:translateX(0);
 }

 70% {
  width:78%;
 }

 100% {
  width:100%;
 }
}

#gameContainer.booting #game {
 animation:arenaBoot 0.55s ease-out;
}

@keyframes arenaBoot {
 0% {
  opacity:0;
  filter:blur(10px);
  transform:scale(0.965);
 }

 45% {
  opacity:0.65;
  filter:blur(4px);
  transform:scale(1.01);
 }

 100% {
  opacity:1;
  filter:none;
  transform:scale(1);
 }
}

.testConsole {
 position:fixed;
 top:50%;
 left:50%;
 width:min(780px, calc(100vw - 28px));
 max-height:calc(100vh - 32px);
 transform:translate(-50%, -50%);
 z-index:260;
 display:flex;
 flex-direction:column;
 gap:14px;
 padding:18px;
 color:var(--text-main);
 background:rgba(5,7,12,0.96);
 border:1px solid var(--accent-border);
 box-shadow:0 0 30px var(--shadow-cyan), -3px 0 16px var(--shadow-danger);
 pointer-events:auto;
 cursor:auto !important;
}

.testConsole *,
.testConsole button {
 cursor:auto !important;
}

.testConsole input,
.testConsole textarea {
 cursor:text !important;
}

body.testConsoleActive #cursorCanvas {
 display:none;
}

.testConsoleHeader {
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:14px;
 border-bottom:1px solid rgba(98,243,255,0.18);
 padding-bottom:12px;
}

.testConsoleKicker {
 color:var(--danger);
 font-size:9px;
 letter-spacing:1.8px;
 margin-bottom:5px;
}

.testConsole h2 {
 margin:0;
 color:var(--text-main);
 font-size:18px;
 letter-spacing:2px;
 text-shadow:0 0 10px var(--shadow-cyan);
}

.testConsoleHint {
 color:var(--accent);
 font-size:11px;
 line-height:1.45;
 opacity:0.86;
}

.testConsoleBody {
 overflow:auto;
 padding-right:4px;
}

.testConsoleGrid {
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:8px;
 margin-bottom:12px;
}

.testConsoleGrid button,
.testConsoleActions button {
 width:100%;
 min-height:34px;
 margin:0;
}

.testConsoleActions {
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:8px;
}

.testConsoleStatus {
 margin-bottom:12px;
 padding:9px 12px;
 color:rgba(235,251,255,0.72);
 border:1px solid rgba(98,243,255,0.22);
 background:rgba(98,243,255,0.06);
 font-size:11px;
 letter-spacing:1px;
}

.testConsoleStatus.active {
 color:var(--danger);
 border-color:rgba(255,54,94,0.58);
 background:rgba(255,54,94,0.12);
 text-shadow:0 0 8px var(--shadow-danger);
}

.testConsoleStateGrid {
 display:grid;
 grid-template-columns:repeat(2, minmax(0, 1fr));
 gap:8px;
 margin-bottom:14px;
}

.testConsoleStateRow {
 display:flex;
 justify-content:space-between;
 gap:12px;
 min-height:28px;
 padding:7px 9px;
 border-left:2px solid var(--accent);
 background:rgba(98,243,255,0.06);
 font-size:10px;
}

.testConsoleStateRow span {
 color:rgba(235,251,255,0.62);
}

.testConsoleStateRow strong {
 color:var(--text-main);
 text-align:right;
 overflow-wrap:anywhere;
}

.testCommandOutput {
 height:310px;
 overflow:auto;
 padding:10px;
 margin-bottom:10px;
 color:rgba(235,251,255,0.88);
 background:rgba(0,2,5,0.74);
 border:1px solid rgba(98,243,255,0.24);
 font-size:11px;
 line-height:1.55;
 text-transform:none;
}

.testCommandInput {
 width:100%;
 height:38px;
 padding:0 12px;
 color:var(--text-main);
 background:rgba(0,2,5,0.92);
 border:1px solid var(--accent-border);
 font-family:inherit;
 font-size:13px;
}

@media (max-width: 720px) {
 .testConsoleGrid,
 .testConsoleActions,
 .testConsoleStateGrid {
  grid-template-columns:1fr;
 }
}