#game-screen{position:fixed;inset:0;width:100vw;height:100dvh;background:#e7d59b;overflow:hidden;isolation:isolate;z-index:10}#game-screen .battle-shell,#battle-canvas{position:absolute;inset:0;width:100%;height:100%;border:0;image-rendering:pixelated;touch-action:none}#game-screen::after{content:'';position:absolute;inset:auto 0 0;height:25%;background:linear-gradient(transparent,#192d24aa);z-index:1;pointer-events:none}.game-topline{position:absolute;z-index:9;top:max(23px,env(safe-area-inset-top));left:max(28px,env(safe-area-inset-left));right:max(28px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;gap:15px}.game-topline #stage-title{font-size:15px;font-weight:900;letter-spacing:.06em;text-align:center;color:#2b3c2d;text-shadow:0 1px #fff7d8}.game-tools{display:flex;gap:5px}.game-topline button{font-size:11px;background:#263b2ebf;color:#f5edca;padding:8px 10px}.battle-hud{position:absolute;z-index:4;top:79px;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;color:#293d2f;gap:12px;font-weight:900}.hud-item{font-size:10px}.hud-item b{font-size:12px}.hud-combo{position:absolute;right:0;top:0}.hud-combo b{font-size:24px;color:#8f4d26}.hud-combo strong{font-size:12px;letter-spacing:.1em}.hud-goal{position:absolute;top:31px;left:0;font-size:10px}.hud-goal b{font-size:10px}.battle-event{position:absolute;top:147px;left:30px;z-index:3;color:#4a593b;font-size:12px;font-weight:800;pointer-events:none}.command-callout{position:absolute;top:26%;left:50%;transform:translate(-50%,10px) scale(.9);font-size:clamp(30px,4.6vw,65px);font-weight:950;letter-spacing:.15em;color:#fff8dc;text-shadow:0 4px #273e2d,0 7px #273e2d55;opacity:0;transition:opacity .12s,transform .15s;pointer-events:none;z-index:4;white-space:nowrap}.command-callout.show{opacity:1;transform:translate(-50%,0) scale(1)}.response-chant{position:absolute;left:32%;top:48%;z-index:4;color:#fff8dc;font-size:clamp(22px,3vw,43px);font-weight:950;letter-spacing:.1em;text-shadow:0 3px #263d2c;opacity:0;transform:rotate(-8deg) scale(.9);transition:opacity .1s,transform .1s;pointer-events:none}.response-chant.show{opacity:1;transform:rotate(-8deg) scale(1)}.fever .response-chant,.fever .command-callout{color:#ffdc6d}.rhythm-panel{position:absolute;z-index:8;bottom:max(25px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(440px,calc(100vw - 36px));color:#fff6d5}.rhythm-heading{display:flex;flex-direction:column;text-align:center;gap:5px;margin-bottom:14px;text-shadow:0 2px #243a2b}.rhythm-heading .eyebrow{display:none}.rhythm-heading b{font-size:15px;letter-spacing:.1em}.rhythm-heading>span{font-size:10px;color:#dedfc0;min-height:15px}.beat-rail{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.drum-row{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.drum{height:83px;border:3px solid #fff1bb;border-radius:50%;background:#273c2df0;color:#f9e5aa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;box-shadow:0 5px #17271d,0 0 0 3px #273c2d;transition:transform .07s,background .07s,box-shadow .07s}.drum>span{font-size:24px;line-height:1.05;font-weight:900}.drum b{font-size:11px;letter-spacing:.07em}.drum small{font-size:9px;color:#c1c7a2;margin-top:2px}.drum-pikachu{border-color:#efd26c}.drum-charmander{border-color:#9fd59a}.drum-squirtle{border-color:#95c4bf}.drum-bulbasaur{border-color:#d9a8ac}.drum:active,.drum.pressed{transform:translateY(4px) scale(.96);background:#f7cc61;color:#263c2d;box-shadow:0 1px #17271d,0 0 0 3px #273c2d}.command-strip{position:absolute;left:30px;bottom:32px;z-index:3;display:grid;gap:7px;font-size:9px;color:#e0e3be;text-shadow:0 1px #24372a}.command-strip>div{display:flex;gap:11px}.command-strip b{font-size:11px;color:#f5d47e;min-width:25px}.command-strip span{font-size:9px;letter-spacing:.04em}.rhythm-border{--pulse:0;--edge:#e9b94c;position:absolute;z-index:7;inset:7px;border:6px solid var(--edge);box-shadow:inset 0 0 0 2px #fff7bf,0 0 0 2px #253d2c,inset 0 0 35px color-mix(in srgb,var(--edge) 60%,transparent);opacity:calc(.12 + var(--pulse)*.85);pointer-events:none;transition:border-color .1s}.rhythm-border::after{content:attr(data-beat);position:absolute;top:0;left:50%;transform:translate(-50%,-4px);padding:0 13px;font-size:16px;font-weight:950;background:var(--edge);color:#26382b;line-height:22px}.rhythm-border.response{--edge:#9fdbbd}.rhythm-border.miss{--edge:#cf7560}.rhythm-border.fever{--edge:#ffd65b;border-width:9px}.rhythm-border.paused{opacity:.06}.rhythm-border i{position:absolute;width:16px;height:16px;background:var(--edge);border:2px solid #ffefb9;transform:rotate(45deg)}.rhythm-border i:nth-child(1){left:1px;top:1px}.rhythm-border i:nth-child(2){right:1px;top:1px}.rhythm-border i:nth-child(3){left:1px;bottom:1px}.rhythm-border i:nth-child(4){right:1px;bottom:1px}@media(max-width:1100px){.command-strip{display:none}}@media(max-width:650px){.game-topline{top:max(19px,env(safe-area-inset-top));left:19px;right:19px;gap:7px;align-items:flex-start;flex-wrap:wrap}.game-topline #stage-title{font-size:9px;order:3;width:100%;text-align:left;margin-top:4px}.game-topline button{font-size:9px;padding:6px 7px}.game-tools{gap:4px}#game-help-button,#fullscreen-button{width:27px;font-size:0;padding:6px 0}#game-help-button::before{content:'?';font-size:11px}#fullscreen-button::before{content:'⛶';font-size:12px}.battle-hud{top:83px;left:20px;right:20px;gap:5px}.hud-item{font-size:8px;gap:5px}.hud-item b{font-size:9px}.health-track{width:70px;height:6px}.hud-combo b{font-size:18px}.hud-combo strong{font-size:9px}.hud-goal{top:23px}.hud-goal b{font-size:8px}.battle-event{left:20px;top:129px;font-size:9px}.rhythm-panel{bottom:max(22px,env(safe-area-inset-bottom));width:calc(100vw - 45px)}.rhythm-heading{margin-bottom:10px;gap:4px}.rhythm-heading b{font-size:12px}.rhythm-heading>span{font-size:9px}.drum-row{gap:11px}.drum{height:65px;border-width:2px}.drum>span{font-size:22px}.drum b{font-size:9px}.drum small{display:none}.rhythm-border{inset:5px;border-width:5px}.rhythm-border.fever{border-width:7px}.rhythm-border::after{font-size:12px;line-height:17px}.rhythm-border i{width:13px;height:13px}.command-callout{top:29%;font-size:31px}.response-chant{left:37%;top:49%;font-size:24px}}
@media(orientation:landscape) and (max-height:550px){.game-topline{top:20px;left:22px;right:22px}.game-topline #stage-title{font-size:10px;order:0;width:auto}.game-topline button{font-size:9px;padding:5px 8px}.battle-hud{top:58px;left:23px;right:23px}.hud-goal{display:none}.battle-event{top:85px;left:23px;font-size:9px}.rhythm-panel{left:auto;right:28px;bottom:22px;transform:none;width:260px}.drum-row{gap:9px}.drum{height:52px;border-width:2px}.drum>span{font-size:18px}.drum b{font-size:8px}.drum small{display:none}.rhythm-heading{margin-bottom:8px}.rhythm-heading b{font-size:11px}.rhythm-heading>span{font-size:8px}.command-callout{font-size:33px;top:28%}.response-chant{font-size:23px;top:42%}.hud-item{font-size:9px}.hud-combo b{font-size:18px}.health-track{width:90px}}

.drum img{width:38px;height:30px;object-fit:contain;image-rendering:pixelated}.drum b{display:flex;gap:5px;align-items:center}.drum b em{font-style:normal;font-size:9px}.drum-pikachu{border-color:#efd26c}.drum-charmander{border-color:#ed9b6d}.drum-squirtle{border-color:#8fcbd6}.drum-bulbasaur{border-color:#a6ce8c}.drum small{font-size:8px}
.command-strip .pika-pattern{gap:3px}.command-strip .pika-beat{padding:1px 3px;gap:2px}.command-strip .pika-beat img{width:18px;height:18px}.command-strip .pika-beat>span{font-size:7px}.command-strip .pika-beat small{font-size:7px}.command-strip>div>b{min-width:48px;align-self:center}.command-strip{gap:4px}
@media(max-width:650px){.drum img{width:29px;height:26px}.drum b{font-size:9px}.drum b em{font-size:8px}}
@media(orientation:landscape) and (max-height:550px){.drum img{width:25px;height:21px}.drum b{font-size:8px}}

/* Partner bond mode: a Poké Ball badge and four elemental pads share the beat. */
.fever-banner{position:absolute;z-index:5;top:177px;left:50%;transform:translate(-50%,-8px);display:flex;align-items:center;gap:10px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,transform .2s;color:#fff6c7;text-shadow:0 2px #263d2e;white-space:nowrap}.fever-banner>span{display:grid;gap:1px}.fever-banner small{font-size:9px;letter-spacing:.32em;color:#ffdd79}.fever-banner b{font-size:20px;letter-spacing:.14em}.fever-banner em{font-size:10px;font-style:normal;border-left:1px solid #fce3a288;padding-left:10px;letter-spacing:.08em}.fever .fever-banner{opacity:1;visibility:visible;transform:translate(-50%,0)}.bond-ball{display:block;width:29px;height:29px;border:2px solid #fff3bd;border-radius:50%;background:linear-gradient(#f27b62 0 43%,#344c3b 43% 56%,#fff6d4 56%);position:relative;box-shadow:0 0 18px #ffe27877}.bond-ball::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#ffdf6a;border:2px solid #344c3b}.fever .drum-pikachu{--bond-color:#ffda67}.fever .drum-charmander{--bond-color:#ff9b70}.fever .drum-squirtle{--bond-color:#91deec}.fever .drum-bulbasaur{--bond-color:#b7e78c}.fever .drum{border-color:var(--bond-color);box-shadow:0 4px #17271d,0 0 0 3px #273c2d,0 0 15px color-mix(in srgb,var(--bond-color) 60%,transparent)}.fever .rhythm-border i{width:22px;height:22px;border-radius:50%;transform:none;background:linear-gradient(#e77d61 0 43%,#344c3b 43% 56%,#fff6d4 56%);border-color:#fff0ad}.fever .rhythm-border i::after{content:'';position:absolute;top:50%;left:50%;width:5px;height:5px;border:2px solid #344c3b;border-radius:50%;background:#fff1bc;transform:translate(-50%,-50%)}.fever #fever-label{color:#ffe58d;text-shadow:0 1px #30472e,0 0 10px #f6bd40}.fever-entry .command-callout{color:#fff2a5;letter-spacing:.09em}.fever .response-chant{text-shadow:0 3px #263d2c,0 0 18px #ffdb6c77}
@media(max-width:650px){.fever-banner{top:152px;gap:7px}.fever-banner b{font-size:15px}.fever-banner small{font-size:7px}.fever-banner em{font-size:8px;padding-left:7px}.bond-ball{width:24px;height:24px}.fever-entry .command-callout{top:32%;font-size:29px}.fever .rhythm-border i{width:17px;height:17px}.fever .drum{box-shadow:0 4px #17271d,0 0 0 2px #273c2d,0 0 10px color-mix(in srgb,var(--bond-color) 50%,transparent)}}
@media(max-height:500px) and (orientation:landscape){.fever-banner{top:117px;left:auto;right:25px;transform:translateY(-8px)}.fever .fever-banner{transform:translateY(0)}.fever-banner b{font-size:13px}.fever-banner em{display:none}.fever-entry .command-callout{top:39%;font-size:30px}.fever-banner small{font-size:7px}.fever-banner .bond-ball{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.fever-banner{transition:none}.fever .rhythm-border{opacity:.75}.fever .response-chant{transition:none}}
.fever .battle-hud,.fever .game-topline #stage-title{color:#f5f4d5;text-shadow:0 1px 2px #163e45}.fever .battle-event{color:#d9ecce;text-shadow:0 1px #193c41}.fever .hud-combo b{color:#ffe391}.fever .game-topline button{background:#193e45dd}.fever .hud-goal{color:#e8eed1}
.drum b{white-space:nowrap;gap:3px;letter-spacing:.02em}
@media(orientation:landscape) and (max-height:550px){.drum{padding:0}.drum b{gap:2px}.drum b em{font-size:7px}}
.tactical-cue{position:absolute;z-index:4;left:30px;right:30px;top:120px;color:#324c37;font-size:10px;font-weight:900;line-height:1.5;white-space:pre-line;pointer-events:none}.battle-event{top:159px}.fever .tactical-cue{color:#e0e9bc;text-shadow:0 1px #213c3e}@media(max-width:650px){.tactical-cue{left:20px;right:20px;top:124px;font-size:8px;line-height:1.5}.battle-event{top:182px;font-size:8px}}@media(orientation:landscape) and (max-height:550px){.tactical-cue{left:23px;top:82px;right:240px;font-size:8px}.battle-event{left:23px;top:114px;font-size:8px}}
html[lang="en"] .drum b,html[lang="ja"] .drum b{flex-direction:column;gap:0;line-height:1.15}
html[lang="en"] .drum b em,html[lang="ja"] .drum b em{letter-spacing:0}
.command-callout{max-width:calc(100vw - 30px);text-align:center}
@media(max-width:650px){html[lang="en"] .command-callout{font-size:27px;letter-spacing:.04em}html[lang="ja"] .command-callout{font-size:28px;letter-spacing:.03em}}
.battle-guide{position:absolute;z-index:5;left:30px;top:198px;width:min(430px,40vw);padding:12px 15px;border-left:4px solid #d7bd66;background:#20382dea;color:#fff5d5;pointer-events:none;box-shadow:0 3px 0 #15261b40}.battle-guide>b{display:block;font-size:15px;line-height:1.4;color:#ffe38b}.battle-guide>p{margin:6px 0;font-size:13px;line-height:1.55}.battle-guide #guide-command{display:flex;align-items:center;gap:3px;min-height:0}.battle-guide #guide-command:empty{display:none}.battle-guide .pika-beat{font-size:9px}.battle-guide .pika-beat img{width:22px;height:22px;image-rendering:pixelated}.battle-guide.urgent{border-left-color:#ffd787;background:#513d28f0}
@media(max-width:650px){.battle-guide{left:20px;top:207px;width:min(350px,calc(100vw - 40px));padding:9px 11px}.battle-guide>b{font-size:13px}.battle-guide>p{font-size:11px;line-height:1.45;margin:4px 0}.battle-guide .pika-beat{font-size:8px}.battle-guide .pika-beat img{width:18px;height:18px}}
@media(orientation:landscape) and (max-height:550px){.battle-guide{left:auto;right:22px;top:84px;width:300px;padding:7px 10px}.battle-guide>b{font-size:11px}.battle-guide>p{font-size:10px;line-height:1.35;margin:3px 0}.battle-guide #guide-command{position:absolute;top:100%;right:0;background:#20382dea;padding:3px 7px}.battle-guide .pika-beat{font-size:8px}.battle-guide .pika-beat img{width:17px;height:17px}}
.battle-guide .pika-pattern{gap:4px}.battle-guide .pika-beat{flex-direction:column;gap:2px;padding:3px 4px;line-height:1.1}.battle-guide .pika-beat>span{font-size:9px}.battle-guide .pika-beat small{display:none}
@media(max-width:650px),(orientation:landscape) and (max-height:550px){.battle-guide .pika-beat>span{font-size:8px}}

/* Phone landscape: two calls under each thumb, with the beat cue between them. */
@media (orientation:landscape) and (max-height:550px) and (pointer:coarse) {
  .rhythm-panel {
    --thumb-pad:clamp(64px,19dvh,82px);
    --thumb-gap:12px;
    left:max(24px,calc(env(safe-area-inset-left) + 12px));
    right:max(24px,calc(env(safe-area-inset-right) + 12px));
    bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));
    width:auto;
    transform:none;
    pointer-events:none;
  }
  .drum-row {
    grid-template-columns:repeat(2,var(--thumb-pad)) minmax(0,1fr) repeat(2,var(--thumb-pad));
    gap:var(--thumb-gap);
    align-items:end;
  }
  .drum:nth-child(3) { grid-column:4; }
  .drum {
    width:var(--thumb-pad);
    height:var(--thumb-pad);
    border-width:3px;
    touch-action:none;
    pointer-events:auto;
  }
  .drum img { width:34px;height:30px; }
  .drum b { flex-direction:column;gap:0;font-size:clamp(8px,2.5dvh,10px);line-height:1.15;white-space:nowrap; }
  .drum b em { font-size:8px; }
  .rhythm-heading {
    position:absolute;
    left:50%;
    bottom:10px;
    transform:translateX(-50%);
    width:min(300px,calc(100% - 4 * var(--thumb-pad) - 6 * var(--thumb-gap)));
    margin:0;
    gap:6px;
    text-wrap:balance;
  }
  .rhythm-heading b { font-size:12px; }
  .rhythm-heading>span { font-size:10px;line-height:1.5; }
}
