/* ════════════════════════════════════════════
   CMO QUEST — retro arcade / neo-brutal pixel
   ════════════════════════════════════════════ */
:root{
  --bg:#0b0b1a;
  --bg2:#11112a;
  --panel:#151530;
  --ink:#f2f2ff;
  --dim:#9aa0c0;
  --yellow:#ffe600;
  --pink:#ff2e88;
  --cyan:#00f0ff;
  --green:#3dff6e;
  --orange:#ff7a00;
  --purple:#b36bff;
  --red:#ff3355;
  --line:#2c2c55;
  --shadow:#000;
  --px:3px;
  --f-hud:'Press Start 2P',monospace;
  --f-head:'Unbounded',sans-serif;
  --f-body:'IBM Plex Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{overflow-x:hidden}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:15px;
  line-height:1.6;
  overflow-x:hidden;
}
::selection{background:var(--pink);color:#fff}
a{color:var(--cyan)}

/* scrollbar */
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--pink);border:3px solid var(--bg2)}

/* ═══ CRT / stars ═══ */
.crt{
  position:fixed;inset:0;z-index:9000;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 1px,transparent 1px 3px);
}
.crt::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at center,transparent 58%,rgba(0,0,10,.55) 100%);
}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none}

/* ═══ HUD ═══ */
.hud{
  position:fixed;top:0;left:0;right:0;z-index:8000;
  display:flex;gap:0;align-items:stretch;
  background:var(--bg2);
  border-bottom:var(--px) solid var(--ink);
  transform:translateY(-110%);
  transition:transform .45s steps(6);
  font-family:var(--f-hud);
}
body[data-state="play"] .hud{transform:translateY(0)}
.hud-cell{
  display:flex;align-items:center;gap:10px;
  padding:12px 18px;
  border-right:var(--px) solid var(--line);
  font-size:11px;color:var(--ink);
  background:none;white-space:nowrap;
}
.hud-label{color:var(--dim);font-size:8px}
.hud-score span:last-child{color:var(--yellow)}
.hud-coins span:last-child{color:var(--orange)}
.hud-level span:last-child{color:var(--cyan)}
.hud-xp{flex:1;min-width:0}
.xpbar{flex:1;height:14px;border:2px solid var(--ink);background:var(--bg);min-width:40px}
.xpbar-fill{height:100%;width:0%;background:repeating-linear-gradient(90deg,var(--green) 0 8px,#2bd455 8px 16px)}
.hud-sound{cursor:pointer;border:none;border-right:none;font-family:var(--f-hud)}
.hud-sound:hover{background:var(--line)}
#soundState{color:var(--pink)}

/* ═══ NAV DOTS ═══ */
.dots{
  position:fixed;right:14px;top:50%;transform:translateY(-50%);
  z-index:7000;display:flex;flex-direction:column;gap:10px;
}
.dots a{
  width:12px;height:12px;background:var(--line);
  border:2px solid var(--bg);outline:2px solid var(--line);
  display:block;position:relative;
}
.dots a.on{background:var(--yellow);outline-color:var(--yellow)}
@media (hover:none),(pointer:coarse){.dots{display:none}}
.dots a:hover::after{
  content:attr(data-t);position:absolute;right:22px;top:50%;transform:translateY(-50%);
  background:var(--ink);color:var(--bg);font-family:var(--f-hud);font-size:8px;
  padding:5px 8px;white-space:nowrap;
}

/* ═══ TOASTS ═══ */
.toasts{position:fixed;left:16px;bottom:16px;z-index:8500;display:flex;flex-direction:column;gap:10px}
.toast{
  background:var(--bg2);border:var(--px) solid var(--yellow);
  box-shadow:6px 6px 0 var(--shadow);
  padding:12px 16px;max-width:320px;
  animation:toastIn .3s steps(4) both;
}
.toast b{font-family:var(--f-hud);font-size:10px;color:var(--yellow);display:block;margin-bottom:4px}
.toast p{font-size:12px;color:var(--dim)}
.toast.out{animation:toastOut .3s steps(4) both}
@keyframes toastIn{from{transform:translateX(-120%)}to{transform:translateX(0)}}
@keyframes toastOut{from{transform:translateX(0);opacity:1}to{transform:translateX(-120%);opacity:0}}

/* ═══ ZONES ═══ */
main{position:relative;z-index:1}
.zone{
  max-width:1080px;margin:0 auto;
  padding:90px 24px 70px;
}
.zone-slim{padding-top:60px;padding-bottom:50px}
.zone-alt{position:relative}
.zone-alt::before{
  content:"";position:absolute;top:0;bottom:0;
  left:calc(50% - 50vw);width:100vw;
  background:var(--bg2);z-index:-1;
}
.zone-head{margin-bottom:42px}
.zone-tag{
  font-family:var(--f-hud);font-size:10px;color:var(--bg);
  background:var(--yellow);padding:6px 10px;display:inline-block;
  box-shadow:4px 4px 0 var(--shadow);margin-bottom:16px;
}
.zone-head h2{
  font-family:var(--f-head);font-weight:900;
  font-size:clamp(30px,5.5vw,54px);
  letter-spacing:.01em;text-transform:uppercase;
  line-height:1.05;
  text-shadow:4px 4px 0 var(--pink);
}
.zone-sub{color:var(--dim);margin-top:12px;font-size:15px}

/* ленивый рендер тяжёлых блоков вне экрана */
.worlds,.bosses,.scores-grid,.skilltree,.inv-grid,.codex-grid,
.guild-grid,.trophy-grid,.splits,.arcade{
  content-visibility:auto;
  contain-intrinsic-size:auto 700px;
}

/* generic frame */
.frame{
  background:var(--panel);
  border:var(--px) solid var(--ink);
  box-shadow:8px 8px 0 var(--shadow);
  padding:22px;
}
.frame-title{
  font-family:var(--f-hud);font-size:10px;color:var(--cyan);
  margin-bottom:16px;letter-spacing:.05em;
}

/* next-level кнопка в конце зоны */
.zone-next{
  display:block;margin:46px auto 0;
  font-family:var(--f-hud);font-size:10px;color:var(--ink);
  background:var(--panel);border:var(--px) solid var(--ink);
  box-shadow:5px 5px 0 var(--shadow);
  padding:15px 24px;min-height:44px;cursor:pointer;
  transition:transform .08s steps(2),box-shadow .08s steps(2);
}
.zone-next:hover{background:var(--yellow);color:var(--bg)}
.zone-next:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--shadow)}

/* reveal animation */
.rv{opacity:0;transform:translateY(26px)}
.rv.in{opacity:1;transform:none;transition:opacity .5s steps(6),transform .5s steps(6)}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none}
  .blink,.blink-slow,.ticker-track{animation:none!important}
}

/* ═══ ZONE 01 BOOT ═══ */
.shotmode .zone-boot{min-height:900px!important}
.zone-boot{
  min-height:100vh;max-width:none;
  display:flex;align-items:center;justify-content:center;
  padding:40px 20px;position:relative;
}
.boot-seq{
  font-family:var(--f-body);color:var(--green);
  font-size:14px;line-height:2;
  position:absolute;inset:0;padding:40px;
  background:var(--bg);z-index:5;
}
.boot-seq p{visibility:hidden;white-space:pre-wrap}
.title-screen{text-align:center;position:relative;z-index:2;opacity:0;transition:opacity .6s steps(8)}
body[data-boot="done"] .title-screen{opacity:1}
body[data-boot="done"] .boot-seq{display:none}
.title-top{font-family:var(--f-hud);font-size:11px;color:var(--cyan);margin-bottom:30px}
.title-logo{
  font-family:var(--f-head);font-weight:900;text-transform:uppercase;
  font-size:clamp(56px,13vw,150px);line-height:.92;
  display:flex;flex-direction:column;align-items:center;gap:0;
}
.tl-a{color:var(--yellow);text-shadow:6px 6px 0 var(--pink),12px 12px 0 rgba(0,0,0,.9)}
.tl-b{color:var(--cyan);text-shadow:6px 6px 0 var(--purple),12px 12px 0 rgba(0,0,0,.9)}
.title-sub{
  font-family:var(--f-head);font-weight:800;font-size:clamp(18px,3vw,28px);
  margin-top:26px;text-transform:uppercase;letter-spacing:.06em;
}
.title-role{color:var(--dim);font-size:14px;margin-top:6px}
.title-stats{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;
  margin:26px auto 0;font-size:13px;color:var(--ink);max-width:640px;
}
.title-stats i{color:var(--pink);font-style:normal}
.press-start{
  font-family:var(--f-hud);font-size:14px;
  background:var(--pink);color:#fff;border:var(--px) solid var(--ink);
  box-shadow:6px 6px 0 var(--shadow);
  padding:18px 34px;margin-top:36px;cursor:pointer;
  transition:transform .08s steps(2),box-shadow .08s steps(2);
}
.press-start:hover{background:var(--yellow);color:var(--bg)}
.press-start:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--shadow)}
.insert-coin{font-family:var(--f-hud);font-size:9px;color:var(--dim);margin-top:22px}
.copyr{font-family:var(--f-hud);font-size:8px;color:var(--dim);margin-top:34px;letter-spacing:.08em}
.blink{animation:blink 1s steps(2) infinite}
.blink-slow{animation:blink 2s steps(2) infinite}
@keyframes blink{50%{opacity:0}}

/* ═══ TICKERS ═══ */
.ticker{
  overflow:hidden;background:var(--yellow);color:var(--bg);
  border-top:var(--px) solid var(--ink);border-bottom:var(--px) solid var(--ink);
  font-family:var(--f-hud);font-size:11px;
  padding:10px 0;white-space:nowrap;position:relative;z-index:2;
}
.ticker-track{display:inline-flex;animation:tick 28s linear infinite}
.ticker-track span{padding-right:0}
.t-pink{background:var(--pink);color:#fff}
.t-green{background:var(--green);color:var(--bg)}
@keyframes tick{to{transform:translateX(-50%)}}

/* ═══ ZONE 02 PLAYER ═══ */
.player-grid{display:grid;grid-template-columns:340px 1fr;gap:28px}
.sprite-box{text-align:center;padding:10px 0 18px}
#playerSprite{image-rendering:pixelated;background:var(--bg);border:var(--px) solid var(--line)}
.sprite-box{cursor:pointer}
.sprite-name{font-family:var(--f-hud);font-size:16px;color:var(--yellow);margin-top:14px}
.sprite-skin{font-family:var(--f-hud);font-size:8px;color:var(--dim);margin-top:10px}
.sprite-box:hover .sprite-skin{color:var(--yellow)}
.sprite-class{font-family:var(--f-hud);font-size:8px;color:var(--dim);margin-top:8px}
.player-meta{list-style:none;border-top:2px dashed var(--line);padding-top:14px}
.player-meta li{padding:7px 0;font-size:13.5px;color:var(--dim)}
.player-meta b{font-family:var(--f-hud);font-size:8px;color:var(--cyan);display:inline-block;width:56px}
.statbar{display:grid;grid-template-columns:170px 1fr 34px;gap:12px;align-items:center;margin-bottom:14px}
.statbar span{font-size:13px}
.statbar b{font-family:var(--f-hud);font-size:11px;color:var(--yellow);text-align:right}
.sb-track{height:16px;border:2px solid var(--ink);background:var(--bg)}
.sb-fill{
  height:100%;width:0;
  background:repeating-linear-gradient(90deg,var(--pink) 0 10px,var(--purple) 10px 20px);
  transition:width 1.1s steps(12);
}
.stats-note{color:var(--dim);font-size:11.5px;margin-top:18px}

/* ═══ ZONE 03 SCORES ═══ */
.scores-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.score-card{text-align:left;padding:20px 18px;cursor:pointer;transition:transform .1s steps(2)}
.score-card:hover{transform:translate(-2px,-2px)}
.score-num{
  font-family:var(--f-head);font-weight:900;font-size:clamp(22px,2.6vw,34px);
  display:block;line-height:1.1;word-break:break-word;
}
.score-unit{font-family:var(--f-hud);font-size:9px;color:var(--dim);display:block;margin:6px 0 10px}
.score-card p{font-size:12.5px;color:var(--dim);line-height:1.5}
.c-yellow .score-num{color:var(--yellow)}
.c-pink .score-num{color:var(--pink)}
.c-cyan .score-num{color:var(--cyan)}
.c-green .score-num{color:var(--green)}
.c-orange .score-num{color:var(--orange)}
.c-purple .score-num{color:var(--purple)}

/* ═══ ZONE 04 WORLDS ═══ */
.worlds{display:flex;flex-direction:column;gap:26px;position:relative}
.worlds::before{
  content:"";position:absolute;left:34px;top:0;bottom:0;width:4px;
  background:repeating-linear-gradient(180deg,var(--line) 0 12px,transparent 12px 22px);
  z-index:-1;
}
.world{margin-left:70px;position:relative;cursor:pointer}
.world.looted{cursor:default}
.world-lootbadge{
  font-family:var(--f-hud);font-size:9px;color:var(--orange);
  border:2px solid var(--orange);padding:5px 8px;transform:rotate(-3deg);
  white-space:nowrap;align-self:center;
}
.loot-coin{
  position:absolute;width:10px;height:10px;z-index:5;pointer-events:none;
  background:var(--yellow);border:2px solid var(--ink);
  animation:lootFly .9s steps(9) forwards;
}
@keyframes lootFly{
  to{transform:translate(var(--lx,0),-110px) rotate(200deg);opacity:0}
}
.world::before{
  content:"";position:absolute;left:-48px;top:26px;width:20px;height:20px;
  background:var(--yellow);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--shadow);
}
.world-head{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px}
.world-no{
  font-family:var(--f-hud);font-size:10px;background:var(--cyan);color:var(--bg);
  padding:6px 9px;box-shadow:3px 3px 0 var(--shadow);white-space:nowrap;
}
.world-head h3{font-family:var(--f-head);font-weight:800;font-size:19px;line-height:1.25}
.world-role{color:var(--dim);font-size:12.5px;margin-top:4px}
.world-stamp{
  margin-left:auto;font-family:var(--f-hud);font-size:9px;color:var(--green);
  border:2px solid var(--green);padding:5px 8px;transform:rotate(4deg);white-space:nowrap;
}
.nda{
  font-style:normal;font-family:var(--f-hud);font-size:8px;background:var(--red);
  color:#fff;padding:3px 6px;vertical-align:middle;margin-left:6px;
}
.world-log{list-style:none}
.world-log li{
  padding:6px 0 6px 22px;position:relative;font-size:13.5px;color:var(--dim);
}
.world-log li::before{content:"▸";position:absolute;left:0;color:var(--pink)}
.world-log b{color:var(--ink)}

/* ═══ ZONE 05 SPEEDRUN ═══ */
.splits{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap;justify-content:space-between}
.split{text-align:center;flex:1;min-width:110px;padding:8px 4px}
.split-t{font-family:var(--f-hud);font-size:8px;color:var(--dim);display:block}
.split b{font-family:var(--f-head);font-weight:900;font-size:24px;color:var(--cyan);display:block;margin:6px 0}
.split p{font-size:11.5px;color:var(--dim);line-height:1.4}
.split-pb b{color:var(--yellow)}
.split-arrow{align-self:center;color:var(--pink);font-size:18px}

/* ═══ ZONE 06 BOSSES ═══ */
.bosses{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.boss{cursor:crosshair;position:relative;overflow:hidden;transition:transform .1s steps(2)}
.boss:hover{transform:translate(-2px,-2px)}
.boss.dead{cursor:default}
.boss.dead .boss-sprite{filter:grayscale(1) brightness(.5)}
.boss-top{display:flex;gap:18px;align-items:center;margin-bottom:14px}
.boss-sprite{image-rendering:pixelated;background:var(--bg);border:var(--px) solid var(--line);flex:none}
.boss h3{font-family:var(--f-head);font-weight:800;font-size:20px}
.boss-sub{color:var(--dim);font-size:12px;margin-top:4px}
.hpbar{
  position:relative;height:22px;border:var(--px) solid var(--ink);
  background:var(--bg);margin-bottom:14px;
}
.hp-fill{height:100%;width:100%;background:repeating-linear-gradient(90deg,var(--red) 0 9px,#c01840 9px 18px);transition:width .18s steps(3)}
.hp-label{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--f-hud);font-size:9px;color:#fff;text-shadow:2px 2px 0 #000;
}
.boss-story{font-size:13.5px;color:var(--dim)}
.boss-story b{color:var(--ink)}
.boss-reward{
  margin-top:12px;font-family:var(--f-hud);font-size:8px;color:var(--orange);
  border-top:2px dashed var(--line);padding-top:12px;line-height:1.8;
}
.boss .ko{
  position:absolute;inset:0;display:none;align-items:center;justify-content:center;
  background:rgba(11,11,26,.82);z-index:3;flex-direction:column;gap:10px;
}
.boss.dead .ko{display:flex}
.ko b{font-family:var(--f-hud);font-size:26px;color:var(--yellow);text-shadow:4px 4px 0 var(--pink)}
.ko span{font-family:var(--f-hud);font-size:9px;color:var(--green)}
.dmg{
  position:absolute;font-family:var(--f-hud);font-size:14px;color:var(--yellow);
  text-shadow:2px 2px 0 #000;pointer-events:none;z-index:4;
  animation:dmgFly .7s steps(7) forwards;
}
@keyframes dmgFly{to{transform:translateY(-70px);opacity:0}}
.shake{animation:shake .25s steps(4)}
@keyframes shake{25%{transform:translate(-4px,2px)}50%{transform:translate(4px,-2px)}75%{transform:translate(-3px,-2px)}}

/* ═══ ZONE 07 ARCADE ═══ */
.arcade{padding:18px}
.arcade-hud{
  display:flex;gap:22px;flex-wrap:wrap;
  font-family:var(--f-hud);font-size:9px;color:var(--dim);
  padding:10px 6px 16px;
}
.arcade-hud b{color:var(--yellow);margin-left:6px}
#agLives{color:var(--red)}
.arcade-stage{position:relative;border:var(--px) solid var(--ink);background:#07070f}
#arcadeCanvas{display:block;width:100%;height:auto;image-rendering:pixelated;touch-action:none}
.arcade-overlay{
  position:absolute;inset:0;background:rgba(7,7,15,.9);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:16px;padding:20px;z-index:2;
}
.arcade-overlay.hide{display:none}
.ao-title{font-family:var(--f-hud);font-size:22px;color:var(--green);text-shadow:3px 3px 0 #063}
.ao-rules{font-size:13px;color:var(--dim);line-height:2}
.ao-controls{font-family:var(--f-hud);font-size:8px;color:var(--cyan)}
.arcade-overlay .press-start{margin-top:6px}
.arcade-note{color:var(--dim);font-size:11.5px;margin-top:12px}

/* ═══ ZONE 08 SKILLS ═══ */
.skilltree{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.skill-branch{display:flex;flex-direction:column;gap:12px}
.branch-name{font-family:var(--f-hud);font-size:10px;text-align:center;padding:9px 4px;border:var(--px) solid var(--ink);box-shadow:4px 4px 0 var(--shadow)}
.c-pink.branch-name{background:var(--pink);color:#fff}
.c-cyan.branch-name{background:var(--cyan);color:var(--bg)}
.c-yellow.branch-name{background:var(--yellow);color:var(--bg)}
.c-green.branch-name{background:var(--green);color:var(--bg)}
.c-orange.branch-name{background:var(--orange);color:var(--bg)}
.skill-node{
  font-family:var(--f-body);font-size:12.5px;font-weight:400;
  background:var(--panel);color:var(--ink);
  border:2px solid var(--line);padding:11px 8px;cursor:pointer;
  position:relative;transition:border-color .12s;
}
.skill-node::before{content:"◇ ";color:var(--dim)}
.skill-node:hover{border-color:var(--ink)}
.skill-node.lit{border-color:var(--yellow);background:var(--bg2)}
.skill-node.lit::before{content:"◆ ";color:var(--yellow)}
.skill-tip{margin-top:24px;position:relative;padding:18px 22px}
.st-arrow{position:absolute;top:-16px;left:34px;color:var(--ink);font-size:14px}
#skillTipText{font-size:14px;color:var(--dim)}

/* ═══ ZONE 09 INVENTORY ═══ */
.inv-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.inv-item{position:relative;padding-top:34px}
.inv-rarity{
  position:absolute;top:-14px;left:18px;
  font-family:var(--f-hud);font-size:9px;padding:7px 10px;
  border:var(--px) solid var(--ink);box-shadow:4px 4px 0 var(--shadow);
}
.rar-legend .inv-rarity{background:var(--yellow);color:var(--bg)}
.rar-epic .inv-rarity{background:var(--purple);color:#fff}
.rar-rare .inv-rarity{background:var(--cyan);color:var(--bg)}
.rar-legend{border-color:var(--yellow)}
.rar-epic{border-color:var(--purple)}
.rar-rare{border-color:var(--cyan)}
.inv-item h3{font-family:var(--f-head);font-weight:800;font-size:20px;margin-bottom:10px}
.inv-item>p{font-size:13.5px;color:var(--dim)}
.inv-eff{
  margin-top:14px;font-family:var(--f-hud);font-size:8px;color:var(--green);
  border-top:2px dashed var(--line);padding-top:12px;line-height:1.8;
}

/* ═══ ZONE 10 CODEX ═══ */
.codex-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.codex-card{position:relative;padding:20px}
.cdx-no{font-family:var(--f-hud);font-size:8px;color:var(--dim)}
.codex-card h3{font-family:var(--f-head);font-weight:800;font-size:17px;margin:8px 0 6px}
.cdx-count{font-family:var(--f-head);font-weight:900;font-size:34px;color:var(--cyan);display:block;margin-bottom:6px}
.codex-card p{font-size:12.5px;color:var(--dim)}
.cdx-total{border-color:var(--yellow)}
.cdx-total .cdx-count{color:var(--yellow)}

/* ═══ ZONE 11 GUILD ═══ */
.guild-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.guild-card b{font-family:var(--f-head);font-weight:900;font-size:34px;color:var(--pink);display:block;margin-bottom:8px}
.guild-card p{font-size:13px;color:var(--dim)}

/* ═══ ZONE 12 TROPHIES ═══ */
.trophy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.trophy{display:flex;gap:14px;align-items:flex-start;padding:16px;opacity:.75}
.trophy i{
  font-style:normal;font-size:22px;color:var(--line);
  border:2px solid var(--line);width:44px;height:44px;flex:none;
  display:flex;align-items:center;justify-content:center;
}
.trophy b{font-family:var(--f-hud);font-size:9px;display:block;margin-bottom:6px;color:var(--dim)}
.trophy p{font-size:12px;color:var(--dim)}
.trophy.unlocked{opacity:1}
.trophy.unlocked i{color:var(--yellow);border-color:var(--yellow);background:rgba(255,230,0,.08)}
.trophy.unlocked b{color:var(--ink)}
.trophy-sep{font-size:12px;color:var(--dim);margin:26px 0 18px}

/* ═══ ZONE 13 FINAL ═══ */
.zone-final{
  max-width:none;text-align:center;
  background:var(--bg2);border-top:var(--px) solid var(--ink);
  padding:110px 24px 60px;
}
.final-inner{max-width:860px;margin:0 auto}
.final-gameover{font-family:var(--f-hud);font-size:11px;color:var(--cyan)}
.final-title{
  font-family:var(--f-head);font-weight:900;text-transform:uppercase;
  font-size:clamp(32px,11vw,110px);line-height:1;
  color:var(--yellow);text-shadow:6px 6px 0 var(--red);
  margin:18px 0 8px;
}
.final-count{font-family:var(--f-hud);font-size:34px;color:var(--red);margin-bottom:26px}
.final-pitch{color:var(--dim);font-size:15px;margin-bottom:34px}
.final-ctas{display:flex;flex-direction:column;gap:16px;align-items:center}
.cta{
  font-family:var(--f-hud);text-decoration:none;display:inline-block;
  border:var(--px) solid var(--ink);box-shadow:6px 6px 0 var(--shadow);
  transition:transform .08s steps(2),box-shadow .08s steps(2);
}
.cta:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--shadow)}
.cta-main{
  background:var(--green);color:var(--bg);font-size:13px;
  padding:20px 30px;
}
.cta-main:hover{background:var(--yellow)}
.cta-row{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.cta-alt{background:var(--panel);color:var(--ink);font-size:9px;padding:14px 18px}
.cta-alt:hover{background:var(--line)}
.final-summary{
  margin:44px auto 0;font-family:var(--f-hud);font-size:9px;color:var(--dim);
  border:2px dashed var(--line);display:inline-block;padding:14px 22px;
}
.final-summary b{color:var(--yellow)}
.credits{margin-top:70px;color:var(--dim);font-size:12px;line-height:2.1}
.credits-title{font-family:var(--f-hud);font-size:10px;color:var(--dim);margin-bottom:10px}
.credits-loc{margin-top:14px;color:var(--dim)}

/* ═══ KONAMI RAINBOW ═══ */
body.konami .zone-head h2,body.konami .title-logo{
  animation:hue 1.2s linear infinite;
}
@keyframes hue{to{filter:hue-rotate(360deg)}}

/* ═══ RESPONSIVE ═══ */
@media (max-width:960px){
  .scores-grid{grid-template-columns:repeat(2,1fr)}
  .skilltree{grid-template-columns:repeat(3,1fr)}
  .bosses{grid-template-columns:1fr}
  .codex-grid,.guild-grid,.trophy-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .player-grid,.inv-grid{grid-template-columns:1fr}
  .dots{display:none}
  .hud-cell{padding:10px 10px;font-size:9px;min-height:44px}
  .hud-label{display:none}
  .zone{padding:64px 16px 50px}
  .world{margin-left:0}
  .worlds::before{display:none}
  .world::before{display:none}
  .world-stamp{margin-left:0}
  .split-arrow{display:none}
  .splits{gap:6px}
}
@media (max-width:560px){
  .scores-grid,.skilltree,.codex-grid,.guild-grid,.trophy-grid{grid-template-columns:1fr}
  .boss-top{gap:12px}
  .boss-sprite{width:64px;height:64px}
  .boss h3,.world-head h3{font-size:17px}
  .zone-next{width:100%;max-width:340px}
  .ao-title{font-size:15px}
  .ao-rules{font-size:11.5px;line-height:1.8}
  .arcade-overlay{gap:12px;padding:14px}
  .arcade-overlay .press-start{font-size:11px;padding:14px 22px}
  .statbar{grid-template-columns:1fr 60px;grid-template-rows:auto auto}
  .statbar span{grid-column:1/3}
  .frame{box-shadow:5px 5px 0 var(--shadow)}
  .cta-main{font-size:10px;padding:16px 18px}
}
