/* Mobile layout uses logical pixels; ViewportAdapter supplies physical tap/text sizes. */
.stage-reward-layer {position:absolute;inset:0;z-index:140;pointer-events:none}
.stage-reward-layer .stage-reward-card {pointer-events:auto}
.stage-reward-footer[hidden],.stage-reward-scroll-hint[hidden] {display:none!important}
.land-tip-close {display:none}

.is-mobile-game {
    --mobile-nav-total:calc(var(--mobile-nav-height) + var(--game-safe-bottom,0px));
    --mobile-hero-tabs:calc(var(--mobile-tap) + 12px);
    --battle-hud-height:calc(var(--game-safe-top,0px) + var(--mobile-tap) + 24px);
}
.is-mobile-game button,.is-mobile-game [role="button"],.is-mobile-game .nav-item {
    touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}

/* The map gives up space on short screens; the primary action always stays above navigation. */
.is-mobile-game #main-screen .main-bg {
    box-sizing:border-box;display:grid;grid-template-rows:var(--mobile-tap) auto minmax(105px,1fr) auto 92px;
    row-gap:10px;align-items:center;
    padding:calc(var(--game-safe-top) + 18px) 10px calc(var(--mobile-nav-total) + 18px);
}
.is-mobile-game #main-screen .main-top-bar {
    position:relative;top:auto;left:auto;width:100%;height:var(--mobile-tap);padding:0;animation:none;
}
.is-mobile-game #main-screen .stage-title-area {
    position:relative;top:auto;left:auto;width:100%;align-self:center;animation:none;
}
.is-mobile-game #main-screen .stage-map-area {
    position:relative;top:auto;left:auto;width:100%;height:100%;min-height:0;gap:5px;animation:none;
}
.is-mobile-game #main-screen .stage-map-box {width:auto;flex:1;min-width:0;height:100%;max-height:230px}
.is-mobile-game .stage-arrow {flex:0 0 var(--mobile-tap);width:var(--mobile-tap);height:var(--mobile-tap);animation:none}
.is-mobile-game .stage-arrow img {width:34px;height:38px}
.is-mobile-game #main-screen .stage-dots-area {position:relative;top:auto;left:auto;width:100%;padding:0 14px;animation:none}
.is-mobile-game .stage-dot {min-width:var(--mobile-tap);min-height:var(--mobile-tap)}
.is-mobile-game .stage-dot-label {font-size:var(--mobile-meta);line-height:1.3;max-width:88px}
.is-mobile-game #main-screen .battle-btn-wrapper {
    position:relative;top:auto;bottom:auto;left:auto;right:auto;transform:none;animation:none;
    justify-self:center;width:213px;height:92px;margin:0;
}
.is-mobile-game #global-bottom-nav {
    box-sizing:border-box;height:var(--mobile-nav-total)!important;
    padding:0 12px var(--game-safe-bottom);align-items:center;gap:12px;
}
.is-mobile-game #global-bottom-nav::before {top:0;height:100%}
.is-mobile-game #global-bottom-nav .nav-item {
    box-sizing:border-box;width:88px;min-width:var(--mobile-tap);height:var(--mobile-nav-height);
    min-height:var(--mobile-tap);padding:3px 4px 5px;gap:1px;transform:none!important;
}
.is-mobile-game #global-bottom-nav .nav-item img {width:34px;height:34px;object-fit:contain}
.is-mobile-game #global-bottom-nav .nav-label {font-size:var(--mobile-meta);line-height:1.3;white-space:nowrap}
.is-mobile-game #global-bottom-nav .nav-detail-text .nav-label {font-size:var(--mobile-reading)}
.is-mobile-game #global-bottom-nav .nav-detail-back {width:var(--mobile-tap)}
.is-mobile-game .main-top-right {gap:5px}
.is-mobile-game .main-top-right .settings-btn,.is-mobile-game .main-top-right .reset-save-btn {
    box-sizing:border-box;width:var(--mobile-tap);height:var(--mobile-tap);min-width:var(--mobile-tap);min-height:var(--mobile-tap);
}
.is-mobile-game .main-top-right button img {width:28px;height:28px}

/* Shared safe-area contract for every growth screen, including both rows of navigation. */
.is-mobile-game .hg-formation-area {box-sizing:border-box;height:calc(310px + var(--game-safe-top));padding-top:var(--game-safe-top)}
.is-mobile-game .hg-card-list-area {top:calc(310px + var(--game-safe-top));bottom:var(--mobile-nav-total);overflow-y:auto;touch-action:pan-y}
.is-mobile-game #hero-detail-screen .hg-top-bar {top:var(--game-safe-top)}
.is-mobile-game #hero-detail-screen .hg-sub-tabs {top:calc(50px + var(--game-safe-top))}
.is-mobile-game #hero-detail-screen .hd-top-bar {top:calc(110px + var(--game-safe-top))}
.is-mobile-game #hero-detail-screen .hd-panel-area {top:calc(150px + var(--game-safe-top));bottom:var(--mobile-nav-total);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.is-mobile-game .hd-switch-arrow {
    top:calc(215px + var(--game-safe-top));width:var(--mobile-tap);height:var(--mobile-tap);z-index:12;
}
.is-mobile-game .hd-switch-arrow img {width:20px;height:28px}
.is-mobile-game #hd-arrow-left {left:1px}
.is-mobile-game #hd-arrow-right {right:1px}
.is-mobile-game .hd-equip-panel,.is-mobile-game .hd-levelup-panel,.is-mobile-game #hd-panel-starup.hd-levelup-panel {
    overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;
}
.is-mobile-game .hd-levelup-panel>* {flex-shrink:0}
.is-mobile-game .hd-levelup-panel .hd-action-btn.btn-levelup {
    box-sizing:border-box;height:var(--mobile-tap);min-height:var(--mobile-tap);padding:5px 0;
}
.is-mobile-game .hd-levelup-panel .hd-action-btn .hd-btn-levelup-text {font-size:var(--mobile-reading);line-height:1.25}
.is-mobile-game .hd-btn-coin-info {font-size:var(--mobile-meta)}
.is-mobile-game .hg-btn-edit,.is-mobile-game .hg-btn-confirm,.is-mobile-game .hg-btn-cancel {
    box-sizing:border-box;min-height:var(--mobile-tap);font-size:var(--mobile-reading);touch-action:manipulation;
}
.is-mobile-game .su-top-bar {top:var(--game-safe-top);height:var(--mobile-tap)}
.is-mobile-game .su-hero-info {top:calc(var(--mobile-tap) + var(--game-safe-top))}
.is-mobile-game .su-grid-area {
    top:calc(var(--mobile-tap) + 46px + var(--game-safe-top));bottom:calc(var(--mobile-nav-total) + var(--mobile-hero-tabs));
    overscroll-behavior:contain;touch-action:pan-y;
}
.is-mobile-game .su-hero-tab-bar {bottom:var(--mobile-nav-total);height:var(--mobile-hero-tabs);gap:7px;padding:0 8px}
.is-mobile-game .su-hero-tab-item {box-sizing:border-box;width:var(--mobile-tap);height:var(--mobile-tap);min-width:var(--mobile-tap);flex:none}
.is-mobile-game .su-hero-tab-item.active {transform:none!important}
.is-mobile-game .su-settings-btn,.is-mobile-game .su-page-btn,.is-mobile-game .su-tab {min-width:var(--mobile-tap);min-height:var(--mobile-tap)}
.is-mobile-game .su-settings-btn {position:relative;top:auto;right:auto;width:var(--mobile-tap);height:var(--mobile-tap);margin-left:auto;display:grid;place-items:center}
.is-mobile-game .su-settings-btn img {width:28px;height:28px;object-fit:contain}
.is-mobile-game .su-page-btn {font-size:var(--mobile-reading);display:flex;align-items:center;justify-content:center}
.is-mobile-game #skill-upgrade-screen .su-card-upgrade-btn,
.is-mobile-game #skill-upgrade-screen .su-card-max-tag {height:var(--mobile-tap-small);min-height:var(--mobile-tap-small);font-size:var(--mobile-meta)}
.is-mobile-game .su-locked-entry {min-height:var(--mobile-tap);font-size:var(--mobile-reading)}
.is-mobile-game .su-locked-entry span {font-size:var(--mobile-meta)}

/* Reward drawer: fixed heading/footer, a finger-scrollable middle, and no click-through. */
.is-mobile-game .stage-reward-layer {
    box-sizing:border-box;display:flex;align-items:flex-end;justify-content:center;
    padding:calc(var(--game-safe-top) + 18px) 9px calc(var(--game-safe-bottom) + 9px);
    pointer-events:auto;background:#30271f75;
}
.is-mobile-game #reward-preview-popup.stage-reward-card {
    position:relative;flex-direction:column;left:auto;top:auto;width:100%;max-width:none;
    max-height:100%;padding:6px 9px 10px;transform:none;animation:mobileRewardIn .2s ease-out both;
    transform-origin:50% 100%;border-width:10px;border-radius:18px;
}
.is-mobile-game .stage-reward-layer #reward-preview-popup.stage-reward-card {display:flex!important}
@keyframes mobileRewardIn {from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.is-mobile-game .stage-reward-header {
    flex:none;display:grid;grid-template-columns:32px minmax(0,1fr) var(--mobile-tap);
    grid-template-rows:auto auto;column-gap:7px;row-gap:3px;margin:0 0 10px;
}
.is-mobile-game .stage-reward-chest {grid-column:1;grid-row:1/3;width:32px;height:35px}
.is-mobile-game #reward-preview-popup .reward-preview-title {grid-column:2;grid-row:1;font-size:var(--mobile-title);align-self:end}
.is-mobile-game .stage-reward-status {grid-column:2;grid-row:2;justify-self:start;align-self:start;font-size:var(--mobile-meta);padding:2px 6px}
.is-mobile-game .stage-reward-close {grid-column:3;grid-row:1/3;width:var(--mobile-tap);height:var(--mobile-tap);margin:0}
.is-mobile-game .stage-reward-close::before,.is-mobile-game .stage-reward-close::after,
.is-mobile-game .land-tip-close::before,.is-mobile-game .land-tip-close::after {
    content:'';position:absolute;left:calc(50% - 9px);top:calc(50% - 1.5px);width:18px;height:3px;border-radius:3px;background:#886649;transform:rotate(45deg);
}
.is-mobile-game .stage-reward-close::after,.is-mobile-game .land-tip-close::after {transform:rotate(-45deg)}
.is-mobile-game .stage-reward-body {flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;padding:0 2px;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch}
.is-mobile-game .stage-reward-items.is-multiple {grid-template-columns:1fr;gap:7px}
.is-mobile-game .stage-reward-item,.is-mobile-game .is-multiple .stage-reward-item {
    grid-template-columns:48px minmax(0,1fr) auto;grid-template-rows:auto;gap:8px;padding:8px;min-height:69px;
}
.is-mobile-game .is-multiple .stage-reward-thumb {grid-row:auto;width:48px;height:48px}
.is-mobile-game .is-multiple .stage-reward-icon {width:42px;height:42px}
.is-mobile-game .stage-reward-name,.is-mobile-game .is-multiple .stage-reward-name {font-size:var(--mobile-reading);line-height:1.35}
.is-mobile-game .stage-reward-caption,.is-mobile-game .is-multiple .stage-reward-caption {font-size:var(--mobile-meta);line-height:1.4;margin-top:2px}
.is-mobile-game .stage-reward-count,.is-mobile-game .is-multiple .stage-reward-count {grid-column:auto;align-self:center;font-size:26px}
.is-mobile-game .stage-reward-footer {flex:none}
.is-mobile-game .stage-reward-repeat {margin-top:9px;padding:9px 3px 0}
.is-mobile-game .stage-reward-repeat-title {font-size:var(--mobile-reading);margin-bottom:7px}
.is-mobile-game .stage-reward-repeat-items {gap:7px 10px}
.is-mobile-game .stage-reward-supply-name,.is-mobile-game .is-single .stage-reward-supply-name {font-size:var(--mobile-meta);line-height:1.4}
.is-mobile-game .stage-reward-supply-count {font-size:21px}
.is-mobile-game .stage-reward-milestone {font-size:var(--mobile-meta);line-height:1.45;flex-wrap:wrap}
.is-mobile-game .stage-reward-milestone small {font-size:var(--mobile-meta)}
.is-mobile-game .stage-reward-scroll-hint {flex:none;text-align:center;padding:5px 0 0;color:#96724c;font:400 var(--mobile-meta)/1.35 var(--ui-body);pointer-events:none}
.is-mobile-game .stage-reward-pointer {display:none}

/* Consistent tap targets, while retaining the existing painted control art. */
.is-mobile-game .battle-dialog-button,.is-mobile-game #exit-stage-modal .battle-dialog-button {
    height:var(--mobile-tap);min-height:var(--mobile-tap);font-size:var(--mobile-title);
}
.is-mobile-game #battle-pause-overlay,.is-mobile-game #exit-stage-overlay,.is-mobile-game .revive-overlay,
.is-mobile-game #skill-upgrade-screen .su-popup-overlay {
    box-sizing:border-box;padding:calc(var(--game-safe-top) + 34px) 18px calc(var(--game-safe-bottom) + 18px);
}
.is-mobile-game .battle-dialog,.is-mobile-game #exit-stage-modal {max-height:100%;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.is-mobile-game .battle-dialog .battle-dialog-emblem {margin-top:0}
.is-mobile-game .battle-dialog p {font-size:var(--mobile-reading)}
.is-mobile-game .battle-dialog .battle-dialog-meta,.is-mobile-game .battle-dialog .battle-dialog-note,.is-mobile-game .revive-benefit div>span {font-size:var(--mobile-meta)}
.is-mobile-game .hd-face-modal {
    bottom:calc(var(--game-safe-bottom) + 12px);width:calc(100% - 24px);
    max-height:calc(100% - var(--game-safe-top) - var(--game-safe-bottom) - 32px);z-index:151;
    display:flex;flex-direction:column;overflow:hidden;
}
.is-mobile-game .hd-face-modal-overlay {z-index:150}
.is-mobile-game .hd-face-modal-title {font-size:var(--mobile-title);min-height:var(--mobile-tap);padding:12px calc(var(--mobile-tap) + 6px) 6px 14px;text-align:left;flex:none}
.is-mobile-game .hd-face-modal-close {width:var(--mobile-tap);height:var(--mobile-tap);top:4px;right:4px}
.is-mobile-game .hd-face-modal-subtitle {font-size:var(--mobile-meta);flex:none}
.is-mobile-game .hd-face-modal-list {min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.is-mobile-game .hd-face-modal-item {min-height:var(--mobile-tap);touch-action:pan-y}
.is-mobile-game .hd-face-modal-name {font-size:var(--mobile-reading)}
.is-mobile-game .hd-face-modal-desc {font-size:var(--mobile-reading);display:block;-webkit-line-clamp:unset;overflow:visible}
.is-mobile-game .hd-face-modal-cost {font-size:var(--mobile-meta);min-width:44px}
.is-mobile-game #skill-upgrade-screen .su-det-close {width:var(--mobile-tap);height:var(--mobile-tap)}
.is-mobile-game #result-screen .settlement-container {max-height:calc(100% - var(--game-safe-top) - var(--game-safe-bottom) - 32px);top:calc(50% + (var(--game-safe-top) - var(--game-safe-bottom))/2);touch-action:pan-y}
.is-mobile-game #result-screen .settlement-btn {min-height:var(--mobile-tap);height:var(--mobile-tap);font-size:var(--mobile-title)}
.is-mobile-game #result-screen .settlement-way-item {height:var(--mobile-tap);min-height:var(--mobile-tap)}
.is-mobile-game #hextech-screen.temple-gamble .hextech-content {
    top:calc(50% + (var(--game-safe-top) - var(--game-safe-bottom))/2);
    height:min(730px,calc(100% - var(--game-safe-top) - var(--game-safe-bottom) - 32px));
}
.is-mobile-game #hextech-screen.temple-gamble .hextech-rune-desc {font-size:var(--mobile-reading);overflow-y:auto;line-height:1.7;min-height:0}
.is-mobile-game #hextech-screen.temple-gamble .hextech-rune-owner {font-size:var(--mobile-meta)}
.is-mobile-game #hextech-screen.temple-gamble .qian-decision-actions button {min-height:var(--mobile-tap);height:var(--mobile-tap);font-size:var(--mobile-title)}
.is-mobile-game .qian-decision-scope,.is-mobile-game #hextech-screen .qian-decision-risk {font-size:var(--mobile-meta)}
.is-mobile-game .game-detail-overlay {box-sizing:border-box;padding-top:calc(var(--game-safe-top) + 14px);padding-bottom:calc(var(--game-safe-bottom) + 14px)}
.is-mobile-game .game-detail-close {width:var(--mobile-tap);height:var(--mobile-tap);min-height:var(--mobile-tap)}
.is-mobile-game .game-detail-section p {font-size:var(--mobile-reading)}

/* HUD controls share one safe-area baseline. The lottery stays at the agreed lower third. */
.is-mobile-game #battle-exit-btn,.is-mobile-game #battle-speed-btn,.is-mobile-game .land-blessing-toggle {
    width:var(--mobile-tap);height:var(--mobile-tap);top:calc(var(--game-safe-top) + 4px);
}
.is-mobile-game #battle-exit-btn {right:8px}
.is-mobile-game #battle-speed-btn {right:calc(var(--mobile-tap) + 14px)}
.is-mobile-game .land-blessing-bar {top:calc(var(--game-safe-top) + 4px);right:calc(var(--mobile-tap)*2 + 20px);width:var(--mobile-tap);height:var(--mobile-tap)}
.is-mobile-game .land-blessing-toggle {top:auto}
.is-mobile-game #battle-speed-btn span {font-size:var(--mobile-reading);line-height:1}
.is-mobile-game .battle-hud .battle-info-row {
    top:calc(var(--game-safe-top) + 5px);left:9px;right:calc(var(--mobile-tap)*3 + 29px);height:var(--mobile-tap);
    grid-template-columns:1fr 1fr;grid-template-rows:22px 22px;gap:0 4px;
}
.is-mobile-game .battle-hud .timer {grid-column:1;grid-row:1;font-size:var(--mobile-meta);line-height:1.3}
.is-mobile-game .battle-hud .gold-display {grid-column:2;grid-row:1;font-size:var(--mobile-meta);line-height:1.3;justify-self:end}
.is-mobile-game .battle-hud .wave-info {grid-column:1/3;grid-row:2;font-size:var(--mobile-meta);line-height:1.3;white-space:nowrap;margin:0;overflow:hidden;text-overflow:ellipsis}
.is-mobile-game .battle-hud .encounter-track {left:9px;right:calc(var(--mobile-tap)*3 + 29px);top:calc(var(--game-safe-top) + var(--mobile-tap) - 2px)}
.is-mobile-game .battle-hud .exp-bar-container {top:calc(var(--game-safe-top) + var(--mobile-tap) + 12px);height:9px}
.is-mobile-game .land-blessing-tip {
    box-sizing:border-box;left:8px;right:8px;top:calc(var(--battle-hud-height) + 7px);width:auto;max-width:none;
    max-height:calc(100% - var(--battle-hud-height) - var(--game-safe-bottom) - 24px);
    display:flex;flex-direction:column;padding:9px 12px;
}
.is-mobile-game .land-tip-heading {box-sizing:border-box;display:flex;align-items:center;min-height:var(--mobile-tap);padding:0 var(--mobile-tap) 7px 0;font-size:var(--mobile-title);flex:none}
.is-mobile-game .land-tip-close {display:block;position:absolute;top:6px;right:6px;width:var(--mobile-tap);height:var(--mobile-tap);border:0;background:none;border-radius:8px;cursor:pointer}
.is-mobile-game .land-blessing-list {min-height:0;max-height:none;overflow-y:auto;-webkit-overflow-scrolling:touch}
.is-mobile-game .land-blessing-tip p {font-size:var(--mobile-reading);line-height:1.65}
.is-mobile-game .land-tip-title {font-size:var(--mobile-reading);line-height:1.5}
.is-mobile-game .land-tip-rarity,.is-mobile-game .land-tip-group {font-size:var(--mobile-meta)}
.is-mobile-game .land-blessing-icon {width:var(--mobile-tap-small);height:var(--mobile-tap-small);touch-action:pan-y}
.is-mobile-game .land-blessing-award {top:calc(var(--battle-hud-height) + 8px)}
@media(prefers-reduced-motion:reduce) {.is-mobile-game #reward-preview-popup.stage-reward-card {animation:none}}
