/* The pull reveal (SCAN §12 as V1_SCOPE S33; BUILD_PLAN_V1 U4): templates/scan/_reveal.html, driven by
   static/js/reveal.js, which sets the classes on .rv:
     rv-on · ph-intro (700 ms, the same for every card) · ph-wait (the claim is still in flight) ·
     ph-payoff · ph-done · rv-end (skipped) · tier-1..5 · lv-flip | lv-holo | lv-slam · rm (reduced motion).
   The effects are ported from home.css's pack hero (.po-card.r-*, .hit) with an rv prefix; home.css
   is untouched. Three levels (S33): flip (Common, Uncommon), holo sweep (Rare, Mythic; Mythic adds
   a 360 ms rumble: motion, not flashing), slam with the serial stamp (Legendary). Filmable: portrait
   first, the essential elements inside the central 80% of the width and 12-80% of the height, type
   >= 20 px. Safe: no flashing (every light effect is a slow sweep or a single soft pulse), no
   saturated-red flash, and a calm reduced-motion version (.rv.rm and the media query). */

.rv{position:fixed;inset:0;z-index:1000;overflow:hidden;color:#fff;text-align:center;
  -webkit-user-select:none;user-select:none;touch-action:manipulation;}
.rv[hidden],.rv [hidden]{display:none!important;}
.rv-bg{position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 36%,#241046 0%,#0c0716 70%);
  opacity:.97;transition:background-color .4s;}
.rv.tier-5 .rv-bg{background:#000;opacity:.92;}                       /* Legendary: backdrop to 92% black */

/* Legendary god-rays: slow conic rays at 0.25 rev/s */
.rv-rays{position:absolute;left:50%;top:34%;width:200vmax;height:200vmax;margin:-100vmax 0 0 -100vmax;
  pointer-events:none;opacity:0;transition:opacity .6s;
  background:repeating-conic-gradient(from 0deg,rgba(255,223,140,.15) 0deg 8deg,transparent 8deg 22.5deg);}
.rv.tier-5 .rv-rays{opacity:1;animation:rvRays 4s linear infinite;}
@keyframes rvRays{to{transform:rotate(360deg);}}

/* the filmable frame: central 80% of the width, from 12% of the height */
.rv-frame{position:absolute;left:10%;right:10%;top:calc(12% + 22px);bottom:3%;display:flex;flex-direction:column;
  align-items:center;gap:10px;}
.rv-mark{position:absolute;left:10%;right:10%;top:12%;font-family:'JetBrains Mono',monospace;font-size:13px;
  letter-spacing:4px;color:rgba(255,255,255,.62);}

/* the card: .rv-card turns in 3D; the back and the face are its two sides */
.rv-stage{position:relative;flex:none;height:min(36vh,calc(64vw * 532 / 380));aspect-ratio:380/532;cursor:pointer;}
.rv-stage::before{content:"";position:absolute;inset:-7px;border-radius:20px;border:3px solid transparent;
  pointer-events:none;transition:border-color .3s;}
.rv.tier-1 .rv-stage::before{border-color:rgba(255,255,255,.28);}
.rv.tier-2 .rv-stage::before{border-color:rgba(154,213,255,.55);}
.rv.tier-3 .rv-stage::before{border-color:rgba(227,193,90,.75);}
.rv.tier-4 .rv-stage::before{border-color:rgba(201,162,255,.8);}
.rv.tier-5 .rv-stage::before{border-color:rgba(255,215,90,.95);}
.rv-card{position:absolute;inset:0;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;}
.rv-back,.rv-scaler{position:absolute;top:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.rv-back{right:0;bottom:0;border-radius:14px;overflow:hidden;transform:rotateY(180deg);
  box-shadow:0 22px 40px rgba(0,0,0,.6);}
.rv-back img{display:block;width:100%;height:100%;object-fit:cover;}
.rv-scaler{width:380px;transform-origin:top left;isolation:isolate;pointer-events:none;
  filter:drop-shadow(0 22px 40px rgba(0,0,0,.6));}
.rv-art{display:block;width:380px;height:532px;object-fit:cover;border-radius:14px;}
.rv.ph-intro .rv-card,.rv.ph-wait .rv-card{transform:rotateY(180deg);}
.rv.ph-intro .rv-scaler,.rv.ph-wait .rv-scaler{visibility:hidden;}

/* intro (uniform): the back drops in and spins once; "THE PULL" */
.rv.ph-intro .rv-card{animation:rvDrop .7s cubic-bezier(.2,.8,.25,1) both;}
@keyframes rvDrop{
  0%{opacity:0;transform:translateY(-55vh) rotateY(-180deg) scale(.8);}
  55%{opacity:1;transform:translateY(0) rotateY(120deg) scale(1.02);}
  100%{opacity:1;transform:translateY(0) rotateY(180deg) scale(1);}}
.rv.ph-wait .rv-card{animation:rvHover 1.6s ease-in-out infinite;}
@keyframes rvHover{0%,100%{transform:rotateY(180deg) translateY(0);}50%{transform:rotateY(180deg) translateY(-8px);}}
.rv-intro{position:absolute;left:0;right:0;top:calc(min(36vh,calc(64vw * 532 / 380)) + 28px);margin:0;
  font-family:'Bebas Neue',sans-serif;
  font-size:44px;letter-spacing:6px;color:#e3c15a;opacity:0;transition:opacity .2s;}
.rv.ph-intro .rv-intro,.rv.ph-wait .rv-intro{opacity:1;}

/* the text block */
.rv-text{opacity:0;display:flex;flex-direction:column;align-items:center;gap:6px;max-width:100%;}
.rv.ph-payoff .rv-text,.rv.ph-done .rv-text{opacity:1;transition:opacity .3s .2s;}
.rv-rarity{margin:0;font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:42px;line-height:1;letter-spacing:3px;}
.rv.tier-1 .rv-rarity{color:#eae6f2;}
.rv.tier-2 .rv-rarity{color:#9ad5ff;}
.rv.tier-3 .rv-rarity{color:#e3c15a;}
.rv.tier-4 .rv-rarity{color:#c9a2ff;}
.rv.tier-5 .rv-rarity{color:#ffd75a;text-shadow:0 0 18px rgba(255,215,90,.55);}
.rv-name{margin:0;font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:1px;line-height:1.05;}
.rv-badges{margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;}
.rv-badge{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1.5px;color:#0d0a14;background:#e3c15a;
  padding:2px 10px;border-radius:14px;}
.rv-low{background:#f6f3ff;}
.rv-caption,.rv-meta,.rv-odds{margin:0;font-size:20px;line-height:1.2;}
.rv-caption{color:#f3ead6;}
.rv-odds{list-style:none;padding:0;color:#cdbf9c;}
.rv-meta{color:#e9dcc0;font-family:'JetBrains Mono',monospace;font-size:20px;}
.rv-share{max-width:100%;}
.rv-share p{margin:2px 0;font-size:20px;line-height:1.2;}
.rv-share-note{color:#9a8c6e;}
.rv-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding-bottom:env(safe-area-inset-bottom);}
.rv-actions .btn{min-width:120px;font-size:20px;}

/* the serial stamp (Legendary): "№ 12/40" slams in over the card */
.rv-stamp{position:absolute;right:-6%;bottom:8%;font-family:'Bebas Neue',sans-serif;font-size:40px;letter-spacing:2px;
  color:#ffd75a;padding:2px 12px;border:3px solid #ffd75a;border-radius:8px;transform:rotate(-8deg);
  background:rgba(0,0,0,.55);pointer-events:none;}
.rv-stamp:empty{display:none;}
.rv.ph-payoff.tier-5 .rv-stamp{animation:rvStamp .42s cubic-bezier(.2,1.6,.4,1) 1.25s both;}
@keyframes rvStamp{0%{opacity:0;transform:rotate(-8deg) scale(3);}100%{opacity:1;transform:rotate(-8deg) scale(1);}}

/* the ticker (Legendary): reveal.ticker scrolls */
.rv-ticker{position:absolute;left:0;right:0;top:5%;overflow:hidden;white-space:nowrap;pointer-events:none;
  font-family:'JetBrains Mono',monospace;font-size:14px;letter-spacing:3px;color:rgba(255,215,90,.8);}
.rv-ticker span{display:inline-block;padding-left:100%;}
.rv.tier-5 .rv-ticker span{animation:rvTicker 14s linear infinite;}
@keyframes rvTicker{to{transform:translateX(-100%);}}

/* ===== level 1: flip (Common, Uncommon) ===== */
.rv.ph-payoff.lv-flip .rv-card{animation:rvFlip .35s cubic-bezier(.2,.8,.2,1) both;}
@keyframes rvFlip{0%{transform:rotateY(180deg);}100%{transform:rotateY(0);}}
.rv.ph-payoff.tier-1 .rv-scaler{animation:rvPulse .5s ease-out .2s both;}               /* one soft white pulse */
@keyframes rvPulse{
  0%{filter:drop-shadow(0 22px 40px rgba(0,0,0,.6));}
  45%{filter:drop-shadow(0 0 18px rgba(255,255,255,.55)) drop-shadow(0 22px 40px rgba(0,0,0,.6));}
  100%{filter:drop-shadow(0 22px 40px rgba(0,0,0,.6));}}
/* the foil sweep: one diagonal pass (Uncommon), two holo passes (Rare, Mythic) */
.rv-scaler::after{content:"";position:absolute;inset:0;border-radius:14px;pointer-events:none;z-index:10;opacity:0;
  mix-blend-mode:screen;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 48%,transparent 60%);
  background-size:250% 100%;background-position:130% 0;}
.rv.ph-payoff.tier-2 .rv-scaler::after{animation:rvSheen .6s ease-in-out .3s both;}
@keyframes rvSheen{0%{opacity:1;background-position:130% 0;}100%{opacity:1;background-position:-50% 0;}}

/* ===== level 2: holo sweep (Rare, Mythic) ===== */
.rv.ph-payoff.lv-holo .rv-card{animation:rvFlipOver .5s cubic-bezier(.2,.8,.2,1) both;}
@keyframes rvFlipOver{
  0%{transform:rotateY(180deg) scale(1);}
  70%{transform:rotateY(-8deg) scale(1.03);}
  100%{transform:rotateY(0) scale(1);}}
.rv.ph-payoff.lv-holo .rv-scaler::after{
  background:linear-gradient(115deg,transparent 30%,rgba(255,58,216,.55) 42%,rgba(58,216,255,.6) 50%,
    rgba(248,255,77,.5) 58%,transparent 70%);background-size:250% 100%;mix-blend-mode:color-dodge;
  animation:rvHolo .55s ease-in-out .45s 2 both;}
@keyframes rvHolo{0%{opacity:1;background-position:130% 0;}100%{opacity:1;background-position:-50% 0;}}
/* the card's own foil on (cards.css .foil-on, per rarity) */
.rv.lv-holo .tcg-card[data-rarity="Rare"] .tcg-foil{opacity:.55;}
.rv.lv-holo .tcg-card[data-rarity="Mythic"] .tcg-foil,.rv.lv-slam .tcg-card[data-rarity="Mythic"] .tcg-foil{opacity:.72;}
.rv.lv-slam .tcg-card[data-rarity="Legendary"] .tcg-foil,.rv.lv-holo .tcg-card[data-rarity="Legendary"] .tcg-foil{opacity:.8;}
.rv.lv-holo .tcg-spec,.rv.lv-slam .tcg-spec{opacity:.5;}
/* Mythic: the rumble its captions name (±3 px, 6 cycles over 360 ms) */
.rv.ph-payoff.tier-4 .rv-stage{animation:rvRumble .36s linear .55s both;}
@keyframes rvRumble{
  0%,100%{transform:translate(0,0);}
  8.3%,41.6%,75%{transform:translate(-3px,1px);}
  25%,58.3%,91.6%{transform:translate(3px,-1px);}}

/* liquid chrome (Mythic, Legendary): home.css poChromeFlow / poMercury */
.rv.tier-4 .rv-scaler::before,.rv.tier-5 .rv-scaler::before{content:"";position:absolute;inset:0;border-radius:14px;
  pointer-events:none;z-index:9;mix-blend-mode:color-dodge;opacity:.42;
  background:repeating-linear-gradient(115deg,rgba(255,58,216,.9) 0%,rgba(180,77,255,.55) 3.5%,rgba(58,216,255,.9) 7.5%,
      rgba(58,255,194,.5) 11%,rgba(248,255,77,.9) 15%,rgba(255,122,58,.55) 19%,rgba(255,58,216,.9) 23%),
    linear-gradient(200deg,rgba(255,255,255,.9),rgba(40,40,60,.05) 45%,rgba(255,255,255,.7));
  background-size:300% 300%,260% 260%;
  animation:rvChromeFlow 4.2s cubic-bezier(.45,.05,.55,.95) infinite alternate;}
.rv.tier-4.ph-done .rv-scaler::after,.rv.tier-5 .rv-scaler::after{opacity:.55;mix-blend-mode:screen;filter:blur(.4px);
  background:radial-gradient(24% 14% at 30% 25%,rgba(255,255,255,.95) 30%,transparent 68%),
    radial-gradient(30% 16% at 75% 70%,rgba(255,255,255,.7) 25%,transparent 65%),
    linear-gradient(115deg,transparent 43%,rgba(255,255,255,.95) 49.5%,rgba(255,255,255,.15) 51%,transparent 57%);
  background-size:230% 230%,250% 250%,185% 185%;
  animation:rvMercury 5.6s ease-in-out infinite alternate;}
@keyframes rvChromeFlow{
  0%{background-position:0% 20%,0% 0%;}
  38%{background-position:52% 65%,60% 40%;}
  62%{background-position:41% 38%,45% 75%;}
  100%{background-position:100% 80%,100% 100%;}}
@keyframes rvMercury{
  0%{background-position:0% 0%,100% 100%,-30% -30%;}
  45%{background-position:65% 40%,42% 68%,55% 45%;}
  70%{background-position:38% 72%,60% 30%,80% 70%;}
  100%{background-position:100% 100%,0% 0%,130% 130%;}}

/* ===== level 3: slam (Legendary): 2x -> 1x, chrome + cycling aura ===== */
.rv.ph-payoff.lv-slam .rv-card{animation:rvSlam .9s cubic-bezier(.2,1.25,.4,1) both;}
@keyframes rvSlam{
  0%{opacity:0;transform:rotateY(180deg) scale(2);}
  35%{opacity:1;transform:rotateY(0) scale(2);}
  100%{opacity:1;transform:rotateY(0) scale(1);}}
.rv.tier-5 .rv-scaler{animation:rvChaseGlow 3.4s ease-in-out infinite;}
.rv.tier-5 .rv-scaler::before{opacity:.55;animation-duration:3s;}
.rv.tier-5 .rv-scaler::after{opacity:.7;animation-duration:3.8s;}
@keyframes rvChaseGlow{
  0%,100%{filter:drop-shadow(0 0 26px rgba(255,58,216,.8)) drop-shadow(0 16px 34px rgba(0,0,0,.55));}
  33%{filter:drop-shadow(0 0 30px rgba(58,216,255,.85)) drop-shadow(0 16px 34px rgba(0,0,0,.55));}
  66%{filter:drop-shadow(0 0 30px rgba(248,255,77,.8)) drop-shadow(0 16px 34px rgba(0,0,0,.55));}}

/* foil scraps: each flight path is fixed (no randomness); reveal.js only fires them */
.rv-scrap{position:absolute;left:50%;top:45%;width:11px;height:8px;z-index:9;pointer-events:none;opacity:0;
  border-radius:1px;background:linear-gradient(115deg,#ff9ad5,#9ad5ff 45%,#fff6c8);}
.rv-scrap.fly{animation:rvScrapFly .8s ease-out forwards;}
@keyframes rvScrapFly{
  0%{opacity:1;transform:translate(0,0) rotate(0deg) scale(1);}
  100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(.45);}}
.rv-scrap:nth-of-type(1){--dx:-120px;--dy:-150px;--r:-200deg;}
.rv-scrap:nth-of-type(2){--dx:110px;--dy:-170px;--r:180deg;}
.rv-scrap:nth-of-type(3){--dx:-60px;--dy:-210px;--r:120deg;}
.rv-scrap:nth-of-type(4){--dx:70px;--dy:-120px;--r:-150deg;}
.rv-scrap:nth-of-type(5){--dx:-150px;--dy:-60px;--r:210deg;}
.rv-scrap:nth-of-type(6){--dx:150px;--dy:-80px;--r:-190deg;}
.rv-scrap:nth-of-type(7){--dx:-20px;--dy:-230px;--r:90deg;}
.rv-scrap:nth-of-type(8){--dx:30px;--dy:-180px;--r:-110deg;}
.rv-scrap:nth-of-type(9){--dx:-100px;--dy:-190px;--r:160deg;}
.rv-scrap:nth-of-type(10){--dx:120px;--dy:-130px;--r:-220deg;}
.rv-scrap:nth-of-type(11){--dx:-170px;--dy:-120px;--r:140deg;}
.rv-scrap:nth-of-type(12){--dx:170px;--dy:-150px;--r:-130deg;}
.rv-scrap:nth-of-type(13){--dx:-40px;--dy:-140px;--r:200deg;}
.rv-scrap:nth-of-type(14){--dx:50px;--dy:-220px;--r:-170deg;}

/* skipped: every one-shot ends at once (the loops keep going) */
.rv.rv-end .rv-scrap{animation:none;opacity:0;}

/* ===== reduced motion: 200 ms crossfades, a static rarity frame, a static ticker ===== */
.rv.rm .rv-card,.rv.rm.ph-intro .rv-card,.rv.rm.ph-wait .rv-card{transform:none;animation:none!important;}
.rv.rm .rv-back{transform:none;backface-visibility:visible;-webkit-backface-visibility:visible;}
.rv.rm.ph-intro .rv-back{animation:rvFadeIn .2s ease both;}
.rv.rm.ph-payoff .rv-back{animation:rvFadeOut .2s ease both;}
.rv.rm.ph-done .rv-back{opacity:0;}
.rv.rm.ph-payoff .rv-scaler{animation:rvFadeIn .2s ease both!important;}
.rv.rm .rv-stage,.rv.rm .rv-stamp,.rv.rm .rv-scaler,.rv.rm .rv-scaler::before,.rv.rm .rv-scaler::after,
.rv.rm .rv-ticker span,.rv.rm .rv-rays{animation:none!important;}
.rv.rm .rv-rays,.rv.rm .rv-scrap,.rv.rm .rv-scaler::after{display:none;}
.rv.rm .rv-ticker span{padding-left:0;}
.rv.rm .rv-text{transition:opacity .2s;}
@keyframes rvFadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes rvFadeOut{from{opacity:1;}to{opacity:0;}}
@media (prefers-reduced-motion:reduce){
  .rv .rv-card,.rv .rv-stage,.rv .rv-stamp,.rv .rv-scaler,.rv .rv-scaler::before,.rv .rv-scaler::after,
  .rv .rv-ticker span,.rv .rv-rays,.rv .rv-scrap{animation:none!important;}
  .rv .rv-rays,.rv .rv-scrap{display:none;}}

@media (min-aspect-ratio:1/1){                       /* landscape / desktop: keep the portrait column */
  .rv-frame,.rv-mark{left:calc(50% - 28vh);right:calc(50% - 28vh);}}
