/* ShinyNumberArtifact's scoped styles (styled-jsx on rngdle.com) */
@keyframes gem-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}
@keyframes digit-spin{0%,to{opacity:1}}
@keyframes digit-settle{0%{text-shadow:0 0 8px;transform:scale(1.5)}to{text-shadow:0 1px 2px #ffffff80;transform:scale(1)}}
@keyframes finale-pulse{0%{filter:brightness(1);transform:scale(1)}15%{filter:brightness(1.15);transform:scale(1.25)}40%{filter:brightness(1.05);transform:scale(.98)}60%{filter:brightness(1);transform:scale(1.03)}to{filter:brightness(1);transform:scale(1)}}
@keyframes breathing{0%,to{transform:scale(1)}50%{transform:scale(1.015)}}
.animate-digit-spin{animation:.2s ease-in-out infinite digit-spin}
.animate-digit-settle{animation:.5s ease-out forwards digit-settle}
.animate-attention-glow{box-shadow:0 0 12px 4px #94a3b84d,0 0 24px 8px #94a3b826}
.animate-finale-pulse{animation:.7s ease-out finale-pulse}
.animate-breathing{animation:3s ease-in-out infinite breathing}

/* Toast (sonner, bottom-center, as configured on rngdle.com) */
.toast-host{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{background:var(--black);color:var(--white);border:1px solid var(--outline-strong);font-family:var(--font-ui);font-size:13px;padding:14px 16px;border-radius:8px;min-width:280px;max-width:356px;box-shadow:0 4px 12px #0000001a;display:flex;align-items:center;gap:6px;animation:toast-in .3s ease-out}
.toast svg{width:16px;height:16px;flex-shrink:0}
@keyframes toast-in{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}

/* small utilities used by the social pages that rngdle's build didn't ship */
.self-center{align-self:center}
.text-\[10px\]{font-size:10px}
.leading-4{line-height:1rem}
.nav-pill{position:relative}
.codes-page{flex:1;overflow-y:auto;padding:56px 24px;color:var(--prose)}
.codes-section{width:100%;max-width:460px;margin:0 auto}
.codes-section h1{font-size:26px;font-weight:750;margin-bottom:24px}
.codes-reward{display:flex;flex-direction:column;gap:7px;margin-bottom:28px;padding:20px;border:1px solid var(--outline);border-radius:12px;background:var(--surface)}
.codes-reward strong{font-family:var(--font-roll),monospace;font-size:22px;letter-spacing:.12em}
.codes-reward span,.codes-form label{font-size:13px;color:var(--muted)}
.codes-form label{display:block;margin-bottom:8px}
.codes-form>div{display:flex;gap:8px}
.codes-form input{flex:1;min-width:0;padding:12px 14px;border:1px solid var(--outline-strong);border-radius:8px;background:var(--surface);color:var(--prose);font:inherit;text-transform:uppercase}
.codes-form button{padding:12px 18px;border-radius:8px;background:var(--prose);color:var(--site-bg);font-size:14px;font-weight:650}
.codes-form button:disabled{opacity:.4;cursor:not-allowed}
.codes-message,.codes-signin{margin-top:16px;font-size:13px;line-height:1.6}
.codes-claimed{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:14px}
.codes-claimed a{text-decoration:underline}
.guest-notice{max-width:430px;margin:14px auto 0;font-size:14px;line-height:1.65;color:var(--muted);text-align:center;text-transform:none}
.guest-notice small{display:block;margin-top:6px;font-size:11px}
.codes-section .guest-notice{text-align:left;margin-top:12px}
.nav-count{position:absolute;top:2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:9999px;background:var(--color-red-500,#ef4444);color:#fff;font-size:10px;line-height:16px;text-align:center;font-weight:700}

/* Number ranks above Mythic. */
.rank-unral-surface{background:#dff9ed;background-image:linear-gradient(135deg,#7adbbc 0%,#e8fff4 47%,#f4adc8 100%)}
.rank-unral-feed{background:linear-gradient(135deg,#e9fff4,#fff8fb,#ffe5ee)}
.rank-unral-pill{background:linear-gradient(120deg,#d9f8e9,#ffe1ee)}
.rank-unral-border{border-color:#7adbbc}
.rank-unral-text,.rank-unral-number{color:#245548}
.rank-unral-glow{box-shadow:0 0 24px #7adbbc75,0 0 32px #f4adc852}
.rank-aberration-surface{background:#1a1328;background-image:linear-gradient(125deg,#26143f,#9471c2 48%,#caff92 100%)}
.rank-aberration-feed{background:linear-gradient(135deg,#211437,#583c76,#d6ffc4)}
.rank-aberration-pill{background:linear-gradient(120deg,#3a2459,#b9e892)}
.rank-aberration-border{border-color:#a97ce6}
.rank-aberration-text,.rank-aberration-number{color:#efffe2;text-shadow:0 0 7px #caff92}
.rank-aberration-glow{box-shadow:0 0 20px #a97ce68c,0 0 38px #caff9280}
.rank-divine-surface{background:#fffcf0;background-image:linear-gradient(135deg,#fff 0%,#fff8df 50%,#efd27a 100%)}
.rank-divine-feed{background:linear-gradient(135deg,#fff,#fff9e9,#f9e9af)}
.rank-divine-pill{background:linear-gradient(120deg,#fff,#fff2c0)}
.rank-divine-border{border-color:#d6b453}
.rank-divine-text,.rank-divine-number{color:#795c16}
.rank-divine-glow{box-shadow:0 0 28px #eacb7a80}
.rank-transcendent-surface{background:#e8ffff;background-image:linear-gradient(125deg,#fff7df,#d9fdff 37%,#b7edfb 69%,#fff 100%)}
.rank-transcendent-feed{background:linear-gradient(135deg,#fff8e3,#defdff,#c8ecf7)}
.rank-transcendent-pill{background:linear-gradient(120deg,#fff8df,#c8f9ff)}
.rank-transcendent-border{border-color:#75bed0}
.rank-transcendent-text,.rank-transcendent-number{color:#31566b;text-shadow:0 0 8px #fff}
.rank-transcendent-glow{box-shadow:0 0 28px #b8f7ffc7,0 0 52px #ffe1a88c}
.rank-singularity-surface{background:#05060b;background-image:radial-gradient(circle at 50% 30%,#30384c,#080a13 55%,#010104 100%)}
.rank-singularity-feed{background:linear-gradient(135deg,#23252e,#111217,#050508)}
.rank-singularity-pill{background:#101116}
.rank-singularity-border{border-color:#aeb9d8}
.rank-singularity-text,.rank-singularity-number{color:#fff;text-shadow:0 1px 6px #000!important}
.rank-singularity-glow{box-shadow:0 0 18px #fff9,0 0 45px #9ca9d58c,0 0 84px #11182a}
.rank-cosmic-horror-surface{background:#030206;background-image:radial-gradient(circle at 56% 35%,#3a1245,#100a1d 33%,#010104 85%)}
.rank-cosmic-horror-feed{background:linear-gradient(125deg,#080610,#302039,#08060e)}
.rank-cosmic-horror-pill{background:linear-gradient(130deg,#080610,#362143)}
.rank-cosmic-horror-border{border-color:#9ad870}
.rank-cosmic-horror-text,.rank-cosmic-horror-number{color:#d9ffb3;text-shadow:1px 0 #ff4db8,-1px 0 #58e5ff,0 0 9px #b1ff78}
.rank-cosmic-horror-glow{box-shadow:0 0 18px #a8ff6470,0 0 55px #7926a37d,0 0 110px #050008}

/* Keep every decimal visible, including rolls beyond machine integer precision. */
.number-artifact { max-width: 100%; min-width: 0; }
.number-artifact-digits { min-width: 0; max-width: 100%; row-gap: .15em; }
.playtest-panel-armed strong { overflow-wrap: anywhere; }
.number-card { max-width: 100%; min-width: 0; }
.number-card > span { overflow-wrap: anywhere; }
.rank-numinous-ineffability-surface{background:radial-gradient(ellipse at 50% 35%,#22243a 0%,#0b0c1a 44%,#03040a 100%)}
.rank-numinous-ineffability-feed{background:linear-gradient(125deg,#090b17,#242137,#090b17)}
.rank-numinous-ineffability-pill{background:linear-gradient(120deg,#141520,#393047,#141520)}
.rank-numinous-ineffability-border{border-color:#c6b998}
.rank-numinous-ineffability-text,.rank-numinous-ineffability-number{color:#faf5e9;text-shadow:0 0 7px #f9edc8,0 0 22px #a89cc3}
.rank-numinous-ineffability-glow{box-shadow:0 0 16px #d3c9a575,0 0 58px #81769b6b,0 0 105px #080918}

.badge-tag { cursor:pointer; border-width:1px; transition:filter .15s; }
.badge-tag:hover { filter:brightness(.93); }
.badge-tag:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.badge-details { position:fixed; margin:auto; width:min(380px,calc(100vw - 32px)); padding:28px; border:1px solid #d4d4d8; border-radius:18px; background:#fff; color:#27272a; box-shadow:0 24px 90px #0003; text-align:center; }
.badge-details::backdrop { background:#10101880; backdrop-filter:blur(4px); }
.badge-details-close { position:absolute; top:9px; right:14px; font-size:25px; line-height:1; padding:5px; }
.badge-details-emoji { font-size:36px; margin:5px 0 12px; }
.badge-details h2 { font-size:20px; font-weight:700; }
.badge-details p { font-size:14px; line-height:1.6; margin:12px 0 20px; opacity:.75; text-transform:none; }
.badge-details strong { display:block; font-family:monospace; font-size:20px; }
.dark .badge-details { background:#202126; color:#f4f4f5; border-color:#444; }

.leaderboard-number { border-radius:8px; cursor:pointer; }
.leaderboard-number:hover { filter:brightness(1.12); }
.leaderboard-number:focus-visible { outline:2px solid var(--prose); outline-offset:3px; }
.number-details { margin:auto; padding:0; width:min(620px,calc(100vw - 24px)); max-height:85dvh; overflow-y:auto; border:1px solid var(--outline); border-radius:16px; background:var(--surface); color:var(--prose); box-shadow:0 24px 90px #0005; }
.number-details::backdrop { background:#10101899; backdrop-filter:blur(4px); }
.number-details-heading { position:sticky; top:0; z-index:2; padding:26px 44px 20px; text-align:center; background:var(--surface); border-bottom:1px solid var(--outline); }
.number-details-heading h2 { font-family:var(--font-space-mono),monospace; font-size:clamp(23px,4vw,36px); overflow-wrap:anywhere; font-weight:700; text-transform:none; }
.number-details-heading>div { margin-top:8px; font-size:13px; color:var(--prose-3); }
.number-details-heading>button { position:absolute; top:10px; right:14px; font-size:26px; }
.number-details-badges { padding:16px; display:grid; gap:10px; }
.number-details-more { display:block; margin:0 16px 16px; width:calc(100% - 32px); padding:9px; border:1px solid var(--outline); border-radius:10px; color:var(--prose-2); font-size:13px; }
.number-details-more:hover { background:var(--surface-raised); color:var(--prose); }
.number-details-error { padding:16px; color:var(--prose-3); font-size:13px; }
.reveal-speed-hint { position:fixed; bottom:12px; left:50%; transform:translateX(-50%); z-index:45; pointer-events:none; opacity:.38; color:var(--prose); font-size:11px; white-space:nowrap; }
.bulk-next { position:fixed; bottom:16px; left:50%; transform:translateX(-50%); z-index:45; width:min(300px,calc(100vw - 32px)); box-shadow:0 8px 30px #0005; border-radius:12px; }
.bulk-unfolding .rare-roll-main { padding-bottom:100px; }
.navigation-locked a { opacity:.4; cursor:not-allowed; }
.number-details-card .number-card { font-size:clamp(23px,4vw,36px); min-height:56px; }
.number-details-card .number-card>span { font-size:inherit; line-height:1.15; }
html,body,#root,#root .overflow-y-auto,.rare-roll-main,.account-page,#scroll-root,.number-details,.batch-grid-scroll,.polished-card>div,.codes-page,.chat-list,.notification-panel { scrollbar-width:none; }
html::-webkit-scrollbar,body::-webkit-scrollbar,#root::-webkit-scrollbar,#root .overflow-y-auto::-webkit-scrollbar,.rare-roll-main::-webkit-scrollbar,.account-page::-webkit-scrollbar,#scroll-root::-webkit-scrollbar,.number-details::-webkit-scrollbar,.batch-grid-scroll::-webkit-scrollbar,.polished-card>div::-webkit-scrollbar,.codes-page::-webkit-scrollbar { display:none; }

.rewards-control{position:relative}.gem-button{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;color:#8d929b;font:20px/1 system-ui;cursor:pointer}.gem-button:hover{background:var(--surface-raised);color:#b7bcc5}.rewards-panel{position:absolute;right:0;top:42px;z-index:1000;width:min(390px,calc(100vw - 24px));max-height:calc(100dvh - 75px);overflow:auto;padding:24px;background:var(--site-bg);border:1px solid var(--outline);border-radius:14px;box-shadow:0 16px 50px #0003}.rewards-close{position:absolute;right:10px;top:8px;padding:3px 8px;font-size:23px;color:var(--prose-3)}.rewards-content .codes-section{width:100%;padding:0}.rewards-content h2{font-size:18px;font-weight:750;margin-bottom:20px}.minigames-page{width:min(780px,100%);margin:0 auto;padding:12px 24px 40px}.minigames-page .mini-games{margin-top:0;border-top:0}.chain-lives{color:#e86576;letter-spacing:3px;margin-left:8px}

@media(min-width:640px){.leaderboard-score{width:8rem;flex:0 0 8rem;text-align:right}}
.leaderboard-hearts{width:3.5rem;flex:0 0 3.5rem;display:flex;justify-content:flex-end}

.leaderboard-page{width:min(1120px,100%)}.leaderboard-wrap{max-width:1120px}.leaderboard-number{max-width:100%;min-width:0}.leaderboard-number .number-card{max-width:100%}.leaderboard-number .number-card>span{overflow-wrap:anywhere}.leaderboard-hearts{flex-shrink:0}.player-title{display:block;font-size:10px;line-height:1.4;color:var(--prose-3);text-transform:none;overflow:hidden;text-overflow:ellipsis;max-width:230px}.leaderboard-user{display:flex;flex-direction:column;min-width:0}.leaderboard-row-values{width:400px;max-width:48%;min-width:0;justify-content:flex-end}@media(max-width:640px){.leaderboard-row-values{max-width:42%;width:auto;gap:8px!important}.player-title{max-width:140px}.leaderboard-page{padding:10px!important}}

.leaderboard-tabs{overflow-y:hidden;scrollbar-width:none}.leaderboard-tabs::-webkit-scrollbar{display:none}
.roll-button-charged{position:relative;isolation:isolate;overflow:hidden}.roll-button-negative{filter:hue-rotate(150deg) saturate(1.3)}.roll-selection-fill{position:absolute;inset:0 auto 0 0;z-index:-1;background:linear-gradient(90deg,#fff2,#fff6);pointer-events:none;border-right:2px solid #fffc}
.intro-backdrop{position:fixed;inset:0;z-index:190;display:grid;place-items:center;background:#080b13b8;backdrop-filter:blur(7px);padding:20px}.intro-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--outline);border-radius:20px;padding:28px;color:var(--prose);box-shadow:0 30px 100px #0006}.intro-dice{color:#e6b857;font-size:30px}.intro-card h2{font-size:24px;font-weight:800;margin:8px 0 24px;letter-spacing:-.6px}.intro-row{display:flex;align-items:flex-start;gap:14px;margin:20px 0}.intro-row>span,.intro-row>kbd{min-width:52px;text-align:center;font-size:12px;padding:6px 7px;border:1px solid var(--outline);border-radius:7px;color:var(--prose-2);background:var(--surface-raised)}.intro-row p{margin:0;font-size:14px}.intro-row small{display:block;color:var(--prose-3);font-size:12px;line-height:1.6;margin-top:4px}.intro-card>button{display:flex;justify-content:space-between;width:100%;padding:12px 16px;border-radius:9px;background:var(--prose);color:var(--surface);font-size:14px;font-weight:700;margin-top:24px}
/* Phones: page links collapse into one menu. */
.mobile-nav{position:relative;display:none}
.mobile-nav-toggle{position:relative;display:flex;align-items:center;gap:3px;padding:8px 7px;border-radius:8px;color:var(--prose-2)}
.mobile-nav-toggle:hover,.mobile-nav-toggle.is-open{background:var(--surface-raised);color:var(--prose)}
.mobile-nav-toggle.is-open>svg:last-of-type{transform:rotate(180deg)}
.mobile-nav-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:130;min-width:190px;padding:5px;border:1px solid var(--outline);border-radius:12px;background:var(--site-bg);box-shadow:0 14px 40px #0006;animation:mobile-nav-in .14s ease-out}
.mobile-nav-menu a{position:relative;display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;font-size:14px;font-weight:500;color:var(--prose-2)}
.mobile-nav-menu a:hover,.mobile-nav-menu a.is-current{background:var(--surface-raised);color:var(--prose)}
.mobile-nav-menu .nav-count{position:static;margin-left:auto}
@keyframes mobile-nav-in{from{opacity:0;transform:translateY(-4px)}}
@media (max-width:639px){.mobile-nav{display:block}.nav-pill--wide{display:none!important}}

/* ---- live bulk-roll spectating ---- */
.spectate-bar{position:fixed;top:10px;left:10px;z-index:1150;display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:999px;background:var(--surface-raised,#fff);border:1px solid var(--outline-subtle,#0002);box-shadow:0 6px 20px #0003;font-size:12px;color:var(--prose,#222)}
.spectate-back{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;font-size:14px}
.spectate-back:hover{background:var(--outline-subtle,#0001)}
.spectate-status{display:inline-flex;align-items:center;gap:5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:10px;color:var(--prose-3,#777)}
.spectate-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.spectate-status--live{color:#e5484d}
.spectate-status--live::before,.live-dot{animation:live-dot 1.4s ease-in-out infinite}
.spectate-who{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.spectate-who img{width:20px;height:20px;border-radius:50%}
.spectate-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-size:14px;color:var(--prose-2)}
.spectate-empty a{font-size:12px;text-decoration:underline}
.cast-watchers{position:fixed;left:14px;bottom:14px;z-index:120;display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:#000b;color:#fff;font-size:12px;font-weight:600;backdrop-filter:blur(6px);pointer-events:none}
.live-bulk{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin:0 0 16px}
.live-bulk-card{min-width:0;display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px;border-radius:12px;border:1px solid var(--outline-subtle,#0002);background:var(--surface-raised,#fff);text-align:left;transition:transform .15s,box-shadow .15s}
.live-bulk-card:hover{transform:translateY(-1px);box-shadow:0 6px 18px #0002}
.live-bulk-card img{width:32px;height:32px;border-radius:50%}
.live-bulk-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.2}
.live-bulk-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-bulk-main b{font-size:13px}
.live-bulk-main small{font-size:11px;color:var(--prose-3);font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0}
.live-bulk-main small .live-bulk-share{font-size:11px;font-weight:650;color:#e6b857}
.stream-share-input{display:flex;align-items:center;gap:8px;flex:none}.stream-share-input input{width:110px;accent-color:#e6b857}.stream-share-input b{min-width:36px;text-align:right;font-variant-numeric:tabular-nums}
.live-bulk-bar{display:block;height:3px;border-radius:2px;margin-top:3px;background:linear-gradient(90deg,#e5484d var(--pct),var(--outline-subtle) var(--pct))}
.live-incognito{margin-left:6px;padding:1px 6px;border-radius:5px;background:#3a3550;color:#c9c2e8;font-size:9.5px;font-style:normal;font-weight:800;letter-spacing:.06em;text-transform:uppercase;vertical-align:1px}
.live-bulk-meta{display:inline-flex;align-items:center;gap:4px;margin-left:4px;font-size:11px;font-weight:700;color:#e5484d}
.live-dot{width:7px;height:7px;border-radius:50%;background:#e5484d}
@keyframes live-dot{50%{opacity:.35}}
.live-bulk.live-bulk--empty{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px dashed var(--outline);border-radius:12px;font-size:12px;color:var(--prose-3)}
.live-dot--idle{background:var(--prose-3);animation:none;opacity:.5}

/* host pointer, mini-chat and floating reactions while spectating */
.host-cursor{position:fixed;left:0;top:0;z-index:1300;pointer-events:none;transition:opacity .4s;will-change:transform}
.host-cursor svg{display:block;width:30px;height:30px;filter:drop-shadow(0 0 6px #e5484dcc) drop-shadow(0 2px 4px #000a)}
.host-cursor svg path{fill:#fff;stroke:#e5484d;stroke-width:2.2px}
.host-cursor span{position:absolute;left:24px;top:24px;padding:3px 9px;border-radius:99px;background:#e5484d;color:#fff;font-size:11px;font-weight:800;white-space:nowrap;box-shadow:0 3px 12px #0007;border:1.5px solid #fff}
.host-cursor--click::after{content:"";position:absolute;left:-16px;top:-16px;width:32px;height:32px;border-radius:50%;border:3px solid #e5484d;box-shadow:0 0 0 2px #fff;animation:host-click .45s ease-out forwards}
@keyframes host-click{from{transform:scale(.3);opacity:1}to{transform:scale(1.5);opacity:0}}
.live-room-chat{position:fixed;left:12px;bottom:12px;z-index:1250;width:min(290px,calc(100vw - 24px));display:flex;flex-direction:column;gap:6px;padding:8px;border-radius:14px;background:#0d0d12d9;color:#f4f4f7;backdrop-filter:blur(10px);box-shadow:0 10px 30px #0006;font-size:12px}
.live-room-chat--closed{width:auto;padding:0;background:none;box-shadow:none;backdrop-filter:none}
.live-room-chat-list{list-style:none;margin:0;padding:0;max-height:min(180px,30vh);overflow-y:auto;display:flex;flex-direction:column;gap:4px;scrollbar-width:none}
.live-room-chat-list::-webkit-scrollbar{display:none}
.live-room-chat-list li{display:flex;align-items:baseline;gap:5px;line-height:1.35;overflow-wrap:anywhere;animation:chat-pop .2s ease-out}
.live-room-chat-list li img{width:14px;height:14px;border-radius:50%;align-self:center;flex:none}
.live-room-chat-list li b{font-weight:700;color:#b9bdd0;flex:none}
.live-room-chat-list li b.is-host{color:#ff8a8d}
.live-room-chat-list li.is-emoji span{font-size:16px;line-height:1}
.live-room-chat-empty{color:#fff8;font-style:italic}
@keyframes chat-pop{from{opacity:0;transform:translateY(4px)}}
.live-room-chat-emoji{display:flex;flex-wrap:wrap;gap:2px}
.live-room-chat-emoji button{font-size:16px;line-height:1;padding:4px;border-radius:8px;transition:transform .12s,background .12s}
.live-room-chat-emoji button:hover:not(:disabled){background:#fff2;transform:scale(1.15)}
.live-room-chat-emoji button:disabled{opacity:.4}
.live-room-chat input{width:100%;padding:7px 9px;border-radius:9px;border:1px solid #fff2;background:#fff1;color:#fff;font-size:12px;outline:none}
.live-room-chat input:focus{border-color:#fff5}
.live-floats{position:fixed;inset:0;z-index:1240;pointer-events:none;overflow:hidden}
.live-floats span{position:absolute;bottom:90px;font-size:28px;animation:live-float 2.6s ease-out forwards}
@keyframes live-float{0%{transform:translate(0,0) scale(.6);opacity:0}12%{opacity:1;transform:translate(0,-20px) scale(1.1)}100%{transform:translate(var(--drift),-55vh) scale(1);opacity:0}}

/* live room: header, delivery feedback */
.live-room-chat-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:0 2px;color:#fffa}
.live-room-chat-hide{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.live-room-chat--closed .live-room-chat-toggle{padding:6px 8px 6px 6px;border-radius:99px;background:#0d0d12e6;color:#fff;box-shadow:0 6px 20px #0005}
.live-room-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:99px;background:#e5484d;color:#fff;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.live-room-badge>i{width:6px;height:6px;border-radius:50%;background:#fff;animation:live-badge-pulse 1.4s ease-in-out infinite}
.live-room-badge.is-idle{background:#fff2}.live-room-badge.is-idle>i{animation:none;opacity:.5}
.live-room-count{display:inline-flex;align-items:center;gap:3px;padding-left:6px;margin-left:1px;border-left:1px solid #fff6;font-variant-numeric:tabular-nums;letter-spacing:0}
@keyframes live-badge-pulse{50%{opacity:.35}}
.live-room-chat-list li.is-pending{opacity:.55}
.live-room-chat-emoji button.is-popped{animation:live-react-pop .35s ease-out}
@keyframes live-react-pop{0%{transform:scale(1)}40%{transform:scale(1.55) rotate(-8deg);background:#fff3}100%{transform:scale(1)}}
.live-room-chat-emoji button:active{transform:scale(.9)}
.live-room-chat form{display:flex;gap:4px}
.live-room-chat form button{flex:none;width:30px;border-radius:9px;background:#fff2;color:#fff;font-size:13px;transition:background .15s,opacity .15s}
.live-room-chat form button:disabled{opacity:.35}.live-room-chat form button:not(:disabled):hover{background:#fff4}
.live-room-notice{margin:0;font-size:11px;color:#ffb4b6;animation:chat-pop .2s ease-out}
.bulk-next .is-spectating{pointer-events:none;cursor:default}
/* the header's chat button floats above fullscreen roll overlays */
.chat-over-roll{position:fixed;z-index:1150;border-radius:10px;background:var(--site-bg);box-shadow:0 6px 24px #0006}

/* Stream chat (live-chat.jsx): the regular chat, docked bottom-left over the stream */
.live-chat{position:fixed;left:12px;bottom:12px;z-index:1250;width:min(360px,calc(100vw - 24px));max-height:min(520px,calc(100dvh - 90px));display:flex;flex-direction:column;border:1px solid var(--outline);border-radius:16px;background:color-mix(in srgb,var(--site-bg) 92%,transparent);color:var(--prose);backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 18px 50px #0007,0 0 0 1px #fff1 inset;text-transform:none;overflow:hidden;animation:live-chat-in .22s cubic-bezier(.2,.9,.3,1.2)}
@keyframes live-chat-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.live-chat.is-closed{width:auto;border-radius:99px;max-height:none}
.live-chat-head{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 10px;border-bottom:1px solid var(--outline-subtle)}
.live-chat.is-closed .live-chat-head{border:0;padding:5px}
.live-chat-toggle{display:inline-flex;align-items:center;gap:6px;border-radius:99px}
.live-chat-title{flex:1;min-width:0;font-size:12px;font-weight:700;color:var(--prose-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-chat-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:var(--prose-2);transition:background .15s,color .15s}
.live-chat-icon:hover{background:var(--surface-raised);color:var(--prose)}
.live-chat-unread{min-width:20px;padding:1px 6px;border-radius:99px;background:var(--prose);color:var(--site-bg);font-size:10px;font-weight:800;text-align:center}
.live-chat-list{flex:1;min-height:90px;max-height:300px;overflow-y:auto;overscroll-behavior:contain;padding:4px 0}
.live-chat-list .chat-list-inner{padding:0 6px}
.live-chat-by-host .chat-meta b,.live-chat-by-host .chat-meta>a{color:#e5484d}
.live-chat-by-host .chat-meta>a:first-child::after{content:"HOST";margin-left:6px;padding:1px 5px;border-radius:4px;background:#e5484d;color:#fff;font-size:9px;font-weight:800;letter-spacing:.06em;vertical-align:1px}
.live-chat-empty{padding:18px 10px;text-align:center;color:var(--prose-3);font-size:12px}
.live-chat-emoji{display:flex;justify-content:space-between;gap:2px;padding:5px 8px;border-top:1px solid var(--outline-subtle)}
.live-chat-emoji button{font-size:17px;line-height:1;padding:4px;border-radius:8px;transition:transform .12s,background .12s}
.live-chat-emoji button:hover{background:var(--surface-raised);transform:scale(1.18)}
.live-chat-emoji button:active{transform:scale(.9)}
.live-chat-emoji button.is-popped{animation:live-react-pop .35s ease-out}
.live-chat-notice{margin:0;padding:4px 12px;font-size:11px;color:var(--status-danger-text);animation:chat-pop .2s ease-out}
.live-chat .chat-form{border-top:1px solid var(--outline-subtle)}
.live-chat .chat-signin{padding:10px;text-align:center;font-size:12px;color:var(--prose-3)}
@media(max-width:640px){.live-chat{left:8px;bottom:8px;width:calc(100vw - 16px);max-height:46dvh}.live-chat-list{max-height:none}}
/* Minimized stream (live-mini.jsx) */
.mini-stream{position:fixed;left:12px;bottom:12px;z-index:1200;display:flex;align-items:center;gap:4px;max-width:calc(100vw - 24px);padding:6px 6px 6px 8px;border:1px solid var(--outline);border-radius:14px;background:color-mix(in srgb,var(--site-bg) 92%,transparent);backdrop-filter:blur(12px);box-shadow:0 12px 34px #0006;text-transform:none;overflow:hidden;animation:live-chat-in .22s ease-out}
.mini-stream-main{display:flex;align-items:center;gap:9px;min-width:0;padding-right:4px}
.mini-stream-main img{width:30px;height:30px;border-radius:50%;flex:none;box-shadow:0 0 0 2px var(--site-bg),0 0 0 3.5px #e5484d}
.mini-stream.is-waiting .mini-stream-main img,.mini-stream.is-connecting .mini-stream-main img{box-shadow:0 0 0 2px var(--site-bg),0 0 0 3.5px var(--outline-strong)}
.mini-stream-text{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.mini-stream-text b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-stream-text small{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--prose-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.mini-stream-dot{width:6px;height:6px;border-radius:50%;background:#e5484d;animation:live-badge-pulse 1.4s ease-in-out infinite}
.mini-stream-close{width:26px;height:26px;border-radius:8px;color:var(--prose-3);font-size:17px;line-height:1}
.mini-stream-close:hover{background:var(--surface-raised);color:var(--prose)}
.mini-stream-bar{position:absolute;left:0;bottom:0;height:2px;background:#e5484d;transition:width .6s ease}
.spectate-min{display:grid;place-items:center;width:28px;height:28px;margin-left:auto;border-radius:8px;color:inherit;opacity:.75}
.spectate-min:hover{opacity:1;background:#fff2}

/* Stream donation banner */
.live-gift-toast{overflow:hidden;border-color:#e8c46a;background:linear-gradient(135deg,var(--surface),color-mix(in srgb,#e8c46a 14%,var(--surface)));box-shadow:0 12px 50px #0004,0 0 0 1px #e8c46a55,0 0 40px #e8c46a33}
.live-gift-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:15px}
.live-gift-line strong{color:#c8941e;font-size:17px}
.live-gift-user{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:inherit}
.live-gift-user:hover{text-decoration:underline}
.live-gift-user img{width:24px;height:24px;border-radius:50%;object-fit:cover}
.live-gift-timer{position:absolute;left:0;bottom:0;height:3px;width:100%;background:#e8c46a;transform-origin:left;animation:live-gift-time 7s linear forwards}
@keyframes live-gift-time{to{transform:scaleX(0)}}

/* Mini stream: the roll on screen */
.mini-stream.has-roll{flex-wrap:wrap;width:min(300px,calc(100vw - 24px))}
.mini-stream.has-roll .mini-stream-main{flex:1}
.mini-stream-roll{order:3;flex-basis:100%;display:flex;flex-direction:column;align-items:center;gap:7px;padding:10px 6px 6px;margin-top:4px;border-top:1px solid var(--outline);color:inherit;text-decoration:none}
.mini-stream-number{max-width:100%;font-family:"Space Mono",ui-monospace,monospace;font-size:20px;font-weight:700;letter-spacing:.02em;overflow-wrap:anywhere;text-align:center;line-height:1.2}
.mini-stream-card{max-width:100%;overflow-wrap:anywhere;animation:mini-card-in .45s cubic-bezier(.2,1.4,.4,1)}
.number-card-mystery{display:inline-flex;gap:1px}.number-card-mystery i{display:inline-block;font-style:normal;opacity:.75;animation:number-card-q 1s ease-in-out infinite}
@keyframes number-card-q{0%,100%{transform:translateY(0) rotate(0);opacity:.45}35%{transform:translateY(-3px) rotate(-8deg);opacity:1}70%{transform:translateY(1px) rotate(6deg);opacity:.7}}
.mini-stream-ep{padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.mini-stream-ep:not(.is-done){background:var(--ep-surface,#2a6f4a22);color:var(--ep,#3fb37f);border:1px solid var(--ep-outline,#3fb37f55)}
.mini-stream-ep.is-done{color:var(--prose-3)}
@keyframes mini-card-in{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}

/* phones: the codes & buy panel is pinned to the screen, not to the gem button */
@media(max-width:640px){
  .rewards-panel{position:fixed;left:8px;right:8px;top:58px;width:auto;max-height:calc(100dvh - 66px);padding:20px 16px}
  .codes-form>div{flex-wrap:wrap}
  .codes-form input{flex:1 1 140px}
  .codes-form button{flex:1 1 auto;white-space:nowrap}
}

/* Stream chat rarity wash for Mythic+ results (7 s) */
.live-chat--fx{--fx:#f472b6;--fx2:#c084fc;animation:live-fx-glow 7s ease-out both;overflow:hidden}
.live-chat--fx-unral{--fx:#7adbbc;--fx2:#f4acc8}.live-chat--fx-aberration{--fx:#ff466a;--fx2:#459dff}
.live-chat--fx-divine{--fx:#f6d46d;--fx2:#fff9d8}.live-chat--fx-transcendent{--fx:#f7add4;--fx2:#fff1f8}
.live-chat--fx-singularity{--fx:#d4dcf2;--fx2:#67738f}.live-chat--fx-cosmic_horror{--fx:#b1ff76;--fx2:#9e5abb}
.live-chat--fx-numinous{--fx:#fff3d1;--fx2:#e8d8b9}
@keyframes live-fx-glow{0%{box-shadow:0 0 0 1px var(--fx),0 0 60px var(--fx)}60%{box-shadow:0 0 0 1px var(--fx2),0 0 28px color-mix(in srgb,var(--fx2) 60%,transparent)}100%{box-shadow:0 18px 50px #0007}}
.live-chat-fx{position:absolute;inset:0;pointer-events:none;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,color-mix(in srgb,var(--fx) 22%,transparent),transparent 45%);animation:live-fx-fade 7s ease-out both}
.live-chat-fx i{position:absolute;left:var(--x);bottom:-10px;width:6px;height:6px;border-radius:50%;background:var(--fx);box-shadow:0 0 10px var(--fx);transform:scale(var(--s));animation:live-fx-rise 2.6s ease-out var(--d) 2 both}
@keyframes live-fx-rise{0%{opacity:0;translate:0 0}15%{opacity:1}100%{opacity:0;translate:0 -320px}}
@keyframes live-fx-fade{0%{opacity:0}8%{opacity:1}75%{opacity:1}100%{opacity:0}}
/* rarity flavours */
.live-chat--fx-aberration .live-chat-fx{animation:live-fx-fade 7s ease-out both,live-fx-split .35s steps(2) 6}
@keyframes live-fx-split{50%{filter:drop-shadow(3px 0 #ff466a) drop-shadow(-3px 0 #459dff)}}
.live-chat--fx-divine .live-chat-fx i,.live-chat--fx-numinous .live-chat-fx i{border-radius:1px;width:2px;height:16px;background:linear-gradient(var(--fx2),var(--fx))}
.live-chat--fx-singularity .live-chat-fx{background:radial-gradient(circle at 50% 0,#000 0 18%,color-mix(in srgb,var(--fx) 30%,transparent) 22%,transparent 55%)}
.live-chat--fx-singularity .live-chat-fx i{animation-name:live-fx-pull}
@keyframes live-fx-pull{0%{opacity:0;translate:0 0}20%{opacity:1}100%{opacity:0;left:50%;translate:0 -340px;scale:.2}}
.live-chat--fx-cosmic_horror .live-chat-fx{background:linear-gradient(180deg,color-mix(in srgb,var(--fx2) 30%,transparent),transparent 50%);animation:live-fx-fade 7s ease-out both,live-fx-shake .18s linear 12}
@keyframes live-fx-shake{25%{transform:translate(1px,-1px)}75%{transform:translate(-1px,1px)}}
@media(prefers-reduced-motion:reduce){.live-chat--fx,.live-chat-fx,.live-chat-fx i{animation:none!important}}
/* Live controls sit above roll scenes without intercepting the pointer. */
.recording-cursor{position:fixed;left:0;top:0;width:5px;height:5px;border-radius:50%;background:#ff394c;box-shadow:0 0 0 1px #35070d,0 0 5px #ff394c88;z-index:2147483000;pointer-events:none;opacity:0}
@media(pointer:coarse){.recording-cursor{display:none}}
.live-members{padding:6px 10px;border-bottom:1px solid var(--outline);font-size:11px;text-transform:none}.live-members-head{display:flex;justify-content:space-between;align-items:center;color:var(--prose-3);margin-bottom:4px}.live-members-head button{font-size:15px;line-height:1;padding:0 4px;color:var(--prose-3)}.live-members-list{display:flex;flex-wrap:wrap;gap:4px;max-height:72px;overflow:auto}.live-member{display:inline-flex;align-items:center;gap:4px;padding:2px 2px 2px 3px;border:1px solid var(--outline);border-radius:99px;background:var(--surface-raised);max-width:100%;white-space:nowrap}.live-member img{width:16px;height:16px;border-radius:50%}.live-member button{min-width:18px;height:18px;padding:0 5px;border-radius:99px;color:var(--prose-3);font-size:12px;line-height:18px}.live-member button:hover,.live-member.is-armed button{background:#e5484d;color:#fff}.live-member.is-armed{border-color:#e5484d88}
.stream-ping-dot{display:inline-block;flex-shrink:0;width:7px;height:7px;background:#ff3b55;border-radius:50%;box-shadow:0 0 6px #ff3b5566}.mini-stream>.stream-ping-dot{position:absolute;top:8px;right:32px}
.mini-stream{overflow:visible}.mini-stream-roll{overflow:hidden}.mini-stream-roll .font-roll{font-size:16px}.mini-stream-floats{position:absolute;inset:0;pointer-events:none;overflow:visible}.mini-stream-floats span{position:absolute;bottom:15px;font-size:23px;animation:mini-hype 2.6s ease-out both}.mini-stream-speed{position:absolute;bottom:4px;right:8px;font-size:9px;opacity:.65}
@keyframes mini-hype{0%{opacity:0;transform:translateY(0) scale(.7)}15%{opacity:1}100%{opacity:0;transform:translateY(-160px) rotate(15deg) scale(1.15)}}
/* Stream chat popups (+ menu, pickers) live inside the clipped panel: keep
   them compact and make sure the panel is tall enough to hold them. */
.live-chat .chat-plus-menu{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:calc(100% - 24px);max-height:calc(100% - 12px);overflow-y:auto}
.live-chat .chat-plus-menu button{padding:6px 8px;font-size:12px}
.live-chat .chat-picker-items{max-height:150px}
.live-chat:has(.chat-plus-menu,.chat-picker) .live-chat-list{min-height:190px}

/* Stream bets: one slim bar under the chat header; expands upward into rows. */
.bet-bar{border-bottom:1px solid var(--outline-subtle);font-size:12px}
.bet-bar-toggle{display:flex;align-items:center;gap:7px;width:100%;padding:6px 10px;color:var(--prose-2);text-transform:none;text-align:left}
.bet-bar-toggle:hover{background:var(--surface-raised);color:var(--prose)}
.bet-bar-status{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.bet-bar-pot{display:flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums;color:var(--prose-3)}
.bet-bar-live{width:6px;height:6px;border-radius:50%;background:#46d68c;box-shadow:0 0 6px #46d68c;animation:bet-live 1.4s ease-in-out infinite}
@keyframes bet-live{50%{opacity:.35}}
.bet-panel{padding:2px 8px 8px;animation:chat-pop .18s ease-out}
.bet-rows{display:flex;flex-direction:column;gap:2px}
.bet-row{position:relative;display:grid;grid-template-columns:10px 1fr auto auto 52px;align-items:center;gap:7px;padding:5px 8px;border-radius:7px;text-transform:none;text-align:left;overflow:hidden;isolation:isolate;transition:background .12s,opacity .2s}
.bet-row::before{content:"";position:absolute;inset:0 auto 0 0;width:calc(var(--share)*100%);background:color-mix(in srgb,var(--c) 16%,transparent);z-index:-1;transition:width .4s}
.bet-row:not(:disabled):hover{background:var(--surface-raised)}
.bet-row:disabled{cursor:default}
.bet-row b{font-weight:700;color:var(--prose);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bet-row small{color:var(--prose-3);font-size:11px;font-variant-numeric:tabular-nums}
.bet-row em{font-style:normal;font-weight:800;text-align:right;color:var(--c);font-variant-numeric:tabular-nums}
.bet-dot{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 6px color-mix(in srgb,var(--c) 60%,transparent)}
.bet-people{min-width:16px;padding:0 4px;border-radius:99px;background:var(--surface-raised);color:var(--prose-2);font-size:10px;font-weight:700;text-align:center}
.bet-row.is-picked,.bet-row.is-mine{box-shadow:inset 0 0 0 1.5px var(--c)}
.bet-row.is-won{background:color-mix(in srgb,var(--c) 22%,transparent);box-shadow:inset 0 0 0 1.5px var(--c);animation:bet-won 1s ease-out}
.bet-row.is-lost{opacity:.4}
@keyframes bet-won{0%{transform:scale(1.04)}100%{transform:none}}
.bet-stake{display:flex;gap:4px;margin-top:6px}
.bet-stake input{flex:1;min-width:0;padding:6px 8px;border:1px solid var(--outline);border-radius:7px;background:var(--surface-raised);color:var(--prose);font-size:12px}
.bet-stake button{padding:0 8px;border-radius:7px;background:var(--surface-raised);color:var(--prose-2);font-size:11px;font-weight:700}
.bet-stake .bet-go{padding:0 10px;background:var(--prose);color:var(--site-bg);white-space:nowrap}
.bet-stake .bet-go:disabled{opacity:.4}
.bet-note{margin:6px 2px 0;font-size:11px;color:var(--prose-3);text-transform:none}
.bet-note.is-error{color:var(--status-danger-text)}
.bet-note.is-win{color:#46d68c;font-weight:700}

@media(max-width:600px){.bet-panel{max-height:48dvh;overflow:auto;overscroll-behavior:contain}.bet-stake{display:flex;flex-wrap:wrap}.bet-stake input{min-width:70px;flex:1;font-size:16px}.bet-row{min-height:42px}.bet-gate-go{min-height:44px}}
.username-live-dot{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 18px;width:18px;height:22px;vertical-align:middle;position:relative;z-index:2}.username-live-dot i{display:block;width:7px;height:7px;border-radius:50%;background:#ff405b;box-shadow:0 0 6px #ff405b;animation:username-live-glint 1.6s ease-in-out infinite}@keyframes username-live-glint{50%{background:#ffb8c0;box-shadow:0 0 10px #ff405b}}[data-function-error]{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px;overflow-wrap:anywhere}[data-function-error]:focus-visible{outline:2px solid #ff9ba9}.event-reactions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.event-reactions .chat-reactions{margin:0}.event-reactions>.chat-react-wrap>button{border:1px solid #8885;border-radius:30px;width:27px;height:27px}.event-reactions small:empty{display:none}
.bet-bar-toggle{min-height:38px;padding:9px 12px}.bet-panel{padding:8px 12px 12px}.bet-panel-heading{display:flex;justify-content:space-between;gap:12px;margin-bottom:9px;color:var(--prose-2);font-size:11px;text-transform:none}.bet-panel-heading small{color:var(--prose-3)}.bet-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.bet-row{display:grid;grid-template-columns:8px minmax(0,1fr) 14px;gap:7px;min-height:38px;padding:8px;border:1px solid var(--outline-subtle);background:var(--surface-raised)}.bet-row::before{display:none}.bet-row b{font-size:11px}.bet-row.is-picked,.bet-row.is-mine{background:color-mix(in srgb,var(--c) 12%,var(--surface-raised));border-color:var(--c);box-shadow:none}.bet-choice-mark{color:var(--c);font-size:13px}.bet-stake{display:grid;grid-template-columns:1fr auto;gap:8px;padding-top:12px;margin-top:10px;border-top:1px solid var(--outline-subtle)}.bet-amount-label{grid-column:1/-1}.bet-amount-label>span{display:flex;justify-content:space-between;font-size:11px;color:var(--prose-2);margin-bottom:6px;text-transform:none}.bet-amount-label small{color:var(--prose-3);font-size:10px}.bet-amount-label input{width:100%;font-size:16px;padding:9px 10px}.bet-presets{display:flex;gap:4px;align-items:stretch}.bet-presets button{min-width:37px;min-height:34px}.bet-stake .bet-go{min-height:36px;font-size:12px;padding:8px 12px}.bet-note{line-height:1.5;margin-top:9px}.bet-bar:has(.bet-panel){background:color-mix(in srgb,var(--surface-raised) 30%,transparent)}

.header-discord{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:32px;height:32px;margin-right:3px;border-radius:8px;color:#fff;transition:background .15s,color .15s}
.header-discord:hover{background:var(--surface-raised);color:#fff}
.header-discord:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.navigation-locked a.header-discord{opacity:1;cursor:pointer}

/* <bless>: wordless divine light */
.live-bless{position:fixed;inset:0;z-index:120;pointer-events:none;overflow:hidden;animation:live-bless-fade 4.2s ease-out forwards}
.live-bless-ray{position:absolute;left:50%;top:-20%;width:46vmin;height:140%;translate:-50% 0;background:linear-gradient(180deg,#fff8dcee,#ffe69a66 40%,transparent 85%);filter:blur(18px);clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);animation:live-bless-ray 4.2s ease-out forwards}
.live-bless-halo{position:absolute;left:50%;top:38%;width:70vmin;height:70vmin;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#fffbe8 0,#ffe08a99 25%,#ffd36a33 50%,transparent 70%);mix-blend-mode:screen;animation:live-bless-halo 4.2s ease-out forwards}
.live-bless b{position:absolute;top:-4%;left:var(--x);width:5px;height:5px;border-radius:50%;background:#fff6c8;box-shadow:0 0 10px 3px #ffe08a;animation:live-bless-mote 3.4s ease-in var(--d) forwards}
@keyframes live-bless-fade{0%{opacity:0}8%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes live-bless-ray{from{transform:scaleY(.2);transform-origin:top}to{transform:scaleY(1)}}
@keyframes live-bless-halo{0%{transform:scale(.3);opacity:0}30%{transform:scale(1);opacity:1}100%{transform:scale(1.25);opacity:.6}}
@keyframes live-bless-mote{to{transform:translateY(105vh);opacity:0}}

/* Amolony: a 1-in-10,000 misspelt, glitching Anomaly. */
.amolony-label{position:relative;display:inline-block;animation:amolony-jit 2.4s steps(1) infinite}
.amolony-label::before,.amolony-label::after{content:attr(data-text);position:absolute;inset:0;padding:inherit;pointer-events:none;overflow:hidden}
.amolony-label::before{color:#00e5ff;transform:translate(-1px,0);clip-path:inset(0 0 55% 0);mix-blend-mode:screen;animation:amolony-a 1.7s steps(2) infinite}
.amolony-label::after{color:#ff2bd6;transform:translate(1px,0);clip-path:inset(50% 0 0 0);mix-blend-mode:screen;animation:amolony-b 1.3s steps(2) infinite}
.amolony-tag{position:absolute;top:1px;right:4px;z-index:11;font:700 9px/1 ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;color:#9a3412;opacity:.85;animation:amolony-jit 2.4s steps(1) infinite;text-shadow:-1px 0 #00e5ff,1px 0 #ff2bd6}
.badge-tag.is-amolony .amolony-tag{position:static;margin-left:4px}
.is-amolony{animation:amolony-card 3.1s steps(1) infinite}
@keyframes amolony-jit{0%,100%{transform:none}31%{transform:translate(1px,-1px) skewX(8deg)}33%{transform:none}71%{transform:translate(-2px,0)}72%{transform:none}}
@keyframes amolony-a{0%{clip-path:inset(0 0 60% 0)}50%{clip-path:inset(30% 0 35% 0);transform:translate(-2px,0)}}
@keyframes amolony-b{0%{clip-path:inset(55% 0 0 0)}50%{clip-path:inset(10% 0 70% 0);transform:translate(2px,0)}}
@keyframes amolony-card{0%,100%{filter:none}47%{filter:hue-rotate(160deg) saturate(1.6)}48%{filter:none}83%{filter:contrast(1.4) hue-rotate(-40deg)}84%{filter:none}}
html.perf-mode .amolony-label,html.perf-mode .is-amolony,html.perf-mode .amolony-tag{animation:none}

.live-bless-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:120;pointer-events:none}
.live-bless-bar{position:fixed;left:50%;top:70px;translate:-50% 0;z-index:121;display:flex;flex-direction:column;gap:5px;min-width:240px;padding:9px 14px;border:1px solid #ffe08a88;border-radius:12px;background:#1d1608e6;color:#fff6d6;font-size:12px;box-shadow:0 0 24px #ffd36a44;backdrop-filter:blur(8px);pointer-events:none;animation:bless-bar-in .4s ease-out}
.live-bless-bar small{color:#ffe7a8b0;font-size:10px}
.live-bless-bar i{display:block;height:6px;border-radius:99px;background:#ffe08a26;overflow:hidden}
.live-bless-bar i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffd36a,#fffbe8,#ffd36a);background-size:200% 100%;transition:width .8s ease;animation:bless-bar-shine 1.6s linear infinite}
.live-bless-bar.is-done{border-color:#fffbe8;transition:opacity .6s}
@keyframes bless-bar-in{from{opacity:0;transform:translateY(-8px)}}
@keyframes bless-bar-shine{to{background-position:-200% 0}}
.live-bless-bar i.is-waiting b{opacity:.45}
.new-best-halo{position:absolute;inset:-60%;background:radial-gradient(ellipse,#ffd97838,transparent 60%);animation:pb-halo 1.8s ease-out both;pointer-events:none}.new-best-rays{position:absolute;inset:-80%;background:repeating-conic-gradient(from 15deg,transparent 0deg 21deg,#ffe99830 23deg 25deg,transparent 27deg 45deg);mask-image:radial-gradient(ellipse,transparent 15%,#000 35%,transparent 65%);animation:pb-rays 2s ease-out both;pointer-events:none}.new-best-banner{letter-spacing:.16em;box-shadow:0 0 28px #e9b43d44;border:1px solid #ffe8a3aa}.new-best{z-index:10}@keyframes pb-halo{0%{opacity:0;transform:scale(.25)}30%{opacity:1}100%{opacity:0;transform:scale(1.5)}}@keyframes pb-rays{0%{opacity:0;transform:rotate(-20deg) scale(.4)}25%{opacity:1}100%{opacity:0;transform:rotate(20deg) scale(1.3)}}
.bless-reroll-status{position:fixed;top:90px;left:50%;transform:translateX(-50%);z-index:1200;padding:12px 18px;background:#241d39;color:#e9d5ff;border:1px solid #b998ed;border-radius:12px;box-shadow:0 4px 25px #0006}

/* Dynamic header tabs: rarity-coloured, with their countdown */
.nav-pill.dyn-tab,.mobile-nav-menu a.dyn-tab{border-width:1px;border-style:solid;animation:dyn-tab-in .5s cubic-bezier(.2,1.4,.4,1)}
.nav-pill.dyn-tab:hover{filter:brightness(1.08)}
.dyn-tab-clock{font-size:10px;font-variant-numeric:tabular-nums;opacity:.75;font-weight:600;margin-left:2px}
.mobile-nav-menu .dyn-tab-clock{margin-left:auto}
@keyframes dyn-tab-in{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}

/* Live chat on phones: folded by default, a compact sheet when open, and a peek of new messages */
.live-chat-peek{display:none}
@media(max-width:640px){
  section.live-chat:not(.is-closed){max-height:42dvh}
  section.live-chat:not(.is-closed) .live-chat-list{min-height:48px;max-height:none}
  section.live-chat .live-chat-head{padding:4px 6px 4px 8px;gap:5px}
  section.live-chat .live-chat-icon{width:30px;height:30px}
  section.live-chat .live-chat-emoji{padding:2px 6px;gap:4px}
  section.live-chat .live-chat-emoji button{font-size:15px;min-height:26px;padding:2px}
  section.live-chat.is-closed{flex-direction:row;align-items:center;background:color-mix(in srgb,var(--site-bg) 80%,transparent)}
  .live-chat.is-closed .live-chat-peek{display:block;max-width:calc(100vw - 150px);margin-right:6px;padding:4px 10px;border-radius:99px;background:var(--surface-raised);color:var(--prose);font-size:12px;line-height:1.3;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:chat-pop .2s ease-out}
  .live-chat-peek b{margin-right:5px;font-weight:800;color:var(--prose-2)}
}