/* ================= MOB RAID (js/slots/raid.js) ================= */
@font-face{font-family:'RD Pixel';src:url(../assets/fonts/Silkscreen-Bold.ttf) format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:'RD Pixel';src:url(../assets/fonts/Silkscreen-Regular.ttf) format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'RD Num';src:url(../assets/fonts/PressStart2P-Regular.ttf) format('truetype');font-display:swap}
/* every control lives inside the machine: the site's shared bar and header favorite are not used on this page */
#v-raid > .gbar,#v-raid .ghead .gfav{display:none}
#v-raid img.px,.rd-info img.px{image-rendering:pixelated;image-rendering:crisp-edges}
.slotview .rd-game{border-radius:var(--r);overflow:hidden;border:1px solid #3a2c4c;box-shadow:0 24px 50px -30px #000,inset 0 0 0 1px #ffffff0a}
.rd-stage{--gold:#ffd86a;--ink:#0d0a14;--plate:#140f1fe6;--edge:#3d3150;position:relative;display:flex;flex-direction:column;
  height:clamp(560px, calc(var(--vh, 1vh) * 100 - var(--head) - 84px), 920px);overflow:hidden;isolation:isolate;user-select:none;-webkit-user-select:none;
  background:#0d0a14}   /* purple machine frame; the arena canvas (drawBg) draws the brick stage over the middle only */

/* top: logo, route strip, next boss */
.rd-top{display:flex;align-items:center;gap:14px;padding:8px 14px;background:linear-gradient(#191325,#110c1d);border-bottom:2px solid #2c2140;min-height:58px}
.rd-logo{display:flex;flex-direction:column;line-height:.9;font-family:'RD Pixel',Silkscreen,monospace;font-weight:700;font-size:20px;letter-spacing:.04em;
  filter:drop-shadow(0 3px 0 #000)}
.rd-logo b:first-child{color:#ff8a46}.rd-logo b:last-child{color:#fff}
.rd-route{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-width:0}
.rd-rgrp{display:flex;align-items:center;gap:4px}
.rd-rsep{width:10px;height:2px;background:#4a3a60;flex:none}
.rd-realm{font-family:'RD Pixel',Silkscreen,monospace;font-size:10px;font-weight:700;letter-spacing:.06em;color:#9a8fb4;margin-right:3px;writing-mode:horizontal-tb}
.rd-realm.r0{color:#9fd48a}.rd-realm.r1{color:#ff9a6a}.rd-realm.r2{color:#5fe0d0}.rd-realm.r3{color:#d0b0ff}
.rd-chip{position:relative;width:38px;height:38px;border-radius:6px;background:#0b0812;border:2px solid #3a2e4e;display:grid;place-items:center;overflow:hidden;transition:transform .2s,border-color .2s,opacity .2s}
.rd-chip img{max-width:84%;max-height:84%;object-fit:contain}
.rd-chip.boss{width:44px;height:44px;border-color:#9a7426;background:#1a1208}
.rd-chip.boss::after{content:'';position:absolute;top:1px;left:50%;width:14px;height:5px;transform:translateX(-50%);background:var(--gold);
  clip-path:polygon(0 100%,0 0,25% 60%,50% 0,75% 60%,100% 0,100% 100%)}
.rd-chip.cur{border-color:#fff;transform:translateY(-2px);box-shadow:0 0 0 2px #ff8a4688,0 6px 14px -4px #ff8a46aa}
.rd-chip.done{opacity:.42}
.rd-chip.done img{filter:grayscale(1)}
.rd-ck{display:none;position:absolute;inset:auto 2px 2px auto;width:12px;height:12px;border-radius:3px;background:#3ac06a}
.rd-ck::before{content:'';position:absolute;left:3px;top:1px;width:4px;height:7px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(40deg)}
.rd-chip.done .rd-ck{display:block}
.rd-next{min-width:118px;text-align:right;font-family:'RD Pixel',Silkscreen,monospace;line-height:1.1}
.rd-next b{display:block;color:var(--gold);font-size:13px}
.rd-next small{color:#b0a6c8;font-size:10px}

/* arena: canvas + HUD overlays */
.rd-arena{position:relative;flex:1 1 auto;min-height:0}
.rd-arena canvas{position:absolute;left:0;top:0;display:block}
.rd-ups{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:4px;padding:6px 6px 7px;border-radius:10px;pointer-events:auto;
  background:linear-gradient(#171124,#0e0a18);border:1px solid #352a4e;box-shadow:0 10px 20px -12px #000,inset 0 1px 0 #ffffff12}
.rd-ups::before{content:'GEAR';text-align:center;font:700 10px/1 'RD Pixel',Silkscreen,monospace;letter-spacing:.14em;color:#9c8fc0;padding:1px 0 3px}
.rd-up{display:flex;flex-direction:row;align-items:center;gap:8px;width:158px;padding:4px 9px 4px 5px;border-radius:8px;background:#1d1733;border:1px solid #3a2e52;opacity:.5;overflow:hidden;transition:opacity .2s,border-color .2s,box-shadow .2s}
.rd-up.on{opacity:1;border-color:#b48cff;background:#241a40;box-shadow:inset 0 0 0 1px #b48cff44,0 0 10px -5px #b48cff}
.rd-upi{flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:6px;background:#0c0814;overflow:hidden}
.rd-upi img{max-width:31px;max-height:31px;width:auto;height:auto;object-fit:contain}.rd-upi img.sm{max-width:31px;max-height:31px;width:auto;height:auto;image-rendering:auto;object-fit:contain}
.rd-upt{flex:1;display:flex;flex-direction:column;align-items:flex-start;line-height:1.1;min-width:0}
.rd-upt small{display:block;font-family:'RD Pixel',Silkscreen,monospace;font-size:10.5px;color:#b8acd8;letter-spacing:.02em}
.rd-upt b{font-family:'RD Pixel',Silkscreen,monospace;font-size:13px;color:#efe6ff;white-space:nowrap}
.rd-up#rd-up-fort.on b{color:#ffd86a}
.rd-pips{flex:0 0 auto;display:flex;flex-direction:column;gap:3px}
.rd-pips i{width:8px;height:8px;border-radius:2px;background:#2c2340;border:1px solid #4a3e60}
.rd-pips i.on{background:#d6bcff;border-color:#fff}
.rd-up.bon{display:none;border-color:#ff8fc4;background:#2a1030}
.rd-up.bon.on{display:flex;opacity:1;box-shadow:inset 0 0 0 1px #ff8fc444,0 0 10px -5px #ff8fc4}
.rd-up.bon b{color:#ffc2dd}
/* the bonus-buy panel: a dungeon GUI plate on the right edge, vertically centered (base game only; the GEAR strip takes
   this spot during a raid, and the two never show together) */
.rd-buys{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:5px;padding:7px 8px 8px;border-radius:9px;
  background:linear-gradient(#241a30,#120c1e);border:2px solid #4a3a60;box-shadow:0 12px 24px -10px #000,inset 0 2px 8px #000a,inset 0 1px 0 #ffffff14}
.rd-buys::before{content:'BONUS BUY';display:block;text-align:center;font:700 8px/1 'RD Pixel',Silkscreen,monospace;letter-spacing:.12em;color:#c9a85a;margin-bottom:2px}
.rd-stage.raid .rd-buys{display:none}
.rd-panel{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 10px;border-radius:8px;
  background:linear-gradient(#1a1426,#0f0b18);border:2px solid #3d3150;box-shadow:inset 0 2px 8px #000a;min-height:64px}
.rd-panel small{font-family:'RD Pixel',Silkscreen,monospace;font-size:10px;color:#a99ec4;letter-spacing:.08em;white-space:nowrap}
.rd-panel b{font-family:'RD Num','Press Start 2P',monospace;font-weight:400;line-height:1.25;white-space:nowrap;margin-top:4px}
.rd-spins{border-color:#2f6b7a}.rd-spins b{font-size:24px;color:#9cf0ff}
.rd-loot{border-color:#7a5a1a}.rd-loot b{font-size:17px;color:#ffe08a;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.rd-loot em{font-style:normal;font-size:11px;color:#c8b48a;font-weight:700}
.rd-panel.pop{animation:rdPop .45s ease-out}
@keyframes rdPop{0%{transform:var(--tf,none) scale(1)}35%{transform:var(--tf,none) scale(1.08)}100%{transform:var(--tf,none) scale(1)}}
.rd-spins.pop,.rd-loot.pop{--tf:translateY(-50%)}
.rd-stage.narrow .rd-spins.pop,.rd-stage.narrow .rd-loot.pop{--tf:none}

/* message line */
.rd-msg{min-height:34px;padding:7px 14px;background:#0a0710;border-top:1px solid #2a2038;color:#b8aed0;font-size:14px;font-weight:600;text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-msg b{color:#fff}
.rd-msg[data-k=win]{color:#ffe2a8}.rd-msg[data-k=win] b{color:#fff}
.rd-msg[data-k=hit]{color:#ffc4cc}
.rd-msg[data-k=add]{color:#bdf4ff}
.rd-msg[data-k=pink]{color:#ffc2dd}
.rd-msg[data-k=gold]{color:#ffe08a}
.rd-msg[data-k=dim],.rd-msg[data-k=part]{color:var(--dim)}

/* deck: part of the machine */
.rd-deck{display:flex;align-items:center;gap:12px;padding:10px 16px;min-height:84px;background:linear-gradient(#120d1b,#181222);border-top:3px solid #2e2340;box-shadow:inset 0 2px 0 #ff8a4630}
.rd-plaque,.rd-stake{display:flex;flex-direction:column;justify-content:center;height:58px;padding:4px 12px;border-radius:var(--r-sm);
  background:linear-gradient(#100c18,#181226);border:1px solid #3d3150;box-shadow:inset 0 2px 6px #000a}
.rd-plaque{min-width:130px}
.rd-plaque small,.rd-stake small{color:#b6a6e0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.rd-plaque b{font-size:18px;white-space:nowrap}
.rd-stake{margin-left:auto}
.rd-step{display:flex;align-items:center;gap:6px}
.rd-step b{min-width:64px;text-align:center;font-size:18px}
.rd-step button{width:30px;height:28px;border:0;border-radius:6px;background:#2c2244;color:#efe6ff;font-size:18px;font-weight:800;cursor:pointer;line-height:1}
.rd-step button:hover:not(:disabled){background:#3d2f60}
.rd-step button:disabled{opacity:.35;cursor:not-allowed}
.rd-go{min-width:190px;height:64px;border:0;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#fff;
  background:linear-gradient(#ff9a52,#e8582a);box-shadow:0 4px 0 #8a2a10,0 10px 24px -8px #000,inset 0 2px 0 #ffffff55;transition:transform .1s,filter .15s}
.rd-go span{font-family:'RD Pixel',Silkscreen,monospace;font-weight:700;font-size:20px;letter-spacing:.05em;line-height:1}
.rd-go small{font-size:11px;font-weight:700;opacity:.9;min-height:13px}
.rd-go:hover:not(:disabled){filter:brightness(1.08)}
.rd-go:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 #8a2a10,0 6px 16px -8px #000,inset 0 2px 0 #ffffff55}
.rd-go.stop{background:linear-gradient(#ff7a8a,#c8283e);box-shadow:0 4px 0 #6a1020,0 10px 24px -8px #000,inset 0 2px 0 #ffffff55}
.rd-go.skip{background:linear-gradient(#a48cff,#6a48e0);box-shadow:0 4px 0 #34207a,0 10px 24px -8px #000,inset 0 2px 0 #ffffff55}
.rd-go.ok{background:linear-gradient(#5ee08a,#20a050);box-shadow:0 4px 0 #0e5a2a,0 10px 24px -8px #000,inset 0 2px 0 #ffffff55}
.rd-go:disabled{filter:grayscale(.7) brightness(.7);cursor:not-allowed}
.rd-tools{display:flex;gap:6px}
.rd-tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:58px;height:58px;border-radius:var(--r-sm);border:1px solid #3d3150;
  background:#17112a;color:#d6ccf4;cursor:pointer;font-size:11px;font-weight:700}
.rd-tool .ic{width:18px;height:18px}
.rd-tool:hover{background:#21183a;color:#fff}
.rd-tool.on{color:#ffd86a;border-color:#ffd86a77}
#rd-fav.on{color:#ff6b97}
#rd-fav.on svg{fill:currentColor}
.rd-ff{display:block;width:18px;height:18px;background:currentColor;clip-path:polygon(0 10%,48% 50%,0 90%,0 10%,50% 10%,100% 50%,50% 90%,50% 10%)}

/* BONUT RAID: lighting and trim change; layout and controls stay exactly where they are */
.rd-stage.bonus .rd-top{background:linear-gradient(#3a1230,#1e0a1a);border-bottom-color:#ff8fc4}
.rd-stage.bonus .rd-deck{border-top-color:#ff8fc4;box-shadow:inset 0 2px 0 #ff8fc455}
.rd-stage.bonus{box-shadow:inset 0 0 0 2px #ff8fc455}

/* overlays */
.rd-ovl{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:#05030ab0;padding:16px;opacity:0;transition:opacity .2s}
.rd-ovl.on{opacity:1}
.rd-ovl[hidden]{display:none}
.rd-intro-card{--intro:#f0a4c5;--intro-halo:#8b365c;--intro-scene:url('../assets/slots/raid/bg_nether.png');position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;gap:0;width:min(450px,100%);max-height:100%;overflow:auto;padding:22px 30px 28px;border:1px solid #977a8b;border-radius:3px;background:#10131d;box-shadow:0 0 0 5px #080c13,inset 0 0 0 5px #202532,0 25px 70px #000b;text-align:center}
.rd-ovl.super .rd-intro-card{--intro:#97d8f3;--intro-halo:#23649b;--intro-scene:url('../assets/slots/raid/bg_deepdark.png');border-color:#7d9cae}
.rd-intro-card:before{content:"";position:absolute;inset:6px;z-index:-2;background:linear-gradient(#0a101b66,#0a101bf5 73%),var(--intro-scene) center top/cover;opacity:.7;image-rendering:pixelated}
.rd-intro-card:after{content:"";position:absolute;inset:11px;z-index:-1;pointer-events:none;border:1px solid #b4c2d31a;background:radial-gradient(ellipse at 50% 17%,var(--intro-halo),transparent 58%);opacity:.5;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.rd-intro-crest{position:relative;width:218px;height:174px;flex:0 0 auto;margin:0 0 8px;isolation:isolate}
.rd-intro-shield{position:absolute;inset:20px 54px 9px;background:linear-gradient(135deg,#617082,#293543 35%,#141e29);clip-path:polygon(50% 0,100% 15%,95% 72%,50% 100%,5% 72%,0 15%);filter:drop-shadow(0 5px #0008)}
.rd-intro-shield:after{content:"";position:absolute;inset:5px;background:linear-gradient(150deg,var(--intro-halo),#0d1524 80%);clip-path:inherit}
.rd-intro-crest img{object-fit:contain;image-rendering:pixelated}
.rd-intro-sword{position:absolute;width:148px;height:148px;top:3px;filter:drop-shadow(3px 6px 0 #0008);transform-origin:50% 68%}
.rd-intro-sword.left{left:20px;transform:scaleX(-1)}.rd-intro-sword.right{right:20px;transform:none}
.rd-intro-token{position:absolute;inset:44px 63px 36px;display:grid;place-items:center;background:#0d1929;border:1px solid #a3b6c65c;box-shadow:0 6px 0 #080e1b,0 0 24px #0005;transform:rotate(45deg)}
.rd-intro-token img{width:86px;height:86px;transform:rotate(-45deg);filter:drop-shadow(0 4px 0 #0005)}
.rd-intro-spark{position:absolute;width:5px;height:5px;transform:rotate(45deg);background:var(--intro);box-shadow:0 0 12px var(--intro);animation:rd-intro-spark 2.8s ease-in-out infinite}.rd-intro-spark.a{left:22px;top:54px}.rd-intro-spark.b{right:22px;top:102px;animation-delay:-.9s}.rd-intro-spark.c{left:75px;top:16px;width:3px;height:3px;animation-delay:-1.8s}
.rd-intro-kicker{font:800 9px/1.3 Inter,Arial,sans-serif;letter-spacing:.25em;color:#b4bdca;margin:0 0 9px}
.rd-intro-card h2{max-width:100%;margin:0;color:var(--intro);font:900 clamp(20px,2.6vw,28px)/1.12 Inter,Arial,sans-serif;letter-spacing:-.02em;text-shadow:0 3px #060d18}
.rd-intro-spins{display:flex;align-items:center;justify-content:center;gap:25px;width:100%;margin:17px 0 24px}
.rd-intro-rule{height:1px;width:63px;background:linear-gradient(90deg,transparent,#7d85996b);position:relative}.rd-intro-rule:last-child{transform:rotate(180deg)}.rd-intro-rule:after{content:"";position:absolute;width:4px;height:4px;background:var(--intro);right:0;top:-2px;transform:rotate(45deg)}
.rd-intro-card p{margin:0;display:flex;flex-direction:column;gap:5px;color:#b7c3d3;font:800 10px/1 Inter,Arial,sans-serif;letter-spacing:.2em}
.rd-intro-card p b{font:900 64px/1 Inter,Arial,sans-serif;color:#fff4d8;letter-spacing:-.04em;text-shadow:0 4px #57504166}
.rd-intro-card #rd-intro-go{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;min-width:0;flex:0 0 auto;margin:0;height:52px;border:1px solid var(--intro);border-radius:3px;background:var(--intro);box-shadow:inset 0 -4px #0c253b33,0 7px 20px #0004;color:#0b1b2a;font:800 15px/1 Inter,Arial,sans-serif;letter-spacing:.09em;transition:translate .18s,filter .18s}
#rd-intro-go .ic{width:19px;height:19px;transition:translate .18s}#rd-intro-go:hover .ic{translate:4px 0}#rd-intro-go:hover{filter:brightness(1.1)}#rd-intro-go:active{translate:0 2px}#rd-intro-go:focus-visible{outline:2px solid #f4f5e8;outline-offset:4px}
.rd-ovl.on .rd-intro-crest{animation:rd-crest-in .65s cubic-bezier(.2,.9,.25,1) both}
@keyframes rd-crest-in{from{opacity:0;transform:translateY(14px) scale(.84)}to{opacity:1;transform:none}}
@keyframes rd-intro-spark{0%,100%{opacity:.3;translate:0 3px}50%{opacity:1;translate:0 -4px}}
@media(max-width:550px){.rd-intro-card{padding:14px 22px 23px;width:min(350px,100%)}.rd-intro-crest{margin-bottom:0;height:164px}.rd-intro-card h2{font-size:23px}.rd-intro-spins{margin:15px 0 20px}.rd-intro-card p b{font-size:54px}}
@media(prefers-reduced-motion:reduce){.rd-ovl.on .rd-intro-crest,.rd-intro-spark{animation:none}.rd-intro-card #rd-intro-go,#rd-intro-go .ic{transition:none}}
.rd-endc{min-width:min(360px,100%);text-align:center;padding:24px 28px 22px;border-radius:12px;background:#140f1f;border:2px solid #4a3d60;box-shadow:0 30px 60px #000a}
.rd-endc h2{margin:0;font-family:'RD Pixel',Silkscreen,monospace;font-size:24px;color:#d6ccf4;letter-spacing:.04em}
.rd-end-v{margin:14px 0 6px;font-family:'RD Num','Press Start 2P',monospace;font-size:30px;color:#fff}
.rd-end-x{margin:0 0 16px;color:#a99ec4;font-size:13px;font-weight:600}
.rd-endc.won{border-color:#d6a84a;background:radial-gradient(ellipse at 50% 0,#3a2a0a,#140f1f 70%)}
.rd-endc.won h2,.rd-endc.won .rd-end-v{color:#ffe08a}
.rd-endc.max{border-color:#ffe08a;box-shadow:0 0 40px -8px #ffd86a}
.rd-cta{min-width:180px;height:50px;border:0;border-radius:10px;cursor:pointer;color:#fff;font-family:'RD Pixel',Silkscreen,monospace;font-weight:700;font-size:18px;letter-spacing:.05em;
  background:linear-gradient(#5ee08a,#20a050);box-shadow:0 4px 0 #0e5a2a}
.rd-card{width:min(860px,100%);max-height:100%;overflow:auto;background:#140f1f;border:1px solid #4a3d60;border-radius:var(--r);padding:16px 18px;box-shadow:0 30px 60px #000a}
.rd-card h3{margin:16px 0 6px;font-size:16px}
.rd-card-h{display:flex;align-items:center;justify-content:space-between}
.rd-card-h h2{margin:0;font-size:20px}
.rd-fine{color:var(--muted);font-size:13px}
.rd-rules{margin:0;padding-left:18px;color:var(--muted);font-size:13.5px;line-height:1.5}
.rd-rules li{margin:4px 0}
.rd-rules b{color:var(--text)}
.rd-tab{width:100%;border-collapse:collapse;margin:4px 0 8px;font-size:13.5px}
.rd-tab th{text-align:left;color:#c0b0f0;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;padding:4px 6px}
.rd-tab td{padding:5px 6px;border-top:1px solid #ffffff10;vertical-align:middle}
.rd-tab td small{display:block;color:var(--dim);font-size:11.5px}
.rd-psym{display:flex;align-items:center;gap:8px}
.rd-psym img{width:34px;height:34px;object-fit:contain}
.rd-psym .px{image-rendering:pixelated}
.rd-boss{font-style:normal;font-size:10px;font-weight:800;color:#2a1a00;background:#ffd86a;border-radius:4px;padding:1px 5px}
.rd-wi{width:38px;height:38px;display:grid;place-items:center;border-radius:5px;background:#13161f;border:2px solid #aab2bc}
.rd-wi img{width:32px;height:32px}
.rd-wi.tJ{border-color:#b48cff;background:#1c1430}.rd-wi.tD{border-color:#4aedd9}.rd-wi.tE{border-color:#ffcf4a;background:#1c1430}.rd-wi.tS{border-color:#ff8fc4;background:#2a1028}
.rd-stone{width:38px;height:38px;border-radius:5px;background:url(../assets/slots/raid/nat_stone.png) 0 0/38px 38px;image-rendering:pixelated;filter:brightness(.55);border:2px solid #2e2a34}
.rd-val{display:inline-flex;align-items:baseline;gap:4px;margin:2px 4px 2px 0;padding:2px 7px;border-radius:5px;background:#ffffff0a;border:1px solid #ffffff12;white-space:nowrap}
.rd-val small{display:inline!important;font-size:11px}
.rd-tab td:last-child,.rd-tab th:last-child{text-align:left}
.rd-load{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:#0d0a14;transition:opacity .3s}
.rd-load.off{opacity:0;pointer-events:none}
.rd-load div{display:flex;flex-direction:column;align-items:center;gap:10px}
.rd-load img{width:64px;height:64px;image-rendering:pixelated}
.rd-lbar{width:180px;height:6px;border-radius:3px;background:#ffffff14;overflow:hidden}
.rd-lbar i{display:block;height:100%;width:0;background:#ff8a46}

/* info below the machine */
.rd-info{margin-top:22px;display:flex;flex-direction:column;gap:22px}
.rd-info section{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px}
.rd-info h3{margin:0 0 10px;font-size:18px}
.rd-info h3 small{color:var(--dim);font-weight:600;font-size:13px}
.rdi-hero{display:flex;gap:18px;align-items:flex-start}
.rdi-hero > img{width:200px;border-radius:var(--r-sm);flex:0 0 auto}
.rdi-hero h2{margin:0 0 8px}
.rdi-hero p{color:var(--muted);margin:0 0 12px}
.rdi-facts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rdi-facts li{background:var(--inset);border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 10px}
.rdi-facts small{display:block;color:var(--dim);font-size:11px}
.rdi-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.rdi-feats > div{background:var(--inset);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px}
.rdi-feats img{width:48px;height:48px;object-fit:contain}
.rdi-feats img.sm{image-rendering:auto}
.rdi-feats h4{margin:6px 0}
.rdi-feats p{margin:0;color:var(--muted);font-size:13.5px}
.rdi-cols{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.rdi-note{color:var(--dim);font-size:12.5px}
.rd-kv{width:100%;border-collapse:collapse;font-size:13.5px}
.rd-kv td{padding:5px 4px;border-top:1px solid #ffffff10;vertical-align:top}
.rd-kv td:last-child{text-align:right}

/* narrow / portrait */
.rd-stage.narrow{height:auto}
.rd-stage.narrow .rd-top{flex-wrap:wrap;gap:6px;padding:8px 8px 6px;justify-content:center}
.rd-stage.narrow .rd-logo{flex-direction:row;gap:.35em;font-size:18px}
.rd-stage.narrow .rd-next{min-width:0;text-align:left;display:flex;gap:6px;align-items:baseline}
.rd-stage.narrow .rd-route{flex:1 0 100%;order:3;gap:3px}
.rd-stage.narrow .rd-realm{display:none}
.rd-stage.narrow .rd-rsep{width:4px}
.rd-stage.narrow .rd-chip{width:31px;height:31px;border-width:2px}
.rd-stage.narrow .rd-chip.boss{width:35px;height:35px}
.rd-stage.narrow .rd-ups{right:4px;top:6px;bottom:auto;transform:none;flex-direction:column;gap:2px;padding:3px}
.rd-stage.narrow .rd-ups::before{display:none}
.rd-stage.narrow .rd-up{width:92px;padding:1px 4px 1px 2px;gap:4px}
.rd-stage.narrow .rd-upt small{font-size:8px}
.rd-stage.narrow .rd-upt b{font-size:9.5px}
.rd-stage.narrow .rd-upi{flex:0 0 21px;width:21px;height:21px}.rd-stage.narrow .rd-upi img{max-width:20px;max-height:20px;width:auto;height:auto}
.rd-stage.narrow .rd-panel{min-height:56px;transform:none}
.rd-stage.narrow .rd-spins b{font-size:20px}
.rd-stage.narrow .rd-loot b{font-size:14px}
.rd-stage.narrow .rd-msg{white-space:normal;font-size:13px;min-height:44px}
.rd-stage.narrow .rd-deck{flex-wrap:wrap;justify-content:center;gap:8px;padding:10px 8px}
.rd-stage.narrow .rd-plaque{flex:1;min-width:0}
.rd-stage.narrow .rd-stake{margin-left:0;flex:1}
.rd-stage.narrow .rd-go{order:3;flex:1 0 100%;height:58px}
.rd-stage.narrow .rd-tools{order:4}
.rd-stage.narrow .rd-tool{width:52px;height:50px;font-size:10px}
@media (max-width:900px){
  .rdi-hero{flex-direction:column}
  .rdi-hero > img{width:100%;max-width:320px}
  .rdi-cols{grid-template-columns:1fr}
  .rd-info section{padding:14px}
  .rd-tab td,.rd-tab th{padding:3px 3px;font-size:12px}
}

/* ===== v2: plate counters (Astra plates, text in code), two donut meters, super bonus, buys, heart badges ===== */
.rd-panel{background:url(../assets/slots/raid/plate_spins.png) 0 0/100% 100% no-repeat;border:0;box-shadow:none;border-radius:0;image-rendering:pixelated;
  aspect-ratio:auto;min-height:0;overflow:hidden;box-sizing:border-box;align-items:center;justify-content:center;gap:1px;filter:drop-shadow(0 6px 10px #000a)}
.rd-panel > *{image-rendering:auto}
.rd-loot{background-image:url(../assets/slots/raid/plate_loot.png)}
.rd-panel small{font-size:9px;line-height:1}
.rd-spins b{font-size:22px}.rd-loot b{font-size:15px}
.rd-loot em{font-size:10px;line-height:1.1}
.rd-stage.narrow .rd-panel{min-height:0}
.rd-stage.narrow .rd-panel small{font-size:8px}
.rd-stage.narrow .rd-spins b{font-size:16px}
.rd-stage.narrow .rd-loot b{font-size:10px}
.rd-stage.narrow .rd-loot em{font-size:9px}
.rd-up.bon.sup{border-color:#5fb8ff;background:#0c1e3ee6;box-shadow:0 0 14px -4px #5fb8ff}
.rd-up.bon.sup b{color:#bfe4ff}
.rd-msg[data-k=blue]{color:#bfe4ff}
.rd-stage.super .rd-top{background:linear-gradient(#10264a,#0a1428);border-bottom-color:#5fb8ff}
.rd-stage.super .rd-deck{border-top-color:#5fb8ff;box-shadow:inset 0 2px 0 #5fb8ff55}
.rd-stage.super{box-shadow:inset 0 0 0 2px #5fb8ff55}
.rd-hc{position:absolute;left:1px;bottom:1px;min-width:14px;height:12px;padding:0 2px;font:400 7px/12px 'RD Num','Press Start 2P',monospace;font-style:normal;color:#fff;
  background:#b8283c;border-radius:3px;text-align:center}
.rd-buy{min-width:122px;height:28px;border:0;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 10px;color:#fff;
  background:linear-gradient(#e85aa0,#b02a6a);box-shadow:0 2px 0 #5a1034;font-weight:800}
.rd-buy.sup{background:linear-gradient(#ffdf7a,#d79620);box-shadow:0 2px 0 #7a4e0c,0 0 10px -2px #ffd86a;color:#2a1c04;border:1px solid #ffe9a0}
.rd-buy.sup span,.rd-buy.sup small{text-shadow:0 1px 0 #ffeaa855}
.rd-buy span{font-family:'RD Pixel',Silkscreen,monospace;font-size:11px;letter-spacing:.04em}
.rd-buy small{font-size:11px;opacity:.95}
.rd-buy.flip{background:linear-gradient(90deg,#d84a92 0 50%,#3a7ae0 50% 100%);box-shadow:0 2px 0 #1a2a5a}
.rd-buy:disabled{filter:grayscale(.8) brightness(.6);cursor:not-allowed}
.rd-buy:hover:not(:disabled){filter:brightness(1.1)}
/* ---- themed buy-confirm dialog: dungeon stone + gold, accent per raid tier.
   Only the cost + what-the-bonus-is + Confirm/Cancel remain. ---- */
.rd-card.buy{width:min(390px,100%);text-align:center;border:3px solid #4a3a60;border-radius:10px;
  background:radial-gradient(ellipse 85% 70% at 50% 24%,#2a1f3e,#0000 72%),url(../assets/slots/raid/px_stone.png) 0 0/72px 72px repeat #140f1f;image-rendering:pixelated;
  box-shadow:0 0 0 3px #0b0812,inset 0 2px 0 #ffffff12,0 24px 50px #000c}
.rd-card.buy h2{margin:2px 0 10px;font-family:'RD Pixel',Silkscreen,monospace;font-weight:700;font-size:22px;letter-spacing:.03em;color:#ffd86a;text-shadow:0 3px 0 #000,0 0 18px #ffb84a55}
.rd-buy-what{margin:0 auto 12px;max-width:320px;color:#d0c6e4;font-weight:600;font-size:14px;line-height:1.45}
.rd-buy-what b{color:#fff}
.rd-buy-cost{background:#0b0812cc;border:1px solid #ffffff18;border-radius:6px;padding:10px 12px;margin:0 0 10px;display:flex;flex-direction:column;align-items:center;gap:4px}
.rd-buy-cost small{color:#c9a85a;font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.rd-buy-cost b{font-family:'RD Num','Press Start 2P',monospace;font-weight:400;font-size:clamp(17px,5vw,23px);line-height:1.4;color:#fff;white-space:nowrap}
.rd-buy-note{margin:0 0 14px;color:#9a8fb4;font-size:12px}
.rd-card.buy .rd-row{justify-content:center;margin-top:0;gap:10px;display:flex}
.rd-card.buy .rd-row .btn{flex:1}
.rd-card.buy .btn.sec{background:#1d1733;color:#efe6ff;box-shadow:inset 0 0 0 1px #4a3a6088}
.rd-card.buy .btn.sec:hover:not(:disabled){background:#271f44}
.rd-card.buy .btn.pri{background:linear-gradient(#ffdf7a,#d79620);color:#2a1c04;text-shadow:0 1px 0 #ffeaa8;box-shadow:inset 0 2px 0 #fff3c8,inset 0 -3px 0 #7a4e0c,0 8px 20px -10px #ffd86a}
.rd-card.buy .btn.pri:hover:not(:disabled){filter:brightness(1.07)}
/* per-tier accent: gold SUPER, pink/blue 50-50, stone-gold regular */
.rd-card.buy.sup{border-color:#ffd86a;box-shadow:0 0 0 3px #0b0812,0 0 40px -8px #ffd86a,0 24px 50px #000c}
.rd-card.buy.flip{border-color:#b760c4}
.rd-card.buy.flip .btn.pri{background:linear-gradient(90deg,#e86aa8 0 50%,#5a8ae8 50% 100%);color:#fff;text-shadow:0 1px 2px #0008;box-shadow:inset 0 2px 0 #ffffff33,0 8px 20px -10px #b760c4}
.rd-row{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
.rd-stage.narrow .rd-buys{right:4px;top:50%;left:auto;transform:translateY(-50%);flex-direction:column;gap:4px;padding:5px 5px 6px}
.rd-stage.narrow .rd-buys .rd-buy{min-width:96px;height:26px;padding:0 7px}
.rd-stage.narrow .rd-buys::before{font-size:7px;margin-bottom:1px}
.rd-stage.narrow .rd-buy{flex:1}
.rd-wi.tN{border-color:#9c7838;background:#1a1410}.rd-wi.tP{border-color:#ff8fc4;background:#2a1028}.rd-wi.tQ{border-color:#5fb8ff;background:#0c1a34}

/* ===== BASE SLOT MODE (the simple donut-collecting game; the battle stage/route/gear only show in a raid) ===== */
.rd-stage.base .rd-route, .rd-stage.base .rd-next, .rd-stage.base .rd-ups, .rd-stage.base .rd-spins{display:none}
.rd-stage.base .rd-top{justify-content:space-between}
.rd-stage.base .rd-loot{border-color:#7a5a1a}
/* a subtle tint so base vs raid reads differently */
.rd-stage.base .rd-deck{box-shadow:inset 0 2px 0 #b06a9a40}
/* In-world dungeon purchase plate, inset from the arena wall. */
.rd-buys{right:clamp(28px,4.2%,66px);gap:7px;padding:13px 11px 12px;border-radius:3px;border:3px solid #69716c;background:linear-gradient(#202827ed,#101818f5),url(../assets/slots/raid/nat_stone.png) center/60px;box-shadow:0 0 0 3px #080f10,inset 0 2px 0 #cbd0b72e,inset 0 -4px 0 #02080980,0 12px 22px #0008}
.rd-buys::before{font-size:9px;letter-spacing:.08em;color:#d8c79f;margin-bottom:5px;text-shadow:0 2px #05090c}
.rd-buys::after{content:'';position:absolute;left:5px;right:5px;top:5px;height:3px;background:linear-gradient(90deg,#b4a67b 0 3px,transparent 3px calc(100% - 3px),#b4a67b calc(100% - 3px));pointer-events:none}
.rd-buys .rd-buy{--edge:#8b6275;min-width:166px;height:43px;padding:0 10px;border:1px solid var(--edge);border-radius:3px;background:linear-gradient(#40303d,#241e2c);box-shadow:inset 0 2px 0 #ffffff12,inset 0 -3px 0 #090e1699;color:#f5c5dc;gap:10px;transition:transform .16s,filter .16s}
.rd-buys .rd-buy span{font-size:9px;letter-spacing:0}
.rd-buys .rd-buy small{font-size:12px;font-weight:800;color:#fff1da}
.rd-buys .rd-buy.flip{--edge:#697795;background:linear-gradient(110deg,#362637,#1e3240);color:#d8cce9;box-shadow:inset 0 2px 0 #ffffff12,inset 0 -3px 0 #090e1699}
.rd-buys .rd-buy.sup{--edge:#a28a4c;background:linear-gradient(#49432c,#2e2b1b);color:#ffe49a;box-shadow:inset 0 2px 0 #fff3c522,inset 0 -3px 0 #090e1699}
.rd-buys .rd-buy.sup span,.rd-buys .rd-buy.sup small{text-shadow:0 1px #050909}
.rd-buys .rd-buy:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.17)}
.rd-stage.narrow .rd-buys{right:18px;gap:5px;padding:9px 7px 8px;border-radius:3px}
.rd-stage.narrow .rd-buys .rd-buy{min-width:104px;height:34px;padding:0 7px;gap:6px}
.rd-stage.narrow .rd-buys .rd-buy span{font-size:7px}
.rd-stage.narrow .rd-buys .rd-buy small{font-size:10px}
.rd-stage.narrow .rd-buys::before{font-size:7px;margin-bottom:4px}

/* One dungeon seal opens the three bonus paths. */
.rd-buys,.rd-stage.narrow .rd-buys{padding:0;border:0;background:none;box-shadow:none;right:clamp(26px,4.2%,66px)}
.rd-buys:before,.rd-buys:after{display:none}
.rd-buy-launch{display:flex;flex-direction:column;align-items:center;width:142px;padding:13px 10px 17px;gap:12px;border:2px solid #9a8465;border-radius:12px;background:radial-gradient(ellipse at top,#87634566,transparent 75%),linear-gradient(#24262a,#13191e);color:#ffe7b3;box-shadow:0 0 0 3px #0b1014,inset 0 2px 0 #efdbb12b,0 12px 22px #0007;font:700 11px 'RD Pixel',monospace;cursor:pointer;transition:transform .2s,border-color .2s}
.rd-launch-art{position:relative;width:100px;height:80px;display:block}.rd-launch-art img{position:absolute;object-fit:contain;filter:drop-shadow(0 4px 5px #0008);transition:transform .25s}.rd-launch-art img:first-child{width:82px;height:82px;left:-7px;top:-7px;transform:rotate(-15deg)}.rd-launch-art img:last-child{width:66px;height:66px;right:-3px;bottom:-4px;transform:rotate(12deg)}
.rd-buy-launch:hover:not(:disabled){transform:translateY(-5px);border-color:#ffe5a5}.rd-buy-launch:hover img:first-child{transform:rotate(-28deg) translateY(-3px)}.rd-buy-launch:hover img:last-child{transform:rotate(23deg) translateY(-3px)}.rd-buy-launch:disabled{opacity:.5;cursor:default}
/* A weapon rack, cut metal plates and suspended blades distinguish Raid from Vault. */
.rd-select-wrap{position:relative;width:min(960px,100%);padding:52px 12px 24px;margin:auto;font-family:Inter,system-ui}
#rd-buy-select{background:radial-gradient(ellipse at 50% 40%,#142529e8,#070b10f5 75%);backdrop-filter:blur(5px);padding:18px}
#rd-select-x{position:absolute;right:12px;top:0;color:#c7d2da;background:#ffffff09;border:1px solid #ffffff1c;border-radius:5px;width:36px;height:36px}
.rd-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;position:relative}
.rd-offers:before{content:"";position:absolute;left:-8px;right:-8px;top:75px;height:14px;border-block:2px solid #4b5964;background:#12191f;box-shadow:0 10px 25px #0009}
.rd-offer{--raid-accent:#c6d5de;--raid-glow:#64899a;position:relative;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:20px 22px 22px;border:1px solid #52616a;border-radius:3px 20px 3px 3px;background:linear-gradient(125deg,#ffffff0b,transparent 40%),linear-gradient(#1c272c,#0e151b);color:#ecf4f8;cursor:pointer;box-shadow:inset 0 0 0 5px #0b1115,0 18px 36px #0009;transition:transform .24s,border-color .24s;isolation:isolate}
.rd-offer:before,.rd-offer:after{content:"";position:absolute;width:4px;height:4px;bottom:10px;border:1px solid #8b9aa2;border-radius:50%;background:#0b1218;left:10px}.rd-offer:after{left:auto;right:10px}
.rd-offer.flip{--raid-accent:#69e1d3;--raid-glow:#389d99;border-color:#386b6c;background:linear-gradient(125deg,#5eeed712,transparent 40%),linear-gradient(#16282b,#0c171c)}
.rd-offer.sup{--raid-accent:#c6a3ff;--raid-glow:#8855c8;border-color:#665282;background:linear-gradient(125deg,#bf83ff16,transparent 40%),linear-gradient(#242330,#14111f)}
.rd-offer-index{position:absolute;left:20px;top:19px;font:600 11px/1 monospace;letter-spacing:.15em;color:#7b8b96;border-bottom:1px solid #63758255;padding-bottom:7px}
.rd-offer-art{position:relative;display:grid;place-items:center;width:100%;height:238px;margin:14px 0 17px;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--raid-glow) 28%,transparent),transparent 67%)}
.rd-offer-rack{position:absolute;inset:18px 30% 25px;border:1px solid #ffffff10;border-top:3px solid #ffffff26;transform:skewY(-8deg);background:repeating-linear-gradient(0deg,#0000 0 31px,#ffffff05 32px 33px)}
.rd-offer-sword{position:relative;width:184px;height:184px;max-width:100%;object-fit:contain;image-rendering:pixelated;transform:rotate(-44deg);filter:drop-shadow(7px 9px 0 #0005);transition:translate .3s ease,filter .3s}
.rd-offer-sword.hd{image-rendering:auto;width:210px;height:210px;filter:drop-shadow(7px 9px 0 #0005)}
.rd-offer-donuts{position:absolute;right:0;bottom:2px;display:flex;align-items:center;gap:4px;z-index:2;padding:9px;border:1px solid #ffffff1b;background:#0c141dd9;box-shadow:3px 3px 0 #0004;transform:rotate(-4deg)}
.rd-offer-donuts img{width:42px;height:42px;object-fit:contain;image-rendering:pixelated}
.rd-offer-title{font:800 clamp(17px,2vw,24px)/1.25 Inter,system-ui;letter-spacing:.035em;text-align:left;color:var(--raid-accent);padding:16px 0 14px;border-top:1px solid #ffffff15}
.rd-offer-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0 0;border-top:1px solid #ffffff0d}
.rd-offer-footer small{font:700 25px/1 Inter,system-ui;color:#f3f5f7;white-space:nowrap}.rd-offer-footer>span{display:flex;align-items:center;gap:5px;font:800 11px/1 Inter,system-ui;letter-spacing:.08em;color:#0c141a;background:var(--raid-accent);padding:12px 13px;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%)}.rd-offer-footer .ic{width:14px;height:14px}
.rd-offer-status{display:block;font:500 10px/1.4 Inter,system-ui;color:#a5b0ba;margin-top:12px}.rd-offer-status:empty{display:none}
.rd-offer:hover:not(:disabled){transform:translateY(-5px);border-color:var(--raid-accent)}.rd-offer:hover:not(:disabled) .rd-offer-sword{translate:0 -9px;filter:drop-shadow(7px 12px 0 #0005) brightness(1.15)}.rd-offer:focus-visible{outline:3px solid var(--raid-accent);outline-offset:4px}.rd-offer:disabled{opacity:.45;cursor:not-allowed}
.rd-ovl.on .rd-offer{animation:rd-offer-in .4s both}.rd-ovl.on .rd-offer.flip{animation-delay:.07s}.rd-ovl.on .rd-offer.sup{animation-delay:.14s}
.rd-launch-art img{image-rendering:pixelated}
.rd-stage.narrow .rd-buy-launch{width:100px;padding:9px 6px 12px;gap:6px;font-size:9px}.rd-stage.narrow .rd-launch-art{width:75px;height:60px}.rd-stage.narrow .rd-launch-art img:first-child{width:63px;height:63px}.rd-stage.narrow .rd-launch-art img:last-child{width:49px;height:49px}
@keyframes rd-offer-in{from{opacity:0;translate:0 -20px}to{opacity:1;translate:0 0}}
@media(max-width:650px){#rd-buy-select{padding:12px}.rd-select-wrap{padding:44px 3px 8px}.rd-offers{grid-template-columns:1fr;gap:12px}.rd-offers:before{display:none}#rd-select-x{right:3px}.rd-offer{display:grid;grid-template-columns:100px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;padding:16px}.rd-offer-index{display:none}.rd-offer-art{grid-row:1/3;width:100px;height:116px;margin:0}.rd-offer-sword{width:90px;height:90px}.rd-offer-sword.hd{width:105px;height:105px}.rd-offer-rack{inset:8px 30%}.rd-offer-donuts{right:-4px;bottom:-3px;padding:4px;gap:1px}.rd-offer-donuts img{width:25px;height:25px}.rd-offer-title{font-size:19px;border:0;align-self:end;padding:5px 0 12px}.rd-offer-footer{padding-top:12px}.rd-offer-footer small{font-size:22px}.rd-offer-footer>span{font-size:10px;padding:10px 8px}.rd-offer-status{grid-column:1/-1}.rd-offer:hover:not(:disabled){transform:none}}
@media(prefers-reduced-motion:reduce){.rd-ovl.on .rd-offer{animation:none}.rd-offer,.rd-offer-sword,.rd-buy-launch,.rd-launch-art img{transition:none}}
