@font-face{font-family:"Cormorant";src:url(fonts/cormorant.ttf) format("truetype");font-weight:300 700}
@font-face{font-family:"CormorantSC";src:url(fonts/cormorant-sc-bold.ttf) format("truetype");font-weight:700}
:root{--g1:#fff2bf;--g2:#f6c95a;--g3:#c4861d;--g4:#7a4a0a;--ink:#0d0628;--vio:#5a23b8;--txt:#f8ecd2;
 --goldgrad:linear-gradient(180deg,#fff6cf 0%,#ffd970 35%,#e8a530 62%,#a8670f 100%);
 --frame:linear-gradient(160deg,#fff0b0,#d99a2b 30%,#8a5512 55%,#f5cf6b 80%,#a8670f)}
*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#03010b;color:var(--txt);font-family:"Cormorant",Georgia,serif;overflow:hidden}
#stage{position:relative;width:100vw;height:100vh;max-width:calc(100vh*1.25);max-height:calc(100vw*.8);margin:auto;top:50%;transform:translateY(-50%);
 background:#0b0420 url(img/bg.webp) center/cover no-repeat;overflow:hidden;font-size:1vmin}
#stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,transparent 40%,rgba(3,1,12,.55) 100%)}
#stars{position:absolute;inset:0;pointer-events:none;z-index:1}
.screen{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;padding:2.2% 6.5% 2%;z-index:2}
.screen.on{display:flex;animation:fade .45s ease-out}
@keyframes fade{from{opacity:0;transform:scale(.985)}to{opacity:1}}
svg.ic{width:1em;height:1em;vertical-align:-.12em}
/* ---- заголовок ---- */
.title{display:flex;align-items:center;justify-content:center;gap:1.2vmin;margin-top:.5vmin}
.title img{height:11vmin;filter:drop-shadow(0 0 2vmin rgba(255,200,90,.7))}
.title b,.gold{font-family:"CormorantSC","Cormorant",serif;font-weight:700;background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent;
 filter:drop-shadow(0 .25vmin 0 #5a3205) drop-shadow(0 0 1.6vmin rgba(255,190,80,.55))}
.title b{font-size:10.5vmin;letter-spacing:.02em;line-height:1}
.sub{font-family:"Cormorant";font-weight:700;font-size:4.4vmin;color:#fbe7b5;text-shadow:0 0 1.5vmin rgba(255,200,110,.45),0 .3vmin .4vmin #000;margin:.4vmin 0 2vmin;display:flex;align-items:center;gap:2vmin}
.sub::before,.sub::after{content:"";width:9vmin;height:.25vmin;background:linear-gradient(90deg,transparent,var(--g2),transparent)}
.title.sm b{font-size:8vmin}.title.sm img{height:8.5vmin}
/* ---- рамки ---- */
.frame{position:relative;border:.45vmin solid transparent;border-radius:2.2vmin;
 background:linear-gradient(165deg,rgba(74,36,150,.92),rgba(30,12,78,.95) 55%,rgba(16,6,48,.97)) padding-box,var(--frame) border-box;
 box-shadow:0 0 2.2vmin rgba(170,100,255,.55),0 0 .8vmin rgba(255,200,100,.5),0 1.4vmin 2.4vmin rgba(0,0,0,.7),inset 0 0 3vmin rgba(150,90,255,.35)}
.frame::before{content:"";position:absolute;inset:.7vmin;border:.15vmin solid rgba(246,201,90,.45);border-radius:1.6vmin;pointer-events:none}
.frame::after{content:"";position:absolute;left:8%;right:8%;top:0;height:40%;border-radius:2vmin 2vmin 50% 50%;background:linear-gradient(rgba(255,255,255,.12),transparent);pointer-events:none}
/* ---- главный экран ---- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:2.3vmin 2.6vmin;width:100%;flex:1;min-height:0}
.tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:1.2vmin 1vmin 2vmin;cursor:pointer;transition:transform .15s,box-shadow .2s}
.tile:active{transform:translateY(.5vmin) scale(.985)}
.tile .art{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.tile .art img{max-width:88%;max-height:100%;filter:drop-shadow(0 1vmin 1.4vmin rgba(0,0,0,.6)) drop-shadow(0 0 1.6vmin rgba(255,190,90,.35))}
.tile .nm{font-weight:700;font-size:3.7vmin;line-height:1.05;text-align:center;color:#fff3da;text-shadow:0 .3vmin .5vmin #000,0 0 1.2vmin rgba(200,150,255,.6);margin:.6vmin 0 1vmin}
.pill{display:inline-block;padding:.5vmin 3.4vmin;border-radius:5vmin;font-weight:700;font-size:3.1vmin;color:#fff4d6;border:.3vmin solid transparent;
 background:linear-gradient(#3b1592,#1d0a55) padding-box,var(--frame) border-box;box-shadow:0 0 1.2vmin rgba(255,190,90,.45),inset 0 .4vmin .6vmin rgba(255,255,255,.15)}
.combo{position:relative;margin-top:2.6vmin;width:100%;padding:1.6vmin 2vmin;border-radius:3vmin;display:flex;align-items:center;justify-content:center;gap:3vmin;cursor:pointer;border:.55vmin solid transparent;
 background:radial-gradient(ellipse at 50% 0,rgba(255,220,140,.35),transparent 60%) padding-box,linear-gradient(90deg,#2a0d6e,#5b1fc4 30%,#7a2fe0 50%,#5b1fc4 70%,#2a0d6e) padding-box,var(--frame) border-box;
 box-shadow:0 0 3vmin rgba(255,190,80,.65),0 0 6vmin rgba(150,80,255,.5),0 1.2vmin 2vmin rgba(0,0,0,.7);animation:glow 2.6s ease-in-out infinite}
.combo .gold{font-size:6vmin}
.combo svg{width:5vmin;height:5vmin;filter:drop-shadow(0 0 1vmin #ffd36b)}
@keyframes glow{50%{box-shadow:0 0 5vmin rgba(255,200,90,.9),0 0 8vmin rgba(150,80,255,.6),0 1.2vmin 2vmin rgba(0,0,0,.7)}}
.foot{margin-top:2vmin;width:84%;padding:1.2vmin;border-radius:3vmin;text-align:center;font-size:2.8vmin;font-weight:600;color:#f2e2c0;
 background:linear-gradient(90deg,transparent,rgba(10,4,30,.85) 20%,rgba(10,4,30,.85) 80%,transparent);border-top:.15vmin solid rgba(246,201,90,.5);border-bottom:.15vmin solid rgba(246,201,90,.5)}
.foot svg{color:var(--g2);width:3.4vmin;height:3.4vmin;vertical-align:-.9vmin;margin-right:.6vmin}
.foot .dot{color:var(--g2);margin:0 1.4vmin}
/* ---- кнопки ---- */
.btn{position:relative;font-family:"CormorantSC","Cormorant",serif;font-weight:700;font-size:4.6vmin;letter-spacing:.03em;padding:1.4vmin 5vmin;border-radius:4vmin;cursor:pointer;
 border:.5vmin solid transparent;color:transparent;background:linear-gradient(180deg,#6d2fe0,#3c1296 55%,#22075e) padding-box,var(--frame) border-box;
 box-shadow:0 0 2.4vmin rgba(255,190,80,.6),0 0 4vmin rgba(150,80,255,.55),0 .9vmin 0 #2a1004,0 1.4vmin 2vmin rgba(0,0,0,.6),inset 0 .5vmin .8vmin rgba(255,255,255,.25)}
.btn span{background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 .2vmin 0 #4a2a04)}
.btn.red{font-size:3.4vmin;background:linear-gradient(180deg,#a3163a,#6e0a24 55%,#45041a) padding-box,var(--frame) border-box;box-shadow:0 0 1.6vmin rgba(255,80,110,.45),0 .9vmin 0 #2a0410,0 1.4vmin 2vmin rgba(0,0,0,.6),inset 0 .5vmin .8vmin rgba(255,255,255,.2)}
.btn.red span{background:linear-gradient(#fff,#ffe1c4);-webkit-background-clip:text;background-clip:text}
.btn.ghost{font-size:3vmin;padding:1vmin 3vmin;background:rgba(14,6,40,.75) padding-box,var(--frame) border-box;box-shadow:0 0 1.2vmin rgba(255,190,80,.35)}
.btn.ghost span{background:linear-gradient(#fff3d0,#f2d08a);-webkit-background-clip:text;background-clip:text}
.btn:disabled{filter:grayscale(.85) brightness(.6);cursor:default}
.btn:active:not(:disabled){transform:translateY(.6vmin)}
.btn .sp{width:3.6vmin;height:3.6vmin;vertical-align:-.5vmin;margin:0 1.4vmin}
.back{position:absolute;left:3vmin;top:3vmin;z-index:3}
.back svg{width:2.6vmin;height:2.6vmin;color:var(--g2);vertical-align:-.4vmin}
/* ---- оплата ---- */
.paytop{display:grid;grid-template-columns:1fr 1.25fr;gap:3vmin;width:100%;margin-top:.5vmin;flex:1;min-height:0}
.svc{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2vmin}
.svc img{height:24vmin;max-width:90%;object-fit:contain;filter:drop-shadow(0 0 2vmin rgba(255,190,90,.5))}
.svc .nm{font-weight:700;font-size:5vmin;color:#fff3da;text-shadow:0 .3vmin .5vmin #000;margin:1vmin 0}
.slot{display:flex;align-items:center;gap:1vmin}
.slot img{width:62%;filter:drop-shadow(0 1.5vmin 2vmin rgba(0,0,0,.6))}
.slot div{font-weight:700;font-size:3.6vmin;color:#fff0d0;text-shadow:0 0 1.2vmin rgba(255,200,120,.5),0 .3vmin .4vmin #000;text-align:center}
.balbar{width:100%;margin-top:2.6vmin;padding:2vmin 7vmin;border-radius:3vmin;display:flex;flex-direction:column;align-items:center;position:relative}
.balbar .spk{position:absolute;top:50%;transform:translateY(-50%);width:7vmin;height:7vmin;filter:drop-shadow(0 0 1.4vmin #ffcf5e)}
.balbar .gold{font-size:6.5vmin}
.prog{width:100%;height:2.6vmin;margin-top:1.2vmin;border-radius:2vmin;background:rgba(0,0,0,.55);border:.2vmin solid rgba(246,201,90,.5);overflow:hidden;box-shadow:inset 0 .3vmin .6vmin #000}
.prog i{display:block;height:100%;width:0;border-radius:2vmin;background:linear-gradient(180deg,#fff0a0,#ffc23a 50%,#e08a10);box-shadow:0 0 1.6vmin #ffb52e;transition:width .6s}
.note{font-size:2.8vmin;color:#e9d6b0;margin-top:1.2vmin;text-shadow:0 .2vmin .3vmin #000}
.btnrow{display:flex;gap:3vmin;align-items:center;justify-content:center;margin-top:2.4vmin;width:100%}
.testbar{position:absolute;left:50%;bottom:.6vmin;transform:translateX(-50%);display:flex;gap:.6vmin;align-items:center;z-index:4;font-family:system-ui,sans-serif;font-size:1.6vmin;
 color:#9fdcae;background:rgba(0,0,0,.55);padding:.5vmin 1vmin;border-radius:1vmin;border:1px dashed rgba(140,240,170,.5)}
.testbar button{font-size:1.6vmin;padding:.4vmin 1vmin;border-radius:.6vmin;border:1px solid #5a8;background:#0e2a1a;color:#cfe;cursor:pointer}
.testbar input{font-size:1.5vmin;width:38vmin;background:#000;color:#cfe;border:1px solid #385}
/* ---- параметры ---- */
.panel{padding:3vmin 4vmin}
.big{font-size:3.8vmin;line-height:1.35;font-weight:600}
.choices{display:flex;gap:2.4vmin;justify-content:center;margin:2vmin 0}
.choice{display:flex;flex-direction:column;align-items:center;gap:.6vmin;padding:1.6vmin 3vmin;cursor:pointer;min-width:20vmin;border-radius:2vmin;font-weight:700;font-size:3.4vmin}
.choice svg{width:6vmin;height:6vmin;color:var(--g2)}
.choice.on{box-shadow:0 0 3vmin rgba(255,200,90,.9),0 0 5vmin rgba(150,80,255,.6),inset 0 0 3vmin rgba(255,200,90,.35)}
.dsel{display:flex;gap:1.4vmin;justify-content:center;margin:1vmin 0 2vmin}
select{font-family:"Cormorant";font-weight:700;font-size:3.8vmin;padding:.8vmin 2vmin;border-radius:1.6vmin;color:#fff1d4;border:.3vmin solid transparent;
 background:linear-gradient(#3b1592,#1d0a55) padding-box,var(--frame) border-box;-webkit-appearance:none;appearance:none;text-align:center}
.lbl{font-size:3.2vmin;color:#f3d895;font-weight:700}
/* ---- ритуалы ---- */
.fan{position:relative;width:100%;height:46vmin;margin-top:3vmin}
.card{position:absolute;width:13vmin;height:19.5vmin;border-radius:1.2vmin;cursor:pointer;background:url(img/card_back.webp) center/cover;
 box-shadow:0 0 0 .2vmin #d9a53a,0 .8vmin 1.6vmin rgba(0,0,0,.7),0 0 1.4vmin rgba(170,110,255,.5);transition:transform .55s cubic-bezier(.2,.8,.3,1.2),left .55s,top .55s,box-shadow .3s}
.card:hover{box-shadow:0 0 0 .2vmin #ffe08a,0 0 3vmin rgba(255,210,110,.9)}
.face{position:relative;width:26vmin;height:39vmin;border-radius:1.6vmin;background:url(img/card_face.webp) center/100% 100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;
 padding:3.2vmin 2vmin 3.6vmin;color:#3a1a6e;text-align:center;box-shadow:0 0 3vmin rgba(255,210,120,.75),0 1.4vmin 2.4vmin rgba(0,0,0,.7);animation:flip .9s cubic-bezier(.2,.8,.3,1)}
.face .rn{font-family:"CormorantSC";font-weight:700;font-size:3.2vmin;color:#6a3b10}
.face img{width:62%;filter:drop-shadow(0 0 1vmin rgba(200,140,40,.6))}
.face .cn{font-family:"CormorantSC";font-weight:700;font-size:3vmin;line-height:1;color:#3a1a6e;min-height:6vmin;display:flex;align-items:center}
@keyframes flip{from{transform:rotateY(90deg) scale(.8)}to{transform:none}}
.palm{width:36vmin;height:36vmin;margin:2vmin;background:url(img/palm.webp) center/contain no-repeat;border-radius:50%;cursor:pointer;touch-action:none;filter:drop-shadow(0 0 3vmin rgba(170,110,255,.8));transition:transform .3s}
.palm.hold{transform:scale(1.06);filter:drop-shadow(0 0 5vmin rgba(255,210,110,.95))}
.meter{width:60%;height:2.8vmin;border-radius:2vmin;background:rgba(0,0,0,.55);border:.2vmin solid rgba(246,201,90,.6);overflow:hidden}
.meter div{height:100%;width:0;background:linear-gradient(90deg,#7a2fe0,#ffd36b);box-shadow:0 0 1.4vmin #ffc548}
.spin{width:44vmin;height:44vmin;object-fit:contain;animation:rot 6s linear infinite;filter:drop-shadow(0 0 3vmin rgba(255,200,100,.6))}
@keyframes rot{to{transform:rotate(360deg)}}
.digits{font-family:"CormorantSC";font-weight:700;font-size:11vmin;letter-spacing:.1em;min-height:13vmin;background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 1.6vmin rgba(255,190,80,.6))}
/* ---- результат ---- */
.res{display:flex;gap:3vmin;align-items:center;justify-content:center;width:100%}
.res .txt{flex:1;padding:3vmin 3.6vmin;font-size:3.3vmin;line-height:1.35;font-weight:600}
.res .txt b{color:#ffd779}
.ans{font-family:"CormorantSC";font-weight:700;font-size:12vmin;background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 2vmin rgba(255,190,80,.7));line-height:1}
.ppf{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4vmin;width:100%}
.ppf .col{display:flex;flex-direction:column;align-items:center}
.ppf .face{width:21vmin;height:31.5vmin;padding:2.4vmin 1.6vmin 2.8vmin}
.ppf .face .cn{font-size:2.5vmin}
.ppf .pos{font-family:"CormorantSC";font-weight:700;font-size:4vmin;color:#ffd779;text-shadow:0 0 1.2vmin rgba(255,190,80,.6);margin-bottom:1vmin}
.ppf .txt{margin-top:1.6vmin;padding:1.6vmin 2vmin;font-size:2.7vmin;line-height:1.3;font-weight:600;text-align:center;width:100%;flex:1}
.scale{display:flex;align-items:center;gap:1.4vmin;font-size:2.9vmin;font-weight:700;margin:.8vmin 0}
.scale span:first-child{width:15vmin}.scale .meter{width:26vmin;height:2vmin}
.signart{width:26vmin;filter:drop-shadow(0 0 2vmin rgba(255,200,100,.6))}
/* ---- модалка, тост ---- */
.modal{position:absolute;inset:0;background:rgba(3,1,12,.75);backdrop-filter:blur(.6vmin);display:none;align-items:center;justify-content:center;z-index:10}
.modal.on{display:flex}
.modal .frame{padding:4vmin 5vmin;text-align:center;max-width:72%;font-size:4vmin;font-weight:700}
#cd{display:block;font-family:"CormorantSC";font-size:10vmin;background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent}
.toast{position:absolute;bottom:6vmin;left:50%;transform:translateX(-50%);padding:1.6vmin 4vmin;border-radius:2vmin;font-size:3vmin;font-weight:700;display:none;z-index:20;color:#fff;
 background:linear-gradient(#7a0f30,#45041a) padding-box,var(--frame) border-box;border:.3vmin solid transparent;box-shadow:0 0 2vmin rgba(255,80,110,.5)}
#scanbuf{position:absolute;left:-9999px;opacity:0}
/* ---- кабинет ---- */
.cab .brand{display:flex;align-items:center;gap:2vmin;margin:1vmin 0 2vmin}
.mono{display:flex;align-items:center;justify-content:center;width:11vmin;height:11vmin;border-radius:50%;font-family:"Cormorant";font-weight:700;font-size:4.6vmin;color:var(--c1);
 background:radial-gradient(circle at 35% 30%,#fff,var(--c2) 45%,color-mix(in srgb,var(--c2) 50%,#000));box-shadow:0 0 2.4vmin var(--c2),0 0 0 .4vmin rgba(255,255,255,.25)}
.cab .frame{background:linear-gradient(165deg,color-mix(in srgb,var(--c1) 85%,#fff 6%),color-mix(in srgb,var(--c1) 55%,#05020f) 60%,#07031a) padding-box,var(--frame) border-box}
.cabgrid{display:grid;grid-template-columns:1fr 1fr;gap:2.4vmin;width:100%;flex:1;min-height:0}
.cabgrid .frame{padding:2.4vmin 3vmin;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.cabgrid h3{margin:0 0 1vmin;font-family:"CormorantSC";font-size:4vmin;color:var(--g2)}
.cab .user{display:flex;gap:2vmin;align-items:center}
.cab .user img{width:12vmin;height:12vmin;border-radius:50%;border:.4vmin solid var(--g2);box-shadow:0 0 2vmin rgba(255,190,80,.6)}
.cab .bal{font-family:"CormorantSC";font-weight:700;font-size:10vmin;background:var(--goldgrad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 1.6vmin rgba(255,190,80,.6));line-height:1}
.amt{display:flex;gap:1.2vmin;flex-wrap:wrap;justify-content:center;margin:1vmin 0}
.amt .btn{font-size:3vmin;padding:.8vmin 2.4vmin}
/* ---- заставка ---- */
#attract{justify-content:center;cursor:pointer;z-index:5}
#attract .title b{font-size:14vmin}#attract .title img{height:15vmin}
#attract .t{margin-top:6vmin;font-size:4.6vmin;font-weight:700;color:#ffe9b5;text-shadow:0 0 2vmin rgba(255,200,100,.8);animation:pulse 2.2s infinite}
@keyframes pulse{50%{opacity:.35}}
/* --- фиксы раскладки --- */
body,#stage{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.gold,.btn,.pill,.digits,.ans,.bal,#cd,.rn{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.grid{grid-template-rows:repeat(2,minmax(0,1fr));grid-auto-rows:auto}
.tile{min-height:0;overflow:hidden}
.tile .art{flex:1 1 0;min-height:0;position:relative;width:100%}
.tile .art img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:86%;max-height:100%;object-fit:contain}
.tile .nm{font-size:3.4vmin}
.btn{white-space:nowrap;font-size:4vmin}
.btn .sp{width:3vmin;height:3vmin;margin:0 1vmin}
.paytop{grid-template-rows:minmax(0,1fr)}
.svc{min-height:0}.svc img{flex:1 1 0;min-height:0;height:auto;width:100%}
.svc .nm{font-size:4vmin;text-align:center;line-height:1.05}
.slot{min-height:0}.slot img{width:58%;max-height:100%;object-fit:contain}
.slot div{font-size:3.4vmin}
.balbar{margin-top:2vmin;padding:1.4vmin 9vmin}
.balbar .gold{font-size:5.6vmin}
.testbar{left:auto;right:1vmin;bottom:auto;top:1vmin;transform:none;opacity:.8}
.combo .gold{font-size:5.4vmin;white-space:nowrap}
.title b{font-size:9.5vmin}.title img{height:10vmin}
.sub{margin:.2vmin 0 1.4vmin}
.frame{background:radial-gradient(ellipse at 50% 38%,rgba(140,70,255,.45),transparent 62%) padding-box,linear-gradient(165deg,rgba(52,22,118,.9),rgba(22,8,62,.93) 55%,rgba(10,4,34,.96)) padding-box,var(--frame) border-box}
.tile{padding:.6vmin .8vmin 1.6vmin}
.tile .art img{max-width:92%;max-height:108%}
.tile .nm{margin:.2vmin 0 .7vmin;font-size:3.5vmin}
.tile .pill{font-size:2.8vmin;padding:.3vmin 3vmin}
.combo{margin-top:2vmin;padding:1.1vmin 2vmin}
.foot{margin-top:1.4vmin;padding:.8vmin}
.frame::after{top:.4vmin;height:22%;opacity:.55;background:linear-gradient(rgba(255,255,255,.10),rgba(255,255,255,0));border-radius:2vmin 2vmin 40% 40%/2vmin 2vmin 100% 100%}
.face{display:block;padding:0;background-size:100% 100%}
.face .rn{position:absolute;left:0;right:0;top:1.6%;height:5.4%;display:flex;align-items:center;justify-content:center;font-size:2.6vmin;color:#4a2606;text-shadow:0 .1vmin 0 rgba(255,240,190,.8)}
.face .cn{position:absolute;left:20%;right:20%;bottom:2.6%;height:7.4%;min-height:0;display:flex;align-items:center;justify-content:center;font-size:2.3vmin;color:#3a1c04;text-shadow:0 .1vmin 0 rgba(255,240,190,.8);white-space:nowrap}
.ppf .face .cn{font-size:1.8vmin}.ppf .face .rn{font-size:2vmin}
.ppf .face{width:24vmin;height:36vmin}
.card{width:14vmin;height:21vmin}
.res>.face{width:30vmin;height:45vmin;flex:none}
.frame{background:radial-gradient(ellipse at 50% 40%,rgba(120,60,230,.30),transparent 65%) padding-box,linear-gradient(165deg,rgba(28,12,74,.94),rgba(12,5,38,.96) 55%,rgba(6,2,22,.98)) padding-box,var(--frame) border-box}
.tile.frame{background:radial-gradient(ellipse at 50% 38%,rgba(150,80,255,.5),transparent 62%) padding-box,linear-gradient(165deg,rgba(60,26,135,.9),rgba(26,10,72,.93) 55%,rgba(12,5,40,.96)) padding-box,var(--frame) border-box}
.slot img{width:66%}
.title b{filter:drop-shadow(0 .3vmin 0 #5a3205) drop-shadow(0 0 2.4vmin rgba(255,190,80,.7))}
.tile.frame{background:radial-gradient(ellipse at 50% 36%,rgba(140,70,255,.42),transparent 60%) padding-box,linear-gradient(165deg,rgba(34,14,88,.93),rgba(14,6,44,.95) 55%,rgba(7,3,24,.97)) padding-box,var(--frame) border-box}
.tile .art img{max-height:116%;max-width:96%}
/* тёмные индиго-плитки как в макете */
.tile.frame{background:radial-gradient(ellipse at 50% 34%,rgba(110,50,220,.30),transparent 58%) padding-box,linear-gradient(170deg,rgba(24,12,66,.95),rgba(12,6,40,.97) 55%,rgba(6,3,22,.98)) padding-box,var(--frame) border-box;
 box-shadow:0 0 1.8vmin rgba(150,90,255,.45),0 0 .8vmin rgba(255,200,100,.45),0 1.4vmin 2.4vmin rgba(0,0,0,.75),inset 0 0 3vmin rgba(110,60,230,.28)}
#stars{width:100%;height:100%;display:block}
.dpick{display:flex;gap:2vmin;justify-content:center;margin:1vmin 0 2.2vmin}
.spin-col{display:flex;flex-direction:column;align-items:center;gap:.6vmin}
.spin-v{min-width:14vmin;padding:1vmin 2vmin;text-align:center;font-weight:700;font-size:4.4vmin;border-radius:1.6vmin;color:#fff1d4;border:.3vmin solid transparent;
 background:linear-gradient(#2b1270,#140743) padding-box,var(--frame) border-box;box-shadow:inset 0 0 1.6vmin rgba(150,90,255,.4)}
.spin-col[data-f=m] .spin-v{min-width:26vmin}
.spin-b{width:11vmin;height:6.4vmin;border-radius:3vmin;border:.3vmin solid transparent;cursor:pointer;touch-action:none;color:#ffd779;
 background:linear-gradient(#5b26c4,#2a0d78) padding-box,var(--frame) border-box;box-shadow:0 .5vmin 0 #1a0640,0 0 1.2vmin rgba(255,190,80,.4)}
.spin-b svg{width:4vmin;height:4vmin;transform:rotate(90deg)}.spin-b.dn svg{transform:rotate(-90deg)}
.spin-b:active{transform:translateY(.4vmin)}
body.notest .testbar{display:none}