#juice-notice { position:fixed; inset:22% auto auto 50%; transform:translateX(-50%); margin:0; width:min(380px,calc(100vw - 40px)); box-sizing:border-box; border:0; border-radius:26px; padding:22px 24px; text-align:center; color:#fff0c5; background:radial-gradient(ellipse at 50% 35%,#345846f0,#18372eee 65%,#112b25ed); box-shadow:0 14px 44px #071d2644,inset 0 0 0 1px #ddc98a77; font-family:inherit; pointer-events:none; overflow:visible; opacity:0; z-index:10050; }
#juice-notice::backdrop { background:transparent; pointer-events:none; }
#juice-notice.juice-show { opacity:1; animation:juice-arrive .35s cubic-bezier(.2,.8,.2,1) both; }
#juice-notice.juice-show { display:block;pointer-events:auto;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none; }
#juice-notice.juice-show:focus-visible { outline:2px solid #ffe7a0;outline-offset:4px; }
#juice-notice.juice-leaving { pointer-events:none;animation:juice-leave .16s ease-out both; }
#juice-notice::before { content:""; position:absolute; inset:0; z-index:-1; border-radius:50%; background:radial-gradient(ellipse,#ebce7725,transparent 65%); pointer-events:none; }
.juice-eyebrow { display:block; color:#ffe9a8; font-size:12px; font-weight:800; letter-spacing:.16em; line-height:1.5; }
#juice-notice .juice-title { display:block; font:500 clamp(24px,6vw,32px)/1.15 Georgia,serif; text-wrap:balance; margin:8px 0; }
.juice-detail { display:block; font-size:14px; color:#dae6d3; line-height:1.5; text-wrap:balance; }
#juice-notice .juice-level-number { display:grid; place-items:center; position:relative; width:96px; height:96px; border-radius:50%; border:2px solid #ffe6a1; margin:14px auto 6px; font:600 58px/1 Georgia,serif; color:#fff2bc; background:radial-gradient(circle,#738a5355,#38503a44 65%); box-shadow:0 0 0 7px #f2da9d12,0 0 34px #f0ce6b38,inset 0 0 28px #f5d17c1f; animation:juice-level-bloom .65s cubic-bezier(.17,.84,.2,1.2) both; }
#juice-notice.juice-level { top:var(--juice-top,27%); width:min(300px,calc(100vw - 40px)); background:radial-gradient(ellipse at 50% 50%,#18372eaa,transparent 72%); box-shadow:none; text-shadow:0 2px 6px #0c251f,0 0 15px #18372e; }
#juice-notice.juice-level .juice-eyebrow { font-size:20px;letter-spacing:.13em; }
#juice-notice.juice-level .juice-title { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
#juice-notice.juice-level .juice-detail { color:#fff3c9;font-weight:650; }
#juice-notice.juice-boss { border-block:1px solid #e7cb8980; background:linear-gradient(110deg,#243c3be8,#253630f5,#243c3be8); }
#juice-notice.juice-boss .juice-eyebrow { font-size:18px; letter-spacing:.12em; }
#juice-notice.juice-upgrade { box-shadow:0 14px 44px #071d2644,inset 0 0 0 1px #b5e3ba99; }
.juice-up-arrow { position:absolute; right:14px; top:14px; display:grid; place-items:center; border:1px solid #cffbd3aa; background:#4f7d55; border-radius:50%; width:26px; height:26px; color:#e3ffe7; font-size:21px; font-weight:800; }
.juice-item-art { display:block; width:82px; height:82px; object-fit:contain; margin:12px auto; filter:drop-shadow(0 0 16px #d8c58744); animation:juice-level-bloom .5s ease-out both; }
body.juice-presenting #celebration.show { visibility:hidden; }
#juice-notice.juice-over-menu { inset:10px auto auto 50%; padding:12px 18px; background:#18382ef5; }
#juice-notice.juice-over-menu .juice-level-number { width:48px; height:48px; font-size:30px; margin:7px auto; }
#juice-notice.juice-over-menu .juice-item-art { width:46px; height:46px; margin:5px auto; }
#juice-notice.juice-over-menu .juice-title { font-size:22px; }
.juice-badge { animation:juice-badge .7s ease-out; }
.juice-counter { animation:juice-counter 1.1s ease-out; }
.juice-currency { position:fixed; top:40%; left:50%; z-index:9999; font-style:normal; color:#ffe5a0; font-size:15px; pointer-events:none; text-shadow:0 0 8px #ffc84d; animation:juice-currency .8s cubic-bezier(.25,.1,.5,1) both; }
.juice-reward-card { animation:juice-reveal .55s ease-out both; }
.juice-upgrade-line { color:#ceefd0!important; padding:10px 12px; border:1px solid #9fcdab77; border-radius:10px; background:#466c4144; font-size:14px!important; line-height:1.45; }
.daily-reveal .juice-chest-stage { position:relative; display:grid; place-items:center; height:210px; isolation:isolate; }
.juice-chest-stage::before { content:""; position:absolute; inset:12px; z-index:-1; background:radial-gradient(ellipse,var(--rarity),transparent 66%); opacity:.22; transform:scale(.7); }
.juice-chest-stage img { width:190px; height:180px; object-fit:contain; filter:drop-shadow(0 8px 13px #070e16aa); }
.daily-reveal.opening .juice-chest-stage img { animation:juice-chest-charge .85s ease-in both; }
.daily-reveal.landed .juice-chest-stage img { animation:juice-chest-open .7s ease-out both; }
.daily-reveal.landed .juice-chest-stage::before { animation:juice-chest-light .9s ease-out both; }
.juice-chest-star { position:absolute; left:50%; top:45%; font-size:22px; color:#ffedbb; opacity:0; pointer-events:none; }
.daily-reveal.landed .juice-chest-star { animation:juice-chest-star .95s ease-out both; }
.streak-days .today.juice-day-claimed { animation:juice-counter 1.1s ease-out; }
.juice-reveal-streak { justify-content:center;gap:5px; }
.juice-reveal-streak > span { font-size:12px;min-width:24px; }
.daily-reveal:not(.landed) .juice-reveal-streak { opacity:.4; }
.daily-reveal.juice-seventh.landed .juice-chest-stage::before { background:radial-gradient(ellipse,#fff2b5,var(--rarity) 35%,transparent 68%); }
.daily-reveal.juice-seventh.landed .juice-chest-stage img { filter:drop-shadow(0 0 22px #ffdc8a); }
#xp { transition:width .25s ease-out; }
body.reduced-motion #xp { transition:none; }
@keyframes juice-arrive { from { opacity:0;translate:0 10px;scale:.94; } to { opacity:1;translate:0 0;scale:1; } }
@keyframes juice-leave { from { opacity:1; } to { opacity:0; } }
@keyframes juice-level-bloom { from { opacity:0;scale:.65; } 65% { scale:1.07; } to { opacity:1;scale:1; } }
@keyframes juice-badge { 40% { scale:1.12;filter:drop-shadow(0 0 7px #ffda7d); } }
@keyframes juice-counter { 35% { color:#fff2aa;filter:drop-shadow(0 0 6px #edbd5f); } }
@keyframes juice-currency { 0% { opacity:0;transform:translate(0,0) scale(.6); } 15% { opacity:1; } 85% { opacity:1; } 100% { opacity:0;transform:translate(var(--juice-x),var(--juice-y)) scale(.35); } }
@keyframes juice-reveal { from { opacity:0;translate:0 8px; } to { opacity:1;translate:0 0; } }
@keyframes juice-chest-charge { 0% { transform:scale(1); } 65% { transform:scale(.96) translateY(3px);filter:drop-shadow(0 0 15px var(--rarity)); } 100% { transform:scale(1.06) translateY(-4px);filter:drop-shadow(0 0 25px var(--rarity)); } }
@keyframes juice-chest-open { from { transform:scale(1.06);filter:drop-shadow(0 0 30px var(--rarity)); } to { transform:scale(1);filter:drop-shadow(0 0 15px var(--rarity)); } }
@keyframes juice-chest-light { 20% { opacity:.6;transform:scale(1.2); } 100% { opacity:.28;transform:scale(1); } }
@keyframes juice-chest-star { 10% { opacity:1; } 100% { opacity:0;transform:translate(var(--star-x),var(--star-y)) rotate(60deg) scale(.5); } }
@media(max-height:620px) { #juice-notice { inset:12% auto auto 50%;padding:14px 20px;width:310px;max-width:calc(100vw - 36px); } #juice-notice .juice-level-number { width:64px;height:64px;font-size:42px; } .juice-item-art { width:54px;height:54px; } }
@media(prefers-reduced-motion:reduce) { #juice-notice,.juice-level-number,.juice-item-art,.juice-badge,.juice-counter,.juice-reward-card,.juice-chest-stage img,.juice-chest-stage::before,.juice-chest-star { animation:none!important; } .juice-currency,.juice-chest-star { display:none; } }
body.reduced-motion #juice-notice,body.reduced-motion .juice-level-number,body.reduced-motion .juice-item-art,body.reduced-motion .juice-badge,body.reduced-motion .juice-counter,body.reduced-motion .juice-reward-card,body.reduced-motion .juice-chest-stage img,body.reduced-motion .juice-chest-stage::before,body.reduced-motion .juice-chest-star { animation:none!important; }
body.reduced-motion .juice-currency,body.reduced-motion .juice-chest-star,.juice-still .juice-level-number { animation:none!important; }