/* Spectacle pass: vivid neon palette, ambient aurora, flowing highlights and
   the overlay used by src/spectacle.js. Loaded last; layout sizes are unchanged. Ambient
   loops are finite so an idle page stops producing frames.
   Low effects and reduced motion keep every static colour but no motion. */
:root{--sp-cyan:#22f0ff;--sp-blue:#3d8bff;--sp-violet:#9b5cff;--sp-magenta:#ff3df2;--sp-pink:#ff4d8d;--sp-gold:#ffd23f;--sp-orange:#ff8a1f;--sp-mint:#2fe0c0;
 --blue:#4fb8ff;--purple:#c06bff;--gold:#ffcc4a;--cyan:#2ff3ff;--green:#5ff0c0;--red:#ff3d5e}
@property --sp-shift{syntax:'<percentage>';inherits:false;initial-value:0%}

/* ---- ambient aurora: one composited, slowly drifting fixed layer ---- */
/* Static on purpose: full-viewport layers must not animate every frame. */
body:before{background:
 radial-gradient(38% 32% at 18% 24%,#2b7bff30,transparent 70%),
 radial-gradient(34% 30% at 82% 18%,#c13dff2b,transparent 70%),
 radial-gradient(44% 38% at 72% 86%,#00e5c424,transparent 70%),
 radial-gradient(38% 34% at 14% 84%,#ff3d8a22,transparent 70%),
 radial-gradient(ellipse at 50% 45%,#12202c40,transparent 56%),
 repeating-linear-gradient(0deg,transparent 0 3px,#8eb4cb06 3px 4px);
 }
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.45;background:
 radial-gradient(1.5px 1.5px at 12% 22%,#9bfcff,transparent),radial-gradient(1.5px 1.5px at 76% 14%,#ffd0ff,transparent),
 radial-gradient(1px 1px at 44% 68%,#fff3b0,transparent),radial-gradient(1.5px 1.5px at 88% 72%,#9bfcff,transparent),
 radial-gradient(1px 1px at 26% 82%,#ffb0e8,transparent),radial-gradient(1px 1px at 62% 34%,#ffffff,transparent),
 radial-gradient(1px 1px at 6% 52%,#d6b3ff,transparent),radial-gradient(1.5px 1.5px at 94% 44%,#ffe58a,transparent);
}

/* ---- neon frames: static glow, tinted per region ---- */
.game-shell .frame{--sp-glow:#22f0ff;box-shadow:inset 0 0 0 2px #020304,inset 0 0 0 3px color-mix(in srgb,var(--sp-glow) 38%,transparent),0 0 .9rem -.45rem var(--sp-glow)}
.game-shell .left-rail .frame{--sp-glow:#8f5cff}
.game-shell .right-rail.frame,.game-shell .right-rail .frame{--sp-glow:#ff4dd2}
.game-shell #current-room{--sp-glow:#22f0ff}
.game-shell .status-strip.frame{--sp-glow:#ffb02e}
.game-shell[data-scene=loot] #current-room,.game-shell[data-scene=chest] #current-room{--sp-glow:#ffd23f}
.game-shell .boss-screen{--sp-glow:#ff2d55}
.game-shell #current-room:has(.boss-screen){--sp-glow:#ff2d55}

.section-label{color:#e4f8ff;text-shadow:0 0 .55rem #22f0ff66,0 0 1.2rem #b84dff33}
.section-label>span{color:#9fb6dc}

/* ---- primary action: neon gradient, glow and tactile press ----
   Idle motion is compositor-only (transform/opacity). Paint-driven loops
   (background-position, box-shadow, color) would repaint every frame. */
.primary-control>.primary{background:linear-gradient(100deg,#062b3d 0%,#0b4a6a 30%,#3a1d6e 55%,#0b4a6a 80%,#062b3d 100%);
 border-color:#4af3ff;color:#e9fdff;text-shadow:0 0 .5rem #22f0ffaa;
 box-shadow:inset 0 0 0 2px #02080b,inset 0 0 0 3px #57e4e955,0 0 1.2rem -.2rem #22f0ff99,0 0 2.6rem -1rem #b84dff;
 transition:transform .12s cubic-bezier(.3,1.6,.5,1),box-shadow .2s,filter .2s}
.primary-control>.primary:hover:not(:disabled){transform:translateY(-1px) scale(1.015);filter:brightness(1.18) saturate(1.2);box-shadow:inset 0 0 0 2px #02080b,inset 0 0 0 3px #9bfcff88,0 0 1.8rem 0 #22f0ffaa,0 0 3.4rem -.6rem #ff3df2}
.primary-control>.primary:active:not(:disabled){transform:translateY(1px) scale(.975);filter:brightness(1.35)}
.primary-control>.primary:disabled{filter:saturate(.6) brightness(.85)}
button:not(.primary):hover:not(:disabled){text-shadow:0 0 .45rem currentColor}

/* ---- bars: vivid fills with a travelling gloss ---- */
.health-track>span{position:relative;z-index:1;background:linear-gradient(180deg,#ffffff55 0 14%,transparent 16% 70%,#0000004d 74%),linear-gradient(90deg,#ff1f6b,#ff2d3d 45%,#ff7a1a);box-shadow:0 0 .9rem #ff2d5580}
.boss-screen .health-track>span{background:linear-gradient(180deg,#ffffff55 0 14%,transparent 16% 70%,#0000004d 74%),linear-gradient(90deg,#b81dff,#ff2d55 50%,#ffb01a);box-shadow:0 0 1.2rem #ff2dc080}
.health-track{overflow:hidden}
/* Only on a settled room: fast pace waits for finite animations inside an
   owned reveal, and an ambient gloss must never lengthen that wait. */
#current-room:not(.busy) .health-track:after{content:"";position:absolute;z-index:1;left:0;top:3px;bottom:3px;width:28%;pointer-events:none;background:linear-gradient(100deg,transparent,#ffffff45 50%,transparent);transform:translateX(-110%);animation:sp-gloss 2.6s cubic-bezier(.5,0,.3,1) .6s 2}
@keyframes sp-gloss{to{transform:translateX(380%)}}
.sp-ghost{position:absolute;background:linear-gradient(90deg,#fff6d0,#ffd36b);box-shadow:0 0 .8rem #ffd36b;pointer-events:none}
.sp-hitflash{position:absolute;pointer-events:none;opacity:0;background:#ffffff1f;box-shadow:inset 0 0 0 2px #ffffffcc,0 0 1.2rem #ffffff88,-3px 0 0 #ff2d5599,3px 0 0 #22f0ff99}
.shield-fill{background:repeating-linear-gradient(90deg,#b84dff 0 .8rem,#5a2bd6 .8rem .9rem);opacity:.85;box-shadow:0 0 .7rem #a344ff88}
.player-health-track>span{background:linear-gradient(90deg,#ff1f6b,#ff4d6d 60%,#ff8a5c);box-shadow:0 0 .7rem #ff2d5580}
.xp-track>span{background:linear-gradient(90deg,#22f0ff,#5ff0c0 50%,#b4ff6a);box-shadow:0 0 .7rem #22f0ffaa}
.player-gold strong{background:linear-gradient(180deg,#fff6c2,#ffd23f 50%,#ff9a1f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 .35rem #ffb02e88)}

/* ---- route ---- */
.route-list li.current .route-node{box-shadow:0 0 0 1px #ff3d6e,0 0 1rem #ff3d6e,0 0 2rem -.3rem #ff3df2}
.route-list li.done .route-node{box-shadow:0 0 .6rem -.1rem #2fe0c0;border-color:#2fe0c0;color:#9fffe9}

/* ---- dice energy colours (also feed the WebGL material) ---- */
.cube-die:not(.resonant):not(.critical-die):not(.charged){color:#bff4ff}
.cube-die.resonant{color:#ffcc2e}
.cube-die.critical-die{color:#ff3b6b}
.cube-die.charged{color:#33c8ff}
.roll-caption{background:linear-gradient(90deg,#9bfcff,#ffffff 40%,#ffb0f0);-webkit-background-clip:text;background-clip:text;color:transparent}
.major-resonance .roll-caption,.combat-screen:is([data-impact=critical],[data-impact=finish]) .roll-caption{background:linear-gradient(90deg,#ffd23f,#ff3df2 50%,#22f0ff);-webkit-background-clip:text;background-clip:text}

/* ---- rarity: high tiers glow (static, so long inventories stay cheap) ---- */
:is(.loot-reveal .item-card,.equipped-item):is(.legendary,.mythic,.ancient,.origin,.eternal) h3{background:linear-gradient(90deg,var(--rarity,var(--gold)) 0%,#ffffff 30%,var(--rarity,var(--gold)) 60%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
:is(.item-card,.equipped-item).legendary{--rarity:#ffcc4a}
:is(.loot-reveal .item-card,.equipped-item).eternal h3{background:linear-gradient(90deg,#ff4d6d,#ffd23f,#5ff0c0,#22f0ff,#b84dff,#ff4d6d);-webkit-background-clip:text;background-clip:text}
:is(.item-card,.equipped-item):is(.legendary,.mythic,.ancient,.origin,.eternal){box-shadow:0 0 1.2rem -.4rem var(--rarity,var(--gold)),inset 0 0 2rem -1.4rem var(--rarity,var(--gold))}

/* ---- overlay used by spectacle.js ---- */
.spectacle-layer{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}
.spectacle-fx{position:absolute;left:0;top:0;width:100%;height:100%;display:none}
.spectacle-fx.active{display:block}
.sp-flash,.sp-vignette{position:absolute;inset:0;opacity:0;pointer-events:none}
.sp-tint{position:absolute;opacity:0;pointer-events:none}
.sp-pop{position:absolute;left:0;top:0;white-space:nowrap;pointer-events:none;will-change:transform,opacity;
 font:400 1.6rem/1 var(--font-display);letter-spacing:.06em;--sp-pop:#e9fdff;--sp-pop-glow:#22f0ff;color:var(--sp-pop);
 -webkit-text-stroke:.06em #05070c;paint-order:stroke fill;
 text-shadow:0 0 .18em #fff,0 0 .45em var(--sp-pop-glow),0 0 1.1em var(--sp-pop-glow),.06em .08em 0 #05070c}
.sp-damage{font-size:3.2rem;font-style:italic;letter-spacing:-.02em}
.sp-tag{font-size:2.3rem;letter-spacing:.14em}
.sp-cyan{--sp-pop:#b8fbff;--sp-pop-glow:#22d8ff}
.sp-gold{--sp-pop:#ffe680;--sp-pop-glow:#ff9a1f}
.sp-magenta{--sp-pop:#ffb3f7;--sp-pop-glow:#ff3df2}
.sp-crit{--sp-pop:#ff8fa3;--sp-pop-glow:#ff2d55;font-size:2.8rem}
.sp-damage.sp-crit{font-size:4.2rem}
.sp-finish{--sp-pop:#fff1b0;--sp-pop-glow:#ffb02e;font-size:3.1rem}
.sp-damage.sp-finish{font-size:4.6rem}
.sp-follow{--sp-pop:#bfe3ff;--sp-pop-glow:#3d8bff;font-size:2.4rem}
.sp-rainbow,.sp-rarity-7{animation:sp-rainbow-text .9s linear 2}
@keyframes sp-rainbow-text{0%{color:#ff7a90;--sp-pop-glow:#ff2d55}25%{color:#ffe680;--sp-pop-glow:#ff9a1f}50%{color:#8affd9;--sp-pop-glow:#22f0c0}75%{color:#9bd8ff;--sp-pop-glow:#3d8bff}100%{color:#e3b3ff;--sp-pop-glow:#b84dff}}
.sp-rarity-2{--sp-pop:#e6c2ff;--sp-pop-glow:#b05cff}
.sp-rarity-3{--sp-pop:#ffe680;--sp-pop-glow:#ff9a1f}
.sp-rarity-4{--sp-pop:#ffa3ae;--sp-pop-glow:#ff2d70}
.sp-rarity-5{--sp-pop:#a6ffec;--sp-pop-glow:#22d8b8}
.sp-rarity-6{--sp-pop:#fff4cc;--sp-pop-glow:#ffc861}

/* ---- software rendering (no GPU): same colours, no large blurs ---- */
html[data-renderer=software] .game-shell .frame{box-shadow:inset 0 0 0 2px #020304,inset 0 0 0 3px color-mix(in srgb,var(--sp-glow) 45%,transparent)}
html[data-renderer=software] :is(.health-track>span,.player-health-track>span,.xp-track>span,.shield-fill){box-shadow:none}
html[data-renderer=software] .primary-control>.primary{box-shadow:inset 0 0 0 2px #02080b,inset 0 0 0 3px #57e4e988}
html[data-renderer=software] .route-list li.current .route-node{box-shadow:0 0 0 1px #ff3d6e}
html[data-renderer=software] :is(.item-card,.equipped-item):is(.legendary,.mythic,.ancient,.origin,.eternal){box-shadow:none}
html[data-renderer=software] .sp-pop{text-shadow:.06em .08em 0 #05070c}
html[data-renderer=software] .health-track:after{display:none}

/* ---- comfort settings ---- */
html[data-effects=low] .spectacle-layer{display:none}
html[data-effects=low] .health-track:after,html[data-effects=low] .primary-control>.primary{animation:none}
@media (prefers-reduced-motion:reduce){.spectacle-layer{display:none}.health-track:after,.primary-control>.primary{animation:none!important}}