[hidden] { display: none !important; }
/* Approved animated hub design. Content remains on opaque, readable surfaces. */
:root{--font:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--bg:#123c43;--panel:#12373f;--panel-2:#183f47;--panel-3:#214b53;--line:#34565c;--line-2:#507277;--text:#edf6ee;--dim:#adc8c6;--faint:#9bb9b7;--teal:#74dcd0;--teal-2:#02a4ad;--gold:#ffd059;--gold-2:#ffe28a;--gold-dim:#d9b86666;--good:#8be0bc;--bad:#ff9385;--r:22px}
body{isolation:isolate}#main{max-width:600px;margin:auto}.acct{padding-top:24px}.brandrow{justify-content:flex-start;margin-bottom:20px}
.brandmark{display:block;position:relative;width:153px;flex-shrink:0;transform-origin:center;animation:brand-float 5s ease-in-out infinite;filter:drop-shadow(0 3px 10px #40d8c620)}
.brandlogo{display:block;width:100%;height:auto;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.brandmark:after{content:'';position:absolute;inset:0;background:#e7f2e9;-webkit-mask:url('/app/logo-sm.png') center/100% 100% no-repeat;mask:url('/app/logo-sm.png') center/100% 100% no-repeat;clip-path:inset(77% 0 0 0);pointer-events:none}
@keyframes brand-float{0%,100%{transform:translateY(0) rotate(-1deg);filter:drop-shadow(0 3px 8px #40d8c620)}50%{transform:translateY(-4px) rotate(1deg) scale(1.025);filter:drop-shadow(0 4px 13px #40d8c64d)}}
.nav{background:#0d2c33f5;border-color:#41605c}.nav button.on{color:#a8f1d9}.ticker{background:linear-gradient(110deg,#324a35,#12373f);border-color:#a99b5455}.ticker:before{opacity:.13}.pcard .pcost,.dcost{color:#f6d48d}.tag.fulfilled,.tag.earned{color:#173e39}.stats{background:#143941dd}.pointchip{color:#173238}.sheet{background:#04191dd9}.sheet .inner{border-color:var(--line)}
.backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 95% 8%,#53867855,transparent 45%),radial-gradient(ellipse at 0 82%,#337b7860,transparent 50%),#123c43}
.backdrop svg{position:absolute;left:50%;top:0;width:max(100%,460px);height:100%;transform:translateX(-50%)}
.backdrop .drift{animation:scenery-drift 26s ease-in-out infinite;transform-origin:420px 100px}
.backdrop .drift-slow{animation:scenery-drift 33s -12s ease-in-out infinite reverse;transform-origin:20px 810px}
@keyframes scenery-drift{50%{translate:0 10px;rotate:4deg}}
.show-hero{height:213px;overflow:hidden;position:relative;border-radius:26px 26px 0 0;background:radial-gradient(ellipse at 50% 95%,#12757a88,transparent 65%),#06262c}.hero-grid{position:absolute;inset:-100px;background-image:linear-gradient(#70d9db12 1px,transparent 1px),linear-gradient(90deg,#70d9db12 1px,transparent 1px);background-size:36px 36px;transform:perspective(280px) rotateX(55deg);animation:gridtravel 8s linear infinite}@keyframes gridtravel{to{background-position:0 36px}}.hero-status{position:absolute;top:20px;left:22px;font-size:10px;font-weight:800;letter-spacing:.1em;display:flex;gap:7px;align-items:center}.hero-status i{width:6px;height:6px;background:#6febd4;border-radius:50%;box-shadow:0 0 12px #48fcd4;animation:pulse 2.5s ease-in-out infinite}@keyframes pulse{50%{box-shadow:0 0 0 5px #48fcd420,0 0 16px #48fcd4}}.hero-series{position:absolute;right:22px;top:20px;font-size:10px;color:#7facb0}.hero-halo{position:absolute;width:220px;height:220px;left:50%;top:47px;border:1px solid #ebc66055;border-radius:50%;transform:translateX(-50%) rotateX(67deg) rotate(-24deg);box-shadow:0 0 28px #ffd36018,inset 0 0 24px #ffd36012;animation:orbit 8s linear infinite}.hero-halo:before,.hero-halo:after{content:'';position:absolute;width:8px;height:8px;background:#ffe497;border-radius:50%;top:27px;left:24px;box-shadow:0 0 20px #ffc84a}.hero-halo:after{top:auto;left:auto;right:24px;bottom:27px}.hero-halo.two{width:285px;height:285px;top:17px;border-color:#56d6d830;animation-direction:reverse;animation-duration:13s;transform:translateX(-50%) rotateX(67deg) rotate(36deg)}@keyframes orbit{to{rotate:0 0 1 360deg}}
.hero-prize{position:absolute;inset:67px 0 0;text-align:center;animation:float 5s ease-in-out infinite}.hero-prize small{font-size:10px;color:#cce1de;letter-spacing:.25em}.hero-prize strong{display:block;font-size:62px;line-height:1.1;font-weight:900;letter-spacing:-3px;background:linear-gradient(110deg,#9b701e 12%,#ffe5a5 30%,#ffca4d 43%,#fff3c2 48%,#c18723 56%,#ffdc7c 76%);background-size:240% auto;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 5px 0 #543819);animation:gold 7s ease-in-out infinite}.hero-prize strong em{font-size:21px;font-style:normal;letter-spacing:0;vertical-align:middle;margin-right:5px}@keyframes gold{50%{background-position:100% center}}@keyframes float{50%{transform:translateY(-5px)}}.hero-spark{position:absolute;width:3px;height:3px;border-radius:50%;background:#fbd587;left:var(--x);bottom:-5px;box-shadow:0 0 8px #ffdd90;animation:spark var(--duration) var(--delay) linear infinite}@keyframes spark{0%{transform:translateY(0);opacity:0}15%{opacity:.8}80%{opacity:.6}100%{transform:translate(18px,-210px);opacity:0}}

/* The hero uses each show's actual art and prize; titles never clip. */
.card{padding:0 0 22px;border:1px solid #548f8877;border-radius:27px;background:#092c32;box-shadow:0 24px 45px -23px #021920bb;position:relative;transition:transform .25s ease-out;isolation:isolate}
.card:before{content:'';position:absolute;inset:0;border-radius:27px;pointer-events:none;border:1px solid transparent;background:conic-gradient(from var(--hub-angle),#158489,#15474b 22%,#ffe298 30%,#1c6669 37%,#13474a 65%,#ffd669 75%,#158489 84%) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:hub-border 9s linear infinite;z-index:4}
@property --hub-angle{syntax:'<angle>';initial-value:0deg;inherits:false}@keyframes hub-border{to{--hub-angle:360deg}}
.show-hero{min-height:205px;height:auto;isolation:isolate}.show-hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3;z-index:-1}.show-hero.has-art{background:#06262c99}.hero-prize{position:relative;inset:auto;padding:63px 18px 30px;overflow-wrap:anywhere}.hero-prize strong{font-size:clamp(34px,11vw,62px);line-height:1.15}.hero-prize.long strong{font-size:27px;letter-spacing:-.5px}.hero-prize small{display:block;margin-bottom:4px}.show-hero .spill{position:absolute;left:21px;top:18px;z-index:2;margin:0}.spill.soon{background:#09616b;color:#cbfff2}.show-summary,.show-summary.no-art{display:block;padding:22px 22px 0}.card .nm{font-size:23px;line-height:1.25;letter-spacing:-.6px}.card .meta{font-size:12px;color:#a1c4c7;margin-top:12px}.card .show-countdown{margin:20px 22px 0;padding-top:16px;border-color:#56847f44}.card .countdown-heading{color:#a1c4c7;font-size:9px;letter-spacing:.16em}.card .act{margin:22px 22px 0;gap:10px}.card .act>button{border-radius:12px;font-size:13px;min-height:48px}.bellbtn{background:#16595c;border:1px solid #5dc1be66;color:#defdf5}.bellbtn.on{background:#b2ead4;color:#113c34}.card .act>.btn{position:relative;overflow:hidden;background:#ffd059;color:#263029}.card .act>.btn:after{content:'';position:absolute;inset:-50%;background:linear-gradient(110deg,transparent 42%,#fff8 50%,transparent 58%);transform:translateX(-110%);animation:hub-sweep 5s 2s infinite;pointer-events:none}@keyframes hub-sweep{0%,65%{transform:translateX(-110%)}100%{transform:translateX(110%)}}.card .gate{margin:18px 22px 0;background:#ffffff09;flex-wrap:wrap}.card .gate b{color:#c6b0ff}
.arctile{background:#18424a;border-color:#6fa3a333;box-shadow:0 12px 24px -12px #001f2c88}.arcbody{padding:13px 14px}.arcbody .btn{font-size:13px;border-radius:12px}.arcsub{font-size:11px}.arcart.faithful{height:244px;background:radial-gradient(ellipse at 50% 70%,#15343e,#091c26 80%);padding:7px 0}.arcart.faithful>svg{display:block;width:100%;height:100%}
.mini-reel{animation:actual-reel 8s cubic-bezier(.25,.01,.2,1) infinite}.mini-reel.r1{animation-delay:.2s}.mini-reel.r2{animation-delay:.4s}@keyframes actual-reel{0%,28%{transform:translateY(0)}64%,100%{transform:translateY(-90px)}}.mini-ball{animation:actual-drop 6s linear infinite;filter:drop-shadow(0 0 2px #55e5ff66)}@keyframes actual-drop{0%,8%{transform:translate(86px,22px);opacity:0}10%{opacity:1}16%{transform:translate(84px,43px)}22%{transform:translate(90px,53px)}28%{transform:translate(84px,65px)}34%{transform:translate(90px,78px)}40%{transform:translate(83px,90px)}46%{transform:translate(90px,103px)}52%{transform:translate(84px,115px)}58%{transform:translate(89px,128px)}64%{transform:translate(83px,141px)}70%{transform:translate(75px,154px)}76%{transform:translate(68px,181px);opacity:1}83%,100%{transform:translate(68px,204px);opacity:0}}.mini-led{animation:led-breathe 3s ease-in-out infinite}@keyframes led-breathe{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){.mini-reel,.mini-ball,.mini-led{animation:none}.mini-ball{transform:translate(86px,22px)}}

.motion-paused *, .motion-paused *:before, .motion-paused *:after, .motion-out *, .motion-out *:before, .motion-out *:after, .motion-out:before, .motion-out:after{animation-play-state:paused!important}
@media(max-width:370px){.show-summary,.show-summary.no-art{padding:19px 17px 0}.card .nm{font-size:21px}.card .show-countdown{margin-left:17px;margin-right:17px}.card .act{margin-left:17px;margin-right:17px}.card .act>button{font-size:12px}.arcnote{font-size:10px}.arcart.faithful{height:212px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.mini-ball{transform:translate(86px,22px)}.hero-prize{transform:none}.card{transform:none!important}}

@supports not ((mask-composite:exclude) or (-webkit-mask-composite:xor)){.card:before{display:none}}
