/* Mythic reveal (mythic-reveal.js): the item rises at the centre of the screen in its own colours. Above the scene and
   the HUD, never catching the pointer; no filters, no blend modes, transform/opacity animations only. */
.mythic-reveal{position:fixed;inset:0;z-index:90;pointer-events:none;overflow:hidden;
 --c1:#fff3c8;--c2:#ffcf5a;--c3:rgb(255 170 40);--core:#fffdf2;--txt:#fff1c4}
.mythic-reveal[hidden]{display:none}
.mythic-reveal[data-theme=eclipse]{--c1:#f0b8ff;--c2:#d4143c;--c3:rgb(150 40 210);--core:#050206;--txt:#f3c6ff}
.mythic-reveal[data-theme=ember]{--c1:#ffd9a0;--c2:#ff6a1a;--c3:rgb(200 40 10);--core:#fff2dc;--txt:#ffcf94}
.mythic-reveal[data-theme=venom]{--c1:#ffc2d6;--c2:#e0245e;--c3:rgb(120 10 50);--core:#ffe8ef;--txt:#ffb3cb}
.mythic-reveal[data-theme=frost]{--c1:#e6f9ff;--c2:#5fd0ff;--c3:rgb(40 110 200);--core:#f5fdff;--txt:#c8f1ff}
.mythic-reveal[data-theme=blood]{--c1:#ffc0b8;--c2:#d4111d;--c3:rgb(110 0 10);--core:#ffe9e6;--txt:#ffaaa2}
.mythic-reveal>i,.mythic-reveal .mr-item,.mythic-reveal .mr-sparks,.mythic-reveal .mr-motes{position:absolute;left:50%;top:44%}
/* 1. flash */
.mythic-reveal .mr-flash{left:0;top:0;width:100%;height:100%;opacity:0;
 background:radial-gradient(circle at 50% 44%,var(--c1) 0,color-mix(in srgb,var(--c2) 70%,transparent) 18%,color-mix(in srgb,var(--c3) 35%,transparent) 42%,transparent 70%)}
/* 2. shockwaves */
.mythic-reveal .mr-ring{width:22vmin;height:22vmin;border-radius:50%;opacity:0;border:.5vmin solid var(--c1);
 box-shadow:0 0 3vmin var(--c2),inset 0 0 3vmin var(--c2);will-change:transform,opacity}
/* 3. rays and corona behind the item */
.mythic-reveal .mr-rays{width:120vmin;height:120vmin;opacity:0;transform:translate(-50%,-50%);will-change:transform,opacity;
 background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--c1) 80%,transparent) 0deg 3deg,transparent 3deg 12deg);
 -webkit-mask:radial-gradient(circle,#000 0,#000 18%,rgb(0 0 0 / .55) 34%,transparent 66%);mask:radial-gradient(circle,#000 0,#000 18%,rgb(0 0 0 / .55) 34%,transparent 66%)}
.mythic-reveal .mr-corona{width:54vmin;height:54vmin;border-radius:50%;opacity:0;will-change:transform,opacity;
 background:radial-gradient(circle,var(--core) 0,var(--core) 30%,var(--c1) 36%,color-mix(in srgb,var(--c2) 80%,transparent) 44%,color-mix(in srgb,var(--c3) 40%,transparent) 58%,transparent 72%)}
/* the eclipse: a black disc with a crimson corona and violet light */
.mythic-reveal[data-theme=eclipse] .mr-corona{background:radial-gradient(circle,var(--core) 0,var(--core) 33%,#ff3b5c 35%,var(--c2) 40%,color-mix(in srgb,var(--c3) 75%,transparent) 50%,color-mix(in srgb,var(--c3) 30%,transparent) 62%,transparent 74%)}
.mythic-reveal[data-theme=eclipse] .mr-rays{background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--c2) 80%,transparent) 0deg 2deg,transparent 2deg 9deg,color-mix(in srgb,var(--c3) 70%,transparent) 9deg 11deg,transparent 11deg 18deg)}
/* 4. the item */
.mythic-reveal .mr-item{width:36vmin;height:36vmin;opacity:0;transform:translate(-50%,-50%);will-change:transform,opacity}
.mythic-reveal .mr-item img{position:relative;display:block;width:100%;height:100%;object-fit:contain}
.mythic-reveal .mr-aura{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c1) 70%,transparent) 0,color-mix(in srgb,var(--c3) 30%,transparent) 45%,transparent 70%);will-change:transform,opacity}
/* 5. sparks and motes */
.mythic-reveal .mr-sparks,.mythic-reveal .mr-motes{width:0;height:0}
.mythic-reveal .mr-sparks>i{position:absolute;left:0;top:0;width:1.1vmin;height:1.1vmin;border-radius:50%;opacity:0;background:var(--c1);box-shadow:0 0 1.4vmin .3vmin var(--c2);will-change:transform,opacity}
.mythic-reveal .mr-sparks>i:nth-child(3n){background:var(--c2);box-shadow:0 0 1.4vmin .3vmin var(--c3)}
.mythic-reveal .mr-motes>i{position:absolute;left:0;top:0;width:.7vmin;height:.7vmin;border-radius:50%;opacity:0;background:var(--c1);box-shadow:0 0 1vmin var(--c2);will-change:transform,opacity}
/* 6. the words */
.mythic-reveal .mr-text{position:absolute;left:50%;top:calc(44% + 22vmin);opacity:0;transform:translate(-50%,0);display:flex;flex-direction:column;align-items:center;gap:.6vmin;width:min(90vw,70rem);text-align:center}
.mythic-reveal .mr-rarity{font:700 clamp(1.1rem,2.4vmin,2rem)/1 'Optimus Princeps',Georgia,serif;letter-spacing:.1em;color:var(--txt);text-shadow:0 0 .5em var(--c2),0 0 1.2em var(--c3)}
.mythic-reveal .mr-name{font:normal clamp(2rem,6vmin,4.6rem)/1.05 'Optimus Princeps',Georgia,serif;color:var(--txt);
 text-shadow:0 .08em 0 #000,0 0 .25em var(--c2),0 0 .8em var(--c3),0 0 1.6em var(--c3)}