/* The selected palette: light grey, chocolate and coral. */
:root{
 --retail-base:#f2f1f0;--retail-surface:#faf9f7;--retail-card:#e9e7e5;
 --retail-ink:#392a26;--retail-secondary:#817771;--retail-line:#dedad6;
 --retail-accent:#ef8875;--retail-lime:var(--retail-accent);
 --atelier-coral:#ef8875;--atelier-deep:#392a26;--atelier-soft:#eeeae6;
 color:var(--retail-ink);background:#e5e2df;
}
.app{border:0;border-radius:0;background:var(--retail-surface)}
.header{background:#faf9f7;border:0}
.user-avatar{background:#e9e6e3;border:0;color:var(--retail-ink)}
.user-name,.user-summary,.balance,.sound-toggle,.scene-title,.scroll-view>h1{color:var(--retail-ink)}
.scene,.entry-screen{background-color:#f0eeeb;background-image:linear-gradient(90deg,#f1efec00,#faf9f7d9 35%,#faf9f7d9 65%,#f1efec00),var(--retail-metal)}
.gift-label{color:var(--retail-ink);font-weight:600}
.spin-button,.task button,.prize-claim,#shop-view .shop-buy,#certificates-view .certificate-button,#match3-view .spin-button,#quiz-view .spin-button,#word-view .word-next{background:var(--atelier-deep);color:#fff;border:0;border-radius:4px;box-shadow:none}
.spin-button:hover,.task button:hover,.prize-claim:hover,#shop-view .shop-buy:hover,#certificates-view .certificate-button:hover,#match3-view .spin-button:hover:not(:disabled),#quiz-view .spin-button:hover:not(:disabled),#word-view .word-next:hover:not(:disabled){background:#543d35;color:#fff}
.spin-button:disabled,.task button:disabled,#shop-view .shop-buy:disabled,#certificates-view .certificate-button:disabled{background:#e1dcd8;color:#9c9189}
.tabbar{background:#faf9f7;border-top:1px solid #dedad680}
.tabbar button{color:#988e87;font-weight:600}
.tabbar .selected,.tabbar .selected .nav-symbol{color:var(--atelier-deep)}
.tabbar .selected:after{width:24px;left:calc(50% - 12px);height:3px;background:var(--atelier-coral)}
.tabbar i{background:var(--atelier-coral)}
.scroll-view,.scroll-view.active,#top-view,#prizes-view{background:#faf9f7;background-image:none}
.scroll-view:before,.scroll-view.active:before,.top-row:before{display:none;content:none}
.top-row{background:transparent;border-bottom-color:#dedad6}
.top-row div,.top-row .rank,.prize-card b,.task h2{color:var(--atelier-deep)}
.activity,.owned-certificate{color:var(--atelier-deep)}
.activity-copy small,.activity-copy small,.task p,.prize-empty{color:#817771}
.activity-icon{color:var(--atelier-deep)}
.activity:nth-child(2) .activity-icon{color:#dc7a66;font-weight:500}
.activity:nth-child(3) .activity-icon{color:#9c8b7c;font-weight:500}
#profile-view{padding:24px 20px;gap:25px;color:var(--atelier-deep);background:#faf9f7}
#profile-view .profile-title{color:var(--atelier-deep);font-size:29px;letter-spacing:-.8px}
#profile-view .profile-links{flex:none;gap:14px;min-height:0;max-height:none}
#profile-view .profile-banner{position:relative;grid-template-columns:minmax(0,1fr) 139px;min-height:172px;max-height:none;padding:24px;gap:0;overflow:hidden;border-radius:4px}
#profile-view .profile-banner-art{grid-column:2;grid-row:1;height:145px;max-height:none;width:160px;justify-self:center;z-index:1}
#profile-view .profile-banner-copy{grid-column:1;grid-row:1;align-self:start;z-index:2;gap:12px;padding-top:3px}
#profile-view .profile-banner-title{font-size:21px;line-height:1.15;letter-spacing:-.6px;color:inherit}
#profile-view .profile-banner-note{max-width:155px;font-size:12px;line-height:1.45;color:inherit;opacity:.7}
#profile-view .profile-banner-arrow{position:absolute;left:24px;bottom:22px;stroke:currentColor;width:23px;height:23px}
#profile-view [data-profile-banner="chests"]{background:#e6e3e0 var(--retail-metal) center/cover no-repeat;color:var(--atelier-deep)}
#profile-view [data-profile-banner="chests"] .profile-banner-art img{width:190%;height:190%;max-width:none;transform:translateY(-6px)}
#profile-view .profile-chest-count{display:block;margin:12px 0 0;font-size:36px;line-height:1;font-weight:500;color:var(--atelier-deep)}
#profile-view [data-profile-banner="chests"] .profile-banner-note{margin-top:-4px}
#profile-view [data-profile-banner="shop"]{background:#49352f;color:#fff8f3;min-height:182px}
#profile-view [data-profile-banner="shop"]:before{content:"";position:absolute;right:-73px;bottom:-116px;width:290px;height:290px;border:1px solid #f4b2a44f;border-radius:50%;pointer-events:none}
#profile-view [data-profile-banner="shop"] .profile-banner-art{width:190px;transform:translate(12px,5px) rotate(-5deg)}
#profile-view [data-profile-banner="shop"] .profile-banner-title{color:#fff8f3;font-size:25px}
#profile-view [data-profile-banner="shop"] .profile-banner-note{color:#fff8f3}
#shop-view,#certificates-view{background:#faf9f7;color:var(--atelier-deep)}
#shop-view .shop-title,#shop-view .shop-offer-details h2,#shop-view .shop-price,#shop-view .shop-certificate-banner,#certificates-view .certificates-title,#certificates-view .certificate-nominal,#certificates-view .certificate-cost,#certificates-view .certificate-market[aria-selected="true"],#certificates-view .certificate-amount[aria-pressed="true"]{color:var(--atelier-deep)}
#certificates-view .certificate-market[aria-selected="true"]:after,#certificates-view .certificate-amount[aria-pressed="true"]:after{background:var(--atelier-coral)}
#certificates-view .certificate-nominal{position:relative;padding:25px 22px;max-height:270px;margin-block:auto;background:#e7e4e1 var(--retail-metal) center/cover no-repeat;border-radius:4px}
#certificates-view .certificate-brand{color:var(--atelier-deep);max-width:80%;font-size:20px}
#certificates-view .certificate-value{font-weight:500}
#certificates-view .certificate-result .certificate-nominal{min-height:180px}
#shop-view .shop-certificate-banner{padding:18px 16px;background:#eae6e2;border:0;border-radius:4px}
#shop-view .shop-chest-art{background:var(--retail-metal) center/cover no-repeat;border-radius:4px}
#win-screen{background:#eeeae6;color:var(--atelier-deep)}
#win-screen .win-sun{background:repeating-conic-gradient(from -8deg,#c9b8ac 0deg 14deg,#f2eeea 14deg 30deg);opacity:.88}
#win-screen:not([data-prize="cloud"]) .win-sun{background:repeating-conic-gradient(from -8deg,#e8ac9c 0deg 14deg,#f4eeea 14deg 30deg)}
#win-screen .win-content h1{color:var(--atelier-deep)}
#win-screen .win-eyebrow{color:#816e63}
#win-screen .win-content>.spin-button{background:var(--atelier-deep);border-radius:4px}
#win-screen .close{border:0;background:#faf9f7b3;color:var(--atelier-deep);border-radius:4px}
#win-screen button:focus-visible{outline-color:var(--atelier-coral)}
@media(max-height:720px){#profile-view{padding:17px 18px;gap:18px}#profile-view .profile-title{font-size:26px}#profile-view .profile-banner{min-height:140px;padding:19px 21px}#profile-view [data-profile-banner="shop"]{min-height:148px}#profile-view .profile-banner-art{height:118px}#profile-view .profile-banner-arrow{left:21px;bottom:18px}#profile-view .profile-chest-count{font-size:29px;margin-top:9px}#profile-view .profile-banner-title{font-size:19px}#certificates-view .certificate-nominal{max-height:200px}}
@media(max-width:350px){#profile-view{padding-inline:16px}#profile-view .profile-banner{grid-template-columns:minmax(0,1fr) 114px;padding-inline:18px}#profile-view .profile-banner-art{width:135px}#profile-view [data-profile-banner="shop"] .profile-banner-art{width:153px}#profile-view .profile-banner-title{font-size:19px}#profile-view .profile-banner-note{font-size:11px}#profile-view .profile-banner-arrow{left:18px}}

/* The wheel uses the complete stage. Account tools live outside gameplay. */
.app[data-view="roulette"]{grid-template-rows:0 minmax(0,1fr) calc(var(--nav-height) + env(safe-area-inset-bottom,0px))}
.app[data-view="roulette"]>.header{display:none}
.app>.content{grid-row:2}
.app>.tabbar{grid-row:3}

/* One continuous decorated surface, shared by all scrollable screens. */
.app{grid-template-rows:0 minmax(0,1fr) calc(var(--nav-height) + env(safe-area-inset-bottom,0px))}
.app>.header{display:none}
.content{background:#f2eeea url('./assets/atelier-hearts.svg') center/cover no-repeat;isolation:isolate}
.scroll-view,.scroll-view.active,#top-view,#prizes-view{background-color:transparent;background-image:none}
.scene,.entry-screen{background:#f2eeea url('./assets/atelier-hearts.svg') center/cover no-repeat}
.tabbar .selected:after{display:none;content:none}
.tab-glow{background:#ed8268;border-radius:2px;opacity:1;transition:transform .44s cubic-bezier(.22,1,.36,1);box-shadow:none}
.tabbar .selected .nav-symbol{color:#d96f56}
.activity-icon img:only-child{position:static;width:62px;height:62px;max-width:100%;max-height:100%}
.activity-icon img:only-child:first-child{left:auto;top:auto}
.activity-arrow{font-size:25px;line-height:1}
.activity:active .activity-icon{transform:translateY(-3px) rotate(-3deg)}
.activity-icon{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.activity-copy small{font-size:12px;line-height:1.45}
.spin-button:not(:disabled),.task button:not(:disabled),.prize-claim{background:#ef8875;color:#392a26}
.spin-button:not(:disabled):hover,.task button:not(:disabled):hover,.prize-claim:hover{background:#f29b89;color:#392a26}
.gift.photo img,.captured-prize img[src*="prizes-cutouts"],.win-art>img[src*="prizes-cutouts"],.prize-card img[src*="prizes-cutouts"]{filter:url('#clean-prize-alpha') drop-shadow(0 6px 5px #392a2612)}

.basket{aspect-ratio:1536/1024;object-fit:contain;filter:url("#clean-prize-alpha") drop-shadow(0 7px 5px #7d4a3120)}
.content,.scene,.entry-screen{background:#f5c9b8 url("./assets/coral-atmosphere.png") center/cover no-repeat}
#profile-view{background:transparent}
/* Chrome surface replaces the rejected coral illustration. */
.content,.scene,.entry-screen{background:#e9e7e5 url('./assets/metal-background.svg') center/cover no-repeat}
.basket{bottom:calc(var(--control-height) - 12px * var(--scene-scale))}
.playing .basket{bottom:calc(-8px * var(--scene-scale))}
/* Visible canvas edge leaves a small gap above the catch control. */
.basket{bottom:calc(var(--control-height) + 1px * var(--scene-scale))}
.scene>.scene-balances{position:absolute;right:16px;top:17px;z-index:13;display:flex;align-items:center;gap:9px;pointer-events:none}
.scene>.scene-balances .balance{display:flex;align-items:center;gap:3px;font-size:11px;color:#514c4d}
.scene>.scene-balances .balance img{width:18px;height:18px;object-fit:contain}
.scene>.scene-balances .balance b{font-size:11px;font-weight:650}
.scene-title{left:20px;right:auto;width:auto;max-width:calc(100% - 135px);font-size:22px;text-align:left}
.tabbar button:focus-visible{outline:2px solid #d59f90;outline-offset:-3px;border-radius:8px}
.app-toast{position:absolute;left:20px;right:20px;bottom:calc(var(--nav-height) + 15px);z-index:100;padding:15px 18px;border-radius:10px;background:#f8f9fc;color:#48474e;box-shadow:0 5px 25px #5c63793b;font-size:13px;line-height:1.45}
@media(max-width:350px){.scene-title{font-size:19px;left:16px}.scene>.scene-balances{top:16px;right:13px;gap:7px}.scene>.scene-balances .balance img{width:16px;height:16px}}
/* Result palette follows the white chrome direction. */
#win-screen{background:#edf0f4;color:#31343b}
#win-screen .win-sun,#win-screen:not([data-prize="cloud"]) .win-sun{background:repeating-conic-gradient(from -8deg,#bfc6d0 0deg 14deg,#f5f7fa 14deg 30deg);opacity:.86}
#win-screen .win-content h1{color:#31343b}
#win-screen .win-eyebrow{color:#8a9099}
#win-screen .win-content>.spin-button,#win-screen .win-content>.spin-button:hover{background:linear-gradient(135deg,#fff 0%,#e4e8ee 29%,#fafcff 46%,#c4ccd7 78%,#eff3f8);color:#3e4550;border:1px solid #fff;border-radius:8px;box-shadow:inset 0 1px 0 #fff,0 4px 10px #7f8b9d20}
#win-screen .close{border:1px solid #fff;background:linear-gradient(145deg,#fff,#e1e6ee);color:#535b67;border-radius:12px}
#win-screen .close:focus-visible{outline:2px solid #9ba8bb;outline-offset:2px}
.chest-art>img[src*="secret-box"]{filter:url('#clean-prize-alpha') drop-shadow(0 5px 6px #8a94a826)}
.chest-open{transform:translateY(-1.84%)}
.chest-box.is-opening .chest-open{animation-name:secret-box-reveal}
@keyframes secret-box-reveal{from{opacity:0;transform:translateY(calc(-1.84% + 3px)) scale(.995)}to{opacity:1;transform:translateY(-1.84%) scale(1)}}

/* Keep certificate captions centered beneath the original card artwork. */
.gift.certificate-gift{gap:6px}
.gift.certificate-gift img{max-height:calc(100% - 22px)}
.gift.certificate-gift .gift-label{display:block;width:100%;text-align:center}
/* Short entrance motion, shared across secondary screens. */
@keyframes chrome-content-enter{from{opacity:0;translate:0 9px}to{opacity:1;translate:0 0}}
#shop-view.active .shop-heading,#shop-view.active .shop-intro,
#shop-view.active .shop-merchant-banner,#tasks-view.active .activity,
#tasks-view.active .task,#top-view.active .winner-row,
#prizes-view.active .owned-certificate,#prizes-view.active .prize-card,
#certificates-view.active .certificate-original-art{
 animation:chrome-content-enter .42s cubic-bezier(.2,.75,.2,1) backwards;
}
#shop-view.active .shop-merchant-banner:nth-child(2),#tasks-view.active .activity:nth-child(2){animation-delay:.06s}
#shop-view.active .shop-merchant-banner:nth-child(3){animation-delay:.12s}
#shop-view .shop-merchant-art{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover) and (pointer:fine){#shop-view .shop-merchant-banner:hover .shop-merchant-art{transform:translateY(-3px) rotate(-2deg)}}
@media(prefers-reduced-motion:reduce){
 #shop-view.active .shop-heading,#shop-view.active .shop-intro,#shop-view.active .shop-merchant-banner,
 #tasks-view.active .activity,#tasks-view.active .task,#top-view.active .winner-row,
 #prizes-view.active .owned-certificate,#prizes-view.active .prize-card,#certificates-view.active .certificate-original-art{animation:none}
 #shop-view .shop-merchant-art{transition:none}
}
#certificates-view{background:transparent}
#certificates-view .certificate-button:not(:disabled){background:#ef8875;color:#392a26;border-radius:8px;transition:background .18s,transform .18s}
#certificates-view .certificate-button:not(:disabled):hover{background:#f29b89}
#certificates-view .certificate-button:not(:disabled):active{transform:scale(.985)}

#win-screen .win-content>.spin-button,#win-screen .win-content>.spin-button:hover{background:#f39a83;color:#392a26;border-color:#ffc4af;box-shadow:inset 0 1px 0 #ffd5c6,0 4px 10px #9b6e6220}
#quiz-view .quiz-tomorrow{margin:-12px 0 0;color:#7a7475;font-size:15px;line-height:21px}
.tabbar button:focus-visible{outline:none}
.tabbar button:focus-visible .nav-symbol{box-shadow:0 0 0 2px #abb3c144}

.gift .gift-label{top:calc(50% + (var(--body-height,125px) / 2 + 7px) * var(--scene-scale));text-align:center}
.scene-title{left:0;right:0;top:14px;max-width:none;width:100%;text-align:center;font-size:22px}
.scene>.scene-balances{top:53px}
@media(max-width:350px){.scene-title{left:0;font-size:21px}.scene>.scene-balances{top:49px}}
.chest-certificate-mini[data-split-certificate="true"]{padding:0;border:0;background:none;border-radius:10px;box-shadow:none}
.chest-certificate-mini[data-split-certificate="true"]:before,.chest-certificate-mini[data-split-certificate="true"]:after{content:none}
.chest-certificate-mini[data-split-certificate="true"]>img{width:100%;height:100%;object-fit:fill;display:block}
