:root{color-scheme:dark;font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;background:#10111d;color:#f9f2e9}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overscroll-behavior:none}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #ffcc76;outline-offset:3px}.shell{width:min(100%,520px);margin:0 auto;height:100dvh;min-height:0;display:flex;flex-direction:column;background:#191a2a;box-shadow:0 0 70px #0008}.series-bar{height:43px;flex:none;display:flex;align-items:center;gap:7px;padding:0 12px;background:#10111d;color:#eac9a0;font-size:10px;letter-spacing:.02em;white-space:nowrap}.series-paw{font-size:16px}.series-bar strong{font-family:ui-monospace,monospace;margin-left:auto;color:#f8c977;font-size:10px;letter-spacing:.06em}.series-bar strong span{color:#756e73}.game{display:flex;flex-direction:column;flex:1;min-height:0}.hud{height:58px;flex:none;display:flex;align-items:center;gap:13px;padding:6px 13px;background:#252338;border-bottom:2px solid #c5925a}.hud-item{min-width:94px}.hud small{display:block;color:#c2a9a7;font-size:10px;letter-spacing:.06em;margin-bottom:5px}.hearts{color:#ff7874;font-size:17px;letter-spacing:1px;line-height:1}.hud-center{flex:1}.progress{height:9px;border-radius:20px;background:#10111d;overflow:hidden;border:1px solid #62536a}.progress div{height:100%;width:0;background:linear-gradient(90deg,#f19769,#ffd48a);border-radius:20px;transition:width .15s}.pause-button{height:36px;width:36px;border:1px solid #89737d;border-radius:11px;color:#fff0d6;background:#3b3448;font-size:18px;font-weight:800}.pause-button:disabled{opacity:.45}.arena-wrap{position:relative;flex:1;min-height:230px;overflow:hidden;background:#322b40}.arena-wrap canvas{display:block;width:100%;height:100%;object-fit:contain}.announcement{position:absolute;top:12px;left:50%;transform:translateX(-50%) translateY(-8px);padding:5px 11px;background:#171827d9;color:#ffe0a5;font-size:13px;font-weight:800;border-radius:20px;opacity:0;transition:opacity .15s,transform .15s;pointer-events:none;white-space:nowrap}.announcement.show{opacity:1;transform:translateX(-50%) translateY(0)}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(#1816269c,#191624df);padding:14px}.overlay[hidden]{display:none}.overlay-card{width:min(100%,290px);padding:20px 18px 17px;text-align:center;border:1px solid #ffcf8a8c;border-radius:18px;background:linear-gradient(160deg,#343048,#1c1b2d);box-shadow:0 16px 40px #100b1ec0}.card-mark{font-size:11px;letter-spacing:.16em;color:#ffc582;font-weight:800}.overlay h1{font-size:30px;line-height:1.22;margin:10px 0 9px;color:#fff0d9;text-shadow:0 3px #8e514d}.overlay p{font-size:13px;line-height:1.6;color:#eee1d9;margin:0 0 15px}.primary-button{width:100%;height:48px;border:0;border-radius:12px;background:linear-gradient(#ffd68b,#f3a76e);color:#332733;font-size:16px;font-weight:900;box-shadow:0 4px 0 #a65f4c}.primary-button:active{transform:translateY(3px);box-shadow:0 1px 0 #a65f4c}.primary-button span{margin-left:15px}.overlay-hint{color:#bcaab4;font-size:11px;margin-top:13px}.controls{height:169px;flex:none;display:flex;gap:8px;align-items:stretch;padding:11px 10px 13px;background:#201e31;border-top:2px solid #634c59;touch-action:none;user-select:none}.move-controls{flex:1.2;min-width:0}.fight-controls{flex:1;min-width:0}.control-label{font-size:10px;color:#f6bb81;font-family:ui-monospace,monospace;letter-spacing:.13em;font-weight:800;margin:0 0 9px 4px;white-space:nowrap}.control-label span{font-family:inherit;letter-spacing:0;color:#b2a3ae;font-weight:400;margin-left:4px}.move-row,.fight-row{display:flex;gap:5px;height:112px}.control-button{touch-action:none;user-select:none;border:1px solid #756576;color:#fff3e0;box-shadow:inset 0 1px #ffffff29,0 4px 0 #11101d;border-radius:15px;background:linear-gradient(#4c4559,#373346);font-weight:900}.control-button.pressed,.control-button:active{transform:translateY(3px);box-shadow:inset 0 1px #ffffff12,0 1px 0 #11101d;filter:brightness(1.2)}.move-row .control-button{flex:1;min-width:0;font-size:21px}.move-row .jump{background:linear-gradient(#5c5470,#48415d)}.fight-row .control-button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:13px}.fight-row .punch{background:linear-gradient(#d8836c,#a95158);border-color:#e3a283}.fight-row .kick{background:linear-gradient(#d9aa6c,#a77951);border-color:#e6c188}.button-symbol{font-size:27px;line-height:1}.keyboard-hint{text-align:center;background:#191827;color:#8f8899;font-size:10px;padding:7px 5px}.series-footer{padding:9px 13px 13px;color:#877f8d;font-size:10px;line-height:1.5;text-align:center;background:#10111d}.series-footer[hidden]{display:none}@media(max-width:359px){.series-bar{font-size:9px;padding:0 8px}.series-bar strong{font-size:9px}.controls{padding-left:6px;padding-right:6px;gap:5px}.control-label span{display:none}.keyboard-hint{font-size:9px}}@media(max-height:650px){.series-bar{height:34px}.hud{height:48px}.controls{height:137px;padding-top:7px;padding-bottom:7px}.move-row,.fight-row{height:95px}.control-label{margin-bottom:5px}.keyboard-hint{display:none}.series-footer{padding:5px}}


@media(min-width:900px){.shell{width:min(1100px,calc(100vw - 40px));max-width:1100px}.controls{justify-content:center;gap:30px;height:155px}.move-controls,.fight-controls{flex:0 1 240px}.series-bar{font-size:12px}.series-bar strong{font-size:12px}.keyboard-hint{font-size:12px}.announcement{font-size:14px}}

.health{position:relative;width:104px;height:17px;border:1px solid #947383;border-radius:9px;background:#121422;overflow:hidden}.health>div{height:100%;width:100%;background:linear-gradient(90deg,#f17c99,#ffd18b);transition:width .18s ease-out}.health>span{position:absolute;inset:0;text-align:center;font-size:10px;line-height:15px;font-weight:800;color:#fff;text-shadow:0 1px 3px #24121f,1px 0 2px #24121f}.health.low>div{background:#ed6178}@media(max-width:359px){.health{width:90px}.hud{gap:8px}.hud-item{min-width:90px}}

/* Keep Safari gestures and selection outside the game controls. */
html,body{height:100%;overflow:hidden;touch-action:none}.shell,.shell *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.shell{touch-action:none;overscroll-behavior:none}.shell button{touch-action:none}.controls{padding-bottom:max(13px,env(safe-area-inset-bottom))}

#rushLabel{float:right;color:#ffd681;font-size:8px;letter-spacing:0}.hud-item small{white-space:nowrap}

.sound-button{flex:0 0 auto;border:1px solid #7f7288;border-radius:9px;padding:8px 5px;min-height:40px;background:#393246;color:#ffe6be;font:700 11px system-ui;cursor:pointer;touch-action:manipulation}
.sound-button[aria-pressed="false"]{color:#c0b8c8;background:#252132}

.hud-center{min-width:0}.pause-button{flex-shrink:0}
@media(max-width:400px){.hud{gap:7px;padding-left:9px;padding-right:9px}.hud small{letter-spacing:0}.hud-center small{font-size:9px}}

.overlay .personal-best{display:block;margin-top:8px;color:#e5c899;font-size:9px;line-height:1.4}
.overlay{overflow-y:auto}.overlay-card{max-height:100%;overflow-y:auto;touch-action:pan-y}
@media(max-width:899px) and (max-height:700px){.overlay-card{padding:10px 12px}.overlay .card-mark{font-size:9px;letter-spacing:.06em}.overlay h1{font-size:25px;line-height:1.15;margin:6px 0}.overlay p{font-size:12px;line-height:1.4;margin-bottom:8px}.overlay .personal-best{margin-top:5px;font-size:8px}.overlay-hint{font-size:9px;margin-top:6px}}
/* Collection exterior shared with GAME 01-03; keep the game's viewport and controls independent. */
.series-band{width:100%;flex:0 0 auto;background:#24172f;color:#fff6e6;border-bottom:2px solid #f2b84b;box-shadow:0 5px 16px #0006;position:relative;z-index:20}
.series-band__inner{width:100%;min-height:42px;margin:auto;padding:5px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.series-mark{display:flex;align-items:center;gap:8px}
.series-mark__icon{width:26px;height:26px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:#e95767;color:#fff;font-size:19px;line-height:1}
.series-mark div,.series-game{display:flex;flex-direction:column;gap:1px}
.series-mark b{font-size:13px;line-height:1.15;letter-spacing:.06em;white-space:nowrap}
.series-mark small,.series-game small{font-size:6px;line-height:1;letter-spacing:.16em;color:#d9b66c}
.series-game{text-align:right;flex-shrink:0}
.series-game strong{font-size:13px;line-height:1.1;letter-spacing:.1em;color:#fff;white-space:nowrap}
.series-note{width:100%;flex:0 0 auto;margin:0 auto;padding:7px 14px max(9px,env(safe-area-inset-bottom));text-align:center;font-size:7px;line-height:1.55;color:#8f83a3;background:#10111d}
.series-note b{color:#b8a9c8;letter-spacing:.08em;margin-right:7px}
.series-note[hidden]{display:none}
@media(max-width:899px){.series-band__inner{min-height:38px;padding:4px 8px;gap:8px}.series-mark{gap:6px}.series-mark__icon{width:23px;height:23px;font-size:16px}.series-mark b{font-size:10px}.series-mark small,.series-game small{font-size:5px}.series-game strong{font-size:10px}.series-note{font-size:6px;padding:5px 8px max(7px,env(safe-area-inset-bottom))}.series-note b{display:none}}
.series-back{display:block;width:max-content;max-width:100%;margin:0 auto;padding:0 12px 4px;min-height:24px;box-sizing:border-box;font-size:11px;line-height:20px;color:#f5db9c;text-decoration:underline;text-underline-offset:3px;touch-action:manipulation}.series-back:hover{color:#fff6e6}.series-back:focus-visible{outline:2px solid #f2b84b;outline-offset:1px}