.battle-page{isolation:isolate;width:min(100% - (var(--space-8) * 2), var(--width-content));padding-block:var(--space-8) var(--space-16);margin-inline:auto;position:relative}.battle-page:before{content:"";z-index:-2;background:linear-gradient(180deg, color-mix(in srgb, var(--surface-base) 40%, transparent) 0%, color-mix(in srgb, var(--surface-base) 80%, transparent) 62%, var(--surface-base) 100%), linear-gradient(90deg, var(--surface-base), color-mix(in srgb, var(--surface-base) 62%, transparent) 50%, var(--surface-base)), url(/images/worlds/versus-arena.webp) center top / cover no-repeat;pointer-events:none;width:100vw;height:min(48rem,100%);position:absolute;top:0;left:50%;transform:translate(-50%)}@media (max-width:840px){.battle-page{width:calc(100% - (var(--space-4) * 2));padding-block:var(--space-4) var(--space-12)}}.battle-intro{gap:var(--space-3);max-width:var(--width-prose);margin-bottom:var(--space-6);display:grid}.battle-signal{align-items:center;gap:var(--space-2);padding-bottom:var(--space-2);border-bottom:1px solid var(--border-subtle);color:var(--accent-secondary);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:var(--tracking-hud,.08em);text-transform:uppercase;display:inline-flex}.battle-intro h1{font-family:var(--font-display);font-size:clamp(var(--text-2xl), 4vw, var(--text-4xl));line-height:var(--leading-tight);text-transform:uppercase;text-shadow:0 0 34px var(--surface-accent-soft)}.battle-intro p{color:var(--text-secondary);max-width:46ch}.shortcut-toggle{min-height:var(--touch-target-min);padding:var(--space-1) var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-full);color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0}.shortcut-toggle:hover{border-color:var(--accent-secondary);color:var(--accent-secondary)}.shortcut-toggle[aria-pressed=false]{border-color:var(--border-strong);color:var(--text-secondary)}.state{text-align:center;color:var(--text-secondary);padding:var(--space-16) var(--space-4)}.stage{background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-raised);position:relative;overflow:hidden}.challenge-strip{align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--accent-victory);background:linear-gradient(90deg, color-mix(in srgb, var(--accent-victory) 16%, var(--surface-screen)), var(--surface-screen));box-shadow:inset 0 -1px 18px color-mix(in srgb, var(--accent-victory) 10%, transparent);grid-template-columns:auto minmax(10rem,auto) minmax(16rem,1fr) auto;display:grid}.challenge-strip>span{color:var(--accent-victory);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.1em}.challenge-strip>strong{font-family:var(--font-display);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;overflow:hidden}.challenge-strip>p{color:var(--text-secondary);font-size:var(--text-xs)}.challenge-strip>a{color:var(--accent-secondary);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.era-strip{align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--accent-secondary);background:linear-gradient(90deg, color-mix(in srgb, var(--accent-secondary) 16%, var(--surface-screen)), var(--surface-screen));box-shadow:inset 0 -1px 18px color-mix(in srgb, var(--accent-secondary) 10%, transparent);grid-template-columns:auto minmax(0,auto) minmax(0,1fr);display:grid}.era-strip>span{color:var(--accent-secondary);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.1em;text-transform:uppercase}.era-strip>i{background:color-mix(in srgb, var(--accent-secondary) 40%, transparent);height:1px}.era-strip>strong{color:var(--text-secondary);font-family:var(--font-body);font-size:var(--text-xs);text-overflow:ellipsis;white-space:nowrap;font-weight:400;overflow:hidden}.era-strip[data-era=superseded]{grid-template-columns:1fr}.era-strip[data-era=superseded]>span{text-transform:none;letter-spacing:0;font-family:var(--font-body);font-size:var(--text-xs)}.era-end{gap:var(--space-3)}.era-end-eyebrow{color:var(--accent-secondary);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.12em;text-transform:uppercase}.stage-head,.foot{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface-sunken);display:flex}.stage-head{border-bottom:1px solid var(--border-subtle)}.foot{border-top:1px solid var(--border-subtle)}.trust-rule{justify-content:space-between;align-items:center;gap:var(--space-4);min-height:3.25rem;padding:var(--space-2) var(--space-6);border-bottom:1px solid var(--border-subtle);background:var(--surface-screen);display:flex}.trust-state{align-items:center;gap:var(--space-3);display:flex}.trust-state>i{border-radius:var(--radius-full);background:var(--text-muted);width:8px;height:8px;transition:background var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.trust-rule[data-rated=true] .trust-state>i{background:var(--accent-victory);box-shadow:0 0 14px var(--accent-victory)}.trust-state>div{gap:1px;display:grid}.trust-state strong{font-family:var(--font-display);font-size:var(--text-sm);text-transform:uppercase}.trust-state span,.trust-rule summary,.listen-meter-copy{font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.09em;text-transform:uppercase}.trust-state span{color:var(--text-muted)}.trust-rule[data-rated=true] .trust-state strong{color:var(--accent-victory)}.trust-rule details{position:relative}.trust-rule summary{color:var(--text-muted);cursor:pointer;list-style-position:inside}.trust-rule summary:hover{color:var(--accent-secondary)}.trust-rule details p{z-index:5;top:calc(100% + var(--space-3));width:min(28rem, calc(100vw - var(--space-8)));padding:var(--space-4);border:1px solid var(--border-strong);background:var(--surface-hud);color:var(--text-secondary);font-size:var(--text-xs);box-shadow:var(--shadow-raised);position:absolute;right:0}.stage-head{flex-wrap:wrap}.stage-status{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.auth-action{min-height:var(--touch-target-min);padding:var(--space-1) var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-full);color:var(--text-primary);font:inherit;cursor:pointer;background:0 0;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.auth-action:hover:not(:disabled){border-color:var(--accent-primary);color:var(--accent-primary)}.auth-action:disabled{cursor:default;opacity:.6}.badge{font-family:var(--font-display);font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:.1em;text-transform:uppercase;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);color:var(--accent-secondary);border:1px solid}.counter,.keys{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);font-variant-numeric:tabular-nums}.pit{grid-template-columns:1fr 1px 1fr;display:grid}.seam{background:linear-gradient(180deg, transparent, var(--accent-primary), transparent);opacity:.5}.side{padding:var(--space-4);gap:var(--space-3);flex-direction:column;display:flex}.player{aspect-ratio:16/9;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:#000;position:relative;overflow:hidden}.player .frame,.player iframe{border:0;width:100%;height:100%}.unplayable{align-content:center;place-items:center;gap:var(--space-3);height:100%;padding:var(--space-4);text-align:center;color:var(--text-secondary);font-size:var(--text-sm);background:var(--surface-screen);display:grid}.consent-hold{z-index:3;position:relative}.consent-hold p{max-width:34ch;font-size:var(--text-xs);color:var(--text-secondary);margin:0;line-height:1.5}.consent-hold a{color:var(--accent-secondary)}.consent-play{min-height:var(--touch-target-min)}.consent-play:focus-visible{outline:2px solid var(--side-accent,var(--accent-primary));outline-offset:2px}.skip-inline{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-secondary);font-size:var(--text-sm);padding:var(--space-2) var(--space-4);min-height:var(--touch-target-min);cursor:pointer;background:0 0}.skip-inline:hover{color:var(--text-primary);border-color:var(--accent-primary)}.track{min-height:4rem}.track h2{font-size:var(--text-lg);margin-bottom:2px}.track p{font-size:var(--text-sm);color:var(--text-muted);margin:0}.track a{min-height:auto;text-decoration:none}.track a:hover{color:var(--accent-secondary)}.listen-meter{gap:var(--space-2);display:grid}.listen-meter-copy{justify-content:space-between;align-items:center;gap:var(--space-3);color:var(--text-muted);display:flex}.listen-meter-copy strong{color:var(--side-accent);font-weight:var(--weight-bold)}.listen-meter-track{border:1px solid var(--border-subtle);background:var(--surface-base);height:6px;position:relative;overflow:visible}.listen-meter-track i{background:var(--side-accent);max-width:100%;box-shadow:0 0 12px color-mix(in srgb, var(--side-accent) 65%, transparent);transition:width .12s linear;position:absolute;inset:0 auto 0 0}.listen-meter-track i:after{content:"";background:var(--side-accent);filter:blur(5px);opacity:.38;position:absolute;inset:-3px -2px}.listen-meter[data-playing=true] .listen-meter-track i{animation:listen-charge .9s var(--ease-out) infinite alternate}.listen-meter[data-qualified=true] .listen-meter-track{border-color:color-mix(in srgb, var(--accent-victory) 55%, var(--border-subtle))}.listen-meter[data-full=true] .listen-meter-track{box-shadow:0 0 18px color-mix(in srgb, var(--side-accent) 52%, transparent)}@keyframes listen-charge{to{filter:brightness(1.35);box-shadow:0 0 22px color-mix(in srgb, var(--side-accent) 82%, transparent)}}.controls{gap:var(--space-2);display:grid}.play,.vote,.skip{font-family:var(--font-display);letter-spacing:.06em;text-transform:uppercase;min-height:var(--touch-target-min);border-radius:var(--radius-md);cursor:pointer;transition:background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out)}.play{color:var(--text-secondary);border:1px solid var(--border-subtle);font-size:var(--text-sm);background:0 0}.play:hover{color:var(--text-primary);border-color:var(--border-strong)}.vote{color:var(--accent-primary);border:1px solid var(--accent-primary);font-size:var(--text-base);font-weight:var(--weight-bold);background:0 0}.vote:hover:not(:disabled){background:var(--accent-primary);color:var(--text-on-accent)}.vote:disabled{opacity:.4;cursor:default}.side[data-chosen=true] .vote:disabled{opacity:1}kbd{font-family:var(--font-mono);font-size:var(--text-2xs);opacity:.65;margin-left:var(--space-2);letter-spacing:0}.skip{color:var(--text-muted);font-family:var(--font-body);text-transform:none;letter-spacing:0;font-size:var(--text-sm);text-underline-offset:3px;background:0 0;border:0;text-decoration:underline}.skip:hover:not(:disabled){color:var(--text-secondary)}.stage[data-picked=true] .pit{animation:handoff .32s var(--ease-out) both}@keyframes handoff{0%{opacity:1}70%{opacity:1}to{opacity:.35}}.side[data-chosen=true] .vote{animation:confirm .32s var(--ease-out) both}@keyframes confirm{0%{transform:scale(1)}35%{transform:scale(1.04)}to{transform:scale(1)}}.ab{padding:var(--space-3) var(--space-4) 0;display:none}.ab>button{font:inherit;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);min-height:var(--touch-target-min);cursor:pointer;background:0 0;border:0;flex:1}.ab>button[aria-pressed=true]{background:var(--accent-primary);color:var(--text-on-accent)}@media (max-width:840px){.challenge-strip{gap:var(--space-2) var(--space-3);grid-template-columns:1fr auto}.challenge-strip>p{grid-area:2/1/auto/-1}.challenge-strip>strong{grid-area:1/1}.challenge-strip>span{display:none}.challenge-strip>a{grid-area:1/2}.stage-status{width:100%}.trust-rule{padding-inline:var(--space-4)}.pit{grid-template-columns:1fr}.seam{display:none}.ab{background:var(--surface-sunken);border-radius:var(--radius-full);margin:var(--space-3) var(--space-4) 0;gap:2px;padding:3px;display:flex}.side[data-hidden=true]{display:none}}@media (prefers-reduced-motion:reduce){.stage[data-picked=true] .pit,.side[data-chosen=true] .vote{animation:none}.stage[data-picked=true] .pit{opacity:.5}.listen-meter[data-playing=true] .listen-meter-track i{animation:none}.listen-meter-track i{transition:none}}.side{transition:opacity .14s,transform .14s}.side[data-chosen=true]{transform:translateY(-2px)}.side[data-chosen=true] .vote{border-color:var(--accent-primary);background:var(--accent-primary);color:var(--text-on-accent)}.side[data-dimmed=true]{opacity:.45}.vote:disabled,.skip:disabled{cursor:default}.vote:focus-visible,.skip:focus-visible,.play:focus-visible,.skip-inline:focus-visible{outline:2px solid var(--side-accent,var(--accent-primary));outline-offset:2px}.auth-action:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){.side{transition:none}.side[data-chosen=true]{transform:none}}.stage-loading{align-content:center;place-items:center;gap:var(--space-6);text-align:center;min-height:60vh;color:var(--text-secondary);display:grid}.equaliser{align-items:flex-end;gap:var(--space-2);height:56px;display:flex}.equaliser span{border-radius:var(--radius-full);background:linear-gradient(180deg, var(--accent-secondary), var(--accent-primary));width:6px;height:30%;animation:equalise 1.1s var(--ease-out) infinite}.equaliser span:first-child{animation-delay:0s}.equaliser span:nth-child(2){animation-delay:.19s}.equaliser span:nth-child(3){animation-delay:90ms}.equaliser span:nth-child(4){animation-delay:.31s}.equaliser span:nth-child(5){animation-delay:.14s}@keyframes equalise{0%,to{opacity:.55;height:22%}50%{opacity:1;height:100%}}.retry{font-family:var(--font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--accent-primary);border:1px solid var(--accent-primary);border-radius:var(--radius-md);padding:var(--space-2) var(--space-6);min-height:var(--touch-target-min);cursor:pointer;background:0 0}.retry:hover{background:var(--accent-primary);color:var(--text-on-accent)}@media (prefers-reduced-motion:reduce){.equaliser span{opacity:.8;animation:none}.equaliser span:first-child{height:40%}.equaliser span:nth-child(2){height:75%}.equaliser span:nth-child(3){height:100%}.equaliser span:nth-child(4){height:65%}.equaliser span:nth-child(5){height:35%}}.stage-wait{z-index:2;background:color-mix(in srgb, var(--surface-overlay) 92%, transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);place-items:center;display:grid;position:absolute;inset:0}.stage{border-color:var(--border-strong);background:var(--surface-hud);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)));box-shadow:var(--shadow-energy), var(--shadow-raised);border-radius:0}.stage:before{content:"";z-index:3;background:var(--gradient-brand);height:2px;box-shadow:0 0 18px var(--accent-primary);position:absolute;inset:0 12% auto}.stage-head{min-height:5rem;padding:var(--space-3) var(--space-6);background:linear-gradient(90deg, var(--surface-cyan-soft), transparent 35%, var(--surface-accent-soft)), var(--surface-screen);position:relative}.round-signal{align-items:center;gap:var(--space-2);color:var(--accent-victory);font-family:var(--font-mono);font-size:var(--text-2xs);font-weight:var(--weight-bold);letter-spacing:.12em;flex-basis:100%;display:flex}.round-signal span{color:var(--text-muted);margin-left:auto}.badge{border-radius:var(--radius-sm);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)));background:var(--surface-cyan-soft)}.auth-action{border-radius:var(--radius-sm);background:var(--surface-accent-soft);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.06em;text-transform:uppercase}.pit{grid-template-columns:1fr 2px 1fr;position:relative}.pit:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(90deg, var(--surface-cyan-soft), transparent 26%, transparent 74%, var(--surface-accent-soft)), linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);background-size:auto,42px 42px,42px 42px;position:absolute;inset:0}.seam{z-index:2;opacity:1;background:linear-gradient(180deg, transparent, var(--accent-victory), transparent);box-shadow:0 0 18px var(--accent-primary);place-items:center;display:grid;position:relative}.seam span{z-index:3;border:1px solid var(--accent-victory);background:var(--surface-hud);width:3.5rem;height:3.5rem;color:var(--accent-victory);font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--weight-bold);text-shadow:0 0 12px var(--accent-victory);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);place-items:center;display:grid;position:absolute}.side{z-index:1;padding:var(--space-6);position:relative}.side[data-side=a]{--side-accent:var(--accent-secondary)}.side[data-side=b]{--side-accent:var(--accent-victory)}.combatant-label{align-items:center;gap:var(--space-3);color:var(--side-accent);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.1em;grid-template-columns:auto 1fr auto;display:grid}.combatant-label i{background:linear-gradient(90deg, var(--side-accent), transparent);height:1px}.combatant-label strong{font-weight:var(--weight-normal);color:var(--text-muted)}.side[data-locked=true]{background:linear-gradient(180deg, color-mix(in srgb, var(--accent-victory) 8%, transparent), transparent 42%);box-shadow:inset 0 2px 0 var(--accent-victory)}.side[data-locked=true] .combatant-label>span{color:var(--accent-victory);text-shadow:0 0 12px var(--accent-victory)}.player{border-radius:var(--radius-sm);border-color:color-mix(in srgb, var(--side-accent) 55%, var(--border-strong));background:var(--surface-base);min-height:200px;box-shadow:0 0 0 1px var(--surface-base), 0 0 24px color-mix(in srgb, var(--side-accent) 15%, transparent);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)))}.player:before,.player:after{content:"";z-index:2;pointer-events:none;width:2rem;height:2rem;position:absolute}.player:before{inset:var(--space-2) auto auto var(--space-2);border-top:2px solid var(--side-accent);border-left:2px solid var(--side-accent)}.player:after{inset:auto var(--space-2) var(--space-2) auto;border-right:2px solid var(--side-accent);border-bottom:2px solid var(--side-accent)}.track{padding:var(--space-2) 0 var(--space-2) var(--space-3);border-left:3px solid var(--side-accent);position:relative}.track:before{content:"NOW PLAYING";margin-bottom:var(--space-1);color:var(--side-accent);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.12em;display:block}.track h2{font-size:var(--text-xl);text-transform:uppercase}@media (min-width:841px){.track h2,.track p{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.track h2{-webkit-line-clamp:2;min-height:2.3em;line-height:1.15}.track p{-webkit-line-clamp:2;min-height:3em;line-height:1.5}}.play,.vote{border-radius:var(--radius-sm);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)))}.play{border-color:var(--border-strong);background:var(--surface-screen)}.play:hover{border-color:var(--side-accent);color:var(--side-accent)}.vote{min-height:3.5rem;color:var(--side-accent);border-color:var(--side-accent);background:color-mix(in srgb, var(--side-accent) 7%, transparent);position:relative}.vote:hover:not(:disabled){background:var(--side-accent);color:var(--text-on-accent);box-shadow:0 0 26px color-mix(in srgb, var(--side-accent) 35%, transparent);transform:translateY(-2px)}.vote:active:not(:disabled){transform:translateY(0)scale(.99)}.side[data-chosen=true]{filter:drop-shadow(0 0 22px color-mix(in srgb, var(--side-accent) 45%, transparent))}.side[data-chosen=true] .vote{background:var(--side-accent);border-color:var(--side-accent)}.foot{min-height:3.5rem;padding-inline:var(--space-6);background:var(--surface-screen)}.keys:before{content:"CONTROLS // ";color:var(--accent-secondary)}.skip{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.04em}@media (max-width:840px){.battle-page:before{opacity:.78;background-position:50%,50%,top;height:min(42rem,100%)}.stage-head{padding-inline:var(--space-4)}.round-signal{flex-basis:auto;width:100%}.stage-status{flex:1;width:auto}.auth-action{margin-left:auto}.pit{grid-template-columns:1fr}.seam{display:none}.pit:before{background-size:auto,34px 34px,34px 34px}.ab{border:1px solid var(--border-subtle);background:var(--surface-screen);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)));border-radius:0}.ab>button{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;border-radius:0}.ab>button[aria-pressed=true]{background:var(--gradient-brand)}.side{padding:var(--space-4)}.combatant-label{margin-top:var(--space-1)}.track h2{font-size:var(--text-lg)}.foot{padding-block:var(--space-3);flex-direction:column;align-items:flex-start}.keys{opacity:.7}}@media (prefers-reduced-motion:reduce){.vote:hover:not(:disabled){transform:none}}.stage[data-waiting=true] .pit{pointer-events:none}.vote-notice{padding:var(--space-2) var(--space-4);border-inline-start:2px solid var(--accent-victory);color:var(--text-muted);background:color-mix(in srgb, var(--surface-hud) 82%, transparent);font-family:var(--font-mono);font-size:var(--text-xs);margin:0}.vote-notice[data-tone=warn]{border-color:var(--accent-warning);color:var(--text-primary)}.reward-burst{z-index:var(--z-toast);top:calc(var(--height-header) + var(--space-4));right:var(--space-6);width:min(23rem, calc(100vw - (var(--space-6) * 2)));border:1px solid var(--accent-victory);background:color-mix(in srgb, var(--surface-hud) 94%, transparent);box-shadow:0 0 28px color-mix(in srgb, var(--accent-victory) 35%, transparent);clip-path:polygon(0 0, calc(100% - var(--cut-corner)) 0, 100% var(--cut-corner), 100% 100%, var(--cut-corner) 100%, 0 calc(100% - var(--cut-corner)));animation:reward-burst 3.2s var(--ease-out) both;display:grid;position:fixed}.reward-burst[data-major=true]{border-color:var(--accent-primary);box-shadow:0 0 36px color-mix(in srgb, var(--accent-primary) 34%, transparent)}.reward-burst>header{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle);background:linear-gradient(90deg, var(--surface-cyan-soft), var(--surface-accent-soft));display:flex}.reward-burst>header span{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.1em}.reward-burst>header strong{color:var(--accent-victory);font-family:var(--font-display);letter-spacing:.04em}.reward-row{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle);grid-template-columns:2rem minmax(0,1fr);display:grid}.reward-row:last-child{border-bottom:0}.reward-row>i{color:var(--accent-secondary);font-size:var(--text-lg);text-align:center;text-shadow:0 0 12px var(--accent-secondary);font-style:normal}.reward-row>span{gap:1px;min-width:0;display:grid}.reward-row small{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:.1em;text-transform:uppercase}.reward-row strong{font-family:var(--font-display);font-size:var(--text-sm);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;overflow:hidden}.reward-level>i,.reward-level strong{color:var(--accent-victory)}.reward-achievement>i,.reward-achievement strong{color:var(--accent-primary)}@keyframes reward-burst{0%{opacity:0;transform:translateY(var(--space-4)) scale(.88)}10%,84%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(calc(var(--space-3) * -1)) scale(1)}}@media (max-width:840px){.reward-burst{top:calc(var(--height-header) + var(--space-3));right:var(--space-4);width:min(21rem, calc(100vw - (var(--space-4) * 2)))}}@media (prefers-reduced-motion:reduce){.reward-burst{animation:none}}
