/* PANDA 1.24 | Visual quality and safe scoped fixes. Preserve phone skins/wardrobe. */
:root{--p124-ink:#162d28;--p124-subtle:#506861;--p124-tea:#164e3f;--p124-cream:#fffaf1;--p124-gold:#efc677}
/* Global sleep class must never make secondary screens unreadable. */
body.p124-secondary-view{background:radial-gradient(circle at 12% 0%,#f4f4ec,#f7f8f6 48%,#eef1ee 100%)!important;color:#162d28!important}
body.p124-secondary-view header{background:rgba(255,255,255,.96)!important;border-bottom-color:#dfe7e2!important;color:#142d26!important}
body.p124-secondary-view header .eyebrow{color:#ab252e!important}
body.p124-secondary-view header h1{color:#15191e!important}
body.p124-secondary-view header .stat-name{color:#586a65!important}
body.p124-secondary-view .screen .section-title h2{color:#152a25!important}
body.p124-secondary-view .screen .section-title>span{color:#5e716b!important}
body.p124-secondary-view .screen .section-title{color:#142f27!important}
/* Fix actual white-on-white cards in China and Progress tabs for day AND night. */
#screenChina .fact-card,#screenChina .word-card,#screenStats .achievement,#screenStats>.daily-card{background:linear-gradient(152deg,#fffefa 0%,#f4f9f2 100%)!important;color:#163b2e!important;border:1px solid #d9e6d7!important;box-shadow:0 14px 36px rgba(18,54,37,.10)!important;text-shadow:none!important}
#screenChina .fact-card *,#screenChina .word-card *,#screenStats .achievement *,#screenStats>.daily-card *{text-shadow:none!important}
#screenChina .fact-card h2,#screenChina .word-card h2,#screenStats .achievement h3,#screenStats .achievement strong,#screenStats>.daily-card strong{color:#152f28!important}
#screenChina .fact-card p,#screenChina .word-card p,#screenStats .achievement p,#screenStats>.daily-card p,#screenChina .translation,#screenStats .translation{color:#446355!important;opacity:1!important}
#screenChina .fact-category{color:#397459!important}
#screenChina .hanzi{color:#194835!important;text-shadow:none!important}
#screenChina .pinyin{color:#b33a54!important;text-shadow:none!important}
#screenStats .achievement{opacity:1!important;position:relative;overflow:hidden;min-height:140px}
#screenStats .achievement:not(.unlocked){background:linear-gradient(142deg,#f0f4ef,#e6ece6)!important;border-color:#dbe4d9!important}
#screenStats .achievement:not(.unlocked) .item-icon{opacity:.54;filter:saturate(.52)}
#screenStats .achievement:not(.unlocked) strong,#screenStats .achievement:not(.unlocked) h3{color:#345246!important}
#screenStats .achievement.unlocked{background:linear-gradient(146deg,#f7fff0,#f1f8e5)!important;border-color:#a2caa8!important}
#screenChina .secondary-btn,#screenStats .secondary-btn{color:#1b4736!important;background:#fffef9!important;border:1px solid #c8dccd!important}
#screenChina .primary-btn,#screenStats .primary-btn{color:#fff!important}
#screenStats .small-pill{color:#1e4c3b!important;background:#e4f2e5!important;border:1px solid #c6ddc7!important}
#screenStats .panda-life120,#screenStats .p123-journey{color:#fafff6!important}
#screenStats .panda-life120 h2,#screenStats .panda-life120 h3,#screenStats .p123-journey h3,#screenStats .p123-journey h4{color:#fafff6!important}
/* The bottom navigation remains an app shell even while the pet sleeps. */
.bottom-nav .nav-btn[data-screen="Game"] .nav-icon img,.bottom-nav .nav-btn[data-screen="Stats"] .nav-icon img{filter:brightness(0) invert(1) drop-shadow(0 1px 2px #0007)!important;opacity:.96!important}
.bottom-nav .nav-btn:not(.active) .nav-icon{opacity:.95!important}
.bottom-nav .nav-btn:not(.active){color:#e5e8e5!important}
.bottom-nav .nav-btn.active .nav-icon img{filter:drop-shadow(0 3px 5px #0004)!important}
/* Main room: one coherent composition, no empty rectangle and duplicate ZZZ text. */
#screenHome .pet-card{isolation:isolate;border:1px solid rgba(44,88,67,.12)!important}
#screenHome .pet-card .panda-stage{min-height:clamp(370px,56vh,510px)!important;padding:22px 0 3px!important;align-content:center}
#screenHome .pet-card .panda-wrap{width:min(83vw,355px)!important;height:min(93vw,395px)!important;max-width:355px;max-height:395px}
#screenHome .pet-card .panda-base{object-fit:contain!important}
body.sleep-mode #screenHome .pet-card{background:radial-gradient(ellipse at 52% 45%,rgba(91,133,205,.25),transparent 45%),linear-gradient(170deg,#171f40 0%,#0c1531 53%,#090f24 100%)!important;border-color:rgba(148,183,236,.24)!important;box-shadow:0 16px 38px #02081455!important}
body.sleep-mode #screenHome .pet-card:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle,#fff9 1.5px,transparent 2px),radial-gradient(circle,#b5dafa80 1px,transparent 2px);background-size:81px 93px,127px 119px;background-position:12px 24px,43px 76px;mask-image:linear-gradient(#000 0%,#0008 60%,transparent 95%);opacity:.78}
body.sleep-mode #screenHome .pet-card:after{content:"";position:absolute;top:86px;right:29px;z-index:0;width:43px;height:43px;background:radial-gradient(circle at 42% 42%,#fffbe2,#e6e7cb);box-shadow:0 0 38px #d4eaff73;border-radius:50%;pointer-events:none;opacity:.85}
body.sleep-mode #screenHome .pet-card .room{opacity:.14!important}
body.sleep-mode #screenHome .pet-card .panda-stage{min-height:clamp(370px,54vh,485px)!important;z-index:2}
body.sleep-mode #screenHome .pet-card .panda-wrap{width:min(91vw,390px)!important;height:min(91vw,395px)!important;max-width:390px;max-height:395px;animation:p124-sleepbreath 4s ease-in-out infinite!important;transform-origin:50% 74%!important;filter:drop-shadow(0 18px 22px #0008)}
body.sleep-mode #screenHome .sleep-z{display:none!important}
body.sleep-mode #screenHome .mood-pill,body.sleep-mode #screenHome .level-pill{background:#ffffff1c!important;color:#edf7ff!important;border:1px solid #b5c8e055!important}
body.sleep-mode #screenHome .quick-actions .action-btn{background:linear-gradient(#fdfefe,#eef4fd)!important;color:#193550!important;opacity:1!important;border:1px solid #c9d8ee!important}
body.sleep-mode #screenHome .quick-actions .action-btn .label{color:#193550!important;opacity:1!important}
body.sleep-mode #screenHome .speech{background:#243653!important;color:#f2faff!important}
body.sleep-mode #screenHome .speech:after{background:#243653!important}
@keyframes p124-sleepbreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(3px) scale(1.016,.985)}}
.p124-room-caption{position:relative;z-index:4;display:flex;align-items:center;gap:10px;justify-content:center;max-width:95%;margin:-4px auto 12px;padding:9px 15px;border-radius:18px;background:#f0f7ee;color:#27573d;border:1px solid #d1e5d2;font-size:12px;line-height:1.3;font-weight:800;text-align:center}
.p124-room-caption img{width:23px;height:23px;object-fit:contain}
body.sleep-mode .p124-room-caption{background:#263958dc;color:#eef8ff;border-color:#9db0d259}
#screenHome .quick-actions{gap:8px!important;position:relative;z-index:5}
#screenHome .quick-actions .action-btn{border-radius:18px!important;min-height:81px!important;background:linear-gradient(#fff,#f3f7f2)!important;color:#204333!important;box-shadow:0 7px 18px #15392312!important;border:1px solid #dfe8df!important}
#screenHome .quick-actions .action-btn .icon{display:grid;place-items:center;width:34px;height:34px}
#screenHome .quick-actions .action-btn .icon img{height:32px;width:32px;object-fit:contain;filter:drop-shadow(0 2px 3px #0002)}
#screenHome .quick-actions .action-btn .label{color:#204333!important;font-size:12px!important}
#screenHome .quick-actions .action-btn:focus-visible{outline:3px solid #b67822;outline-offset:2px}
/* Real Panda Journey action surface on the HOME tab; uses existing reward logic. */
.p124-care-panel{margin:12px 0 15px;padding:15px 15px 12px;background:linear-gradient(138deg,#fffdf7,#ecf6ed);border:1px solid #d8e5d6;border-radius:23px;box-shadow:0 10px 28px #173e2414;color:#19402f}
.p124-care-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.p124-care-top strong{font-size:15px;letter-spacing:-.2px}.p124-care-top span{font-size:11px;background:#dfefdd;border-radius:999px;padding:6px 9px;color:#315c41;font-weight:900;white-space:nowrap}
.p124-care-panel p{font-size:12px;color:#4e6958;margin:5px 0 10px;line-height:1.4}
.p124-care-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.p124-care-actions button{border:1px solid #d5e6d4;border-radius:15px;background:white;padding:8px 4px;display:grid;place-items:center;gap:5px;min-height:86px;color:#274b35;font-weight:850;font-size:11px;cursor:pointer;box-shadow:0 5px 15px #003d1512}
.p124-care-actions button img{width:43px;height:43px;object-fit:contain}.p124-care-actions button:disabled{opacity:.48;cursor:not-allowed;filter:grayscale(.7)}
.p124-care-feedback{min-height:18px;font-size:11px!important;color:#1d5a39!important;font-weight:800!important;margin:8px 0 0!important}
body.sleep-mode .p124-care-panel{background:linear-gradient(135deg,#192b44,#203957);border-color:#4c6580;color:#f4faff}
body.sleep-mode .p124-care-panel p,body.sleep-mode .p124-care-panel .p124-care-feedback{color:#dbeaf9!important}
body.sleep-mode .p124-care-top span{background:#3b5170;color:#fff}
.p124-room-collectibles{display:flex;align-items:center;gap:7px;margin-top:8px;color:#476d58;font-size:11px;font-weight:750}
.p124-room-collectibles img{width:25px;height:25px;object-fit:contain}
body.sleep-mode .p124-room-collectibles{color:#d3e8f4}
/* Stronger action contrast on smaller phones, without changing purchased phone themes. */
@media(max-width:400px){#screenHome .pet-card .panda-wrap{width:min(85vw,325px)!important;height:min(90vw,355px)!important}body.sleep-mode #screenHome .pet-card .panda-wrap{width:min(90vw,345px)!important;height:min(90vw,375px)!important}.p124-care-panel{padding:12px}.p124-care-actions button{min-height:76px}.p124-care-actions button img{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){body.sleep-mode #screenHome .pet-card .panda-wrap{animation:none!important}}
/* Progress uses a PALE original pet-life panel: all its content needs dark ink. */
#screenStats .panda-life120{color:#214a36!important;background:linear-gradient(152deg,#effaf0,#d4f0de)!important}
#screenStats .panda-life120 h2,#screenStats .panda-life120 h3,#screenStats .panda-life120 h4,#screenStats .panda-life120 strong,#screenStats .panda-life120 b,#screenStats .panda-life120 label{color:#24503a!important;text-shadow:none!important}
#screenStats .panda-life120 small{color:#557961!important}
#screenStats .panda-life120 p,#screenStats .panda-life120 [data-story]{color:#4b7059!important;opacity:1!important}
#screenStats .panda-life120 .p120-traits{color:#26533e!important;background:#ffffffbd!important}
#screenStats .panda-life120 .p120-summary>div{color:#244634!important}
#screenStats .panda-life120 .p120-memory,#screenStats .panda-life120 .p120-room,#screenStats .panda-life120 .p120-photo{color:#284c39!important}
#screenStats .panda-life120 .p120-modal h3,#screenStats .panda-life120 .p120-modal p,#screenStats .panda-life120 .p120-modal small{color:#214a36!important}
#screenStats .panda-life120 button{color:#fff!important}
#screenStats .panda-life120 .p120-room select{color:#23513d!important}
/* More room for the actual Panda on portrait phones, without touching newsroom layout. */
@media(max-width:430px){
 body:not(.arcade-game-live) .topbar{gap:7px;padding:10px 11px 8px!important}
 body:not(.arcade-game-live) .topbar .back-btn{padding:9px 10px!important;font-size:12px!important}
 body:not(.arcade-game-live) .topbar #screenTitle{font-size:clamp(19px,5.25vw,24px)!important;line-height:1.07!important}
 body:not(.arcade-game-live) .topbar .eyebrow{font-size:11px!important}
 body:not(.arcade-game-live) header .stats{gap:5px!important;padding:7px 10px 9px!important}
 body:not(.arcade-game-live) header .stats .stat{padding:8px 6px!important;border-radius:13px!important}
 body:not(.arcade-game-live) header .stats .stat-label{font-size:10px!important}
 body:not(.arcade-game-live) header .stats .bar{height:7px!important}
}
/* Fix a real overflow discovered in 1.23 arcade card layout on 320–430px. */
@media(max-width:560px){
 #screenGame .game-tabs.arcade-game-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;min-width:0!important;overflow:visible!important;gap:12px!important}
 #screenGame .game-tabs.arcade-game-grid .arcade-game-card{width:100%!important;min-width:0!important;max-width:100%!important;flex-basis:auto!important;box-sizing:border-box!important}
 #screenGame .game-tabs.arcade-game-grid .arcade-cover,#screenGame .game-tabs.arcade-game-grid .arcade-card-copy{min-width:0!important;max-width:100%!important}
}
/* Avoid stacking two competing speech bubbles while sleeping. */
body.sleep-mode #screenHome .pet-card .speech{display:none!important}
