/* Layout only: all visible frames, controls and icons use the native image atlases.
   This sheet owns viewport / touch geometry after the shared desktop artwork. */
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body { touch-action:manipulation; }
button,a,input,select { touch-action:manipulation; }
body.in-game { overflow:hidden; overscroll-behavior:none; }
.game-screen { touch-action:auto; }
#game-canvas,.touch-controls,.touch-controls button,.joystick,.skill-bar { touch-action:none; }
.game-screen canvas#game-canvas { left:0; top:0; width:100%; height:100%; transform:none; }
.boot-title-options { flex-wrap:wrap; justify-content:center; }
.mobile-fullscreen-help { display:grid; gap:12px; font-size:16px; line-height:1.4; }
.mobile-fullscreen-help img { width:54px; height:54px; margin:auto; object-fit:contain; image-rendering:pixelated; }
.mobile-fullscreen-help p { margin:0; }
.overlay,.modal { touch-action:pan-y; overscroll-behavior:contain; }
.native-ui .modal-panel,.native-ui .overlay-panel { box-sizing:border-box; max-height:calc(100dvh - 24px); }
.native-ui .overlay-actions { flex-wrap:wrap; }
.native-ui .overlay-actions button { max-width:100%; white-space:normal; line-height:1.15; }
.native-ui .game-screen:has(#overlay:not([hidden])) .touch-controls,
.native-ui .game-screen:has(#overlay:not([hidden])) #capture-hud { visibility:hidden; }
.native-ui .loadout-item,.native-ui .upgrade-grid button,.native-ui .camp-reward-grid button { min-width:0; }
.native-ui .camp-talent-branch button>strong,.native-ui .camp-moves button>strong { overflow-wrap:anywhere; }
.native-ui .camp-section-hint,.native-ui .overlay-panel>p { overflow-wrap:break-word; }
.native-ui .game-screen .match-stats { box-sizing:border-box; align-items:center; }
.native-ui .game-screen .match-stats>span { max-width:100%; text-align:center; white-space:normal; }
.native-ui .game-screen .match-center { box-sizing:border-box; }
.native-ui .game-screen .match-phase,.native-ui .game-screen .match-objective { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.native-ui .game-screen .journey-resources>span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.native-ui .game-screen .journey-xp-row>span { white-space:nowrap; }

/* One set of touch actions replaces the duplicate desktop skill bar.
   Costs / cooldowns are rendered on those same native buttons. */
.native-ui.touch-ui .game-screen .skill-bar,.touch-ui .in-game-help { display:none!important; }
.native-ui.touch-ui .touch-controls { display:block; }
.native-ui.touch-ui .touch-controls .joystick {
  left:max(24px,calc(env(safe-area-inset-left) + 16px));
  bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px));
  width:136px; height:136px; padding:0;
}
.native-ui.touch-ui .joystick::before,.native-ui.touch-ui .joystick::after { display:none; }
.native-ui.touch-ui .touch-controls .joystick-stick {
  position:absolute; width:54px; height:54px; left:calc(50% - 27px); top:calc(50% - 27px);
}
.native-ui.touch-ui .touch-controls .touch-actions {
  right:max(22px,calc(env(safe-area-inset-right) + 14px));
  bottom:max(20px,calc(env(safe-area-inset-bottom) + 10px));
  width:204px; display:grid; grid-template-columns:repeat(3,64px); grid-template-rows:repeat(2,68px); gap:6px;
}
.native-ui.touch-ui .touch-actions button,.native-ui.touch-ui .touch-actions .touch-attack {
  box-sizing:border-box; width:64px; height:68px; min-width:0; min-height:0;
  grid-column:auto; grid-row:auto; padding:8px 13px 23px; gap:0;
  background-size:58px 58px!important; background-position:center top!important;
  position:relative; overflow:hidden;
}
.native-ui.touch-ui .touch-actions [data-action=attack] { grid-column:3; grid-row:2; }
.native-ui.touch-ui .touch-actions .touch-icon { width:30px; height:30px; flex:none; margin:0; }
.native-ui.touch-ui .touch-actions [data-action=dash] .touch-icon,.native-ui.touch-ui .touch-actions [data-action=interact] .touch-icon { width:44px; height:44px; margin-top:-3px; }
.native-ui.touch-ui .touch-actions .touch-label { bottom:1px; font-size:11px; line-height:12px; white-space:nowrap; }
.native-ui.touch-ui .touch-status { position:absolute; bottom:16px; left:0; right:0; text-align:center; font:11px/12px var(--pixel); color:#fff1c9; text-shadow:1px 1px #0b2032,-1px -1px #0b2032; pointer-events:none; }
.native-ui.touch-ui .touch-actions .cooling .touch-status { bottom:30px; font-size:17px; line-height:18px; }
.native-ui.touch-ui .touch-actions .not-ready .touch-icon { opacity:.55; }
.native-ui.touch-ui .game-screen .player-hud { left:max(10px,env(safe-area-inset-left)); top:max(8px,env(safe-area-inset-top)); }
.native-ui.touch-ui .game-screen .match-right { right:max(10px,env(safe-area-inset-right)); top:max(8px,env(safe-area-inset-top)); }
.native-ui.touch-ui .game-screen .icon-button { width:40px; height:40px; }
.native-ui.touch-ui .game-screen .minimap-panel { top:auto; bottom:180px; right:max(16px,env(safe-area-inset-right)); width:76px; height:76px; }
.native-ui.touch-ui .game-screen .toast { left:50%; transform:translateX(-50%); top:82px; bottom:auto; max-width:min(330px,42vw); text-align:center; }
.native-ui.touch-ui .game-screen .interaction-prompt { bottom:180px; max-width:60vw; white-space:normal; text-align:center; }

/* Opening media has a poster and a visible loading/retry state. */
.boot-intro { position:absolute; inset:0; height:100%; overflow:hidden; }
.boot-intro video { display:block; }
.boot-video-status { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); max-width:80%; margin:0; padding:15px 26px; background:var(--native-nameplate) center/100% 100% no-repeat; font-size:16px; color:#f4e4bf; text-align:center; }
.boot-intro-caption { right:env(safe-area-inset-right); bottom:env(safe-area-inset-bottom); }
.boot-native { white-space:normal; line-height:1.15; box-sizing:border-box; }
.boot-mode { box-sizing:border-box; }
.boot-mode>span { line-height:1.2; }
body[data-boot-phase=intro] .cloud-account { display:none; }
.cloud-account { box-sizing:border-box; max-width:min(250px,70vw)!important; padding:7px 18px!important; bottom:max(3px,env(safe-area-inset-bottom))!important; font-size:11px!important; line-height:12px; }

@media(max-height:540px) and (orientation:landscape) {
  .boot-title,.boot-title.has-journey { padding:10px max(20px,env(safe-area-inset-left)) 34px; gap:2px; }
  .boot-title .boot-brand,.boot-title.has-journey .boot-brand { width:min(330px,46vw); }
  .boot-title .boot-tagline { margin:3px 0 10px; font-size:12px; }
  .boot-title .boot-start,.boot-title.has-journey .boot-start { min-height:44px; padding:8px 24px; font-size:19px; }
  .boot-title .boot-input-hint { margin:5px 0 9px; font-size:10px; }
  .boot-title-options { gap:8px; }
  .boot-title .boot-small { min-height:35px; padding:7px 18px; }
  .boot-modes { min-height:100%; padding:10px max(16px,env(safe-area-inset-left)) 36px; gap:9px; justify-content:center; }
  .boot-mode-brand { display:none; }
  .boot-modes h2 { font-size:19px; margin:0; }
  .boot-mode-list { grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }
  .boot-mode { min-height:204px; padding:12px 12px 28px; gap:5px; }
  .boot-mode-land { height:52px; width:100%; margin:0; }
  .boot-mode-icon { width:27px; height:27px; margin-top:-12px; }
  .boot-mode strong { font-size:16px; }
  .boot-mode small { font-size:9px; line-height:1.15; letter-spacing:0; }
  .boot-mode>span { font-size:11px; }
  .boot-modes footer { width:100%; gap:8px; }
  .boot-modes footer>span { display:none; }
  .boot-modes footer .boot-small { min-width:110px; min-height:36px; font-size:12px; padding:8px 15px; }
  .native-ui .lobby { padding-bottom:32px; padding-left:max(12px,env(safe-area-inset-left)); padding-right:max(12px,env(safe-area-inset-right)); }
  .native-ui .site-footer { display:none; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card { display:grid; grid-template-columns:34px minmax(0,1fr); grid-template-rows:12px 18px; align-content:center; justify-items:start; gap:0 3px; padding:9px 12px; min-height:0; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { grid-column:1; grid-row:1/3; width:33px; height:33px; max-height:none; max-width:none; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card .card-number { grid-column:2; grid-row:1; align-self:end; font-size:8px; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card strong { grid-column:2; grid-row:2; font-size:11px; width:100%; text-align:left; }
  .native-ui .game-selection .partner-heading h2 { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .native-ui .game-screen .player-hud { width:194px; height:104px; }
  .native-ui .game-screen .hud-portrait-wrap { width:49px; height:49px; }
  .native-ui .game-screen #hud-name { font-size:14px; }
  .native-ui .game-screen .progress-hud { top:106px; width:194px; height:58px; min-height:58px; padding:8px 16px; }
  .native-ui .game-screen .journey-xp-row { height:14px; }
  .native-ui .game-screen .journey-xp-track { margin:3px 0; height:5px; }
  .native-ui .game-screen .journey-resources { height:11px; }
  .native-ui .game-screen .journey-xp-row strong { font-size:13px; }
  .native-ui .game-screen .journey-xp-row span,.native-ui .game-screen .journey-resources span { font-size:10px; }
  .native-ui .game-screen .match-center { top:max(8px,env(safe-area-inset-top)); width:min(300px,34vw); max-width:34vw; padding:10px 16px; }
  .native-ui .game-screen .match-phase { font-size:12px; }
  .native-ui .game-screen .match-objective { font-size:10px; }
  .native-ui .game-screen .match-stats { min-width:114px; max-width:140px; padding:6px 12px; }
  .native-ui .game-screen .boss-hud { top:56px; width:230px; }
  .native-ui.touch-ui .game-screen .minimap-panel { display:none; }
  .native-ui.touch-ui .game-screen .toast { top:67px; max-width:36vw; }
  #presentation-milestone:not([data-kind=evolution]) { top:65px; right:max(12px,env(safe-area-inset-right)); width:245px; }
}

@media(max-width:700px) and (orientation:portrait) {
  .boot-modes { justify-content:flex-start; padding:18px 12px 44px; gap:12px; }
  .boot-mode { padding:13px 14px 22px; min-height:175px; }
  .boot-mode-land { width:100%; }
  .boot-modes footer { flex-wrap:wrap; justify-content:center; }
  .boot-modes footer .boot-small { flex:1; max-width:180px; }
  .native-ui .lobby { padding-bottom:34px; grid-template-rows:68px 34px minmax(0,1fr); }
  .native-ui .site-header { height:68px; display:flex; flex-wrap:wrap; gap:5px; align-content:start; justify-content:center; }
  .native-ui .wordmark { width:100%; display:flex; justify-content:center; }
  .native-ui .main-nav { width:100%; justify-content:center; flex-wrap:nowrap; gap:3px; }
  .native-ui .main-nav .nav-item { font-size:10px; padding:5px 8px; min-width:0; }
  .native-ui .site-footer { display:none; }
  .native-ui .game-selection .partner-heading h2 { font-size:23px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card { padding:8px 3px; gap:2px; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { width:clamp(32px,7vh,52px); height:clamp(32px,7vh,52px); max-height:54%; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card strong { font-size:10px; }
  .native-ui .game-screen .player-hud { width:190px; height:102px; left:8px; top:max(8px,env(safe-area-inset-top)); }
  .native-ui .game-screen .hud-portrait-wrap { width:48px; height:48px; }
  .native-ui .game-screen #hud-name { font-size:14px; }
  .native-ui .game-screen .resource-label strong { font-size:9px; }
  .native-ui .game-screen .match-right { right:8px; gap:3px; }
  .native-ui .game-screen .match-stats { min-width:106px; max-width:115px; }
  .native-ui .game-screen .match-stats>span { font-size:8px; }
  .native-ui .game-screen .match-center { left:50%; top:112px; width:min(270px,80vw); max-width:80vw; }
  .native-ui .game-screen .boss-hud { top:158px; }
  .native-ui .game-screen .progress-hud { top:159px; left:8px; width:190px; height:59px; min-height:59px; padding:9px 16px; }
  .native-ui .game-screen .journey-xp-row { height:14px; }
  .native-ui .game-screen .journey-xp-track { margin:3px 0; height:5px; }
  .native-ui .game-screen .journey-resources { height:11px; }
  .native-ui .game-screen .journey-resources span { font-size:9px; }
  .native-ui.touch-ui .touch-controls .joystick { left:max(16px,env(safe-area-inset-left)); bottom:max(30px,calc(env(safe-area-inset-bottom) + 12px)); width:120px; height:120px; }
  .native-ui.touch-ui .touch-controls .touch-actions { right:max(12px,env(safe-area-inset-right)); bottom:max(26px,calc(env(safe-area-inset-bottom) + 10px)); width:180px; grid-template-columns:repeat(3,56px); grid-template-rows:repeat(2,66px); gap:6px; }
  .native-ui.touch-ui .touch-actions button,.native-ui.touch-ui .touch-actions .touch-attack { width:56px; height:66px; background-size:54px 54px!important; padding:7px 11px 22px; }
  .native-ui.touch-ui .game-screen .icon-button { width:34px; height:34px; }
  .native-ui.touch-ui .game-screen .minimap-panel { top:226px; bottom:auto; }
  .native-ui.touch-ui .game-screen .toast { top:112px; max-width:80vw; }
  #presentation-milestone:not([data-kind=evolution]) { top:112px; right:12px; width:calc(100vw - 24px); }
}

@media(max-width:360px) and (orientation:portrait) {
  .native-ui.touch-ui .touch-controls .joystick { width:104px; height:104px; left:10px; }
  .native-ui .game-selection .main-nav .nav-item { padding:5px; }
}

@media(max-width:600px) and (orientation:landscape) {
  .boot-mode { min-height:172px; padding:8px 8px 18px; }
  .boot-mode>span { display:none; }
  .boot-mode strong { font-size:14px; }
  .boot-mode-land { height:40px; }
  .native-ui.touch-ui .game-screen .player-hud { width:168px; height:90px; }
  .native-ui.touch-ui .game-screen .hud-portrait-wrap { width:42px; height:42px; }
  .native-ui.touch-ui .game-screen #hud-name { font-size:12px; }
  .native-ui.touch-ui .game-screen .resource-label strong { font-size:9px; }
  .native-ui.touch-ui .game-screen .progress-hud { left:10px; top:96px; width:168px; height:56px; min-height:56px; padding:8px 15px; }
  .native-ui.touch-ui .game-screen .journey-resources span { font-size:9px; }
  .native-ui.touch-ui .game-screen .match-center { max-width:30vw; width:30vw; padding:10px 14px; }
  .native-ui.touch-ui .game-screen .match-phase { font-size:11px; }
  .native-ui.touch-ui .touch-controls .joystick { width:112px; height:112px; left:max(16px,env(safe-area-inset-left)); bottom:max(18px,env(safe-area-inset-bottom)); }
  .native-ui.touch-ui .touch-controls .touch-actions { width:180px; right:max(12px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); grid-template-columns:repeat(3,56px); grid-template-rows:repeat(2,66px); }
  .native-ui.touch-ui .touch-actions button,.native-ui.touch-ui .touch-actions .touch-attack { width:56px; height:66px; background-size:54px 54px!important; padding:7px 11px 22px; }
  .native-ui.touch-ui .game-screen .icon-button { width:34px; height:34px; }
}

/* Readable fighting-game catalogue: one bounded page, official Pokédex order.
   Frames are the existing image_gen PNGs; only their composition changes. */
.native-ui .game-selection .roster-panel { grid-template-rows:32px minmax(0,1fr) auto; }
.native-ui .game-selection .roster { gap:7px; }
.native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; padding:14px 7px 18px; background:var(--native-card) center/100% 100% no-repeat!important;
}
.native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card:is(.selected,:hover,:focus-visible) {
  background:var(--native-selected) center/100% 100% no-repeat!important;
}
.native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card img {
  width:clamp(42px,5.8vw,76px); height:clamp(42px,5.8vw,76px);
  max-width:90%; max-height:58%; margin:0;
}
.native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card .card-number {
  position:static; align-self:center; margin:0; font-size:10px; line-height:10px; color:#bfcebd;
}
.native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card strong {
  display:block!important; width:100%; font-size:13px; line-height:1.1;
  color:#e9dfbd; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.native-ui .game-selection .roster-pagination { height:37px; gap:16px; }
.native-ui .game-selection .roster-pagination button { height:35px; width:74px; }
.native-ui .game-selection .roster-pagination>span { font-size:14px; }
.native-ui .game-selection .partner-scene { min-height:180px; height:180px; max-height:180px; }
.native-ui .game-selection .partner-image { width:174px!important; height:174px!important; max-width:174px!important; max-height:174px!important; }
.native-ui .game-selection .setup-heading h2 { font-size:22px; }
.native-ui .game-selection #mode-selection-caption { color:#d8e1cc; font-size:13px; line-height:1.35; }
.native-ui .game-selection .biome-choice { height:70px; padding:7px 8px; }
.native-ui .game-selection .biome-choice img { height:38px; }
.native-ui .game-selection .biome-choice>span { font-size:10px; }
.native-ui .game-selection #journey-map { margin:14px 0; gap:6px; }
.native-ui .game-selection[data-selection-mode=survival] .roster-heading .search-field { display:none; }
.native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { width:clamp(56px,11vh,108px); height:clamp(56px,11vh,108px); max-height:64%; }
.native-ui .fighter-details-window { max-height:calc(100dvh - 32px); padding:25px; }
.native-ui .fighter-details-window .loadout-item { overflow:hidden; }
.native-ui .fighter-details-window select { width:100%; min-width:0; text-overflow:ellipsis; }
.native-ui .fighter-details-window .stat-row { min-width:0; }
.native-ui .overlay-panel:not(.journey-camp .overlay-panel) { padding:28px; }
.native-ui .overlay-panel .overlay-actions { gap:8px; }
.native-ui .overlay-panel .overlay-actions button { min-height:43px; padding:10px 19px; }
@media(max-height:760px) and (min-width:901px) {
  .native-ui .game-selection .partner-scene { min-height:154px; height:154px; max-height:154px; }
  .native-ui .game-selection .partner-image { width:148px!important; height:148px!important; max-width:148px!important; max-height:148px!important; }
}
@media(max-width:900px) {
  .native-ui .game-selection .roster-panel { grid-template-rows:27px minmax(0,1fr) auto; }
  .native-ui .game-selection .roster { gap:4px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card { padding:6px 4px; gap:2px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card .card-number { font-size:8px; line-height:8px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card img { width:43px; height:43px; max-height:60%; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card strong { font-size:10px; }
  .native-ui .game-selection .roster-pagination { height:32px; }
  .native-ui .game-selection .roster-pagination button { height:30px; width:60px; }
  .native-ui .game-selection .roster-pagination>span { font-size:12px; }
  .native-ui .game-selection .partner-scene { min-height:109px; height:109px; max-height:109px; }
  .native-ui .game-selection .partner-image { width:106px!important; height:106px!important; max-width:106px!important; max-height:106px!important; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { width:clamp(52px,9vh,70px); height:clamp(52px,9vh,70px); max-height:63%; }
}
@media(max-height:540px) and (orientation:landscape) {
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card { padding:5px 4px; gap:1px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card img { width:34px; height:34px; max-height:56%; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card .card-number { font-size:7px; line-height:7px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card strong { font-size:9px; }
  .native-ui .game-selection #mode-selection-caption { font-size:11px; margin-bottom:7px; }
  .native-ui .game-selection .biome-choice { height:55px; padding:4px 6px; }
  .native-ui .game-selection .biome-choice img { height:29px; }
  .native-ui .overlay-panel:not(.journey-camp .overlay-panel) { padding:20px 26px; }
  .native-ui .overlay-panel .overlay-emblem { display:none; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { width:33px; height:33px; max-height:none; }
}
@media(max-width:700px) and (orientation:portrait) {
  .native-ui .game-selection .partner-scene { min-height:108px; height:108px; max-height:108px; width:99px; }
  .native-ui .game-selection .partner-image { width:99px!important; height:99px!important; max-width:99px!important; max-height:99px!important; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card { padding:9px 4px; gap:3px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card img { width:56px; height:56px; max-width:80%; max-height:62%; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card strong { font-size:11px; }
  .native-ui .game-selection .roster[data-catalog=kanto] .pokemon-card .card-number { font-size:9px; line-height:9px; }
  .native-ui .selection-phase-tabs button { width:auto; flex:1; padding:6px 12px; font-size:12px; }
  .native-ui .overlay-panel:not(.journey-camp .overlay-panel) { padding:25px 23px; }
  .native-ui .game-selection[data-selection-mode=survival] .pokemon-card img { width:clamp(34px,8vh,64px); height:clamp(34px,8vh,64px); max-height:58%; }
}

/* Explicitly clear both vertical anchors inherited from earlier touch sheets.
   A notification is one short native plate, never a stretched center panel. */
.native-ui .game-screen .toast,.native-ui .game-screen .toast.visible,.native-ui .game-screen .toast.show,
.native-ui.touch-ui .game-screen .toast,.native-ui.touch-ui .game-screen .toast.visible,
.native-ui .game-screen:has(.touch-controls.force-touch) .toast.visible {
  left:50%; right:auto; top:67px; bottom:auto; width:min(350px,42vw); height:auto;
  min-height:38px; max-height:54px; max-width:none; padding:10px 22px;
  transform:translateX(-50%); text-align:center; font-size:12px; line-height:1.2;
  overflow:hidden; pointer-events:none;
}
@media(max-width:700px) and (orientation:portrait) {
  .native-ui .game-screen .toast,.native-ui .game-screen .toast.visible,.native-ui.touch-ui .game-screen .toast.visible,
  .native-ui .game-screen:has(.touch-controls.force-touch) .toast.visible { top:112px; width:calc(100vw - 24px); font-size:11px; min-height:36px; max-height:48px; padding:9px 20px; }
}
@media(max-width:360px) and (orientation:portrait) {
  .native-ui .game-screen .progress-hud { width:168px; }
  .native-ui.touch-ui #capture-hud { top:159px!important; }
}

/* Pause-to-pick level rewards: three illustrated native cards, a single choice. */
.native-ui .run-draft { align-items:center; padding:12px; overflow:hidden; }
.native-ui .run-draft .overlay-panel { width:min(900px,96vw); max-width:min(900px,96vw); max-height:calc(100dvh - 24px); padding:27px 30px; overflow:hidden; display:flex; flex-direction:column; }
.native-ui .run-draft .overlay-emblem,.native-ui .run-draft .overlay-brand { display:none; }
.native-ui .run-draft #overlay-title { font-size:30px; line-height:1.1; margin:0; }
.native-ui .run-draft #overlay-subtitle { font-size:14px; margin:5px 0 0; line-height:1.25; }
.native-ui .run-draft #overlay-content { width:100%; min-height:0; overflow:hidden; margin:17px 0 0; }
.native-ui .run-draft .draft-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.native-ui .run-draft .draft-card {
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  min-width:0; min-height:286px; padding:28px 20px 34px; gap:9px; border:0; border-radius:0; box-shadow:none;
  background:var(--native-card) center/100% 100% no-repeat; color:#efe3bc; font-family:var(--pixel); text-align:center; image-rendering:pixelated;
}
.native-ui .run-draft .draft-card:hover,.native-ui .run-draft .draft-card:focus-visible { background-image:var(--native-card); filter:brightness(1.18); outline:none; }
.native-ui .run-draft .draft-card { position:relative; }
.native-ui .run-draft .draft-card:focus-visible::before { content:''; position:absolute; left:8px; top:calc(50% - 12px); width:17px; height:24px; background:var(--native-chevron) center/contain no-repeat; image-rendering:pixelated; pointer-events:none; }
.native-ui .run-draft .draft-rarity { font-size:11px; line-height:1; letter-spacing:.04em; color:#b7d2c3; }
.native-ui .run-draft .draft-card[data-rarity=rare] .draft-rarity { color:#9ce0e7; }
.native-ui .run-draft .draft-card[data-rarity=epic] .draft-rarity { color:#d8b2fb; }
.native-ui .run-draft .draft-icon { display:block; width:64px; height:64px; object-fit:contain; image-rendering:pixelated; flex:none; }
.native-ui .run-draft .draft-kind { color:#a9c6b7; font-size:11px; line-height:1; }
.native-ui .run-draft .draft-title { display:block; font-size:22px; line-height:1.05; color:#ffe6a9; font-weight:500; margin:0; max-width:100%; overflow-wrap:break-word; }
.native-ui .run-draft .draft-description { font-size:14px; line-height:1.25; color:#d5dfc9; margin:0; max-width:100%; }
.native-ui .run-draft .draft-footer { display:block; margin-top:auto; font-size:11px; line-height:1.2; color:#f1d395; }
.native-ui .run-draft #overlay-actions:empty { display:none; }
.native-ui .run-draft .draft-items { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:5px; margin:12px 0 0; font:12px/1.3 var(--pixel); color:#c3d3c2; }
.native-ui .run-draft .draft-items .camp-native-icon { display:inline-block; width:24px; height:24px; margin:0; vertical-align:middle; }
.native-ui .run-draft #overlay-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:15px; }
.native-ui .run-draft #overlay-actions button { min-width:0; min-height:40px; padding:9px 18px; font-size:14px; }
@media(max-height:540px) and (orientation:landscape) {
  .native-ui .run-draft .overlay-panel { padding:18px 24px; }
  .native-ui .run-draft #overlay-title { font-size:24px; }
  .native-ui .run-draft #overlay-subtitle { font-size:12px; }
  .native-ui .run-draft #overlay-content { margin-top:10px; }
  .native-ui .run-draft .draft-grid { gap:9px; }
  .native-ui .run-draft .draft-card { min-height:clamp(130px,calc(100dvh - 210px),180px); padding:20px 16px 25px; gap:4px; }
  .native-ui .run-draft .draft-icon { width:43px; height:43px; }
  .native-ui .run-draft .draft-title { font-size:18px; }
  .native-ui .run-draft .draft-description { font-size:12px; line-height:1.15; }
  .native-ui .run-draft .draft-rarity,.native-ui .run-draft .draft-kind,.native-ui .run-draft .draft-footer { font-size:10px; }
  .native-ui .run-draft .draft-items { margin-top:6px; font-size:11px; }
  .native-ui .run-draft .draft-items .camp-native-icon { width:20px; height:20px; }
  .native-ui .run-draft #overlay-actions { margin-top:7px; gap:7px; }
  .native-ui .run-draft #overlay-actions button { min-height:34px; padding:7px 16px; font-size:12px; }
}
@media(max-width:700px) and (orientation:portrait) {
  .native-ui .run-draft .overlay-panel { padding:23px 20px; }
  .native-ui .run-draft #overlay-title { font-size:24px; }
  .native-ui .run-draft #overlay-subtitle { font-size:12px; }
  .native-ui .run-draft #overlay-content { margin-top:12px; }
  .native-ui .run-draft .draft-grid { grid-template-columns:1fr; gap:8px; }
  .native-ui .run-draft .draft-card { display:grid; grid-template-columns:50px minmax(0,1fr); grid-template-rows:auto auto auto auto; min-height:127px; padding:17px 17px; gap:3px 9px; align-content:center; text-align:left; }
  .native-ui .run-draft .draft-icon { grid-column:1; grid-row:1/5; width:48px; height:48px; }
  .native-ui .run-draft .draft-rarity { grid-column:2; grid-row:1; font-size:9px; }
  .native-ui .run-draft .draft-kind { display:none; }
  .native-ui .run-draft .draft-title { grid-column:2; grid-row:2; font-size:18px; }
  .native-ui .run-draft .draft-description { grid-column:2; grid-row:3; font-size:12px; line-height:1.15; }
  .native-ui .run-draft .draft-footer { grid-column:2; grid-row:4; font-size:10px; margin-top:2px; }
  .native-ui .run-draft .draft-card:focus-visible::before { left:2px; width:12px; height:18px; }
  .native-ui .run-draft .draft-items { font-size:11px; }
  .native-ui .run-draft #overlay-actions { gap:6px; }
  .native-ui .run-draft #overlay-actions button { font-size:11px; padding:8px 13px; }
}
@media(max-height:660px) and (orientation:portrait) {
  .native-ui .run-draft .overlay-panel { padding:19px 19px; }
  .native-ui .run-draft .draft-card { min-height:115px; padding:14px 16px; }
}

/* Mobile chrome is deliberately smaller than the Windows presentation.
   Touch hit areas remain 48 px; bitmap ornament and repeated labels stay quiet. */
.native-ui.touch-ui .game-screen .player-hud { width:168px; height:90px; }
.native-ui.touch-ui .game-screen .hud-portrait-wrap { width:42px; height:42px; }
.native-ui.touch-ui .game-screen .hud-portrait-wrap img { width:40px; height:40px; }
.native-ui.touch-ui .game-screen #hud-name { font-size:12px; }
.native-ui.touch-ui .game-screen .resource-label strong { font-size:9px; }
.native-ui.touch-ui .game-screen .progress-hud { top:99px; width:168px; height:53px; min-height:53px; padding:8px 14px; }
.native-ui.touch-ui .game-screen .journey-xp-row { height:12px; }
.native-ui.touch-ui .game-screen .journey-xp-row strong { font-size:12px; }
.native-ui.touch-ui .game-screen .journey-xp-row span,.native-ui.touch-ui .game-screen .journey-resources span { font-size:9px; }
.native-ui.touch-ui .game-screen .journey-xp-track { height:4px; margin:3px 0; }
.native-ui.touch-ui .game-screen .journey-resources { height:11px; }
.native-ui.touch-ui .game-screen .match-center { width:min(270px,33vw); min-height:34px; padding:8px 15px; }
.native-ui.touch-ui .game-screen .match-phase { font-size:11px; }
.native-ui.touch-ui .game-screen .match-objective { font-size:9px; }
.native-ui.touch-ui .game-screen .match-stats { min-width:104px; max-width:110px; padding:5px 12px; }
.native-ui.touch-ui .game-screen .match-stats strong { font-size:17px; }
.native-ui.touch-ui .game-screen .match-stats>span { font-size:8px; }
.native-ui.touch-ui .touch-controls .touch-actions { width:172px; grid-template-columns:repeat(3,54px); grid-template-rows:repeat(2,61px); gap:5px; }
.native-ui.touch-ui .touch-actions button,.native-ui.touch-ui .touch-actions .touch-attack { width:54px; height:61px; background-size:48px 48px!important; padding:7px 10px 19px; }
.native-ui.touch-ui .touch-actions .touch-icon { width:27px; height:27px; }
.native-ui.touch-ui .touch-actions [data-action=dash] .touch-icon,.native-ui.touch-ui .touch-actions [data-action=interact] .touch-icon { width:37px; height:37px; }
.native-ui.touch-ui .touch-actions .touch-label { font-size:10px; line-height:11px; }
.native-ui.touch-ui .touch-status { bottom:14px; font-size:10px; line-height:11px; }
.native-ui.touch-ui .touch-actions .cooling .touch-status { bottom:25px; font-size:15px; }
@media(max-width:700px) and (orientation:portrait) {
  .native-ui.touch-ui .game-screen .match-center { top:111px; left:auto; right:8px; transform:none; max-width:none; width:172px; padding:7px 12px; }
  .native-ui.touch-ui .game-screen .boss-hud { top:159px; width:172px; left:8px; transform:none; }
  .native-ui.touch-ui .game-screen .progress-hud { top:99px; }
  .native-ui.touch-ui .game-screen .toast.visible,.native-ui .game-screen:has(.touch-controls.force-touch) .toast.visible { top:154px; }
  #presentation-milestone:not([data-kind=evolution]) { top:154px; }
}

/* Brief boss instructions use a separate top slot below the boss health bar. */
.native-ui .game-screen:has(#boss-hud:not([hidden])) .toast.visible { top:126px; }
.native-ui #presentation-milestone:not([data-kind=evolution]) { inset:67px auto auto 50%; transform:translateX(-50%); width:min(350px,42vw); }
.native-ui:has(#boss-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]) { top:126px; }
.native-ui #presentation-milestone:not([data-kind=evolution]) .presentation-milestone-panel { height:64px; min-height:64px; padding:7px 12px 8px 52px; grid-template-rows:9px minmax(15px,28px) 13px; gap:1px; }
.native-ui #presentation-milestone:not([data-kind=evolution]) canvas { left:8px; top:10px; width:38px; height:44px; }
.native-ui #presentation-milestone:not([data-kind=evolution]) h2 { font-size:15px; line-height:14px; }
.native-ui #presentation-milestone:not([data-kind=evolution]) .presentation-milestone-subtitle { font-size:11px; line-height:12px; white-space:nowrap; display:block; overflow:hidden; text-overflow:ellipsis; }
.native-ui.presentation-notice-open .game-screen .toast { visibility:hidden; }
@media(max-height:540px) and (orientation:landscape) {
  .native-ui .game-screen:has(#boss-hud:not([hidden])) .toast.visible { top:108px; }
  .native-ui .game-screen .experience-controls { top:100px; right:8px; max-width:27vw; }
  .native-ui:has(#boss-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]) { top:108px; }
}
@media(max-width:700px) and (orientation:portrait) {
  .native-ui .game-screen:has(#boss-hud:not([hidden])) .toast.visible { top:212px; }
  .native-ui .game-screen .toast.visible,.native-ui #presentation-milestone:not([data-kind=evolution]) { top:244px; left:8px; right:auto; transform:none; width:calc(100vw - 204px); max-width:188px; }
  .native-ui:not(.touch-ui) .game-screen .experience-controls { right:8px; width:172px; max-width:44vw; }
  .native-ui:not(.touch-ui) .game-screen .experience-readout { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:12px; }
  .native-ui:not(.touch-ui) .game-screen .match-center { top:138px; left:auto; right:8px; transform:none; width:172px; max-width:none; padding:7px 12px; }
  .native-ui:not(.touch-ui) .game-screen #capture-hud { top:183px; left:auto; right:8px; width:172px; padding:8px 10px; }
  .native-ui:not(.touch-ui) .game-screen .boss-hud { top:224px; left:8px; transform:none; width:172px; }
  .native-ui:not(.touch-ui) .game-screen:has(#boss-hud:not([hidden])) .toast.visible,.native-ui:not(.touch-ui):has(#boss-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]) { top:277px; }
  .native-ui:not(.touch-ui) .game-screen:has(#capture-hud:not([hidden])) .minimap-panel { display:none; }
  .native-ui:not(.touch-ui) .game-screen:has(.experience-controls [data-experience-ping]:not([hidden])) .match-center { top:198px; }
  .native-ui.touch-ui .game-screen .experience-controls { right:8px; width:172px; max-width:44vw; }
  .native-ui.touch-ui .game-screen .experience-readout { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:12px; }
  .native-ui.touch-ui .game-screen .match-center { top:138px; }
  .native-ui.touch-ui .game-screen #capture-hud { top:183px!important; }
  .native-ui.touch-ui .game-screen:has(.experience-controls [data-experience-ping]:not([hidden])) .match-center { top:198px; }
  .native-ui.touch-ui .game-screen .toast.visible,.native-ui .game-screen:has(.touch-controls.force-touch) .toast.visible,.native-ui.touch-ui #presentation-milestone:not([data-kind=evolution]) { top:159px; left:8px; right:auto; transform:none; width:calc(100vw - 204px); max-width:188px; }
  .native-ui.touch-ui .game-screen:has(#boss-hud:not([hidden])) .toast.visible,.native-ui.touch-ui:has(#boss-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]) { top:212px; }
  .native-ui #presentation-milestone:not([data-kind=evolution]) .presentation-milestone-panel { padding-left:43px; padding-right:9px; }
  .native-ui #presentation-milestone:not([data-kind=evolution]) canvas { left:6px; width:32px; height:41px; }
  .native-ui #presentation-milestone:not([data-kind=evolution]) h2 { font-size:13px; line-height:14px; }
  .native-ui #presentation-milestone:not([data-kind=evolution]) .presentation-milestone-kicker { font-size:8px; }
}
/* The learning panel grows with its real instructions and actions. Its observer
   reserves the next free top slot without measuring the combat loop. */
.native-ui .game-screen:has(#learning-hud:not([hidden])) .toast.visible,
.native-ui.touch-ui .game-screen:has(#learning-hud:not([hidden])) .toast.visible,
.native-ui .game-screen:has(#learning-hud:not([hidden])):has(.touch-controls.force-touch) .toast.visible,
.native-ui:has(#learning-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]),
.native-ui.touch-ui:has(#learning-hud:not([hidden])) #presentation-milestone:not([data-kind=evolution]) { top:calc(var(--learning-hud-bottom,240px) + 6px); }
