/* PANDA ARCADE 1.5 — product-wide responsive remaster, deliberately scoped to Panda. */
:root{--p15-ink:#16362a;--p15-green:#1b5a42;--p15-gold:#f2c560}
#screenHome,#screenGame,#screenStats,#screenShop,#screenFood,#screenChina{min-width:0;max-width:100%}
#screenHome *,#screenGame *,#screenStats *,#screenShop *,#screenFood *,#screenChina *{min-width:0;box-sizing:border-box}
#screenHome{display:none;}
#screenHome.active{display:block;}
/* Native seven-action controller ABOVE the character, not beneath several scroll screens. */
#screenHome>.p126-care-rail{margin:0 0 12px!important;padding:10px 12px 9px!important;background:linear-gradient(145deg,#f4fff3,#e1f3e6)!important;border:1px solid #b4d7bf!important;border-radius:22px!important;box-shadow:0 8px 24px #183d2618!important;color:var(--p15-ink)!important}
#screenHome>.p126-care-rail .p124-care-top{padding:0 3px 4px!important;align-items:center}
#screenHome>.p126-care-rail .p124-care-top strong{font-size:clamp(13px,3.5vw,16px)!important;color:var(--p15-ink)!important}
#screenHome>.p126-care-rail .p124-care-top [data-left]{font-size:11px!important;padding:5px 8px!important;white-space:nowrap}
#screenHome>.p126-care-rail .p124-care-top .p126-hint{font-size:11px!important;color:#397558!important;white-space:nowrap}
#screenHome>.p126-care-rail .p124-care-actions{padding:2px 2px 7px!important;gap:6px!important}
#screenHome>.p126-care-rail .p124-care-actions button{flex:0 0 72px!important;min-width:72px!important;max-width:72px!important;min-height:76px!important;border-radius:15px!important;padding:6px 3px!important;gap:3px!important}
#screenHome>.p126-care-rail .p124-care-actions button img,#screenHome>.p126-care-rail .p124-care-actions button .icon img{width:36px!important;height:36px!important}
#screenHome>.p126-care-rail .p124-care-actions button .label,#screenHome>.p126-care-rail .p124-care-actions button span:last-child{font-size:11px!important;line-height:1.12!important;overflow-wrap:anywhere!important}
#screenHome>.p126-care-rail .p124-room-collectibles{display:none!important}
#screenHome>.p126-care-rail .p124-care-feedback{font-size:11px!important}
#screenHome>.pet-card{margin-top:0!important;}
/* Shared result sheet: the result has to fit inside the physical viewport on small iPhones. */
#modal.modal,#importModal.modal{position:fixed!important;z-index:1000!important;inset:0!important;min-width:0!important;display:none;align-items:center!important;justify-content:center!important;overflow-y:auto!important;overscroll-behavior:contain;padding:max(14px,env(safe-area-inset-top)) 13px max(16px,env(safe-area-inset-bottom))!important;background:#071d18ac!important;backdrop-filter:blur(7px)}
#modal.modal.show,#importModal.modal.show{display:flex!important}
#modal .modal-card,#importModal .modal-card{position:relative!important;display:block!important;width:min(100%,440px)!important;min-width:0!important;max-width:440px!important;max-height:calc(100dvh - 35px)!important;overflow-y:auto!important;overscroll-behavior:contain;background:linear-gradient(160deg,#fffef9,#e5f5e6)!important;color:#183629!important;border:1px solid #a9d2ac!important;border-radius:26px!important;padding:clamp(15px,4vw,24px)!important;box-shadow:0 20px 70px #0007!important;overflow-wrap:anywhere;word-break:normal}
#modal .modal-card h2,#importModal .modal-card h2{color:#153b2b!important;font-size:clamp(20px,6vw,29px)!important;line-height:1.13!important;margin:0 0 8px!important;overflow-wrap:anywhere!important;text-align:center}
#modal .modal-card p,#importModal .modal-card p{color:#3b604e!important;font-size:clamp(13px,3.65vw,16px)!important;line-height:1.46!important;white-space:normal!important;overflow-wrap:anywhere!important;max-width:100%!important}
#modal .modal-actions,#importModal .modal-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
#modal .modal-actions button,#importModal .modal-actions button{min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;min-height:44px!important;padding:9px 8px!important;line-height:1.2!important;font-size:clamp(12px,3.5vw,15px)!important}
#modal.p15-result .modal-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#modal.p15-result #modalOk{display:none!important}
#modal.p15-result #modalText{font-size:13px!important;text-align:center;margin:6px 0 15px!important}
#modal .p15-result-hero{display:none;width:110px;height:98px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 8px 8px #2b412934)}
#modal.p15-result .p15-result-hero{display:block}
#modal .p15-result-kicker{display:none;text-transform:uppercase;font:800 11px/1.25 system-ui;letter-spacing:1.7px;color:#397e53;text-align:center;margin:0 0 7px}
#modal.p15-result .p15-result-kicker{display:block}
#modal #p15Replay{background:linear-gradient(160deg,#ffde89,#e8b142)!important;color:#392b13!important;border-color:#bb923c!important}
@media(max-height:600px){#modal .modal-card,#importModal .modal-card{padding:12px!important}#modal .p15-result-hero{height:57px;width:75px}#modal .modal-actions button{min-height:39px!important}}
/* Toasts never leave the screen, and always sit above the nav/keyboard safely. */
#toast.toast{left:50%!important;right:auto!important;bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--bottom-nav-height,72px) + 12px)!important;width:max-content!important;max-width:calc(100vw - 26px)!important;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.32!important;text-align:center!important;border-radius:16px!important;padding:11px 15px!important;z-index:1001!important;pointer-events:none!important}
#toast.toast.show{opacity:1!important;transform:translate(-50%,0)!important}
body.arcade-game-live #toast.toast,body.panda-run-lock #toast.toast,body.maze-fullscreen #toast.toast,body.tetris-fullscreen #toast.toast{bottom:max(12px,env(safe-area-inset-bottom))!important}
/* Game overlays: no text clipping, no buttons beneath the bottom browser bar. */
#gameArea,.arcade-now,.arcade-game-grid,.arcade-game-card{min-width:0!important;max-width:100%}
#gameArea .maze-panel,#gameArea .tetris-overlay,#gameArea .pmerge-over,#gameArea .game-overlay{max-width:100%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;align-items:safe center;min-width:0;padding:13px!important}
#gameArea .maze-card,#gameArea .tetris-card,#gameArea .pmerge-card,#gameArea .gameover-card{width:min(100%,350px)!important;max-width:100%!important;max-height:calc(100dvh - 55px)!important;overflow-y:auto!important;overflow-x:hidden!important;padding:clamp(13px,4vw,20px)!important;overflow-wrap:anywhere!important;word-break:normal!important}
#gameArea .maze-card h3,#gameArea .tetris-card h3,#gameArea .pmerge-card h3{font-size:clamp(20px,6vw,28px)!important;line-height:1.13!important;overflow-wrap:anywhere!important}
#gameArea .maze-card p,#gameArea .tetris-card p,#gameArea .pmerge-card p{font-size:clamp(12px,3.5vw,15px)!important;line-height:1.45!important;white-space:normal!important;overflow-wrap:anywhere!important}
#gameArea .maze-card button,#gameArea .tetris-card button,#gameArea .pmerge-card button{font-size:clamp(12px,3.4vw,15px)!important;min-width:0!important;max-width:100%!important;white-space:normal!important;padding:9px 10px!important;min-height:40px!important;overflow-wrap:anywhere!important}
#gameArea .maze-panel-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
/* Tetris HUD and control positions repaired for low-height devices. */
body.tetris-fullscreen .tetris-wrap{overflow:hidden!important;grid-template-rows:minmax(0,1fr)!important;padding:calc(env(safe-area-inset-top) + 12px) 8px calc(env(safe-area-inset-bottom) + 72px)!important}
body.tetris-fullscreen .tetris-board-zone{display:flex!important;align-items:center!important;justify-content:center!important;min-height:0!important;overflow:hidden!important}
body.tetris-fullscreen .tetris-board{width:min(calc(100vw - 55px),calc((100dvh - 202px)/2),300px)!important;max-height:calc(100dvh - 185px)!important}
body.tetris-fullscreen .tetris-side{position:absolute!important;top:calc(env(safe-area-inset-top) + 13px)!important;left:12px!important;right:62px!important;z-index:15!important;display:flex!important;flex-wrap:wrap!important;align-content:center!important;gap:5px!important;padding:0!important}
body.tetris-fullscreen .tetris-controls{left:7px!important;right:7px!important;bottom:calc(env(safe-area-inset-bottom) + 10px)!important;display:flex!important;justify-content:space-between!important;gap:4px!important}
body.tetris-fullscreen .tetris-controls button{min-width:0!important;flex:1 1 0!important;height:clamp(43px,7vh,57px)!important;max-width:64px!important;padding:5px 2px!important;font-size:clamp(12px,4vw,18px)!important}
/* Real motion, in the same visual style as the existing Panda. */
.catch-panda{transform-origin:50% 88%;will-change:transform;animation:p15-catch-idle 1.05s ease-in-out infinite alternate!important}
@keyframes p15-catch-idle{from{transform:translateX(-50%) translateY(0) rotate(-1deg)}to{transform:translateX(-50%) translateY(-8px) rotate(1deg)}}
#screenHome .room .panda-wrap img,#screenHome .panda-wrap>img{transform-origin:center 90%;animation:p15-panda-breathe 2.2s ease-in-out infinite alternate}
@keyframes p15-panda-breathe{from{transform:translateY(0) scale(1)}to{transform:translateY(-4px) scale(1.015)}}
#screenGame .arcade-cover-panda{transform-origin:center 85%;animation:p15-card-sway 2.8s ease-in-out infinite alternate}
@keyframes p15-card-sway{from{transform:translateY(1px) rotate(-1deg)}to{transform:translateY(-7px) rotate(2deg)}}
#screenGame .arcade-card-copy p{line-height:1.42!important;overflow-wrap:anywhere!important}
/* Fullscreen runner draws dark fallback while loading instead of an empty white plane. */
.panda-run-fullscreen{grid-template-rows:56px minmax(0,1fr)!important;background:#0d2d23!important}
.panda-run-frame{min-height:0!important;background:#0e3026!important;}
.p15-run-loader{position:absolute;z-index:270;top:calc(56px + env(safe-area-inset-top));bottom:env(safe-area-inset-bottom);left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;background:linear-gradient(145deg,#102f24,#1b553b);color:#f6fff2;text-align:center}
.p15-run-loader[hidden]{display:none!important}
.p15-run-loader img{width:116px;height:116px;object-fit:contain;animation:p15-loader 1.9s ease-in-out infinite alternate}
.p15-run-loader h3{font-size:19px;line-height:1.2;margin:0;overflow-wrap:anywhere}
.p15-run-loader p{font-size:13px;line-height:1.4;margin:0;color:#d3f0dd;overflow-wrap:anywhere}
.p15-run-loader button{padding:12px 18px;border-radius:14px;border:1px solid #ffffff7a;background:#edc45b;color:#253b24;font-weight:800;max-width:100%;overflow-wrap:anywhere}
@keyframes p15-loader{to{transform:translateY(-9px) rotate(5deg)}}
@media(max-width:360px){#screenHome>.p126-care-rail .p124-care-actions button{flex-basis:68px!important;min-width:68px!important;max-width:68px!important}}
@media(prefers-reduced-motion:reduce){.catch-panda,#screenHome .room .panda-wrap img,#screenGame .arcade-cover-panda,.p15-run-loader img{animation:none!important}}

/* Recovery for hosting environments that prevent same-origin iframe embedding. */
.p15-run-recovery{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:center;max-width:min(360px,100%)}
.p15-run-recovery a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:12px 15px;border-radius:14px;background:#f2fff0;color:#17422c;font-weight:850;font-size:13px;max-width:100%;overflow-wrap:anywhere}
.p15-run-recovery [hidden]{display:none!important}
/* Keep controls from colliding with browser chrome or clipped headings. */
#modal .modal-card,#gameArea .maze-card,#gameArea .tetris-card,#gameArea .pmerge-card{scrollbar-width:thin}
#gameArea .maze-panel,#gameArea .tetris-overlay,#gameArea .pmerge-over{max-height:100dvh!important}
