/* ===== RIPPO Series 1 — premium character cards, Real Rip, Spin reel, Codex ===== */
:root{--w:220px;--t0:#9aa3b5;--t1:#19c39a;--t2:#3b8cff;--t3:#b05cff;--t4:#ffb400;--t5:#ff3d8b}
.pc{container-type:inline-size;--c:var(--t0);--mx:50%;--my:50%;--rx:0deg;--ry:0deg;position:relative;width:var(--w);aspect-ratio:540/804;border-radius:calc(var(--w)*.06);transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .15s ease-out;flex:none;user-select:none;-webkit-user-select:none}
.pc .in{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:#0d0d1f;border:2.2cqw solid var(--c);box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 0 2px #0d0d1f}
.pc img.art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pc .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,24,.55) 0,transparent 16%,transparent 52%,rgba(8,8,24,.94) 82%)}
.pc .tp{position:absolute;top:5%;left:6%;right:6%;display:flex;justify-content:space-between;align-items:center;gap:6px;font:700 5cqw "Space Mono",monospace;color:#fff;text-shadow:0 1px 3px #000}
.pc .tier{background:var(--c);color:#0d0d1f;padding:.15em .55em;border-radius:999px;letter-spacing:.06em;text-shadow:none}
.pc .el{opacity:.9}
.pc .bt{position:absolute;left:6%;right:6%;bottom:4.5%;color:#fff}
.pc .nm{font:8.3cqw/1.05 "Archivo Black",Impact,sans-serif;text-shadow:0 2px 0 rgba(0,0,0,.6);margin-bottom:.25em}
.pc .lore{font-size:4.3cqw;line-height:1.3;opacity:.86;margin-bottom:.45em;min-height:2.6em}
.pc .rw{display:flex;justify-content:space-between;align-items:flex-end;font-weight:700}
.pc .val{font:8.5cqw "Archivo Black",Impact,sans-serif;color:#fff;background:linear-gradient(90deg,var(--c),#fff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pc .ser{font-size:4.5cqw;opacity:.9;color:var(--c)}
.pc .cls{font-size:4cqw;opacity:.75}
.pc.mini .lore,.pc.mini .cls{display:none}
.pc.mini .nm{font-size:10cqw}
.pc.mini .tp{font-size:7cqw}
.pc.mini .val{font-size:11cqw}
.pc .holo,.pc .glare,.pc .spark{position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.pc .glare{background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.38),transparent 45%);mix-blend-mode:overlay;opacity:.7}
.t0{--c:var(--t0)}.t1{--c:var(--t1)}.t2{--c:var(--t2)}.t3{--c:var(--t3)}.t4{--c:var(--t4)}.t5{--c:var(--t5)}.t6{--c:var(--t5)}.t7{--c:var(--t0)}
/* Rare: holo shine that follows tilt */
.pc.t2 .holo,.pc.t3 .holo,.pc.t4 .holo,.pc.t5 .holo,.pc.t6 .holo{background:linear-gradient(115deg,transparent 25%,rgba(255,0,170,.35) 38%,rgba(0,255,230,.35) 46%,rgba(255,255,120,.35) 54%,rgba(120,120,255,.35) 62%,transparent 75%);background-size:250% 250%;background-position:var(--mx) var(--my);mix-blend-mode:color-dodge;opacity:.55}
/* Epic: animated foil sweep */
.pc.t3 .holo,.pc.t4 .holo,.pc.t5 .holo,.pc.t6 .holo{animation:pcfoil 3.2s linear infinite}
@keyframes pcfoil{0%{background-position:0% 0%}100%{background-position:250% 250%}}
.pc.t3 .in{box-shadow:0 0 24px rgba(176,92,255,.65),0 10px 30px rgba(0,0,0,.4)}
/* Mythic: gold frame + particles */
.pc.t4 .in{border-image:linear-gradient(135deg,#fff3b0,#ffb400,#8a5a00,#ffe27a,#ffb400) 1;border-radius:0}
.pc.t4,.pc.t4 .in{border-radius:4px}
.pc.t4 .in{box-shadow:0 0 34px rgba(255,180,0,.75),0 10px 30px rgba(0,0,0,.4)}
.pc .spark{overflow:hidden}
.pc .spark i{position:absolute;bottom:-6px;width:4px;height:4px;border-radius:50%;background:#fff6c2;box-shadow:0 0 6px 2px var(--c);animation:pcup 3s linear infinite;opacity:0}
@keyframes pcup{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-160cqw);opacity:0}}
/* Grail: full-art animated rainbow frame */
.pc.t5 .in,.pc.t6 .in{border:none;box-shadow:0 0 46px rgba(255,61,139,.8),0 0 90px rgba(80,160,255,.5)}
.pc.t5:before,.pc.t6:before{content:"";position:absolute;inset:calc(var(--w)*-.025);border-radius:calc(var(--w)*.075);background:conic-gradient(from var(--ang,0deg),#ff3d8b,#ffd23f,#3cffb4,#3b8cff,#b05cff,#ff3d8b);animation:pcspin 3s linear infinite;z-index:-1;filter:blur(1px)}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes pcspin{to{--ang:360deg}}
.pc.t5 img.art,.pc.t6 img.art{animation:pczoom 6s ease-in-out infinite alternate}
@keyframes pczoom{from{transform:scale(1)}to{transform:scale(1.06)}}
.pc.boost .tier:after{content:" ⚡"}
/* back */
.pcb{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 42%,#2b4bff 0,#151548 55%,#0b0b24 100%);border:calc(var(--w)*.03) solid #f6efe1;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.pcb:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,61,139,.45) 1.2px,transparent 1.5px);background-size:9px 9px}
.pcb img{width:52%;position:relative;filter:drop-shadow(0 4px 0 #ff3d8b)}
.pcb b{position:relative;font:calc(var(--w)*.12) "Archivo Black";color:#f6efe1;text-shadow:3px 2px 0 #ff3d8b;letter-spacing:.04em}
/* flip wrapper */
.fl{position:relative;width:var(--w);aspect-ratio:540/804;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.fl>.pc,.fl>.bk{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.fl>.pc{transform:rotateY(180deg)}
.fl>.bk{border-radius:calc(var(--w)*.06)}
.fl.open{transform:rotateY(180deg)}
/* silhouette (codex) */
.pc.sil img.art{filter:blur(7px) brightness(.32) saturate(.3);transform:scale(1.08)}
.pc.sil .nm,.pc.sil .lore,.pc.sil .val{filter:blur(0);opacity:.5}
.pc.sil .holo,.pc.sil .spark{display:none}

/* ===== overlay room ===== */
.room{position:fixed;inset:0;z-index:60;background:radial-gradient(circle at 50% 38%,#272866 0,#0e0e2a 60%,#05050f 100%);color:#fff;display:none;flex-direction:column;align-items:center;overflow:hidden;touch-action:none}
.room.on{display:flex}
.room .rbar{width:100%;display:flex;justify-content:space-between;align-items:center;padding:12px 14px;gap:8px;z-index:5}
.room .rbar .lbl{font:700 13px "Space Mono";opacity:.85}
.room .rbar button{padding:7px 14px;font-size:13px;box-shadow:2px 2px 0 var(--pink)}
.room .rstage{flex:1;width:100%;position:relative;display:flex;align-items:center;justify-content:center}
.room .rhint{position:absolute;bottom:18px;left:0;right:0;text-align:center;font:700 13px "Space Mono";opacity:.85;padding:0 16px;z-index:4}
.room .flash{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:3}
.room .flash.go{animation:rflash 1.1s ease-out}
@keyframes rflash{0%{opacity:0}10%{opacity:.95}100%{opacity:0}}
.room .rays{position:absolute;left:50%;top:50%;width:130vmax;height:130vmax;margin:-65vmax 0 0 -65vmax;will-change:transform;background:repeating-conic-gradient(from 0deg,var(--c) 0 6deg,transparent 6deg 18deg);opacity:0;mask:radial-gradient(circle,#000 0,transparent 55%);-webkit-mask:radial-gradient(circle,#000 0,transparent 55%);pointer-events:none;transition:opacity .6s}
.room .rays.on{opacity:.35;animation:rspin 14s linear infinite}
@keyframes rspin{to{transform:rotate(360deg)}}
.room .burst i{position:absolute;left:50%;top:50%;width:9px;height:9px;border-radius:2px;animation:rb 1.3s ease-out forwards;z-index:4}
@keyframes rb{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--x),var(--y)) rotate(540deg);opacity:0}}
.banner{position:absolute;top:8%;left:50%;transform:translateX(-50%) scale(.6);opacity:0;font:clamp(26px,7vw,54px) "Archivo Black";letter-spacing:.04em;color:#fff;text-shadow:0 0 18px var(--c),3px 3px 0 var(--c);white-space:nowrap;z-index:6;transition:all .5s cubic-bezier(.2,1.6,.4,1);pointer-events:none}
.banner.on{opacity:1;transform:translateX(-50%) scale(1)}
.banner.god{background:linear-gradient(90deg,#ff3d8b,#ffd23f,#3cffb4,#3b8cff,#b05cff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 12px #fff8)}
/* physical pack */
.rpack{position:relative;width:min(64vw,270px);aspect-ratio:.62;user-select:none;touch-action:none;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .2s}
.rpack .bod,.rpack .flap{position:absolute;left:0;right:0;background:linear-gradient(115deg,#ffd6ea 0%,#c8f4ff 18%,#fff4b0 34%,#ffc6f0 50%,#b9ccff 66%,#d9ffe8 82%,#ffd6ea 100%);background-size:300% 300%;background-position:var(--mx,50%) var(--my,50%);border:3px solid #1d1d3a}
.rpack .flap{top:0;height:15%;border-radius:12px 12px 0 0;border-bottom:none;z-index:3;transform-origin:0 100%;clip-path:polygon(0 0,100% 0,100% 88%,96% 100%,92% 88%,88% 100%,84% 88%,80% 100%,76% 88%,72% 100%,68% 88%,64% 100%,60% 88%,56% 100%,52% 88%,48% 100%,44% 88%,40% 100%,36% 88%,32% 100%,28% 88%,24% 100%,20% 88%,16% 100%,12% 88%,8% 100%,4% 88%,0 100%)}
.rpack .flap:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(29,29,58,.25) 0 2px,transparent 2px 7px)}
.rpack .bod{top:13%;bottom:0;border-radius:0 0 12px 12px;z-index:2;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.rpack .bod:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(43,75,255,.35) 1.2px,transparent 1.4px);background-size:7px 7px;mix-blend-mode:multiply}
.rpack .bod:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.8) var(--sx,45%),transparent 60%);mix-blend-mode:soft-light}
.rpack .bod img{width:62%;position:relative;z-index:1}
.rpack .bod .pn{font:clamp(22px,7vw,34px) "Archivo Black";color:#2b4bff;text-shadow:2px 2px 0 #ff3d8b;position:relative;z-index:1}
.rpack .bod .s1{position:relative;z-index:1;font:700 11px "Space Mono";background:#1d1d3a;color:#ffd23f;padding:2px 9px;border-radius:999px}
.rpack .tear{position:absolute;top:13.5%;left:0;height:4px;width:0;background:linear-gradient(90deg,#fff,#ffd23f);box-shadow:0 0 12px #ffd23f;z-index:4;border-radius:2px}
.rpack .grip{position:absolute;top:-2%;left:-4%;right:-4%;height:26%;z-index:5;cursor:ew-resize}
.rpack .arrow{position:absolute;top:3%;left:6%;z-index:6;font:700 12px "Space Mono";background:#1d1d3a;color:#ffd23f;padding:3px 9px;border-radius:999px;animation:rnudge 1.4s ease-in-out infinite;pointer-events:none;white-space:nowrap}
@keyframes rnudge{0%,100%{transform:translateX(0)}50%{transform:translateX(26px)}}
.rpack.torn .flap{animation:rflap .8s cubic-bezier(.3,.6,.4,1) forwards}
@keyframes rflap{to{transform:translate(70px,-130px) rotate(28deg);opacity:0}}
.rpack.torn .arrow,.rpack.torn .tear,.rpack.torn .grip{display:none}
.rpack.out .bod{animation:rdrop .7s ease-in forwards}
@keyframes rdrop{to{transform:translateY(120%) rotate(-4deg);opacity:0}}
/* card stack */
.stack{position:absolute;left:50%;top:50%;--w:min(72vw,40vh);width:var(--w);aspect-ratio:540/804;transform:translate(-50%,-50%)}
.stack .fl{position:absolute;inset:0;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .4s}
.stack .fl.rise{animation:rrise .8s cubic-bezier(.2,.9,.3,1) both}
@keyframes rrise{from{transform:translateY(55%) scale(.9)}to{transform:none}}
.stack .fl.gone{transform:translateX(130%) rotate(18deg) !important;opacity:0;pointer-events:none}
.stack .fl.gone.l{transform:translateX(-130%) rotate(-18deg) !important}
.stack .fl.open.gone{transform:translateX(130%) rotate(18deg) rotateY(180deg) !important}
.stack .fl.open.gone.l{transform:translateX(-130%) rotate(-18deg) rotateY(180deg) !important}
.stack .fl.charge .bk{animation:rcharge .5s ease-in-out infinite alternate;box-shadow:0 0 40px 8px var(--c)}
@keyframes rcharge{from{transform:scale(1) rotate(-.6deg)}to{transform:scale(1.03) rotate(.6deg)}}
.stack .fl.slow{transition:transform 1.6s cubic-bezier(.1,.9,.1,1)}
.slot{position:absolute;bottom:-34px;left:0;right:0;text-align:center;font:700 12px "Space Mono";opacity:.85}
/* summary */
.sum{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:12px;z-index:7;background:rgba(5,5,15,.78);}
.sum.on{display:flex}
.sum .row5{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:980px}
.sum .tot{font:clamp(20px,5vw,32px) "Archivo Black";text-align:center}
.sum .sub{font-size:12px;opacity:.85;text-align:center;max-width:560px}
.sum .btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.sum .x5c{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px}
.sum .x5c .pc{cursor:pointer;transition:opacity .3s,filter .3s,transform .15s}
.sum .x5c.noid .pc{cursor:default}
.sum .x5c .x5a{display:none;gap:6px}
.sum .x5c.ask .x5a{display:flex}
.sum .x5c.ask .pc{outline:3px solid #ffd23f;outline-offset:3px;border-radius:8px}
.sum .x5a button{padding:4px 10px;font-size:12px}
.sum .x5c .x5tag{display:none;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%) rotate(-14deg);z-index:9;font:clamp(16px,4vw,26px) "Archivo Black";color:#fff;background:#ff3d8b;border:2.5px solid #fff;border-radius:6px;padding:2px 12px;letter-spacing:.08em;pointer-events:none}
.sum .x5c.sold .x5tag{display:block}
.sum .x5c.sold .pc{opacity:.35;filter:grayscale(.8);cursor:default}
.sum .x5c.sold .x5a{display:none}
.sum #sSellAll.done{background:#19c39a;opacity:1}
.sum .hitwrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:center}
/* spin reel */
.reels{width:100%;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center}
.reel{position:relative;width:min(100%,1000px);height:var(--rh,250px);overflow:hidden;border-top:2px solid rgba(255,255,255,.15);border-bottom:2px solid rgba(255,255,255,.15);background:linear-gradient(90deg,#05050f 0,transparent 18%,transparent 82%,#05050f 100%),rgba(255,255,255,.03)}
.reel .strip{position:absolute;top:50%;left:0;display:flex;gap:var(--gap,10px);transform:translate3d(0,-50%,0);will-change:transform}
.reel .strip .pc{--w:var(--cw,140px)}
.reel .strip .pc.on .in{box-shadow:0 0 26px 6px var(--c)}
.reel .strip .pc .in{box-shadow:0 0 12px 1px color-mix(in srgb,var(--c) 70%,transparent)}
.reel .mark{position:absolute;left:50%;top:0;bottom:0;width:3px;margin-left:-1.5px;background:#ffd23f;box-shadow:0 0 14px #ffd23f;z-index:3}
.reel .mark.tk{animation:rtk .09s}
@keyframes rtk{50%{background:#fff;box-shadow:0 0 24px #fff}}
.reel .mark:before,.reel .mark:after{content:"";position:absolute;left:50%;margin-left:-9px;border:9px solid transparent}
.reel .mark:before{top:0;border-top-color:#ffd23f}
.reel .mark:after{bottom:0;border-bottom-color:#ffd23f}
.reel.done .strip .pc:not(.win){opacity:.35;transition:opacity .5s}
.bigrev{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:6}
.bigrev.on{display:flex}
.modepick{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.modepick button{padding:6px 12px;font-size:13px;box-shadow:2px 2px 0 var(--blue);background:var(--paper)}
.modepick button.on{background:var(--ink);color:var(--yellow)}
/* main-page showcase + grids */
.showcase{position:relative;height:500px;border:2.5px solid var(--ink);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);background:radial-gradient(circle at 50% 40%,#2b2c74 0,#0e0e2a 70%);display:flex;align-items:center;justify-content:center;cursor:pointer}
.showcase .fan{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.showcase .fan .pc{position:absolute;--w:150px;transition:transform .4s}
.showcase .rpack{z-index:3;width:190px;pointer-events:none}
.showcase .cta{position:absolute;bottom:14px;left:0;right:0;text-align:center;font:700 12px "Space Mono";color:#ffd23f;z-index:4}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.cgrid .pc{--w:100%;width:100%}
.cgrid .cell{position:relative}
.cgrid .cell .ck{position:absolute;top:8px;left:8px;z-index:5;width:20px;height:20px}
.cgrid .cell .ops{display:flex;justify-content:space-between;align-items:center;margin-top:6px;gap:6px}
.codex-h{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:10px}
.tierhead{margin:22px 0 10px;display:flex;align-items:center;gap:10px;font:20px "Archivo Black"}
.tierhead i{display:inline-block;width:16px;height:16px;border-radius:4px;background:var(--c);border:2px solid var(--ink)}
.cmodal{position:fixed;inset:0;z-index:70;background:rgba(5,5,15,.85);display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px}
.cmodal.on{display:flex}
.cmodal .pc{--w:min(78vw,340px)}
@media (max-width:860px){.showcase{height:400px}.reel{--rh:200px;--cw:110px}.hero img{display:none}.hero h1{font-size:34px}.hero p{font-size:13.5px}.hero{margin-bottom:12px}}
@media (prefers-reduced-motion:reduce){.pc .holo,.pc.t5:before,.room .rays.on{animation:none}}

/* perf: keep reels and stacks light */
.reel .pc .holo,.reel .pc .glare,.reel .pc .spark,.stack .fl:not(.open) .pc .holo,.stack .fl:not(.open) .pc .spark,.stack .fl:not(.open) .pc .glare{display:none}
.reel .pc.t5:before,.reel .pc.t6:before,.reel .pc img.art{animation:none}
.reel .strip .pc .in{box-shadow:none;border-color:var(--c)}
.reel .strip .pc.on .in{box-shadow:0 0 18px 4px var(--c)}
.rpack .bod:before,.rpack .bod:after{mix-blend-mode:normal}
.rpack .bod:before{opacity:.5}
.rpack .bod:after{opacity:.45}
.stack .fl{will-change:transform}
@media (hover:none){.pc .glare{display:none}.pc .spark i:nth-child(n+8){display:none}}
@media (prefers-reduced-motion:reduce){.room .rays.on,.pc .holo,.pc:before,.pc img.art{animation:none!important}}

/* waiting for the on-chain reveal: pack wobbles + glows */
.rpack.wait{animation:rpWait 1.1s ease-in-out infinite}
.rpack.wait .bod{box-shadow:0 0 0 3px #fff,0 0 34px 8px rgba(255,61,139,.55)}
@keyframes rpWait{0%,100%{transform:translateY(0) rotate(-2deg) scale(1)}25%{transform:translateY(-6px) rotate(2deg) scale(1.02)}50%{transform:translateY(0) rotate(-1.5deg) scale(1)}75%{transform:translateY(-4px) rotate(1.5deg) scale(1.015)}}
@media (prefers-reduced-motion:reduce){.rpack.wait{animation:none}}

/* ===== perf v8 (mobile Safari): page behind the rip room is hidden + paused ===== */
body.ripping>header,body.ripping>main,body.ripping>footer,body.ripping>.ticker,body.ripping>.demo-bar,body.ripping>nav{visibility:hidden}
body.ripping>header *,body.ripping>main *,body.ripping>.ticker *,body.ripping>.demo-bar *,body.ripping>nav *{animation-play-state:paused!important}
body.ripping:before,body.ripping:after{display:none}
/* reel cards: flat 2D, no per-card 3D layers, no blur/blend/animated glow while spinning */
.reel .pc{transform:none;transition:none;contain:layout style}
.reel .pc.t5:before,.reel .pc.t6:before{filter:none}
.reel .pc .val{background:none;-webkit-text-fill-color:currentColor}
.reel .mark{will-change:auto}
@media (hover:none),(max-width:700px){
  .reel.done .strip .pc:not(.win){transition:none}
  .room .rays{width:100vmax;height:100vmax;margin:-50vmax 0 0 -50vmax}
  .pc.t5:before,.pc.t6:before{filter:none}
  /* Epic+ foil sweep: no per-frame background-position repaint on phones; the shine still follows tilt */
  .pc.t3 .holo,.pc.t4 .holo,.pc.t5 .holo,.pc.t6 .holo{animation:none}
  .sum .pc .spark i:nth-child(n+5){display:none}
}
/* reduced motion: no rays, flash, burst, charge wobble or card sparkles */
.room.rm .rays,.room.rm .flash,.room.rm .burst{display:none}
.room.rm .stack .fl.charge .bk,.room.rm .rpack.wait{animation:none}
.room.rm .pc .spark,.room.rm .pc .holo{animation:none;display:none}
.room.rm .stack .fl,.room.rm .stack .fl.slow{transition-duration:.25s}
@media (prefers-reduced-motion:reduce){.ticker .track,.hero img,.pack .body,.pack .top,.pack .body:after,.pack .hint{animation:none!important}}

/* showcase (Packs stage): caption lives below the box; pack label on one line, pack fully inside the box */
.showcase .rpack{transform:translateY(70px)}
.showcase .cta{display:none}
.sc-cap{margin:8px 0 2px;text-align:center;font:700 11px/1.3 "Space Mono",monospace;color:var(--ink);opacity:.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rpack .bod .s1{white-space:nowrap;max-width:94%;overflow:hidden;text-overflow:ellipsis}
@media (max-width:860px){.showcase .rpack{width:170px;transform:translateY(46px)}.showcase .rpack .bod .s1{font-size:8.5px;padding:2px 6px;letter-spacing:-.03em}.showcase .rpack .bod .pn{font-size:22px;line-height:1;text-align:center}}