/* Digital FSC animated SipBuddy — server data determines all earned stamps. */
:root{--sip-orange:#ff9b48;--sip-deep:#24170f}
.wallet-topline{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(275px,.8fr);gap:17px;align-items:stretch;margin:16px 0 22px}
.wallet-topline>.punchcard{min-height:346px;display:flex;flex-direction:column;justify-content:space-between}
.sip-panel{background:linear-gradient(150deg,#25201e,#1c1a1c 58%,#32211c);border:1px solid #75503a;border-radius:25px;padding:21px;overflow:hidden;position:relative;min-width:0}
.sip-panel:before{content:'';position:absolute;top:-80px;right:-65px;width:235px;height:235px;background:#ff962324;filter:blur(42px);border-radius:50%;pointer-events:none}
.sip-panel-header,.sip-panel-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;position:relative;z-index:1}
.sip-kicker{letter-spacing:.16em;color:#fdb56c;font-size:10px;font-weight:900}
.sip-day-label{border:1px solid #85582e;border-radius:999px;padding:7px 10px;font-weight:800;color:#ffc994;font-size:11px}
.sip-stage{margin-top:2px;text-align:center;min-height:206px;position:relative}
.sip-avatar{width:min(230px,100%);height:200px;overflow:visible;display:block;margin:0 auto}
.sip-avatar .sip-body{transform-origin:124px 168px;animation:sipFloat 2.4s ease-in-out infinite}
.sip-avatar .sip-cup-arm{transform-origin:127px 158px;animation:sipCup 3s ease-in-out infinite}
.sip-avatar .sip-steam{animation:sipSteam 2.2s ease-in-out infinite}
.sip-avatar .sip-spark{animation:sipSpark 1.7s ease-in-out infinite}
.sip-avatar.sip-low .sip-body,.sip-avatar.sip-low .sip-cup-arm{animation-duration:5s}
.sip-avatar.sip-low .sip-spark{opacity:.14}
.sip-avatar.sip-mid .sip-body{animation-duration:3.5s}
.sip-bubble{display:inline-block;padding:9px 13px;border-radius:17px 17px 17px 4px;background:#ffe5b0;color:#352014;font-weight:850;font-size:12px;box-shadow:0 10px 22px #0002;margin:-14px auto 0;position:relative;z-index:2}
.sip-stage-title{font:800 21px Outfit,sans-serif;margin:14px 0 1px;color:#fff4e8;text-align:center}
.sip-stage-sub{font-size:11px;color:#c4b4a4;text-align:center;line-height:1.6;min-height:34px;margin:7px auto 14px;max-width:250px}
.sip-energy-row{display:flex;align-items:center;gap:12px;position:relative;z-index:1;margin-top:10px}
.sip-energy-meter{height:11px;flex:1;border-radius:99px;background:#4a352f;overflow:hidden;border:1px solid #795044}
.sip-energy-fill{height:100%;background:linear-gradient(90deg,#fe7657,#ffbd56);border-radius:99px;width:var(--sip-energy,100%);transition:width 1.2s ease}
.sip-energy-percent{font-weight:850;font-size:12px;color:#ffcc91;min-width:36px;text-align:right}
.sip-remaining{font:850 26px Outfit,sans-serif;letter-spacing:.035em;color:#fff0da;font-variant-numeric:tabular-nums}
.sip-timer-caption{font-size:10px;letter-spacing:.09em;color:#b6a79b;text-transform:uppercase;margin-top:4px}
.sip-expiry{font-size:11px;color:#e7a891;margin-top:8px;line-height:1.5}
.sip-days{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;margin:15px 0 5px}
.sip-day{height:39px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid #514038;background:#2f2925;color:#bba99a}
.sip-day strong{font-size:13px;line-height:1}.sip-day small{font-size:7px;text-transform:uppercase;letter-spacing:.07em}
.sip-day.sip-done{background:#f486282a;color:#ffc388;border-color:#cf7d32}.sip-day.sip-today{outline:2px solid #ffb456;outline-offset:1px}
.sip-rules{font-size:11px;color:#b7a79b;line-height:1.65;margin-top:15px}
.sip-perk{border:1px solid #8f5936;background:#ff963316;border-radius:14px;padding:12px 14px;font-size:12px;color:#ffdcb7;line-height:1.6;margin-top:15px}
.sip-perk strong{color:#ffb05c}
.sip-preview-cta{font-size:12px;text-decoration:underline;color:#ffc17d;background:none;border:0;padding:12px 0;text-align:left}
/* The animated popup celebrates authenticated server results, not preview balances. */
.sip-modal-wrap{position:fixed;inset:0;z-index:160;background:#090607d9;display:flex;justify-content:center;align-items:center;padding:17px;animation:sipFade .3s ease}
.sip-celebration{background:radial-gradient(circle at 75% 20%,#f8883750,transparent 36%),linear-gradient(145deg,#30221b,#181514);border:1px solid #a36339;border-radius:30px;padding:29px 25px;box-shadow:0 35px 110px #000c;max-width:435px;width:100%;position:relative;max-height:96vh;overflow:auto;text-align:center}
.sip-celebration h2{font:900 36px/1.08 Outfit,sans-serif;letter-spacing:-.04em;margin:14px 0 8px;color:#fff3e3}
.sip-celebration .sip-avatar{height:235px;width:min(250px,100%)}
.sip-celebration p{color:#d3bcab;line-height:1.6;font-size:13px}
.sip-modal-close{position:absolute;top:15px;right:16px;background:#ffffff1e;border:1px solid #ffffff30;color:#fff;border-radius:50%;width:38px;height:38px;z-index:3}
.sip-gain{display:inline-flex;background:#ffab5c;color:#301607;padding:10px 19px;border-radius:999px;font-weight:900;font-size:21px;box-shadow:0 7px 30px #e97a3450;animation:sipPulse .55s both}
.sip-finale{font-size:13px;color:#ffbf7b;padding:10px;border:1px solid #8e5030;border-radius:13px;margin:15px auto}
.sip-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sip-confetti i{position:absolute;top:-40px;left:var(--x);width:8px;height:14px;background:var(--c);transform:rotate(var(--r));animation:sipConfetti var(--t) linear forwards;animation-delay:var(--delay)}
.sip-sim-banner{background:#513925;color:#ffd6a7;padding:14px 18px;border:1px dashed #e2a361;border-radius:15px;margin-bottom:20px;font-size:12px;font-weight:750}
.sip-preview-layout{display:grid;grid-template-columns:1fr minmax(280px,.82fr);gap:18px;margin-bottom:23px}
.sip-simulator-control{margin:18px 0;background:#211d19;border:1px solid #4d3b31;padding:18px;border-radius:19px}
.sip-simulator-control label{margin-bottom:15px}.sip-simulator-control input{accent-color:#f78c31;width:100%}
.sip-preview-days{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.sip-preview-days button{background:#2f2822;color:#eac9a9;border:1px solid #635047;border-radius:12px;padding:12px 4px;font-size:12px}.sip-preview-days button.selected{background:#f48628;color:#1e1008;font-weight:900}
@keyframes sipFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes sipCup{0%,17%,100%{transform:rotate(0deg)}36%,56%{transform:rotate(-14deg) translateY(-10px)}}
@keyframes sipSteam{0%{transform:translateY(10px);opacity:0}35%{opacity:.8}100%{transform:translateY(-18px);opacity:0}}
@keyframes sipSpark{0%,100%{opacity:.45;transform:scale(.65)}50%{opacity:1;transform:scale(1.2)}}
@keyframes sipPulse{0%{transform:scale(.6);opacity:0}65%{transform:scale(1.13);opacity:1}100%{transform:scale(1)}}
@keyframes sipConfetti{to{transform:translateY(580px) rotate(790deg);opacity:0}}
@keyframes sipFade{from{opacity:0}to{opacity:1}}
@media(max-width:850px){.wallet-topline,.sip-preview-layout{grid-template-columns:1fr}.sip-panel{padding:17px}.sip-stage{min-height:185px}.sip-avatar{height:175px}.wallet-topline>.punchcard{min-height:0}}
@media(max-width:420px){.sip-day{height:35px}.sip-days{gap:3px}.sip-day strong{font-size:11px}.sip-day small{font-size:6px}.sip-celebration{padding:26px 18px}.sip-remaining{font-size:23px}}
@media(prefers-reduced-motion:reduce){.sip-avatar .sip-body,.sip-avatar .sip-cup-arm,.sip-avatar .sip-steam,.sip-avatar .sip-spark,.sip-confetti i,.sip-gain,.sip-modal-wrap{animation:none!important}.sip-energy-fill{transition:none}}

/* Newly earned punches appear sequentially; bonus punches get a gold ring. */
.stamp.stamp-recent{animation:sipStampLand .6s cubic-bezier(.17,1.6,.48,.96) both;animation-delay:var(--stamp-delay,0s)}
.stamp.stamp-bonus{outline:3px solid #ffe477;box-shadow:0 0 0 4px #f7c44e44,0 0 30px #fff1a880;background:#ffef9c!important;color:#4a270a!important}
@keyframes sipStampLand{0%{transform:scale(.1) rotate(-35deg);opacity:0}55%{transform:scale(1.27) rotate(8deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.stamp.stamp-recent{animation:none}}
