/* 🌗 «یکتا» combo cards */
.cb{position:absolute;inset:0;border-radius:14px;overflow:hidden;isolation:isolate;font-family:inherit;color:#fff}
.cb-h{position:absolute;inset:0;overflow:hidden}
.cb-img{position:absolute;inset:0;background:center 18%/cover #1a1f33;transition:transform .6s}
.cb-h b{position:absolute;z-index:3;font-size:clamp(8px,7cqw,13px);font-weight:800;padding:3px 9px;border-radius:99px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);white-space:nowrap;max-width:70%;overflow:hidden;text-overflow:ellipsis}
.cb-cap{position:absolute;z-index:5;text-align:center;line-height:1.2;pointer-events:none}
.cb-cap small{display:inline-block;font-size:clamp(7px,5.2cqw,10px);font-weight:900;letter-spacing:.5px;padding:1px 8px;border-radius:99px;margin-bottom:3px}
.cb-gl{position:absolute;inset:0;z-index:6;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.28) 48%,transparent 60%);background-size:250% 100%;animation:cbGl 6s ease-in-out infinite}
@keyframes cbGl{0%,60%{background-position:120% 0}100%{background-position:-120% 0}}

/* 🌗 sun & moon: split on a diagonal, warm petals above, moonlit navy below */
.cb-sun{background:#0b1022;box-shadow:inset 0 0 0 2px rgba(255,255,255,.12)}
.cb-sun .cb-a{clip-path:polygon(0 0,100% 0,100% 44%,0 70%)}
.cb-sun .cb-b{clip-path:polygon(100% 44%,100% 100%,0 100%,0 70%)}
.cb-sun .cb-b .cb-img{top:36%;background-position:center 15%}
.cb-sun .cb-a .cb-tint{position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,120,170,.15),rgba(255,92,150,.55) 70%);mix-blend-mode:soft-light}
.cb-sun .cb-a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(120,20,60,.55) 72%)}
.cb-sun .cb-b .cb-tint{position:absolute;inset:0;background:linear-gradient(200deg,rgba(14,26,66,.25),rgba(6,10,30,.85) 90%);mix-blend-mode:multiply}
.cb-sun .cb-a b{top:12px;left:10px;background:rgba(255,92,150,.35);border:1px solid rgba(255,190,215,.5)}
.cb-sun .cb-b b{bottom:24%;right:10px;background:rgba(20,34,80,.55);border:1px solid rgba(200,215,255,.4)}
.cb-seam{position:absolute;z-index:4;left:-10%;width:120%;top:57%;height:2px;transform:rotate(-14.5deg);background:linear-gradient(90deg,transparent,#ffe7a8 20%,#fff 50%,#cfdcff 80%,transparent);box-shadow:0 0 12px 2px rgba(255,236,190,.8)}
.cb-sunb{position:absolute;z-index:4;width:26px;height:26px;left:calc(50% - 13px);top:calc(57% - 13px);border-radius:50%;background:radial-gradient(circle at 40% 40%,#fff,#ffe08a 40%,transparent 41%),conic-gradient(from 0deg,#fff0 0 20deg,#ffe7a888 20deg 25deg,#fff0 25deg 65deg,#ffe7a888 65deg 70deg,#fff0 70deg);animation:cbSpin 14s linear infinite;filter:drop-shadow(0 0 6px #ffd98a)}
@keyframes cbSpin{to{transform:rotate(360deg)}}
.cb-moon{position:absolute;z-index:3;right:14px;top:58%;width:20px;height:20px;border-radius:50%;box-shadow:-5px 3px 0 0 #e8eeff;filter:drop-shadow(0 0 6px rgba(200,215,255,.9));transform:rotate(-20deg)}
.cb-st{position:absolute;z-index:2;width:2px;height:2px;border-radius:50%;background:#fff;left:calc(8% + var(--i)*11%);top:calc(62% + (var(--i)*37%) % 30%);animation:cbTw 2.4s ease-in-out infinite;animation-delay:calc(var(--i)*-.37s)}
@keyframes cbTw{50%{opacity:.15;transform:scale(.5)}}
.cb-pt{position:absolute;z-index:2;width:7px;height:5px;border-radius:70% 0 70% 0;background:linear-gradient(135deg,#ffd1e2,#ff7aaa);left:calc(4% + var(--i)*13%);top:-8px;opacity:.9;animation:cbFall 7s linear infinite;animation-delay:calc(var(--i)*-1s)}
@keyframes cbFall{0%{transform:translate(0,0) rotate(0)}100%{transform:translate(-30px,190px) rotate(320deg);opacity:0}}
.cb-sun .cb-cap{left:0;right:0;bottom:8px}
.cb-sun .cb-cap small{background:linear-gradient(90deg,#ff7aaa,#ffe08a,#9fb6ff);color:#1a0f1e}
.cb-sun .cb-cap b{display:block;font-size:clamp(11px,9.5cqw,17px);font-weight:900;letter-spacing:-.2px;background:linear-gradient(90deg,#ffc7db,#fff3cf,#cad7ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}


/* the back: issue number and date */
.cb-back{position:absolute;inset:0;overflow:hidden;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqw;text-align:center;padding:8cqw;color:#fff;line-height:1.35}
.cb-back.cb-sun{background:linear-gradient(160deg,#5a1d3d 0%,#2a1736 45%,#0e1638 100%)}
.cb-back small{font-size:clamp(7px,5.6cqw,11px);opacity:.75}
.cb-back .cb-no{font-family:inherit;font-size:clamp(22px,20cqw,38px);font-weight:900;line-height:1;background:linear-gradient(90deg,#ffd1e2,#fff3cf,#cad7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cb-back>span{font-size:clamp(7px,6cqw,12px);opacity:.8}
.cb-back p{margin:4cqw 0 0;font-size:clamp(8px,7cqw,13px);font-weight:700}.cb-back p i{font-style:normal;color:#ffe08a;margin:0 4px}
.cb-back em{font-style:normal;font-size:clamp(7px,5.6cqw,11px);opacity:.65}
.cb-back .cb-lock{margin-top:3cqw;font-size:clamp(6px,4.8cqw,10px);opacity:.5}

/* wrappers: the profile showcase and the cards page shelf */
.vt-f.hc.combo{padding:0;background:none;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 34px rgba(255,170,200,.25),0 18px 40px rgba(0,0,0,.55)}
.vt-b.combo{padding:0;background:none;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.cb-back small{color:inherit;font-weight:600}
.cbs{margin:0 0 18px;padding:14px;border-radius:18px;background:linear-gradient(120deg,rgba(255,120,170,.10),rgba(120,150,255,.10));border:1px solid rgba(255,255,255,.1)}
.cbs h3{margin:0 0 10px;font-size:15px}.cbs h3 small{font-weight:500;opacity:.65;font-size:11px;margin-inline-start:6px}
.cbs-row{display:flex;gap:14px;flex-wrap:wrap}
.cbs-c{position:relative;width:min(170px,42vw);aspect-ratio:5/7;perspective:900px;cursor:pointer;background:none;border:0;padding:0}
.cbs-c .cbs-in{position:absolute;inset:0;transition:transform .7s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d}
.cbs-c .cb,.cbs-c .cb-back{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.cbs-c .cb-back{transform:rotateY(180deg)}
.cbs-c.flip .cbs-in{transform:rotateY(180deg)}

/* the reveal */
.cbr{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;background:rgba(4,5,12,.0);transition:background .4s,opacity .35s}
.cbr.go{background:rgba(4,5,12,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.cbr.out{opacity:0}
.cbr-in{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px;padding:16px}
.cbr-card{position:relative;width:min(240px,62vw);aspect-ratio:5/7}
.cbr .cb-a{transform:translateX(-120vw)}.cbr .cb-b{transform:translateX(120vw)}
.cbr.go .cb-a,.cbr.go .cb-b{animation:cbIn .9s cubic-bezier(.2,.9,.25,1) .2s forwards}
@keyframes cbIn{to{transform:none}}
@keyframes cbFade{to{opacity:1}}
.cbr-flash{position:absolute;left:50%;top:34%;width:10px;height:10px;border-radius:50%;background:#fff;opacity:0;transform:translate(-50%,-50%);pointer-events:none}
.cbr.go .cbr-flash{animation:cbFl .9s ease-out 1.05s}
@keyframes cbFl{0%{opacity:1;box-shadow:0 0 0 0 rgba(255,240,210,.9)}100%{opacity:0;box-shadow:0 0 0 60vmax rgba(255,240,210,0)}}
.cbr-t{text-align:center;color:#fff;opacity:0;transform:translateY(14px)}
.cbr.go .cbr-t{animation:cbUp .6s ease 1.6s forwards}
@keyframes cbUp{to{opacity:1;transform:none}}
.cbr-t small{font-size:11px;letter-spacing:.5px;opacity:.7}.cbr-t b{display:block;font-size:22px;font-weight:900;margin:4px 0}
.cbr-t p{margin:0 0 12px;font-size:13px;opacity:.8;max-width:300px}
.cbr-t button{font:inherit;font-weight:800;padding:9px 26px;border-radius:99px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
html.lite .cb-gl,html.lite .cb-pt,html.lite .cb-sunb{animation:none}
@media (prefers-reduced-motion:reduce){.cb-gl,.cb-pt,.cb-st,.cb-sunb{animation:none}.cbr.go *{animation-duration:.01s!important;animation-delay:0s!important}}

.vt-f.hc.combo,.cbs-c .cbs-in,.cbr-card,.vt-b.combo{container-type:inline-size}
.vt-card.flip .cb,.cbs-c.flip .cb{visibility:hidden;transition:visibility 0s .3s}

/* compact banner on the cards page */
.cbs{padding:0;background:none;border:0;margin:0 0 16px;display:grid;gap:10px}
.cbb{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:12px 16px;border-radius:18px;isolation:isolate;
  background:linear-gradient(115deg,#3a1430 0%,#5a1d3d 38%,#141c44 62%,#0b1130 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 14px 30px -18px rgba(0,0,0,.8)}
.cbb::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(240px 120px at 15% 50%,rgba(255,140,190,.25),transparent 70%),radial-gradient(240px 120px at 85% 50%,rgba(140,170,255,.18),transparent 70%)}
.cbb-seam{position:absolute;z-index:-1;top:-20%;bottom:-20%;left:50%;width:2px;transform:rotate(22deg);background:linear-gradient(180deg,transparent,#ffe7a8,#fff,#cfdcff,transparent);box-shadow:0 0 14px 2px rgba(255,236,190,.55);opacity:.7}
.cbb .cbs-c{flex:none;width:76px;transform:rotate(-4deg);transition:transform .3s}
.cbb .cbs-c:hover{transform:rotate(0) scale(1.06)}
.cbb-t{flex:1;min-width:0;line-height:1.45}
.cbb-t small{font-size:10.5px;font-weight:800;letter-spacing:.1em;color:#ffc7db}
.cbb-t b{display:block;font:400 22px/1.3 Lalezar,var(--font);background:linear-gradient(90deg,#ffc7db,#fff3cf,#cad7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cbb-t p{margin:0;font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cbb-t p i{font-style:normal;color:#ffe08a;margin:0 4px}
.cbb-t em{font-style:normal;font-size:11px;color:rgba(255,255,255,.6)}
.cbb-show{flex:none;font:800 12px var(--font);padding:8px 14px;border-radius:99px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;backdrop-filter:blur(6px)}
.cbb-show.on{border-color:rgba(255,224,138,.5);color:#ffe08a}
@media (max-width:560px){.cbb{gap:12px;padding:10px 12px;flex-wrap:wrap}.cbb .cbs-c{width:64px}.cbb-t b{font-size:19px}.cbb-show{width:100%}}

/* 👑 VIP workshop frames (same diagonal layout, own palette) */
.cb-crown{position:absolute;z-index:7;top:6px;right:8px;font-size:clamp(10px,9cqw,16px);filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.cb-vip{box-shadow:inset 0 0 0 2px rgba(255,224,138,.55)}
/* 🌸 sakura: white-pink spring */
.cb-f-sakura .cb-a .cb-tint{background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,160,200,.55) 70%)}
.cb-f-sakura .cb-a::after{background:linear-gradient(180deg,transparent 40%,rgba(200,60,120,.45) 72%)}
.cb-f-sakura .cb-b .cb-tint{background:linear-gradient(200deg,rgba(255,200,225,.2),rgba(90,20,60,.8) 90%)}
.cb-f-sakura .cb-seam{background:linear-gradient(90deg,transparent,#ffd1e2 20%,#fff 50%,#ffd1e2 80%,transparent);box-shadow:0 0 12px 2px rgba(255,190,215,.85)}
.cb-f-sakura .cb-b b{background:rgba(120,30,80,.55);border-color:rgba(255,200,225,.45)}
.cb-f-sakura .cb-cap small{background:linear-gradient(90deg,#fff,#ffb3cf)}
.cb-f-sakura .cb-cap b{background-image:linear-gradient(90deg,#fff,#ffc7db,#fff)}
.cb-back.cb-f-sakura{background:linear-gradient(160deg,#7a2c55,#3d1631 55%,#1d0d1f)}
/* 👑 crown: black and gold */
.cb-f-crown{background:#0d0b06;box-shadow:inset 0 0 0 2px rgba(255,214,110,.8)}
.cb-f-crown .cb-a .cb-tint{background:linear-gradient(160deg,rgba(255,220,120,.1),rgba(160,110,20,.5) 70%)}
.cb-f-crown .cb-a::after{background:linear-gradient(180deg,transparent 40%,rgba(40,25,0,.6) 72%)}
.cb-f-crown .cb-b .cb-tint{background:linear-gradient(200deg,rgba(40,30,10,.25),rgba(10,8,2,.88) 90%)}
.cb-f-crown .cb-seam{background:linear-gradient(90deg,transparent,#ffd66e 20%,#fff6d0 50%,#ffd66e 80%,transparent);box-shadow:0 0 14px 3px rgba(255,200,80,.85)}
.cb-f-crown .cb-a b,.cb-f-crown .cb-b b{background:rgba(30,22,4,.65);border-color:rgba(255,214,110,.6);color:#ffe7a8}
.cb-f-crown .cb-cap small{background:linear-gradient(90deg,#b8862b,#ffe08a,#b8862b)}
.cb-f-crown .cb-cap b{background-image:linear-gradient(90deg,#ffd66e,#fff6d0,#ffd66e)}
.cb-f-crown .cb-pt{background:linear-gradient(135deg,#fff3c4,#ffc94a)}
.cb-back.cb-f-crown{background:linear-gradient(160deg,#3a2a08,#1a1305 55%,#0a0803)}
/* 🌑 eclipse: crimson and violet */
.cb-f-eclipse .cb-a .cb-tint{background:linear-gradient(160deg,rgba(255,80,80,.12),rgba(170,20,50,.6) 70%)}
.cb-f-eclipse .cb-a::after{background:linear-gradient(180deg,transparent 40%,rgba(60,0,20,.6) 72%)}
.cb-f-eclipse .cb-b .cb-tint{background:linear-gradient(200deg,rgba(60,20,90,.3),rgba(14,4,26,.9) 90%)}
.cb-f-eclipse .cb-seam{background:linear-gradient(90deg,transparent,#ff6b6b 20%,#fff 50%,#b46bff 80%,transparent);box-shadow:0 0 14px 3px rgba(255,90,120,.7)}
.cb-f-eclipse .cb-a b{background:rgba(140,20,40,.5);border-color:rgba(255,140,150,.5)}.cb-f-eclipse .cb-b b{background:rgba(50,15,80,.6);border-color:rgba(200,160,255,.45)}
.cb-f-eclipse .cb-cap small{background:linear-gradient(90deg,#ff6b6b,#ffd0d0,#b46bff)}
.cb-f-eclipse .cb-cap b{background-image:linear-gradient(90deg,#ff9a9a,#fff,#d4b0ff)}
.cb-f-eclipse .cb-sunb{filter:drop-shadow(0 0 8px #ff5a6e) hue-rotate(-40deg)}
.cb-back.cb-f-eclipse{background:linear-gradient(160deg,#5a0f22,#2a0c2e 55%,#0e0618)}
/* 🌌 aurora: teal and violet northern lights */
.cb-f-aurora .cb-a .cb-tint{background:linear-gradient(160deg,rgba(80,255,200,.12),rgba(30,160,170,.55) 70%)}
.cb-f-aurora .cb-a::after{background:linear-gradient(180deg,transparent 40%,rgba(0,50,60,.55) 72%)}
.cb-f-aurora .cb-b .cb-tint{background:linear-gradient(200deg,rgba(60,40,140,.3),rgba(6,8,30,.88) 90%)}
.cb-f-aurora .cb-seam{background:linear-gradient(90deg,transparent,#5effc8 20%,#fff 50%,#9b8cff 80%,transparent);box-shadow:0 0 14px 3px rgba(94,255,200,.6)}
.cb-f-aurora .cb-a b{background:rgba(10,90,90,.5);border-color:rgba(120,255,220,.45)}.cb-f-aurora .cb-b b{background:rgba(40,30,100,.6);border-color:rgba(170,160,255,.45)}
.cb-f-aurora .cb-cap small{background:linear-gradient(90deg,#5effc8,#e0fff6,#9b8cff)}
.cb-f-aurora .cb-cap b{background-image:linear-gradient(90deg,#8dffdc,#fff,#bfb4ff)}
.cb-f-aurora .cb-pt{background:linear-gradient(135deg,#d0fff0,#5effc8)}
.cb-back.cb-f-aurora{background:linear-gradient(160deg,#0d4a4a,#14183f 55%,#080a1c)}
.cb-f-crown .cb-back .cb-no,.cb-back.cb-f-crown .cb-no{background-image:linear-gradient(90deg,#ffd66e,#fff6d0,#ffd66e)}

/* 👑 the workshop on the cards page */
.vw-bn{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;isolation:isolate;color:#fff;
  background:linear-gradient(115deg,#2a1d05 0%,#4a3208 30%,#2b1238 70%,#120b26 100%);box-shadow:inset 0 0 0 1px rgba(255,214,110,.35),0 14px 30px -18px rgba(0,0,0,.8)}
.vw-bn::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(260px 120px at 12% 50%,rgba(255,200,90,.28),transparent 70%),radial-gradient(260px 120px at 88% 50%,rgba(190,120,255,.22),transparent 70%)}
.vw-bn .vw-ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:24px;background:linear-gradient(135deg,#ffe08a,#c88a1e);box-shadow:0 6px 18px -6px rgba(255,190,60,.8)}
.vw-bn div{flex:1;min-width:0;line-height:1.5}.vw-bn small{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:#ffd66e}
.vw-bn b{display:block;font-size:16px;font-weight:900}.vw-bn p{margin:0;font-size:12.5px;color:rgba(255,255,255,.75)}
.vw-go{flex:none;font:800 13px var(--font,inherit);padding:10px 16px;border-radius:12px;border:0;cursor:pointer;color:#2a1a00;background:linear-gradient(90deg,#ffe08a,#ffb84a);white-space:nowrap;text-decoration:none}
@media (max-width:560px){.vw-bn{flex-wrap:wrap}.vw-go{width:100%;text-align:center}}
.vw{position:fixed;inset:0;z-index:2147482000;display:grid;place-items:center;padding:14px;background:rgba(4,6,14,.82);backdrop-filter:blur(6px)}
html.lite .vw{backdrop-filter:none}
.vw-in{position:relative;width:min(820px,100%);max-height:calc(100dvh - 28px);overflow-y:auto;overflow-x:hidden;box-sizing:border-box;border-radius:24px;padding:18px 18px 0;color:#E8EEF8;
  background:radial-gradient(400px 220px at 85% 0,rgba(255,200,90,.14),transparent 70%),linear-gradient(160deg,#1a1730,#0f1222);box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,214,110,.25)}
.vw-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.vw-h b{font-size:19px;font-weight:900}
.vw-h button{width:34px;height:34px;border-radius:10px;border:0;background:rgba(255,255,255,.08);color:#fff;font-size:20px;cursor:pointer}
.vw-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px}.vw-grid>div{min-width:0}
.vw-prev{position:sticky;top:0;align-self:start;aspect-ratio:5/7;container-type:inline-size;border-radius:14px;box-shadow:0 0 0 1px rgba(255,214,110,.35),0 0 40px rgba(255,200,90,.25),0 20px 40px rgba(0,0,0,.6)}
.vw-step{margin-bottom:14px;padding:12px;border-radius:16px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.vw-step>small{display:block;font-size:12.5px;font-weight:900;color:#ffd66e;margin-bottom:8px}
.vw-q{width:100%;box-sizing:border-box;margin:0 0 8px;padding:7px 11px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.2);color:#fff;font:inherit;font-size:12.5px}
.vw-pk{display:grid;grid-template-columns:repeat(auto-fill,minmax(66px,1fr));gap:8px;max-height:206px;overflow-y:auto;padding:2px;scrollbar-width:thin;overscroll-behavior:contain}
.vw-pk button{min-width:0;border:0;padding:0;background:none;color:#fff;cursor:pointer;text-align:center;font:600 10.5px var(--font,inherit)}
.vw-pk button i{display:block;aspect-ratio:3/4;border-radius:10px;background:center 18%/cover #223;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);margin-bottom:4px;transition:transform .15s}
.vw-pk button:hover i{transform:translateY(-2px)}
.vw-pk button.on i{box-shadow:inset 0 0 0 3px #ffd66e,0 0 16px rgba(255,214,110,.5)}
.vw-pk button.on span{color:#ffe08a}
.vw-pk button span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vw-fr{display:flex;gap:6px;flex-wrap:wrap}.vw-fr button{padding:7px 12px;border-radius:99px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:#fff;font:700 12.5px var(--font,inherit);cursor:pointer}
.vw-fr button.on{border-color:#ffd66e;background:rgba(255,214,110,.15);color:#ffe08a}
.vw-none{font-size:12.5px;color:rgba(255,255,255,.6);padding:10px;border-radius:12px;background:rgba(255,255,255,.04)}
.vw-foot{position:sticky;bottom:0;margin:0 -18px;padding:12px 18px 14px;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(15,18,34,0),#0f1222 35%)}
.vw-make{min-width:220px;height:46px;padding:0 26px;border:0;border-radius:14px;font:900 15px var(--font,inherit);color:#2a1a00;background:linear-gradient(90deg,#ffe08a,#ffb84a);cursor:pointer;box-shadow:0 10px 26px -10px rgba(255,180,60,.7)}
.vw-make:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
.vw-note{margin:0;font-size:11.5px;color:rgba(255,255,255,.55)}
@media (max-width:620px){.vw-in{padding:14px 12px 0;border-radius:20px}.vw-grid{grid-template-columns:minmax(0,1fr);gap:12px}.vw-prev{position:relative;width:150px;margin:0 auto}.vw-pk{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px;max-height:170px}.vw-step{padding:10px}.vw-foot{margin:0 -12px;padding:10px 12px 12px}.vw-make{width:100%}.vw-note{display:none}}

/* ✦ my unique cards: a lit stage with the cards standing on pedestals */
.cbg{position:relative;overflow:hidden;isolation:isolate;padding:18px 16px 16px;border-radius:24px;
  background:radial-gradient(120% 80% at 50% 0,#2a1840 0%,#140f2a 45%,#0a0b1c 100%);box-shadow:inset 0 0 0 1px rgba(255,214,110,.18),0 24px 50px -30px rgba(0,0,0,.9)}
.cbg::after{content:"";position:absolute;inset:auto 0 0;height:38%;z-index:-1;background:linear-gradient(180deg,transparent,rgba(255,200,110,.06));border-top:1px solid rgba(255,255,255,.05)}
.cbg-spot{position:absolute;z-index:-1;left:50%;top:-40%;width:80%;height:130%;transform:translateX(-50%);background:conic-gradient(from 180deg at 50% 0,transparent 160deg,rgba(255,236,190,.13) 175deg,rgba(255,236,190,.2) 180deg,rgba(255,236,190,.13) 185deg,transparent 200deg);pointer-events:none}
.cbg-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px;color:#fff}
.cbg-h b{font:400 22px/1.3 Lalezar,var(--font,inherit);background:linear-gradient(90deg,#ffc7db,#fff3cf,#cad7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cbg-h small{font-size:11.5px;color:rgba(255,255,255,.55)}
.cbg-row{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;padding:16px 4px 4px}
.cbg-it{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;width:150px;text-align:center;color:#fff;animation:cbgIn .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 70ms)}
@keyframes cbgIn{from{opacity:0;transform:translateY(18px)}}
.cbg-it .cbs-c{width:150px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.cbg-it .cbs-c:hover{transform:translateY(-8px) rotate(-1.5deg)}
.cbg-it .cbs-in{border-radius:14px;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 18px 34px -14px rgba(0,0,0,.9)}
.cbg-it.on .cbs-in{box-shadow:0 0 0 2px #ffd66e,0 0 30px rgba(255,200,90,.35),0 18px 34px -14px rgba(0,0,0,.9)}
.cbg-ped{width:120%;height:14px;margin:8px 0 6px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,200,110,.55),transparent 70%);filter:blur(2px)}
.cbg-it b{font-size:14.5px;font-weight:900}
.cbg-it small{font-size:11.5px;color:rgba(255,255,255,.72);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cbg-it small i{font-style:normal;color:#ffe08a}
.cbg-it em{font-style:normal;font-size:10.5px;color:rgba(255,255,255,.45)}
.cbg-act{display:flex;gap:6px;margin-top:6px}
.cbg-act button{height:30px;padding:0 12px;border-radius:99px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);color:#fff;font:800 11.5px var(--font,inherit);cursor:pointer}
.cbg-act button.on{border-color:rgba(255,224,138,.6);color:#ffe08a;background:rgba(255,214,110,.12)}
.cbg-act button.del{width:30px;padding:0;color:#ff9aa8}
.cbg-act button.del:hover{background:rgba(255,90,110,.18);border-color:rgba(255,120,140,.5)}
html.lite .cbg-it{animation:none}
@media (max-width:620px){.cbg{padding:14px 10px 12px;border-radius:20px}.cbg-row{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;gap:14px;padding:14px 6px 6px;scroll-snap-type:x mandatory;scrollbar-width:none}.cbg-row::-webkit-scrollbar{display:none}.cbg-it{flex:none;width:128px;scroll-snap-align:center}.cbg-it .cbs-c{width:128px}}