/* =======================================================
   FrogCube — тёмный «гейминг / CS-панель» стиль + iOS-док
   ======================================================= */
:root,:root[data-theme="dark"]{
  --bg:#05080a; --panel:#0c1410; --panel2:#0a110d;
  --line:rgba(74,240,158,.16); --line2:rgba(255,255,255,.07);
  --accent:#39ff8b; --accent2:#34c7ff; --warn:#ff5d8f;
  --ink:#e8f3ec; --muted:#8197a0;
  --panel-grad:linear-gradient(180deg,rgba(18,26,21,.78),rgba(9,15,12,.85));
  --glass-bg:rgba(8,13,10,.55);
  --glass-hi:rgba(255,255,255,.44);
  --glass-edge:rgba(255,255,255,.18);
  --dock-glass:rgba(16,26,22,.42);
  --top-bg:rgba(6,10,8,.6);
  --field-bg:rgba(0,0,0,.3);
  --grid-line:rgba(255,255,255,.07);
  --shadow:0 18px 50px rgba(0,0,0,.5);
  --r:6px;
  --ease:cubic-bezier(.16,1,.3,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --mono:ui-monospace,"SF Mono",Consolas,monospace;
}
:root[data-theme="light"]{
  --bg:#eef2f0; --panel:#ffffff; --panel2:#f3f7f5;
  --line:rgba(20,150,90,.22); --line2:rgba(10,30,20,.08);
  --accent:#0fae63; --accent2:#0a86d8; --warn:#e0356f;
  --ink:#0d1a14; --muted:#5d7068;
  --panel-grad:linear-gradient(180deg,rgba(255,255,255,.92),rgba(244,249,246,.96));
  --glass-bg:rgba(255,255,255,.55);
  --glass-hi:rgba(255,255,255,.72);
  --glass-edge:rgba(10,30,20,.12);
  --dock-glass:rgba(255,255,255,.48);
  --top-bg:rgba(255,255,255,.7);
  --field-bg:rgba(10,30,20,.04);
  --grid-line:rgba(10,40,25,.06);
  --shadow:0 18px 44px rgba(40,70,55,.16);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%}
html{transition:background .5s ease}
body{
  font-family:-apple-system,"SF Pro Display","Segoe UI",Roboto,system-ui,sans-serif;
  color:var(--ink); background:var(--bg); overflow-x:hidden;
  padding-bottom:130px; -webkit-font-smoothing:antialiased; line-height:1.5;
  transition:background .5s ease,color .5s ease;
}
::selection{background:color-mix(in srgb,var(--accent) 34%,transparent);color:var(--ink)}
body.noscroll{overflow:hidden}
/* плавный кросс-фейд при смене темы */
.theme-anim *{transition:background-color .5s ease,color .5s ease,border-color .5s ease,box-shadow .5s ease !important}
/* scroll-reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease) var(--rd,0ms),transform .6s var(--ease) var(--rd,0ms)}
.reveal.seen{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;letter-spacing:-.01em;line-height:1.1}
img{max-width:100%}
button{font-family:inherit;cursor:pointer}
.muted{color:var(--muted)}
.mt{margin-top:14px}
.grad{background:linear-gradient(100deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- фон ---------- */
.fx{position:fixed;inset:0;z-index:-2;overflow:hidden;transition:background .5s ease;
  background:
    radial-gradient(60% 50% at 12% 0%, color-mix(in srgb,var(--accent) 12%,transparent), transparent 60%),
    radial-gradient(60% 50% at 90% 0%, color-mix(in srgb,var(--accent2) 12%,transparent), transparent 60%),
    linear-gradient(140deg,rgba(255,255,255,.035),transparent 28%,rgba(52,199,255,.035) 64%,transparent 100%),
    var(--bg);
}
body[style*="--site-bg"] .fx{background-image:var(--site-bg);background-size:cover;background-position:center}
.fx::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);
  background-size:42px 42px;opacity:.6;mask:radial-gradient(circle at 50% 30%,#000,transparent 75%);
  animation:gridfloat 24s ease-in-out infinite}
@keyframes gridfloat{0%,100%{background-position:0 0}50%{background-position:42px 21px}}
.scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);animation:scan 8s linear infinite;opacity:.5}
@keyframes scan{to{transform:translateY(3px)}}
.vig{position:absolute;inset:0;box-shadow:inset 0 0 200px 40px rgba(0,0,0,.7)}
.glow{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;mix-blend-mode:screen}
.g1{width:520px;height:520px;left:-100px;top:-120px;background:radial-gradient(circle,#0f8,#0000);animation:orbf1 26s ease-in-out infinite}
.g2{width:560px;height:560px;right:-140px;bottom:-160px;background:radial-gradient(circle,#08c,#0000);animation:orbf2 30s ease-in-out infinite}
@keyframes orbf1{0%,100%{transform:translate(0,0)}50%{transform:translate(70px,50px)}}
@keyframes orbf2{0%,100%{transform:translate(0,0)}50%{transform:translate(-60px,-40px)}}

/* ---------- общие панели/кнопки ---------- */
.panel{position:relative;background:var(--panel-grad);
  border:1px solid var(--line);border-radius:var(--r);backdrop-filter:blur(12px) saturate(150%);
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .5s ease,border-color .5s ease}
.panel::after{content:"";position:absolute;top:0;left:14px;right:14px;height:1px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4}
.panel:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));box-shadow:var(--shadow),0 0 0 1px rgba(255,255,255,.035),inset 0 1px 0 rgba(255,255,255,.09)}

.btn-fill{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 18px;border:0;border-radius:var(--r);font-weight:800;font-size:14px;letter-spacing:.02em;
  text-transform:uppercase;color:#04130b;background:linear-gradient(120deg,var(--accent),var(--accent2));
  box-shadow:0 10px 24px -8px var(--accent),inset 0 1px 0 rgba(255,255,255,.4);
  transition:transform .2s var(--ease),filter .2s}
.btn-fill{position:relative;overflow:hidden}
.btn-fill::after{content:"";position:absolute;top:-50%;left:-70%;width:40%;height:200%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);
  transition:left .6s var(--ease)}
.btn-fill:hover::after{left:140%}
.btn-fill:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn-fill:active{transform:scale(.97)}
.btn-fill:disabled{opacity:.45;filter:grayscale(.6);cursor:not-allowed}
.btn-fill .ic{width:18px;height:18px}
.btn-fill.big{width:100%;padding:14px}
.btn-fill.sm{padding:9px 14px;font-size:12px}
.btn-fill.xs{padding:7px 9px;font-size:12px}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:var(--r);
  font-weight:700;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);
  transition:.2s var(--ease)}
.btn-ghost:hover{background:rgba(57,255,139,.1);border-color:var(--accent);transform:translateY(-1px)}
.btn-ghost.sm{padding:8px 12px;font-size:12px}
.btn-ghost.lg{padding:13px 20px}
.btn-ghost.xs{padding:6px 9px;font-size:13px;line-height:1}
.btn-ghost.danger:hover{background:rgba(255,93,143,.15);border-color:var(--warn)}

/* ---------- шапка ---------- */
.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:12px clamp(14px,4vw,38px);background:linear-gradient(180deg,color-mix(in srgb,var(--top-bg) 88%,rgba(255,255,255,.1)),var(--top-bg));
  backdrop-filter:blur(20px) saturate(170%);-webkit-backdrop-filter:blur(20px) saturate(170%);
  border-bottom:1px solid var(--line);box-shadow:0 10px 34px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.07);
  transition:background .5s ease,border-color .5s ease}
.brand{display:flex;align-items:center;gap:10px}
.brand__cube{width:40px;height:40px;display:grid;place-items:center;font-size:22px;border-radius:10px;
  background:linear-gradient(160deg,#62ff9c,#0d754a 62%,#0a4d38);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 18px rgba(40,200,120,.36)}
.brand__name{font-weight:900;letter-spacing:.06em;font-size:18px}
.brand__name i{font-style:normal;color:var(--accent)}
.chip{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;
  font:600 13px/1 var(--mono);color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);transition:.2s}
.chip:hover{background:rgba(57,255,139,.1);border-color:var(--accent)}
.chip .ic{width:15px;height:15px;color:var(--accent)}
/* инструменты: валюта + тема */
.tools{display:flex;align-items:center;gap:8px}
.cur{position:relative}
.cur__btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;font:700 13px/1 var(--mono);
  color:var(--ink);background:rgba(127,127,127,.08);border:1px solid var(--line);transition:.2s}
.cur__btn:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.cur__sym{color:var(--accent)}
.caret{width:0;height:0;border:4px solid transparent;border-top-color:currentColor;margin-top:3px;opacity:.6;transition:transform .25s}
.cur.open .caret{transform:rotate(180deg)}
.cur__menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;min-width:160px;display:flex;flex-direction:column;
  padding:6px;border-radius:12px;background:var(--panel-grad);border:1px solid var(--line);
  box-shadow:var(--shadow);backdrop-filter:blur(16px);opacity:0;transform:translateY(-8px) scale(.97);pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease)}
.cur.open .cur__menu{opacity:1;transform:none;pointer-events:auto}
.cur__menu button{text-align:left;padding:9px 11px;border:0;border-radius:8px;background:none;color:var(--ink);font-weight:600;font-size:14px;transition:.15s}
.cur__menu button:hover{background:color-mix(in srgb,var(--accent) 16%,transparent);transform:translateX(2px)}
.themebtn{display:grid;place-items:center;width:42px;height:34px;border:0;background:none}
.themebtn__track{position:relative;width:42px;height:24px;border-radius:999px;border:1px solid var(--line);
  background:color-mix(in srgb,var(--accent2) 20%,transparent);transition:background .4s ease}
.themebtn.is-light .themebtn__track{background:color-mix(in srgb,#ffcf5a 55%,transparent)}
.themebtn__knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;
  background:linear-gradient(160deg,#cfe9ff,#7fb6ff);box-shadow:0 2px 6px rgba(0,0,0,.4);
  transition:transform .45s var(--spring),background .4s}
.themebtn.is-light .themebtn__knob{transform:translateX(18px);background:linear-gradient(160deg,#fff2c0,#ffcf5a)}

.acct{display:flex;align-items:center;gap:10px}
.acct__stat{display:inline-flex;align-items:center;gap:5px;font:700 13px/1 var(--mono);color:var(--accent)}
.acct__stat .ic{width:15px;height:15px}
.acct__ava img{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:#111;image-rendering:pixelated}

/* ---------- toasts ---------- */
.toast{position:fixed;top:74px;left:50%;transform:translateX(-50%);z-index:80;
  padding:12px 20px;border-radius:var(--r);font-weight:600;background:rgba(14,20,16,.92);
  border:1px solid var(--accent);box-shadow:0 14px 40px rgba(0,0,0,.5);animation:tin .4s var(--ease)}
.toast.err{border-color:var(--warn)}
@keyframes tin{from{opacity:0;transform:translate(-50%,-12px)}to{opacity:1;transform:translate(-50%,0)}}

/* ---------- wrap / заголовки ---------- */
.wrap{max-width:1120px;margin:0 auto;padding:clamp(20px,4vw,44px) clamp(14px,4vw,38px)}
.phead{margin:6px 0 24px}
.phead h1{font-size:clamp(26px,5vw,40px);font-weight:900;text-transform:uppercase;letter-spacing:.02em}
.phead p{color:var(--muted);margin:8px 0 0;max-width:560px}
.phead.admin__head{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.h2{font-size:clamp(22px,3.5vw,30px);font-weight:900;text-transform:uppercase;letter-spacing:.02em;margin:34px 0 18px}
.h2.sm{font-size:18px;margin:28px 0 14px;color:var(--muted)}
.back{color:var(--muted);font-weight:700}

/* ---------- HERO ---------- */
.hero{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;margin-top:8px}
.hero__glasspanel{padding:clamp(22px,4vw,40px);border-radius:14px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(57,255,139,.1),rgba(52,199,255,.07) 52%,rgba(255,255,255,.025)),linear-gradient(180deg,rgba(14,22,17,.82),rgba(8,13,10,.91));
  border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));backdrop-filter:blur(14px) saturate(145%);
  -webkit-backdrop-filter:blur(14px) saturate(145%);box-shadow:0 24px 60px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.12)}
.hero__glasspanel::before{content:"";position:absolute;inset:1px;border-radius:13px;pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.14),transparent 34%,rgba(255,255,255,.05) 62%,transparent);
  mask:linear-gradient(#000,transparent 58%)}
.kicker{font:700 12px/1 var(--mono);letter-spacing:.25em;color:var(--accent);text-transform:uppercase}
.hero h1{font-size:clamp(32px,6vw,58px);font-weight:900;text-transform:uppercase;margin:14px 0;letter-spacing:-.01em}
.hero__sub{color:var(--muted);max-width:480px;margin:0 0 22px}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.ipbig{display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border-radius:var(--r);cursor:pointer;
  background:rgba(0,0,0,.3);border:1px dashed var(--line);color:var(--ink);transition:.2s}
.ipbig:hover{border-color:var(--accent);background:rgba(57,255,139,.07)}
.ipbig small{display:block;font:600 10px/1 var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.15em;margin-bottom:4px}
.ipbig b{font:800 18px/1 var(--mono)}
.ipbig .ic{width:18px;height:18px;color:var(--accent)}
.hero__stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.stat{padding:20px;text-align:center;border-radius:var(--r);
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 84%,rgba(255,255,255,.12)),color-mix(in srgb,var(--panel2) 88%,rgba(0,0,0,.08)));
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 36px rgba(0,0,0,.22)}
.stat b{display:block;font:900 26px/1 var(--mono);color:var(--accent)}
.stat span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}

/* ---------- features ---------- */
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feat{padding:22px}
.feat__i{font-size:30px;margin-bottom:10px}
.feat h3{font-size:16px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px}
.feat p{color:var(--muted);font-size:14px;margin:0}

/* ---------- tiers ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tiers--full{grid-template-columns:repeat(3,1fr)}
.tier{padding:20px;overflow:hidden;transition:transform .3s var(--ease)}
.tier::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c,#39ff8b);box-shadow:0 0 18px var(--c)}
.tier::after{background:linear-gradient(90deg,transparent,var(--c),transparent)}
.tier:hover{transform:translateY(-5px)}
.tier__head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tier__badge{width:46px;height:46px;display:grid;place-items:center;font-size:22px;font-weight:900;border-radius:10px;
  color:#05080a;background:var(--c,#39ff8b);box-shadow:0 8px 20px -6px var(--c),inset 0 1px 0 rgba(255,255,255,.5)}
img.tier__badge{object-fit:cover;background:#111;image-rendering:pixelated}
.tier__name{font-size:20px;font-weight:900;text-transform:uppercase;letter-spacing:.02em}
.tier__name small{display:block;font-size:11px;font-weight:600;color:var(--muted);text-transform:none;letter-spacing:0}
.tier__price{display:flex;align-items:baseline;gap:8px;margin:8px 0 4px}
.tier__price b{font:900 30px/1 var(--mono)}
.tier__price span{color:var(--muted);font-size:13px}
.tier__tok{color:var(--accent);font-weight:700;font-size:13px;margin-bottom:16px}
.tier__go{color:var(--muted);font-weight:700;font-size:13px}
.tier--mini:hover .tier__go{color:var(--accent)}

/* селектор дней — мини-док */
.daydock{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:4px;margin:0 0 14px;
  border-radius:12px;background:rgba(0,0,0,.35);border:1px solid var(--line2)}
.daydock__pill{position:absolute;top:4px;left:4px;height:calc(100% - 8px);border-radius:9px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--c,#39ff8b) 38%,transparent),rgba(255,255,255,.12));
  border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 4px 12px rgba(0,0,0,.4);
  transition:left .5s var(--ease),width .5s var(--ease)}
.daydock button{position:relative;z-index:1;padding:9px 4px;border:0;background:none;border-radius:9px;
  color:var(--muted);font-weight:700;font-size:13px;transition:color .3s}
.daydock button.is-active{color:#fff}

/* ---------- cards (кейсы/токены/услуги) ---------- */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ccard{padding:20px;text-align:center;overflow:hidden;transition:transform .3s var(--ease)}
.ccard::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 70% at 50% -10%,color-mix(in srgb,var(--c,#39ff8b) 22%,transparent),transparent 60%);pointer-events:none}
.ccard:hover{transform:translateY(-5px)}
.ccard__emoji{font-size:42px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}
.ccard__name{font-weight:800;margin:12px 0 4px;text-transform:uppercase;font-size:14px;letter-spacing:.02em}
.ccard__tok{color:var(--accent);font-size:13px;font-weight:700}
.ccard__price{font:900 20px/1 var(--mono);margin:8px 0 14px}

/* topup */
.topup{padding:22px;display:flex;flex-direction:column;gap:12px;max-width:420px}
.topup__note{color:var(--muted);font-size:13px}

/* ---------- формы ---------- */
label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
input,select,textarea{font-family:inherit;font-size:15px;color:var(--ink);padding:11px 13px;border-radius:var(--r);
  border:1px solid var(--line);background:rgba(0,0,0,.3);outline:none;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(57,255,139,.15)}
textarea{resize:vertical}
select option{background:#0c140f}
input[type=color]{padding:2px;height:42px}
input[type=file]{padding:8px}
.file{cursor:pointer}
.file input{margin-top:4px}

/* ---------- МОДАЛКА КАССЫ ---------- */
.modal{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:16px;
  background:rgba(3,6,5,.6);backdrop-filter:blur(8px);animation:tin .3s}
.modal[hidden]{display:none}
.modal__card{width:min(440px,100%);padding:24px;animation:sheet .45s var(--ease)}
@keyframes sheet{from{opacity:0;transform:translateY(26px) scale(.96)}to{opacity:1;transform:none}}
.modal__x{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink)}
.checkout__head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.checkout__badge{width:46px;height:46px;display:grid;place-items:center;font-size:22px;border-radius:10px;
  background:linear-gradient(120deg,var(--accent),var(--accent2));color:#05080a;font-weight:900}
.checkout__sub{color:var(--muted);font-size:13px;margin-top:2px}
.cardface{position:relative;height:150px;border-radius:14px;padding:18px;margin-bottom:18px;color:#dfeee6;
  background:linear-gradient(120deg,#0d2a1c,#0a1822 70%);border:1px solid var(--line);overflow:hidden}
.cardface::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(57,255,139,.25),transparent 70%)}
.cardface__chip{width:42px;height:30px;border-radius:6px;background:linear-gradient(135deg,#d8c067,#9c8332);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.cardface__num{font:700 20px/1 var(--mono);letter-spacing:.12em;margin-top:30px}
.cardface__row{display:flex;justify-content:space-between;font:600 12px/1 var(--mono);margin-top:14px;color:#9fc0b0;text-transform:uppercase}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fields .full{grid-column:1/-1}
.checkout__total{display:flex;justify-content:space-between;align-items:center;margin:16px 0 12px;color:var(--muted);font-weight:600}
.checkout__total b{font:900 24px/1 var(--mono);color:var(--ink)}
.checkout__safe{text-align:center;color:var(--muted);font-size:12px;margin:10px 0 0}

/* switch */
.balrow{flex-direction:row;align-items:center;justify-content:space-between;color:var(--ink);font-weight:600;margin:6px 0}
.balrow b{color:var(--accent)}
.sw{position:relative;width:48px;height:28px;flex:none}
.sw input{position:absolute;opacity:0}
.sw i{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.14);transition:.3s}
.sw i::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .35s var(--ease);box-shadow:0 2px 6px rgba(0,0,0,.4)}
.sw input:checked + i{background:var(--accent)}
.sw input:checked + i::after{transform:translateX(20px)}

/* ---------- НИЖНИЙ ДОК + LIQUID GLASS ---------- */
.dock{position:fixed;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:50;
  width:min(540px,calc(100% - 28px));animation:dockin .9s var(--spring) both;
  filter:drop-shadow(0 28px 34px rgba(0,0,0,.34))}
@keyframes dockin{from{opacity:0;transform:translate(-50%,60px) scale(.9)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
.dock__bar{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:8px;border-radius:30px;overflow:hidden;
  isolation:isolate;background:
    linear-gradient(180deg,rgba(255,255,255,.18),transparent 21%),
    radial-gradient(120% 150% at 50% -70%,rgba(255,255,255,.22),transparent 54%),
    linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,transparent),color-mix(in srgb,var(--accent2) 12%,transparent)),
    var(--dock-glass);
  border:1px solid var(--glass-edge);backdrop-filter:blur(34px) saturate(190%) brightness(1.05);
  -webkit-backdrop-filter:blur(34px) saturate(190%) brightness(1.05);
  box-shadow:
    0 22px 58px rgba(0,0,0,.42),
    inset 0 1px 0 var(--glass-hi),
    inset 0 -1px 0 rgba(255,255,255,.08),
    inset 0 -18px 34px rgba(0,0,0,.18)}
.dock__bar::before{content:"";position:absolute;inset:1px;border-radius:29px;z-index:-1;pointer-events:none;
  background:
    linear-gradient(115deg,rgba(255,255,255,.28),transparent 26%,rgba(255,255,255,.08) 48%,transparent 73%),
    radial-gradient(80% 45% at 50% 0%,rgba(255,255,255,.22),transparent 72%);
  opacity:.82;mix-blend-mode:screen}
.dock__bar::after{content:"";position:absolute;inset:auto 13px 5px;height:18px;border-radius:999px;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 100% at 50% 100%,rgba(0,0,0,.32),transparent 78%);filter:blur(10px)}
.dtab{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  min-width:0;min-height:58px;padding:9px 4px;border-radius:22px;color:var(--muted);font-size:11px;font-weight:750;
  transition:color .35s var(--ease),transform .32s var(--spring),background .25s var(--ease)}
.dtab::before{content:"";position:absolute;inset:5px;border-radius:18px;z-index:-1;opacity:0;transform:scale(.92);
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.1);
  transition:opacity .28s var(--ease),transform .28s var(--spring)}
.dtab::after{content:"";width:4px;height:4px;border-radius:50%;background:currentColor;opacity:0;transform:translateY(3px) scale(.7);
  box-shadow:0 0 12px currentColor;transition:opacity .25s var(--ease),transform .25s var(--spring)}
.dtab:hover::before{opacity:.65;transform:scale(1)}
.dtab .ic{width:23px;height:23px;flex:none;transition:transform .35s var(--spring),filter .3s,color .25s}
.dtab span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.15}
.dtab.is-active{color:var(--accent)}
.dtab.is-active::after{opacity:.9;transform:translateY(0) scale(1)}
.dtab.mag .ic{transform:translateY(-5px) scale(1.45);filter:drop-shadow(0 6px 14px color-mix(in srgb,var(--accent) 70%,transparent))}
.dtab.mag{color:var(--ink)}
.dtab:active{transform:scale(.88)}
.dock__bar:hover .dtab:not(.mag):not(:hover){opacity:.82}

/* линза-желе */
.dock__lens{position:absolute;top:6px;height:calc(100% - 12px);width:84px;z-index:3;border-radius:25px;cursor:grab;touch-action:none;
  --sx:1;--sy:1;--skew:0deg;
  transform:scaleX(var(--sx)) scaleY(var(--sy)) skewX(var(--skew));transform-origin:center;
  transition:left .55s var(--spring),transform .25s var(--ease)}
.dock__lens.drag{cursor:grabbing;transition:transform .08s linear}
.dock__lens.wobble{animation:wob .6s var(--spring)}
@keyframes wob{
  0%{transform:scaleX(1.4) scaleY(.78)}
  35%{transform:scaleX(.86) scaleY(1.14)}
  60%{transform:scaleX(1.08) scaleY(.95)}
  100%{transform:scaleX(1) scaleY(1)}
}
/* стекло */
.lens__glass{position:absolute;inset:0;border-radius:inherit;overflow:hidden;
  backdrop-filter:blur(7px) saturate(220%) brightness(1.18) contrast(1.04);
  -webkit-backdrop-filter:blur(7px) saturate(220%) brightness(1.18) contrast(1.04);
  background:
    radial-gradient(85% 115% at 50% -18%,rgba(255,255,255,.48),transparent 55%),
    linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,.08) 43%,rgba(0,0,0,.05) 100%);
  box-shadow:inset 0 0 20px rgba(255,255,255,.08)}
.lens__glass::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(90deg,rgba(52,199,255,.22),transparent 28%,rgba(57,255,139,.2) 72%,transparent);
  filter:blur(8px);opacity:.72}
/* бегущий блик внутри стекла */
.lens__glass::after{content:"";position:absolute;top:-40%;left:-60%;width:50%;height:180%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);animation:sheen 4.2s ease-in-out infinite}
@keyframes sheen{0%,55%{left:-60%}100%{left:150%}}
.lens__ring{position:absolute;inset:0;border-radius:inherit;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.62),inset 0 13px 16px -9px rgba(255,255,255,.85),
    inset 11px 0 18px -10px rgba(52,199,255,.9),inset -11px 0 18px -10px rgba(57,255,139,.8),
    0 10px 28px rgba(0,0,0,.38),0 0 28px color-mix(in srgb,var(--accent) 34%,transparent)}
.lens__ring::after{content:"";position:absolute;top:9%;left:18%;width:36%;height:26%;border-radius:50%;
  background:rgba(255,255,255,.6);filter:blur(2.5px)}

/* ---------- подвал ---------- */
.foot{text-align:center;padding:24px 16px 8px;color:rgba(255,255,255,.4)}
.foot__row{font:900 16px/1 var(--mono);letter-spacing:.06em;color:var(--muted);display:flex;gap:8px;justify-content:center;align-items:center}
.foot__row i{font-style:normal;color:var(--accent)}
.foot p{max-width:620px;margin:10px auto 0;font-size:12px}

/* ---------- auth/profile ---------- */
.authbox{max-width:420px;margin:20px auto;padding:28px}
.authbox h1{text-transform:uppercase;margin-bottom:6px}
.authbox form{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.authswap{margin-top:16px;color:var(--muted);font-size:14px}
.authswap a{color:var(--accent);font-weight:700}
.profile{display:grid;grid-template-columns:320px 1fr;gap:16px;align-items:start}
.pcard{padding:24px;text-align:center}
.pcard__ava{width:96px;height:96px;border-radius:14px;border:1px solid var(--line);image-rendering:pixelated;background:#111}
.pcard__name{font-weight:800;font-size:18px;margin:12px 0;display:flex;gap:8px;justify-content:center;align-items:center}
.pcard__stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pcard__stats b{display:block;font:900 20px/1 var(--mono);color:var(--accent)}
.pcard__stats span{font-size:12px;color:var(--muted)}
.promoredeem{display:flex;gap:8px;margin-top:12px}
.promoredeem input{flex:1}
.phist{padding:22px}
.htab{width:100%;border-collapse:collapse;font-size:14px}
.htab th{text-align:left;color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase;padding:6px 8px;border-bottom:1px solid var(--line)}
.htab td{padding:9px 8px;border-bottom:1px solid var(--line2)}
.role{font:700 11px/1 var(--mono);padding:3px 7px;border-radius:5px;text-transform:uppercase}
.role--user{background:rgba(255,255,255,.08);color:var(--muted)}
.role--helper{background:rgba(52,199,255,.16);color:var(--accent2)}
.role--moder{background:rgba(57,255,139,.16);color:var(--accent)}
.role--admin{background:rgba(255,93,143,.16);color:var(--warn)}

/* ---------- форум ---------- */
.tkstats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.tkstat{padding:14px;border-radius:var(--r);text-align:center;border:1px solid var(--line);background:var(--panel-grad)}
.tkstat b{display:block;font:900 24px/1 var(--mono)}
.tkstat span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.tkstat.st-open b{color:var(--accent2)}.tkstat.st-ok b{color:var(--accent)}
.tkstat.st-no b{color:var(--warn)}.tkstat.st-cl b{color:var(--muted)}
.forum{display:grid;grid-template-columns:360px 1fr;gap:16px;align-items:start}
.ticketform{padding:22px;display:flex;flex-direction:column;gap:14px}
.ticketform h3{font-size:17px}
.typepick{display:flex;gap:8px;margin-top:4px}
.typeopt{flex:1;cursor:pointer}
.typeopt input{position:absolute;opacity:0}
.typeopt span{display:flex;align-items:center;justify-content:center;gap:5px;padding:10px 6px;border-radius:10px;
  border:1px solid var(--line);background:var(--field-bg);font-size:13px;font-weight:700;color:var(--muted);transition:.2s var(--ease)}
.typeopt input:checked + span{border-color:var(--accent);color:var(--ink);background:color-mix(in srgb,var(--accent) 14%,transparent);transform:translateY(-2px)}
.tickets{display:flex;flex-direction:column;gap:12px}
.tk{padding:14px 16px;display:flex;align-items:center;gap:14px;transition:transform .25s var(--spring),box-shadow .25s}
.tk:hover{transform:translateY(-3px) scale(1.01)}
.tk__emoji{font-size:26px;width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:var(--field-bg);flex:none}
.tk__main{flex:1;min-width:0}
.tk__type{font-weight:800;text-transform:capitalize}
.tk__meta{color:var(--muted);font-size:13px}
.tk__meta b{color:var(--ink)}
.st{padding:5px 12px;border-radius:999px;font:700 12px/1 var(--mono);white-space:nowrap}
.st--big{padding:8px 16px;font-size:13px}
.st-open{background:rgba(52,199,255,.16);color:var(--accent2)}
.st-ok{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent)}
.st-no{background:rgba(255,93,143,.16);color:var(--warn)}
.st-cl{background:rgba(127,127,127,.16);color:var(--muted)}
.empty{padding:34px;text-align:center;color:var(--ink);font-weight:700;font-size:17px}
/* тикет — детально */
.ticket{padding:24px}
.ticket__top{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.ticket__emoji{font-size:30px;width:54px;height:54px;display:grid;place-items:center;border-radius:14px;background:var(--field-bg);flex:none}
.ticket__titlewrap{flex:1;min-width:160px}
.ticket__top h1{font-size:23px;text-transform:uppercase}
.ttype{color:var(--accent)}
.ticket__meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;color:var(--muted);font-size:13px;margin-top:6px}
.ticket__meta b{color:var(--ink)}
.tag{font:700 11px/1 var(--mono);padding:3px 7px;border-radius:5px;background:var(--field-bg);color:var(--muted)}
.thread{display:flex;flex-direction:column;gap:12px;margin:18px 0}
.thread__empty{text-align:center;color:var(--muted);padding:18px;font-size:14px}
.msg{display:flex;gap:12px;animation:msgin .45s var(--ease) both}
@keyframes msgin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.msg__ava{width:40px;height:40px;border-radius:11px;flex:none;image-rendering:pixelated;background:var(--field-bg);border:1px solid var(--line2)}
.msg__body{flex:1;padding:12px 15px;border-radius:4px 14px 14px 14px;background:var(--field-bg);border:1px solid var(--line2)}
.msg--op .msg__body{border-color:var(--line)}
.msg--staff{flex-direction:row-reverse}
.msg--staff .msg__body{border-radius:14px 4px 14px 14px;background:color-mix(in srgb,var(--accent) 10%,transparent);border-color:var(--line)}
.msg--staff .msg__head{flex-direction:row-reverse}
.msg__head{display:flex;align-items:center;gap:8px;font-size:14px}
.msg__head b{font-weight:800}
.msg__head time{color:var(--muted);font-size:12px;margin-left:auto}
.msg--staff .msg__head time{margin-left:0;margin-right:auto}
.msg__body p{margin:5px 0 0;word-break:break-word}
.composer{display:flex;gap:8px;margin-top:6px}
.composer__in{flex:1}
.closed-note{text-align:center;color:var(--muted);padding:14px;border-radius:var(--r);background:var(--field-bg);font-weight:600}
.staffbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;padding:12px 14px;border-radius:var(--r);
  background:var(--field-bg);border:1px dashed var(--line)}
.staffbar__lbl{color:var(--ink);font-size:13px;font-weight:800}
.decide--st-ok:hover:not(:disabled){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent)}
.decide--st-no:hover:not(:disabled){border-color:var(--warn);background:rgba(255,93,143,.14)}
.decide:disabled{opacity:.4;cursor:not-allowed}

/* ---------- админка ---------- */
.admin{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.acard{padding:22px}
.acard h3{text-transform:uppercase;letter-spacing:.02em;margin-bottom:14px;font-size:16px}
.acard--wide{grid-column:1/-1}
.acard form{margin-bottom:10px}
.acard hr{border:0;border-top:1px solid var(--line2);margin:14px 0}
.acard .row{display:flex;gap:8px;margin-top:8px}
.roleform,.promoform{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.inlbl{flex-direction:row;align-items:center;gap:6px;color:var(--ink);font-size:13px}
.stafflist{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.atab{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.atab th{text-align:left;color:var(--muted);font-size:11px;text-transform:uppercase;padding:6px;border-bottom:1px solid var(--line)}
.atab td{padding:7px 6px;border-bottom:1px solid var(--line2)}
.atab tr.off{opacity:.45}
.x{border:0;background:none;color:var(--warn);cursor:pointer;font-size:14px}
.prow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 0;border-bottom:1px solid var(--line2)}
.prow--hidden{opacity:.5}
.prow input{padding:7px 8px;font-size:13px;background:rgba(0,0,0,.3)}
.prow__icon{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--c) 30%,#111);font-weight:900;color:#fff}
.prow__icon .i{width:22px;height:22px;font-size:18px}
.w-name{width:120px}.w-grp{width:90px}.w-col{width:42px;padding:2px}.w-ico{width:80px}.w-file{width:120px}
.prow__grp{display:inline-flex;align-items:center;gap:3px;font-size:12px;color:var(--muted)}
.prow__grp input{width:62px}
.prow__btns{display:flex;gap:6px;border:0}
.addprod{margin-top:14px}
.addprod summary{cursor:pointer;color:var(--accent);font-weight:700;margin-bottom:8px}

/* ---------- адаптив ---------- */
@media(max-width:900px){
  .hero{grid-template-columns:1fr}
  .features,.cards{grid-template-columns:repeat(2,1fr)}
  .tiers,.tiers--full{grid-template-columns:repeat(2,1fr)}
  .forum,.profile,.admin{grid-template-columns:1fr}
}
@media(max-width:560px){
  .features,.cards,.tiers,.tiers--full{grid-template-columns:1fr}
  .hero__stats{grid-template-columns:1fr 1fr}
  .top{gap:10px}.chip{order:3;margin-left:0;width:100%;justify-content:center}
  .fields{grid-template-columns:1fr 1fr}
  .dtab span{font-size:10px}
}

/* =======================================================
   White Donate redesign
   ======================================================= */
:root,
:root[data-theme="light"],
:root[data-theme="dark"]{
  --bg:#f7fafc;
  --panel:#ffffff;
  --panel2:#f4f7fb;
  --line:rgba(20,47,75,.11);
  --line2:rgba(20,47,75,.075);
  --accent:#20c775;
  --accent2:#2f80ed;
  --warn:#ef4776;
  --gold:#ffb020;
  --ink:#122033;
  --muted:#64758b;
  --panel-grad:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,251,255,.94));
  --glass-bg:rgba(255,255,255,.66);
  --glass-hi:rgba(255,255,255,.92);
  --glass-edge:rgba(16,40,72,.12);
  --dock-glass:rgba(255,255,255,.72);
  --top-bg:rgba(255,255,255,.78);
  --field-bg:rgba(245,248,252,.82);
  --grid-line:rgba(45,87,130,.055);
  --shadow:0 18px 46px rgba(31,54,83,.12);
  --r:8px;
}
html{background:var(--bg)}
body{
  background:var(--bg);
  color:var(--ink);
  letter-spacing:0;
}
.theme-anim *{transition:background-color .35s ease,color .35s ease,border-color .35s ease,box-shadow .35s ease !important}
.fx{
  background:
    linear-gradient(135deg,rgba(47,128,237,.1),transparent 32%),
    linear-gradient(225deg,rgba(32,199,117,.1),transparent 34%),
    linear-gradient(180deg,rgba(255,176,32,.08),transparent 42%),
    linear-gradient(180deg,#fff 0%,#f7fafc 45%,#f2f6fb 100%);
}
body[style*="--site-bg"] .fx{
  background:
    linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,250,252,.92)),
    var(--site-bg);
  background-size:cover;
  background-position:center;
}
.fx::before{
  opacity:.62;
  background-size:36px 36px;
  mask:linear-gradient(#000,transparent 76%);
}
.scan,.vig{display:none}
.glow{display:none}
.g1{background:radial-gradient(circle,rgba(47,128,237,.42),transparent 68%)}
.g2{background:radial-gradient(circle,rgba(32,199,117,.34),transparent 68%)}

.panel,
.hero__glasspanel,
.stat,
.tkstat{
  background:var(--panel-grad);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
}
.panel::after,
.tier::after{
  left:18px;
  right:18px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c,var(--accent)) 65%,transparent),transparent);
  opacity:.35;
}
.panel:hover{
  border-color:color-mix(in srgb,var(--accent2) 24%,var(--line));
  box-shadow:0 24px 58px rgba(31,54,83,.15),inset 0 1px 0 rgba(255,255,255,.95);
}

.top{
  margin:12px auto 0;
  width:min(1180px,calc(100% - 28px));
  position:sticky;
  top:12px;
  padding:10px 12px;
  border:1px solid rgba(18,32,51,.1);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.68));
  box-shadow:0 18px 44px rgba(31,54,83,.12),inset 0 1px 0 rgba(255,255,255,.94);
}
.brand__cube{
  width:42px;
  height:42px;
  border-radius:14px;
  background:linear-gradient(145deg,#6df2a3,#1bbd71 58%,#178f86);
  box-shadow:0 12px 22px rgba(32,199,117,.26),inset 0 1px 0 rgba(255,255,255,.62);
}
.brand__name{
  font-size:17px;
  letter-spacing:.04em;
  color:#122033;
}
.brand__name i{color:var(--accent2)}
.chip,
.cur__btn,
.btn-ghost,
.acct__ava img{
  background:rgba(255,255,255,.72);
  border-color:var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.chip{
  color:#27405d;
  padding:10px 14px;
}
.chip .ic{color:var(--accent2)}
.cur__menu{
  background:rgba(255,255,255,.94);
  border-color:var(--line);
  box-shadow:0 18px 44px rgba(31,54,83,.14);
}
.cur__menu button:hover{background:rgba(47,128,237,.08)}
.themebtn__track{
  background:rgba(255,176,32,.22);
  border-color:rgba(255,176,32,.32);
}
.themebtn__knob,
.themebtn.is-light .themebtn__knob{
  transform:translateX(18px);
  background:linear-gradient(160deg,#fff7d6,#ffba32);
  box-shadow:0 3px 8px rgba(132,86,0,.22);
}
.acct__stat{
  color:#1b8f5b;
  background:rgba(32,199,117,.08);
  border:1px solid rgba(32,199,117,.16);
  border-radius:999px;
  padding:8px 10px;
}

.wrap{
  max-width:1180px;
  padding:clamp(26px,4vw,54px) clamp(14px,4vw,36px);
}
.phead{
  margin:4px 0 22px;
  padding:22px 0 2px;
}
.phead h1,
.h2{
  color:#122033;
  text-transform:none;
  letter-spacing:-.02em;
}
.phead h1{font-size:clamp(32px,5vw,54px)}
.phead p{
  max-width:660px;
  font-size:16px;
}
.h2{
  font-size:clamp(25px,3.4vw,38px);
  margin:42px 0 18px;
}
.h2.sm{
  color:#334761;
  font-size:22px;
  margin:32px 0 16px;
}
.grad{
  background:linear-gradient(110deg,#1abf70,#2f80ed 54%,#a35cf5);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.btn-fill{
  min-height:44px;
  border-radius:12px;
  color:#fff;
  text-transform:none;
  letter-spacing:0;
  font-weight:850;
  background:linear-gradient(135deg,#1fc875,#2f80ed);
  box-shadow:0 14px 28px rgba(47,128,237,.22),0 8px 20px rgba(32,199,117,.18),inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-fill:hover{
  transform:translateY(-2px);
  filter:saturate(1.06) brightness(1.02);
}
.btn-fill:disabled{
  background:#c9d3df;
  color:#fff;
}
.btn-ghost{
  border-radius:12px;
  color:#263b55;
}
.btn-ghost:hover{
  background:rgba(47,128,237,.08);
  border-color:rgba(47,128,237,.28);
}

.hero{
  grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr);
  gap:18px;
  align-items:stretch;
  margin-top:0;
}
.hero__glasspanel{
  min-height:440px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(28px,5vw,58px);
  border-radius:24px;
  overflow:hidden;
  background:
    linear-gradient(135deg,rgba(47,128,237,.12),transparent 42%),
    linear-gradient(315deg,rgba(32,199,117,.12),transparent 48%),
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(247,251,255,.9));
}
.hero__glasspanel::before{
  inset:auto -40px -72px auto;
  width:270px;
  height:270px;
  border-radius:42px;
  opacity:.18;
  background:
    linear-gradient(135deg,#20c775,#2f80ed);
  transform:rotate(18deg);
  mask:none;
}
.hero__glasspanel::after{
  content:"";
  position:absolute;
  top:30px;
  right:34px;
  width:96px;
  height:96px;
  border-radius:24px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.74),rgba(255,255,255,.28)),
    linear-gradient(135deg,rgba(47,128,237,.18),rgba(32,199,117,.14));
  border:1px solid rgba(18,32,51,.08);
  box-shadow:0 18px 36px rgba(31,54,83,.12);
  transform:rotate(-9deg);
}
.kicker{
  width:max-content;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(32,199,117,.1);
  color:#118555;
  letter-spacing:.12em;
  font-size:11px;
}
.hero h1{
  max-width:720px;
  margin:18px 0;
  color:#122033;
  font-size:clamp(38px,6.2vw,72px);
  line-height:.98;
  text-transform:none;
  letter-spacing:-.045em;
}
.hero__sub{
  max-width:620px;
  color:#54677e;
  font-size:18px;
  line-height:1.65;
}
.hero__cta{margin:4px 0 24px}
.ipbig{
  width:max-content;
  padding:12px 16px;
  border:1px solid rgba(47,128,237,.18);
  border-radius:14px;
  background:rgba(255,255,255,.72);
  box-shadow:0 12px 28px rgba(31,54,83,.09),inset 0 1px 0 rgba(255,255,255,.82);
}
.ipbig:hover{
  background:#fff;
  border-color:rgba(47,128,237,.34);
}
.ipbig b{
  color:#122033;
  font-size:17px;
}
.ipbig .ic{color:var(--accent2)}
.hero__stats{
  grid-template-columns:1fr;
  gap:14px;
}
.stat{
  min-height:99px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-radius:20px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,251,255,.9)),
    linear-gradient(135deg,rgba(47,128,237,.12),transparent 58%);
}
.stat:nth-child(2n){
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,251,255,.9)),
    linear-gradient(135deg,rgba(32,199,117,.12),transparent 58%);
}
.stat b{
  color:#122033;
  font-size:30px;
  letter-spacing:-.03em;
}
.stat span{
  color:#6b7d92;
  letter-spacing:.06em;
}

.features,
.cards{
  gap:16px;
}
.feat,
.ccard{
  border-radius:18px;
}
.feat{
  padding:22px;
}
.feat__i,
.ccard__emoji{
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  margin-bottom:14px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(47,128,237,.1),rgba(32,199,117,.1));
  filter:none;
}
.feat h3,
.ccard__name{
  color:#122033;
  text-transform:none;
  letter-spacing:-.01em;
}
.feat p{font-size:14px;line-height:1.6}

.tiers,
.tiers--full{
  gap:18px;
}
.tier{
  display:flex;
  flex-direction:column;
  min-height:300px;
  padding:22px;
  border-radius:20px;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--c,#20c775) 14%,transparent),transparent 48%),
    linear-gradient(180deg,#fff,rgba(248,251,255,.94));
}
.tier::before{
  left:18px;
  top:18px;
  bottom:auto;
  width:42px;
  height:4px;
  border-radius:999px;
  box-shadow:none;
  background:var(--c,#20c775);
}
.tier:hover{
  transform:translateY(-6px);
}
.tier__head{
  margin:8px 0 18px;
}
.tier__badge{
  width:54px;
  height:54px;
  border-radius:16px;
  color:#fff;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--c,#20c775) 82%,#fff),var(--c,#20c775));
  box-shadow:0 16px 28px color-mix(in srgb,var(--c,#20c775) 24%,transparent),inset 0 1px 0 rgba(255,255,255,.45);
}
img.tier__badge{background:#fff}
.tier__name{
  color:#122033;
  text-transform:none;
  letter-spacing:-.02em;
}
.tier__name small{
  margin-top:3px;
  color:#7a8ca1;
}
.tier__price{
  margin-top:auto;
}
.tier__price b{
  color:#122033;
  font-size:34px;
  letter-spacing:-.04em;
}
.tier__tok{
  color:#168b59;
  background:rgba(32,199,117,.08);
  border:1px solid rgba(32,199,117,.12);
  border-radius:999px;
  padding:8px 10px;
  width:max-content;
  max-width:100%;
}
.tier .btn-fill{width:100%;margin-top:2px}
.tier__go{
  color:var(--accent2);
}
.daydock{
  gap:4px;
  padding:5px;
  border-radius:14px;
  background:#f2f6fb;
  border-color:rgba(18,32,51,.08);
}
.daydock__pill{
  border-radius:11px;
  background:#fff;
  border:1px solid rgba(18,32,51,.08);
  box-shadow:0 8px 18px rgba(31,54,83,.1);
}
.daydock button{
  min-width:0;
  color:#64758b;
  font-size:12px;
}
.daydock button.is-active{
  color:#122033;
}

.ccard{
  min-height:230px;
  padding:22px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.ccard::before{
  background:linear-gradient(180deg,color-mix(in srgb,var(--c,#20c775) 12%,transparent),transparent 58%);
}
.ccard__emoji{
  margin-left:auto;
  margin-right:auto;
  font-size:34px;
}
.ccard__price{
  margin-top:auto;
  color:#122033;
}
.ccard .btn-fill{
  width:100%;
}
.topup{
  max-width:520px;
  border-radius:20px;
}

label{
  color:#53677f;
  font-weight:700;
}
input,
select,
textarea{
  border-color:rgba(18,32,51,.1);
  background:rgba(246,249,253,.9);
  color:#122033;
  border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
input:focus,
select:focus,
textarea:focus{
  border-color:rgba(47,128,237,.52);
  box-shadow:0 0 0 4px rgba(47,128,237,.12);
}
select option{background:#fff;color:#122033}
input[type=file]{background:#fff}

.modal{
  background:rgba(231,239,248,.68);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.modal__card{
  border-radius:22px;
}
.modal__x{
  border-radius:12px;
  background:#f5f8fc;
}
.checkout__badge{
  border-radius:16px;
  color:#fff;
  background:linear-gradient(135deg,#1fc875,#2f80ed);
}
.cardface{
  color:#fff;
  border:0;
  border-radius:20px;
  background:
    radial-gradient(170px 120px at 90% 0%,rgba(255,255,255,.23),transparent 70%),
    linear-gradient(135deg,#122033,#2f80ed 58%,#20c775);
  box-shadow:0 18px 36px rgba(47,128,237,.18);
}
.cardface__row{color:rgba(255,255,255,.72)}
.checkout__total b{color:#122033}

.sw i{
  background:#d8e1ec;
  box-shadow:inset 0 1px 3px rgba(18,32,51,.12);
}
.sw i::after{
  background:#fff;
  box-shadow:0 3px 8px rgba(18,32,51,.18);
}
.sw input:checked + i{background:linear-gradient(135deg,#20c775,#2f80ed)}

.dock{
  bottom:max(18px,env(safe-area-inset-bottom));
  filter:drop-shadow(0 22px 28px rgba(31,54,83,.16));
}
.dock__bar{
  border-color:rgba(18,32,51,.11);
  background:
    linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.52)),
    linear-gradient(135deg,rgba(47,128,237,.1),rgba(32,199,117,.08)),
    var(--dock-glass);
  box-shadow:0 20px 50px rgba(31,54,83,.14),inset 0 1px 0 rgba(255,255,255,.96),inset 0 -12px 24px rgba(31,54,83,.05);
}
.dtab{
  color:#718298;
}
.dtab.is-active{
  color:#168b59;
}
.dtab.mag{
  color:#122033;
}
.dtab::before{
  background:linear-gradient(180deg,rgba(255,255,255,.76),rgba(255,255,255,.36));
  border-color:rgba(18,32,51,.08);
}
.lens__glass{
  background:
    radial-gradient(85% 115% at 50% -18%,rgba(255,255,255,.76),transparent 55%),
    linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.18) 43%,rgba(47,128,237,.04) 100%);
}
.lens__ring{
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.84),inset 0 13px 16px -9px rgba(255,255,255,.96),
    inset 11px 0 18px -10px rgba(47,128,237,.7),inset -11px 0 18px -10px rgba(32,199,117,.68),
    0 10px 24px rgba(31,54,83,.14),0 0 24px rgba(47,128,237,.14);
}

.foot{
  color:#7a8ca1;
  padding-top:28px;
}
.foot p{color:#8392a6}

.authbox,
.pcard,
.phist,
.ticket,
.ticketform,
.acard{
  border-radius:20px;
}
.authbox{
  max-width:460px;
  margin-top:28px;
}
.authbox h1{
  text-transform:none;
  letter-spacing:-.03em;
}
.authswap a{color:var(--accent2)}
.pcard__ava{
  border-radius:20px;
  border-color:rgba(18,32,51,.12);
  background:#eef3f8;
}
.pcard__stats > div{
  padding:14px 10px;
  border-radius:16px;
  background:#f5f8fc;
  border:1px solid rgba(18,32,51,.07);
}
.role{
  border-radius:999px;
  padding:5px 9px;
}
.role--user{background:#eef3f8;color:#64758b}
.role--helper{background:rgba(47,128,237,.1);color:#2f80ed}
.role--moder{background:rgba(32,199,117,.1);color:#168b59}
.role--admin{background:rgba(239,71,118,.1);color:#d93668}
.htab th,
.atab th{
  color:#788aa0;
  border-bottom-color:rgba(18,32,51,.09);
}
.htab td,
.atab td{
  border-bottom-color:rgba(18,32,51,.065);
}

.tkstats{
  gap:14px;
}
.tkstat{
  border-radius:18px;
}
.forum{
  gap:18px;
}
.typeopt span{
  background:#f5f8fc;
  border-color:rgba(18,32,51,.09);
  border-radius:14px;
}
.typeopt input:checked + span{
  border-color:rgba(47,128,237,.3);
  color:#122033;
  background:rgba(47,128,237,.09);
}
.tk{
  border-radius:18px;
  background:#fff;
}
.tk__emoji,
.ticket__emoji{
  background:#f3f7fb;
  border:1px solid rgba(18,32,51,.06);
}
.st-open{background:rgba(47,128,237,.1);color:#2f80ed}
.st-ok{background:rgba(32,199,117,.1);color:#168b59}
.st-no{background:rgba(239,71,118,.1);color:#d93668}
.st-cl{background:#eef3f8;color:#718298}
.ticket__top h1{
  color:#122033;
  text-transform:none;
}
.tag,
.closed-note,
.staffbar,
.msg__body{
  background:#f5f8fc;
  border-color:rgba(18,32,51,.08);
}
.msg--staff .msg__body{
  background:rgba(47,128,237,.08);
  border-color:rgba(47,128,237,.15);
}
.msg__ava{
  border-radius:14px;
  background:#eef3f8;
}

.admin{
  gap:18px;
}
.acard h3{
  color:#122033;
  text-transform:none;
  letter-spacing:-.01em;
  font-size:18px;
}
.prow{
  border-bottom-color:rgba(18,32,51,.07);
}
.prow input{
  background:#f5f8fc;
}
.prow__icon{
  border-radius:12px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--c) 72%,#fff),var(--c));
  color:#fff;
}
.x{color:#d93668}

@media(max-width:900px){
  .top{
    top:8px;
    width:calc(100% - 18px);
    border-radius:18px;
  }
  .hero{
    grid-template-columns:1fr;
  }
  .hero__glasspanel{
    min-height:auto;
  }
  .hero__stats{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:560px){
  body{padding-bottom:118px}
  .wrap{padding-top:24px}
  .hero h1{font-size:clamp(36px,13vw,52px)}
  .hero__sub{font-size:16px}
  .hero__cta .btn-fill,
  .hero__cta .btn-ghost,
  .ipbig{
    width:100%;
    justify-content:center;
  }
  .hero__stats{grid-template-columns:1fr 1fr}
  .stat{min-height:86px;padding:16px 10px}
  .stat b{font-size:24px}
  .top{
    align-items:center;
  }
  .acct{
    width:100%;
    justify-content:center;
  }
  .dock{width:min(520px,calc(100% - 14px))}
  .dock__bar{padding:6px;border-radius:24px}
  .dock__lens{width:72px;border-radius:20px}
  .dtab{min-height:54px;border-radius:18px}
  .dtab .ic{width:21px;height:21px}
  .fields{grid-template-columns:1fr}
}

/* =======================================================
   Minimal black / gray redesign
   ======================================================= */
:root,
:root[data-theme="dark"],
:root[data-theme="light"]{
  --bg:#0a0b0d;
  --panel:#111317;
  --panel2:#16191f;
  --line:rgba(255,255,255,.08);
  --line2:rgba(255,255,255,.055);
  --accent:#e8edf4;
  --accent2:#8e99a8;
  --warn:#ff5f7a;
  --ink:#f2f4f7;
  --muted:#8a93a1;
  --panel-grad:linear-gradient(180deg,rgba(21,23,28,.94),rgba(14,16,20,.96));
  --glass-bg:rgba(18,20,24,.72);
  --glass-hi:rgba(255,255,255,.13);
  --glass-edge:rgba(255,255,255,.09);
  --dock-glass:rgba(16,18,22,.82);
  --top-bg:rgba(12,13,16,.78);
  --field-bg:rgba(255,255,255,.045);
  --grid-line:rgba(255,255,255,.035);
  --shadow:0 20px 46px rgba(0,0,0,.34);
  --r:8px;
}
html,
body{
  background:var(--bg);
  color:var(--ink);
}
body{
  padding-bottom:112px;
}
::selection{
  background:rgba(255,255,255,.18);
  color:#fff;
}
.grad{
  background:none;
  color:var(--ink);
}
.fx{
  background:
    linear-gradient(180deg,#0d0f12 0%,#090a0c 56%,#07080a 100%);
}
body[style*="--site-bg"] .fx{
  background:
    linear-gradient(180deg,rgba(10,11,13,.88),rgba(7,8,10,.94)),
    var(--site-bg);
  background-size:cover;
  background-position:center;
}
.fx::before{
  opacity:.35;
  background-size:44px 44px;
  mask:linear-gradient(#000,transparent 68%);
}
.scan,
.vig,
.glow{
  display:none;
}

.top{
  width:min(1140px,calc(100% - 28px));
  top:12px;
  margin:12px auto 0;
  padding:10px 12px;
  gap:10px;
  border-radius:16px;
  background:rgba(15,17,21,.78);
  border:1px solid var(--line);
  box-shadow:0 18px 36px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.brand__cube{
  width:38px;
  height:38px;
  border-radius:10px;
  background:#1b1f26;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09);
  filter:grayscale(1);
}
.brand__name{
  color:#f2f4f7;
  font-size:16px;
  letter-spacing:.03em;
}
.brand__name i{
  color:#aeb7c4;
}
.chip,
.cur__btn,
.btn-ghost,
.acct__ava img{
  background:rgba(255,255,255,.045);
  border-color:var(--line);
  color:var(--ink);
  box-shadow:none;
}
.chip{
  padding:9px 12px;
  color:#c8ced8;
}
.chip .ic,
.acct__stat,
.acct__stat .ic{
  color:#cfd5df;
}
.acct__stat{
  background:rgba(255,255,255,.045);
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 9px;
}
.cur__menu{
  background:#14171c;
  border-color:var(--line);
  box-shadow:0 18px 36px rgba(0,0,0,.28);
}
.cur__menu button{
  color:var(--ink);
}
.cur__menu button:hover{
  background:rgba(255,255,255,.06);
  transform:none;
}
.themebtn__track,
.themebtn.is-light .themebtn__track{
  background:#22262d;
  border-color:var(--line);
}
.themebtn__knob,
.themebtn.is-light .themebtn__knob{
  transform:translateX(0);
  background:#d7dce4;
  box-shadow:0 2px 8px rgba(0,0,0,.34);
}

.wrap{
  max-width:1140px;
  padding:clamp(22px,4vw,44px) clamp(14px,4vw,34px);
}
.phead{
  margin:0 0 18px;
  padding:12px 0 0;
}
.phead h1,
.h2{
  color:#f2f4f7;
  text-transform:none;
  letter-spacing:-.035em;
}
.phead h1{
  font-size:clamp(30px,5vw,48px);
}
.phead p{
  max-width:460px;
  margin-top:7px;
  color:var(--muted);
  font-size:15px;
}
.h2{
  margin:28px 0 14px;
  font-size:clamp(22px,3.2vw,32px);
}
.h2.sm{
  margin:26px 0 12px;
  color:#c9cfd8;
  font-size:18px;
}
.back{
  color:#aab2bf;
}

.panel,
.hero__glasspanel,
.stat,
.tkstat{
  background:var(--panel-grad);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 16px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.045);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.panel::after,
.tier::after,
.hero__glasspanel::before,
.hero__glasspanel::after{
  display:none;
}
.panel:hover{
  border-color:rgba(255,255,255,.13);
  box-shadow:0 18px 38px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.05);
}

.btn-fill{
  min-height:42px;
  padding:11px 16px;
  border-radius:10px;
  color:#090a0c;
  background:#f2f4f7;
  box-shadow:none;
  text-transform:none;
  letter-spacing:0;
  font-weight:800;
}
.btn-fill::after{
  display:none;
}
.btn-fill:hover{
  transform:translateY(-1px);
  filter:none;
  background:#fff;
}
.btn-fill:active{
  transform:scale(.98);
}
.btn-fill:disabled{
  background:#343941;
  color:#777f8c;
}
.btn-ghost{
  min-height:42px;
  border-radius:10px;
  color:#d8dde5;
}
.btn-ghost:hover{
  transform:none;
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.14);
}
.btn-fill.big{
  padding:12px 14px;
}

.hero{
  grid-template-columns:minmax(0,1.45fr) minmax(240px,.55fr);
  gap:14px;
}
.hero__glasspanel{
  min-height:360px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(24px,5vw,48px);
  border-radius:18px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.045),transparent 46%),
    linear-gradient(180deg,rgba(22,25,31,.98),rgba(13,15,19,.98));
}
.kicker{
  width:max-content;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:#aeb7c4;
  letter-spacing:.1em;
  font-size:11px;
}
.hero h1{
  max-width:620px;
  margin:16px 0 10px;
  color:#f7f8fa;
  font-size:clamp(40px,6.4vw,72px);
  line-height:.95;
  text-transform:none;
  letter-spacing:-.06em;
}
.hero__sub{
  max-width:460px;
  margin-bottom:22px;
  color:#9aa3b1;
  font-size:16px;
  line-height:1.55;
}
.hero__cta{
  gap:9px;
  margin:0 0 18px;
}
.ipbig{
  width:max-content;
  padding:10px 12px;
  gap:10px;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  box-shadow:none;
}
.ipbig:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.13);
}
.ipbig small{
  color:#7e8794;
  letter-spacing:.08em;
}
.ipbig b{
  color:#f2f4f7;
  font-size:15px;
}
.ipbig .ic{
  color:#aeb7c4;
}
.hero__stats{
  grid-template-columns:1fr;
  gap:10px;
}
.stat{
  min-height:82px;
  padding:16px;
  justify-content:center;
  border-radius:14px;
  background:#111317;
}
.stat:nth-child(2n){
  background:#111317;
}
.stat b{
  color:#f2f4f7;
  font-size:24px;
  letter-spacing:-.03em;
}
.stat span{
  color:#7f8793;
  font-size:11px;
  letter-spacing:.08em;
}

.features,
.cards,
.tiers,
.tiers--full{
  gap:12px;
}
.features{
  grid-template-columns:repeat(4,1fr);
}
.feat,
.ccard,
.tier{
  border-radius:14px;
}
.feat{
  padding:18px;
}
.feat__i,
.ccard__emoji{
  width:auto;
  height:auto;
  display:block;
  margin:0 0 10px;
  border-radius:0;
  background:none;
  filter:grayscale(1);
  font-size:25px;
}
.feat h3,
.ccard__name{
  color:#f2f4f7;
  text-transform:none;
  letter-spacing:-.015em;
}
.feat p{
  color:#8a93a1;
  font-size:13px;
  line-height:1.45;
}

.tier{
  min-height:258px;
  padding:18px;
  background:var(--panel-grad);
}
.tier::before{
  display:none;
}
.tier:hover{
  transform:translateY(-3px);
}
.tier__head{
  margin:0 0 14px;
}
.tier__badge{
  width:46px;
  height:46px;
  border-radius:12px;
  color:#f2f4f7;
  background:#20242b;
  box-shadow:none;
  filter:grayscale(.85);
}
img.tier__badge{
  background:#20242b;
}
.tier__name{
  color:#f2f4f7;
  text-transform:none;
  letter-spacing:-.02em;
  font-size:19px;
}
.tier__name small{
  color:#7f8793;
}
.tier__price{
  margin-top:auto;
}
.tier__price b{
  color:#f2f4f7;
  font-size:30px;
  letter-spacing:-.045em;
}
.tier__price span{
  color:#7f8793;
}
.tier__tok{
  width:max-content;
  max-width:100%;
  padding:6px 9px;
  border-radius:999px;
  color:#c8ced8;
  background:rgba(255,255,255,.045);
  border:1px solid var(--line);
  font-size:12px;
}
.tier__go{
  color:#c8ced8;
}
.tier .btn-fill{
  width:100%;
}
.daydock{
  gap:3px;
  padding:4px;
  border-radius:11px;
  background:#0b0d10;
  border-color:var(--line2);
}
.daydock__pill{
  border-radius:8px;
  background:#242932;
  border:1px solid rgba(255,255,255,.075);
  box-shadow:none;
}
.daydock button{
  padding:8px 4px;
  color:#7f8793;
  font-size:12px;
}
.daydock button.is-active{
  color:#f2f4f7;
}

.cards{
  grid-template-columns:repeat(4,1fr);
}
.ccard{
  min-height:204px;
  padding:18px;
  align-items:flex-start;
  text-align:left;
  background:var(--panel-grad);
}
.ccard::before{
  display:none;
}
.ccard__emoji{
  font-size:30px;
  margin-left:0;
  margin-right:0;
}
.ccard__tok{
  color:#9aa3b1;
}
.ccard__price{
  margin-top:auto;
  color:#f2f4f7;
}
.ccard .btn-fill{
  width:100%;
}
.topup{
  max-width:480px;
  border-radius:14px;
}

label{
  color:#9aa3b1;
  font-weight:650;
}
input,
select,
textarea{
  background:#0b0d10;
  border:1px solid var(--line);
  color:#f2f4f7;
  border-radius:10px;
  box-shadow:none;
}
input:focus,
select:focus,
textarea:focus{
  border-color:rgba(255,255,255,.22);
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
}
select option{
  background:#111317;
  color:#f2f4f7;
}
input[type=file]{
  background:#0b0d10;
}

.toast{
  background:#171a20;
  border-color:rgba(255,255,255,.12);
  box-shadow:0 16px 34px rgba(0,0,0,.34);
}
.toast.err{
  border-color:rgba(255,95,122,.45);
}

.modal{
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.modal__card{
  border-radius:16px;
}
.modal__x{
  border-radius:10px;
  background:#0b0d10;
}
.checkout__badge{
  border-radius:12px;
  color:#090a0c;
  background:#f2f4f7;
}
.cardface{
  height:142px;
  border-radius:14px;
  border:1px solid var(--line);
  color:#f2f4f7;
  background:linear-gradient(135deg,#1d2129,#0d0f12);
  box-shadow:none;
}
.cardface::after{
  display:none;
}
.cardface__row{
  color:#8f98a6;
}
.checkout__total b{
  color:#f2f4f7;
}
.checkout__safe{
  color:#7f8793;
}
.sw i{
  background:#303640;
}
.sw input:checked + i{
  background:#d8dde5;
}
.sw input:checked + i::after{
  background:#0b0d10;
}

.dock{
  width:min(500px,calc(100% - 28px));
  bottom:max(18px,env(safe-area-inset-bottom));
  filter:drop-shadow(0 20px 26px rgba(0,0,0,.32));
}
.dock__bar{
  gap:2px;
  padding:7px;
  border-radius:20px;
  background:rgba(17,19,23,.86);
  border:1px solid var(--line);
  box-shadow:0 16px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.dock__bar::before,
.dock__bar::after{
  display:none;
}
.dtab{
  min-height:52px;
  border-radius:14px;
  color:#808895;
  font-size:10px;
  font-weight:700;
}
.dtab::before{
  inset:4px;
  border-radius:11px;
  background:rgba(255,255,255,.055);
  border-color:transparent;
}
.dtab::after{
  width:3px;
  height:3px;
  box-shadow:none;
}
.dtab .ic{
  width:21px;
  height:21px;
}
.dtab.is-active,
.dtab.mag{
  color:#f2f4f7;
}
.dtab.mag .ic{
  transform:translateY(-3px) scale(1.22);
  filter:none;
}
.dock__bar:hover .dtab:not(.mag):not(:hover){
  opacity:.72;
}
.dock__lens{
  top:7px;
  height:calc(100% - 14px);
  width:72px;
  border-radius:14px;
}
.lens__glass{
  background:rgba(255,255,255,.075);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}
.lens__glass::before,
.lens__glass::after{
  display:none;
}
.lens__ring{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.13),inset 0 1px 0 rgba(255,255,255,.08);
}
.lens__ring::after{
  display:none;
}

.foot{
  color:#6f7783;
  padding:18px 16px 4px;
}
.foot__row{
  color:#8c95a3;
}
.foot__row i{
  color:#c3cad5;
}
.foot p{
  color:#69717d;
}

.authbox,
.pcard,
.phist,
.ticket,
.ticketform,
.acard{
  border-radius:14px;
}
.authbox{
  max-width:420px;
  margin-top:18px;
}
.authbox h1{
  text-transform:none;
  letter-spacing:-.035em;
}
.authswap a{
  color:#f2f4f7;
}
.pcard__ava{
  border-radius:14px;
  background:#20242b;
  border-color:var(--line);
}
.pcard__stats > div{
  padding:12px 10px;
  border-radius:12px;
  background:#0b0d10;
  border:1px solid var(--line2);
}
.pcard__stats b{
  color:#f2f4f7;
}
.role{
  border-radius:999px;
  padding:4px 8px;
}
.role--user{
  background:rgba(255,255,255,.055);
  color:#8a93a1;
}
.role--helper,
.role--moder,
.role--admin{
  background:rgba(255,255,255,.075);
  color:#d8dde5;
}
.htab th,
.atab th{
  color:#858e9b;
  border-bottom-color:var(--line);
}
.htab td,
.atab td{
  border-bottom-color:var(--line2);
}

.tkstats{
  gap:10px;
}
.tkstat{
  border-radius:14px;
  background:#111317;
}
.tkstat.st-open b,
.tkstat.st-ok b,
.tkstat.st-no b,
.tkstat.st-cl b{
  color:#f2f4f7;
}
.forum{
  gap:14px;
}
.typeopt span{
  background:#0b0d10;
  border-color:var(--line);
  color:#8a93a1;
  border-radius:10px;
}
.typeopt input:checked + span{
  border-color:rgba(255,255,255,.18);
  color:#f2f4f7;
  background:rgba(255,255,255,.07);
  transform:none;
}
.tk{
  border-radius:14px;
  background:var(--panel-grad);
}
.tk:hover{
  transform:translateY(-2px);
}
.tk__emoji,
.ticket__emoji{
  background:#0b0d10;
  border:1px solid var(--line2);
  filter:grayscale(1);
}
.st{
  background:rgba(255,255,255,.065);
  color:#cdd3dc;
}
.st-open,
.st-ok,
.st-no,
.st-cl{
  background:rgba(255,255,255,.065);
  color:#cdd3dc;
}
.ticket__top h1{
  color:#f2f4f7;
  text-transform:none;
}
.ttype{
  color:#d8dde5;
}
.tag,
.closed-note,
.staffbar,
.msg__body{
  background:#0b0d10;
  border-color:var(--line2);
}
.msg--staff .msg__body{
  background:#171a20;
  border-color:var(--line);
}
.msg__ava{
  border-radius:12px;
  background:#20242b;
}

.admin{
  gap:14px;
}
.acard h3{
  color:#f2f4f7;
  text-transform:none;
  letter-spacing:-.02em;
}
.prow{
  border-bottom-color:var(--line2);
}
.prow input{
  background:#0b0d10;
}
.prow__icon{
  border-radius:10px;
  background:#20242b;
  color:#f2f4f7;
  filter:grayscale(.85);
}
.addprod summary{
  color:#d8dde5;
}

@media(max-width:900px){
  .top{
    width:calc(100% - 18px);
    top:8px;
  }
  .hero{
    grid-template-columns:1fr;
  }
  .hero__glasspanel{
    min-height:310px;
  }
  .hero__stats{
    grid-template-columns:repeat(4,1fr);
  }
}
@media(max-width:700px){
  .hero__stats{
    grid-template-columns:repeat(2,1fr);
  }
  .top .acct{
    width:100%;
    justify-content:center;
  }
}
@media(max-width:560px){
  body{
    padding-bottom:104px;
  }
  .wrap{
    padding-top:22px;
  }
  .hero__glasspanel{
    min-height:300px;
    padding:24px;
  }
  .hero h1{
    font-size:clamp(38px,13vw,56px);
  }
  .hero__sub{
    font-size:15px;
  }
  .hero__cta .btn-fill,
  .hero__cta .btn-ghost,
  .ipbig{
    width:100%;
    justify-content:center;
  }
  .stat{
    min-height:74px;
    padding:12px 8px;
  }
  .stat b{
    font-size:21px;
  }
  .dock{
    width:calc(100% - 14px);
  }
  .dock__bar{
    padding:5px;
    border-radius:16px;
  }
  .dock__lens{
    width:64px;
    border-radius:12px;
  }
  .dtab{
    min-height:48px;
    border-radius:12px;
  }
  .dtab span{
    font-size:9px;
  }
  .fields{
    grid-template-columns:1fr;
  }
}

/* =======================================================
   User pass: colored icons, better checkout, iPhone glass dock
   ======================================================= */
:root,
:root[data-theme="dark"],
:root[data-theme="light"]{
  --accent:#37d67a;
  --accent2:#2d9cff;
  --purple:#8b7cff;
  --gold:#ffb84d;
  --panel-grad:linear-gradient(180deg,rgba(22,24,30,.96),rgba(13,15,19,.98));
}
.brand__cube,
.tier__badge,
.ccard__emoji,
.tk__emoji,
.ticket__emoji,
.prow__icon{
  filter:none;
}
.brand__cube{
  background:linear-gradient(145deg,#39e781,#0f8b59);
  box-shadow:0 10px 24px rgba(55,214,122,.18),inset 0 1px 0 rgba(255,255,255,.28);
}
.brand__name i{
  color:var(--accent);
}
.chip .ic,
.acct__stat,
.acct__stat .ic,
.cur__sym{
  color:var(--accent);
}
.btn-fill{
  color:#061009;
  background:linear-gradient(135deg,#43e987,#29a8ff);
  box-shadow:0 14px 30px rgba(45,156,255,.16),0 8px 18px rgba(55,214,122,.12);
}
.btn-fill:hover{
  background:linear-gradient(135deg,#65f29f,#4ab6ff);
}
.btn-ghost:hover{
  border-color:rgba(55,214,122,.22);
  background:rgba(55,214,122,.07);
}
.hero__glasspanel{
  background:
    linear-gradient(135deg,rgba(55,214,122,.1),transparent 38%),
    linear-gradient(315deg,rgba(45,156,255,.09),transparent 44%),
    linear-gradient(180deg,rgba(22,25,31,.98),rgba(13,15,19,.98));
}
.kicker{
  color:#95f2be;
  background:rgba(55,214,122,.08);
}
.stat b{
  color:#fff;
}
.stat:nth-child(1) b{color:#93c5fd}
.stat:nth-child(2) b{color:#86efac}
.stat:nth-child(3) b{color:#c4b5fd}
.stat:nth-child(4) b{color:#fcd34d}
.tier{
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--c,#37d67a) 10%,transparent),transparent 38%),
    var(--panel-grad);
}
.tier__badge{
  color:#fff;
  background:linear-gradient(145deg,color-mix(in srgb,var(--c,#37d67a) 88%,#fff),var(--c,#37d67a));
  box-shadow:0 12px 28px color-mix(in srgb,var(--c,#37d67a) 24%,transparent),inset 0 1px 0 rgba(255,255,255,.28);
}
.rank-icon{
  position:relative;
  overflow:hidden;
}
.rank-icon svg{
  position:absolute;
  inset:9px;
  width:calc(100% - 18px);
  height:calc(100% - 18px);
  opacity:.42;
}
.rank-icon b{
  position:relative;
  z-index:1;
  font:900 18px/1 var(--mono);
}
.tier__tok,
.ccard__tok{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#a7f3d0;
  border-color:rgba(55,214,122,.16);
  background:rgba(55,214,122,.07);
}
.tier__tok .ic,
.ccard__tok .ic{
  width:15px;
  height:15px;
  color:var(--accent);
}
.ccard{
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--c,#37d67a) 10%,transparent),transparent 42%),
    var(--panel-grad);
}
.ccard__emoji{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  margin-bottom:12px;
  border-radius:13px;
  color:#fff;
  background:linear-gradient(145deg,color-mix(in srgb,var(--c,#37d67a) 84%,#fff),var(--c,#37d67a));
  box-shadow:0 12px 24px color-mix(in srgb,var(--c,#37d67a) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.22);
}
.ccard__emoji .ic{
  width:24px;
  height:24px;
}

.modal{
  padding:18px;
  background:rgba(0,0,0,.66);
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
}
.modal__card{
  width:min(820px,100%);
  padding:0;
  overflow:hidden;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(25,28,35,.98),rgba(12,14,18,.98));
}
.modal__x{
  top:16px;
  right:16px;
  z-index:2;
  width:36px;
  height:36px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
}
.checkout{
  display:grid;
  grid-template-columns:minmax(280px,.92fr) minmax(300px,1fr);
  gap:0;
}
.checkout__head{
  grid-column:1/-1;
  padding:22px 24px 16px;
  margin:0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.checkout__badge{
  width:48px;
  height:48px;
  border-radius:15px;
  color:#07100a;
  background:linear-gradient(145deg,#55ee91,#33a7ff);
  box-shadow:0 14px 28px rgba(55,214,122,.18);
}
.checkout__head h2{
  color:#fff;
  letter-spacing:-.025em;
}
.checkout__sub{
  color:#9ea8b6;
}
.paymethods{
  grid-column:2;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  padding:20px 24px 0;
}
.paymethod{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  border-radius:12px;
  color:#9ea8b6;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  font-size:13px;
}
.paymethod.is-active{
  color:#fff;
  border-color:rgba(55,214,122,.28);
  background:rgba(55,214,122,.08);
}
.paymethod .ic{
  width:18px;
  height:18px;
}
.cardface{
  grid-column:1;
  grid-row:2 / span 5;
  align-self:start;
  height:236px;
  margin:20px 0 24px 24px;
  padding:20px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:24px;
  color:#fff;
  background:
    linear-gradient(135deg,rgba(255,255,255,.16),transparent 28%),
    linear-gradient(315deg,rgba(55,214,122,.32),transparent 36%),
    linear-gradient(135deg,#242a35 0%,#151922 48%,#080a0d 100%);
  box-shadow:0 30px 60px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.12);
}
.cardface::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.16),transparent);
  transform:translateX(-68%);
}
.cardface::after{
  display:block;
  content:"";
  position:absolute;
  right:18px;
  bottom:18px;
  width:74px;
  height:46px;
  border-radius:999px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.06)),
    radial-gradient(circle at 28% 50%,rgba(255,255,255,.32) 0 24%,transparent 25%),
    radial-gradient(circle at 70% 50%,rgba(255,255,255,.22) 0 24%,transparent 25%);
}
.cardface__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:32px;
}
.cardface__brand{
  font:800 11px/1 var(--mono);
  letter-spacing:.16em;
  color:rgba(255,255,255,.74);
}
.cardface__wave .ic{
  width:22px;
  height:22px;
  color:rgba(255,255,255,.72);
  transform:rotate(90deg);
}
.cardface__chip{
  width:48px;
  height:34px;
  border-radius:9px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.13) 1px,transparent 1px) 50%/12px 100%,
    linear-gradient(135deg,#f7d86a,#a8762b);
}
.cardface__num{
  margin-top:24px;
  font:800 clamp(20px,3vw,25px)/1 var(--mono);
  letter-spacing:.08em;
}
.cardface__row{
  margin-top:24px;
  color:rgba(255,255,255,.7);
}
.fields{
  grid-column:2;
  padding:14px 24px 0;
}
.balrow,
.checkout__total,
.checkout .btn-fill.big,
.checkout__safe{
  grid-column:2;
  margin-left:24px;
  margin-right:24px;
}
.checkout__total{
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.07);
}
.checkout__total b{
  color:#fff;
}
.checkout .btn-fill.big{
  width:auto;
}
.checkout__safe{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-bottom:22px;
}
.checkout__safe .ic{
  width:14px;
  height:14px;
}

.dock{
  width:min(620px,calc(100% - 28px));
  bottom:max(18px,env(safe-area-inset-bottom));
  filter:drop-shadow(0 30px 34px rgba(0,0,0,.44));
}
.dock__bar{
  min-height:92px;
  padding:10px 12px;
  border-radius:42px;
  overflow:visible;
  background:
    linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,.08)),
    rgba(78,78,78,.62);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(0,0,0,.28),
    0 20px 48px rgba(0,0,0,.34);
  backdrop-filter:blur(28px) saturate(160%) brightness(1.08);
  -webkit-backdrop-filter:blur(28px) saturate(160%) brightness(1.08);
}
.dock__bar::before{
  display:block;
  content:"";
  position:absolute;
  inset:1px;
  z-index:-1;
  border-radius:41px;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.12),transparent 16%,transparent 84%,rgba(255,255,255,.1)),
    linear-gradient(180deg,rgba(255,255,255,.18),transparent 48%);
}
.dock__bar::after{
  display:block;
  content:"";
  position:absolute;
  inset:auto 28px 9px;
  height:1px;
  z-index:4;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
}
.dtab{
  min-height:72px;
  z-index:5;
  border-radius:28px;
  color:rgba(255,255,255,.86);
  font-size:12px;
  text-shadow:0 1px 12px rgba(0,0,0,.45);
}
.dtab::before,
.dtab::after{
  display:none;
}
.dtab .ic{
  width:30px;
  height:30px;
  stroke-width:2.2;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.25));
}
.dtab.is-active,
.dtab.mag{
  color:#fff;
}
.dtab.mag .ic{
  transform:translateY(-11px) scale(1.42);
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.34));
}
.dtab.mag span{
  transform:translateY(-7px);
}
.dtab span{
  transition:transform .35s var(--spring);
}
.dock__lens{
  top:-18px;
  width:126px;
  height:126px;
  border-radius:50%;
  z-index:3;
  overflow:hidden;
}
.lens__glass{
  background:
    linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.08) 52%,rgba(0,0,0,.12)),
    rgba(120,120,120,.32);
  backdrop-filter:blur(18px) saturate(190%) brightness(1.08);
  -webkit-backdrop-filter:blur(18px) saturate(190%) brightness(1.08);
}
.lens__glass::before{
  display:block;
  content:"";
  position:absolute;
  inset:8px;
  border-radius:50%;
  background:
    linear-gradient(180deg,rgba(255,255,255,.2),transparent 40%),
    linear-gradient(90deg,rgba(45,156,255,.35),transparent 36%,rgba(55,214,122,.26));
  filter:blur(10px);
}
.lens__glass::after{
  display:block;
  content:"";
  position:absolute;
  left:23%;
  right:23%;
  top:8px;
  height:9px;
  border-radius:999px;
  background:rgba(0,0,0,.42);
  box-shadow:0 102px 0 rgba(0,0,0,.34);
}
.lens__ring{
  box-shadow:
    inset 0 0 0 1.5px rgba(255,255,255,.46),
    inset 0 16px 18px -12px rgba(255,255,255,.76),
    inset 12px 0 20px -12px rgba(45,156,255,.72),
    inset -12px 0 20px -12px rgba(55,214,122,.55),
    0 18px 38px rgba(0,0,0,.28);
}
.lens__ring::after{
  display:block;
  content:"";
  position:absolute;
  top:18%;
  left:18%;
  width:34%;
  height:22%;
  border-radius:50%;
  background:rgba(255,255,255,.52);
  filter:blur(4px);
}

@media(max-width:760px){
  .checkout{
    grid-template-columns:1fr;
  }
  .checkout__head,
  .paymethods,
  .cardface,
  .fields,
  .balrow,
  .checkout__total,
  .checkout .btn-fill.big,
  .checkout__safe{
    grid-column:1;
  }
  .paymethods{
    padding:18px 18px 0;
  }
  .cardface{
    grid-row:auto;
    margin:18px;
  }
  .fields{
    padding:0 18px;
  }
  .balrow,
  .checkout__total,
  .checkout .btn-fill.big,
  .checkout__safe{
    margin-left:18px;
    margin-right:18px;
  }
}
@media(max-width:560px){
  body{
    padding-bottom:128px;
  }
  .dock{
    width:calc(100% - 12px);
  }
  .dock__bar{
    min-height:82px;
    padding:8px;
    border-radius:34px;
  }
  .dock__lens{
    top:-15px;
    width:106px;
    height:106px;
  }
  .dtab{
    min-height:66px;
    font-size:10px;
  }
  .dtab .ic{
    width:26px;
    height:26px;
  }
  .dtab.mag .ic{
    transform:translateY(-8px) scale(1.32);
  }
  .dtab.mag span{
    transform:translateY(-5px);
  }
}

/* =======================================================
   Minecraft minimal v3
   ======================================================= */
:root,
:root[data-theme="dark"],
:root[data-theme="light"]{
  --bg:#090b0d;
  --panel:#111419;
  --panel2:#151a20;
  --line:rgba(255,255,255,.075);
  --line2:rgba(255,255,255,.045);
  --accent:#46d979;
  --accent2:#4aa3ff;
  --warn:#ff6177;
  --gold:#f7c35f;
  --ink:#f3f6f9;
  --muted:#8b96a5;
  --panel-grad:linear-gradient(180deg,#141820,#0f1217);
  --field-bg:#0b0e12;
  --shadow:0 18px 40px rgba(0,0,0,.34);
  --r:8px;
}
html,
body{
  background:#090b0d;
}
body{
  color:var(--ink);
  padding-bottom:118px;
}
.fx{
  background:
    linear-gradient(180deg,rgba(70,217,121,.045),transparent 30%),
    linear-gradient(135deg,rgba(74,163,255,.04),transparent 42%),
    #090b0d;
}
.fx::before{
  opacity:.24;
  background-size:32px 32px;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  mask:linear-gradient(#000,transparent 70%);
}
.top{
  width:min(1120px,calc(100% - 24px));
  top:10px;
  margin-top:10px;
  padding:9px 10px;
  border-radius:12px;
  background:rgba(13,16,21,.88);
  border:1px solid rgba(255,255,255,.075);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.brand__cube{
  width:38px;
  height:38px;
  border-radius:8px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.16),transparent 45%),
    #1f8f50;
  color:#07120b;
  font:900 13px/1 var(--mono);
  letter-spacing:-.05em;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.18);
}
.brand__name{
  font-size:16px;
  color:#f3f6f9;
}
.brand__name i{
  color:var(--accent);
}
.chip,
.cur__btn,
.btn-ghost,
.acct__stat{
  border-radius:8px;
  background:#11151b;
  border:1px solid var(--line);
}
.chip:hover,
.cur__btn:hover,
.btn-ghost:hover{
  background:#151b22;
  border-color:rgba(70,217,121,.24);
}
.themebtn{
  display:none;
}
.wrap{
  max-width:1120px;
  padding:clamp(22px,4vw,42px) clamp(14px,4vw,32px);
}
.panel,
.hero__glasspanel,
.stat,
.tkstat{
  border-radius:12px;
  background:var(--panel-grad);
  border:1px solid var(--line);
  box-shadow:0 14px 30px rgba(0,0,0,.24);
}
.panel:hover{
  border-color:rgba(70,217,121,.22);
  transform:translateY(-2px);
}
.phead{
  padding-top:8px;
  margin-bottom:18px;
}
.phead h1{
  font-size:clamp(30px,4.8vw,46px);
  letter-spacing:-.04em;
}
.phead p{
  max-width:420px;
  font-size:14px;
}
.h2{
  margin:26px 0 14px;
  font-size:clamp(22px,3vw,30px);
  letter-spacing:-.035em;
}
.hero{
  grid-template-columns:minmax(0,1.55fr) minmax(230px,.45fr);
  gap:12px;
}
.hero__glasspanel{
  min-height:330px;
  padding:clamp(24px,5vw,46px);
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(70,217,121,.12),transparent 36%),
    linear-gradient(315deg,rgba(74,163,255,.075),transparent 46%),
    #10141a;
}
.kicker{
  padding:6px 8px;
  border-radius:6px;
  background:rgba(70,217,121,.1);
  color:#9cf3b8;
  font:800 11px/1 var(--mono);
  letter-spacing:.12em;
}
.hero h1{
  margin:14px 0 10px;
  font-size:clamp(48px,8vw,86px);
  line-height:.9;
  letter-spacing:-.07em;
}
.hero__sub{
  max-width:430px;
  margin-bottom:20px;
  color:#9aa4b2;
  font-size:16px;
}
.btn-fill,
.btn-ghost{
  border-radius:8px;
}
.btn-fill{
  min-height:42px;
  color:#07120b;
  background:#46d979;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);
}
.btn-fill:hover{
  background:#5be88b;
  transform:translateY(-1px);
}
.btn-ghost{
  min-height:42px;
  color:#dbe2ea;
}
.ipbig{
  border-radius:8px;
  background:#0b0f13;
  border:1px solid rgba(255,255,255,.08);
}
.ipbig:hover{
  border-color:rgba(70,217,121,.28);
}
.hero__stats{
  gap:8px;
}
.stat{
  min-height:76px;
  padding:14px 12px;
  background:#10141a;
}
.stat b{
  font-size:23px;
}
.stat span{
  font-size:10px;
}
.tiers,
.tiers--full,
.cards{
  gap:12px;
}
.tiers--full{
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
}
.tier,
.ccard{
  border-radius:12px;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--c,#46d979) 9%,transparent),transparent 38%),
    #11151b;
  border-color:rgba(255,255,255,.07);
}
.tier{
  min-height:248px;
  padding:17px;
}
.tier:hover,
.ccard:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--c,#46d979) 34%,rgba(255,255,255,.08));
}
.tier__badge,
.ccard__emoji{
  border-radius:8px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.18),transparent 48%),
    color-mix(in srgb,var(--c,#46d979) 86%,#1b1f26);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),0 10px 22px color-mix(in srgb,var(--c,#46d979) 18%,transparent);
}
.tier__name{
  font-size:18px;
}
.tier__price b{
  font-size:29px;
}
.tier__tok,
.ccard__tok{
  color:#b8f7cc;
  background:rgba(70,217,121,.075);
  border-color:rgba(70,217,121,.14);
}
.daydock{
  border-radius:8px;
  background:#090c10;
}
.daydock__pill{
  border-radius:6px;
  background:#202832;
}
.ccard{
  min-height:190px;
}
.ccard__emoji{
  width:42px;
  height:42px;
}
input,
select,
textarea{
  border-radius:8px;
  background:#090c10;
}
.modal__card{
  width:min(760px,100%);
  border-radius:14px;
}
.checkout__head{
  padding:20px 22px 14px;
}
.checkout__badge{
  border-radius:8px;
  background:#46d979;
  color:#07120b;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);
}
.paymethod,
.cardface,
.modal__x{
  border-radius:10px;
}
.cardface{
  height:220px;
  border-radius:14px;
  background:
    linear-gradient(135deg,rgba(70,217,121,.24),transparent 34%),
    linear-gradient(315deg,rgba(74,163,255,.18),transparent 38%),
    #131923;
}

/* Polished payment card + animation */
.cardface{
  position:relative;
  aspect-ratio:1.586/1;
  height:auto;
  min-height:0;
  padding:22px;
  overflow:hidden;
  isolation:isolate;
  transform-style:preserve-3d;
  background:#131923;
}
.cardface__shade,
.cardface__mesh,
.cardface__holo{
  position:absolute;
  pointer-events:none;
  z-index:0;
}
.cardface__shade{
  inset:0;
  background:
    linear-gradient(135deg,rgba(70,217,121,.27),transparent 34%),
    linear-gradient(315deg,rgba(74,163,255,.2),transparent 42%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.16));
}
.cardface__mesh{
  inset:0;
  opacity:.22;
  background-image:
    linear-gradient(120deg,rgba(255,255,255,.12) 1px,transparent 1px),
    linear-gradient(30deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:34px 34px;
  mask:linear-gradient(90deg,#000,transparent 78%);
}
.cardface__holo{
  right:20px;
  bottom:20px;
  width:64px;
  height:42px;
  border-radius:12px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.24),rgba(255,255,255,.04)),
    linear-gradient(90deg,rgba(70,217,121,.42),rgba(74,163,255,.38),rgba(247,195,95,.38));
  opacity:.72;
  filter:saturate(1.2);
}
.cardface__top,
.cardface__chip,
.cardface__num,
.cardface__row{
  position:relative;
  z-index:1;
}
.cardface__top{
  margin-bottom:28px;
}
.cardface__brand{
  font-size:10px;
  letter-spacing:.18em;
}
.cardface__chip{
  width:50px;
  height:36px;
  border-radius:9px;
  background:
    linear-gradient(90deg,rgba(90,65,0,.24) 1px,transparent 1px) 50%/12px 100%,
    linear-gradient(180deg,rgba(255,255,255,.34),transparent 44%),
    linear-gradient(135deg,#f8dc78,#b57c28);
  box-shadow:inset 0 0 0 1px rgba(60,35,0,.22);
}
.cardface__num{
  margin-top:22px;
  white-space:nowrap;
  font:800 clamp(19px,3vw,24px)/1 var(--mono);
  letter-spacing:.075em;
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.32);
}
.cardface__row{
  position:absolute;
  left:22px;
  right:22px;
  bottom:18px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin:0;
}
.cardface__row span{
  min-width:0;
}
.cardface__row span:first-child{
  flex:1;
}
.cardface__row small{
  display:block;
  margin-bottom:4px;
  color:rgba(255,255,255,.46);
  font:800 8px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}
.cardface__row b{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(255,255,255,.78);
  font:800 11px/1 var(--mono);
  letter-spacing:.04em;
}
.payflow{
  position:fixed;
  inset:0;
  z-index:120;
  background:rgba(0,0,0,.58);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(0);
  -webkit-backdrop-filter:blur(0);
  transition:opacity .28s ease,backdrop-filter .55s ease;
}
.payflow.is-run{
  opacity:1;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  pointer-events:auto;
}
.payflow__stage{
  position:absolute;
  inset:0;
  perspective:1200px;
}
.paycard-ghost{
  position:fixed;
  z-index:121;
  margin:0;
  transform-origin:center;
  transition:
    left .72s cubic-bezier(.16,1,.3,1),
    top .72s cubic-bezier(.16,1,.3,1),
    width .72s cubic-bezier(.16,1,.3,1),
    height .72s cubic-bezier(.16,1,.3,1),
    transform .72s cubic-bezier(.16,1,.3,1),
    box-shadow .72s ease;
  will-change:left,top,width,height,transform;
  pointer-events:none;
}
.paycard-ghost.is-fly{
  left:50% !important;
  top:50% !important;
  width:min(460px,calc(100vw - 36px)) !important;
  height:auto !important;
  transform:translate(-50%,-50%) scale(1.02);
  box-shadow:0 38px 90px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.14);
}
.paycard-ghost.is-ok,
.paycard-ghost.is-fail{
  transform:translate(-50%,-50%) scale(1.04);
  pointer-events:auto;
}
.paycard-result{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:26px;
  border-radius:inherit;
  color:#fff;
  text-align:center;
  background:
    linear-gradient(180deg,rgba(8,11,15,.62),rgba(8,11,15,.88)),
    radial-gradient(circle at 50% 18%,rgba(70,217,121,.16),transparent 46%);
  backdrop-filter:blur(10px) saturate(120%);
  -webkit-backdrop-filter:blur(10px) saturate(120%);
  animation:paystatus .42s cubic-bezier(.16,1,.3,1) both;
  pointer-events:auto;
}
@keyframes paystatus{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.paycard-result span{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font:900 31px/1 system-ui;
}
.paycard-result.ok span{
  color:#061009;
  background:#46d979;
  box-shadow:0 0 32px rgba(70,217,121,.34);
}
.paycard-result.fail span{
  color:#fff;
  background:#ff6177;
  box-shadow:0 0 32px rgba(255,97,119,.28);
}
.paycard-result b{
  font-size:22px;
  letter-spacing:-.03em;
}
.paycard-result small{
  max-width:310px;
  color:#a6b0bd;
  line-height:1.45;
}
.paycard-done{
  margin-top:8px;
  min-width:132px;
  min-height:38px;
  border:0;
  border-radius:9px;
  color:#07120b;
  background:#46d979;
  font:800 13px/1 system-ui;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.18);
  cursor:pointer;
  pointer-events:auto;
}
.paycard-result.fail .paycard-done{
  color:#fff;
  background:#242b35;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:none;
}
.modal__card.is-paying .checkout > *:not(.cardface){
  pointer-events:none;
}
.modal__card.is-paying .checkout .btn-fill.big{
  opacity:.62;
}

/* Small polish pass */
.modal{
  background:rgba(0,0,0,.72);
}
.modal__card{
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 32px 90px rgba(0,0,0,.46);
}
.checkout__head{
  background:linear-gradient(180deg,rgba(255,255,255,.035),transparent);
}
.paymethod{
  background:#0c1116;
}
.paymethod.is-active{
  background:rgba(70,217,121,.1);
}
.fields input{
  min-height:44px;
  background:#080b0f;
}
.checkout__total{
  color:#a8b2bf;
}
.checkout__total b{
  font-size:25px;
}

/* Hotbar dock */
.dock{
  width:min(520px,calc(100% - 20px));
  bottom:max(14px,env(safe-area-inset-bottom));
  filter:drop-shadow(0 18px 22px rgba(0,0,0,.38));
}
.dock__bar{
  min-height:72px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:6px;
  padding:8px;
  border-radius:12px;
  overflow:visible;
  background:#0c0f13;
  border:2px solid rgba(255,255,255,.12);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.06),inset 0 -3px 0 rgba(0,0,0,.38);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.dock__bar::before,
.dock__bar::after,
.dock__lens{
  display:none;
}
.dtab{
  min-height:56px;
  gap:4px;
  border-radius:8px;
  color:#9ca6b4;
  background:#151a21;
  border:1px solid rgba(255,255,255,.075);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.25);
  text-shadow:none;
}
.dtab::before,
.dtab::after{
  display:none;
}
.dtab .ic{
  width:24px;
  height:24px;
  filter:none;
}
.dtab span{
  font-size:10px;
  transform:none;
}
.dtab:hover,
.dtab.mag{
  color:#f3f6f9;
  background:#1b222b;
  transform:translateY(-1px);
}
.dtab.is-active{
  color:#0b140e;
  background:#46d979;
  border-color:#7af0a0;
}
.dtab.is-active .ic{
  color:#0b140e;
}
.dtab.mag .ic,
.dtab.mag span{
  transform:none;
}

@media(max-width:900px){
  .hero{
    grid-template-columns:1fr;
  }
  .hero__stats{
    grid-template-columns:repeat(4,1fr);
  }
}
@media(max-width:640px){
  body{
    padding-bottom:104px;
  }
  .top{
    width:calc(100% - 16px);
    border-radius:10px;
  }
  .hero__glasspanel{
    min-height:280px;
    padding:22px;
  }
  .hero h1{
    font-size:clamp(48px,15vw,68px);
  }
  .hero__stats{
    grid-template-columns:repeat(2,1fr);
  }
  .dock{
    width:calc(100% - 12px);
  }
  .dock__bar{
    min-height:64px;
    gap:4px;
    padding:6px;
    border-radius:10px;
  }
  .dtab{
    min-height:52px;
    border-radius:7px;
  }
  .dtab .ic{
    width:22px;
    height:22px;
  }
  .dtab span{
    font-size:9px;
  }
}

/* =======================================================
   Forum support redesign
   ======================================================= */
body[data-page="forum"] .wrap{
  max-width:1180px;
}
body[data-page="forum"] .phead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
}
body[data-page="forum"] .phead h1{
  font-size:clamp(34px,5vw,54px);
}
body[data-page="forum"] .phead p{
  max-width:560px;
}
.tkstats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}
.tkstat{
  position:relative;
  overflow:hidden;
  padding:15px;
  border-radius:12px;
  background:#10151b;
  border:1px solid rgba(255,255,255,.07);
}
.tkstat::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:#6b7280;
}
.tkstat.st-open::before{background:#4aa3ff}
.tkstat.st-ok::before{background:#46d979}
.tkstat.st-no::before{background:#ff6177}
.tkstat.st-cl::before{background:#8b96a5}
.tkstat b{
  color:#fff;
  font-size:25px;
}
.tkstat span{
  color:#8b96a5;
  letter-spacing:.08em;
}
.forum{
  display:grid;
  grid-template-columns:330px minmax(0,1fr);
  gap:14px;
  align-items:start;
}
.ticketform{
  position:sticky;
  top:92px;
  padding:18px;
  border-radius:14px;
  background:#10151b;
}
.ticketform h3{
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-size:18px;
  letter-spacing:-.02em;
}
.ticketform h3 .ic{
  width:19px;
  height:19px;
  color:#46d979;
}
.typepick{
  gap:7px;
}
.typeopt span{
  min-height:44px;
  gap:7px;
  border-radius:10px;
  background:#0a0e12;
}
.typeopt span .ic{
  width:18px;
  height:18px;
}
.typeopt input:checked + span{
  color:#07120b;
  border-color:#74eca0;
  background:#46d979;
}
.tickets{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.tk{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:13px 14px;
  border-radius:13px;
  background:#10151b;
  border:1px solid rgba(255,255,255,.07);
}
.tk:hover{
  transform:translateY(-2px);
  border-color:rgba(70,217,121,.22);
  background:#131922;
}
.tk__emoji{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#0a0e12;
  color:#46d979;
}
.tk__emoji .ic{
  width:25px;
  height:25px;
}
.tk__type{
  color:#fff;
  font-size:16px;
  font-weight:850;
}
.tk__meta{
  margin-top:3px;
  color:#8792a1;
}
.st{
  border-radius:999px;
  padding:6px 10px;
  background:rgba(255,255,255,.06);
  color:#cbd3dd;
}
.st-open{background:rgba(74,163,255,.12);color:#9dccff}
.st-ok{background:rgba(70,217,121,.12);color:#a9f6c2}
.st-no{background:rgba(255,97,119,.12);color:#ffb0bd}
.st-cl{background:rgba(139,150,165,.12);color:#c0c7d0}
.empty{
  display:grid;
  place-items:center;
  gap:4px;
  min-height:220px;
  border-radius:14px;
}
.empty .ic{
  width:34px;
  height:34px;
  color:#46d979;
}
.ticket{
  padding:0;
  overflow:hidden;
  border-radius:16px;
  background:#10151b;
}
.ticket__top{
  display:grid;
  grid-template-columns:56px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:18px;
  margin:0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.ticket__emoji{
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#0a0e12;
  color:#46d979;
}
.ticket__emoji .ic{
  width:29px;
  height:29px;
}
.ticket__top h1{
  font-size:26px;
  letter-spacing:-.035em;
}
.ticket__meta{
  gap:8px;
}
.tag{
  background:#0a0e12;
  border:1px solid rgba(255,255,255,.06);
}
.staffnotice{
  display:flex;
  align-items:center;
  gap:9px;
  margin:14px 18px 0;
  padding:11px 12px;
  border-radius:10px;
  color:#b8f7cc;
  background:rgba(70,217,121,.075);
  border:1px solid rgba(70,217,121,.14);
  font-size:13px;
  font-weight:700;
}
.staffnotice .ic{
  width:18px;
  height:18px;
  color:#46d979;
}
.staffbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:14px 18px 0;
  padding:12px;
  border-radius:10px;
  background:#0a0e12;
  border:1px solid rgba(255,255,255,.06);
}
.staffbar__lbl{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-right:4px;
}
.staffbar__lbl .ic,
.decide .ic{
  width:16px;
  height:16px;
}
.thread{
  margin:0;
  padding:18px;
  gap:14px;
}
.thread__empty{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:10px;
  background:#0a0e12;
}
.thread__empty .ic{
  width:18px;
  height:18px;
  color:#46d979;
}
.msg{
  gap:10px;
}
.msg__ava{
  width:42px;
  height:42px;
  border-radius:10px;
}
.msg__body{
  padding:12px 14px;
  border-radius:5px 13px 13px 13px;
  background:#0a0e12;
  border:1px solid rgba(255,255,255,.06);
}
.msg--staff .msg__body{
  background:rgba(70,217,121,.075);
  border-color:rgba(70,217,121,.14);
}
.msg__head{
  gap:7px;
}
.msg__head b{
  color:#fff;
}
.msg__head time{
  color:#7f8a99;
}
.role--helper{
  color:#9dccff;
  background:rgba(74,163,255,.12);
}
.role--moder{
  color:#a9f6c2;
  background:rgba(70,217,121,.12);
}
.role--admin{
  color:#ffc0ca;
  background:rgba(255,97,119,.12);
}
.composer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  margin:0;
  padding:0 18px 18px;
}
.composer__in{
  min-height:46px;
  border-radius:10px;
}
.composer__send{
  min-width:132px;
}
.composer__send .ic{
  width:17px;
  height:17px;
}
.closed-note{
  margin:0 18px 18px;
  border-radius:10px;
}
@media(max-width:900px){
  body[data-page="forum"] .phead{
    display:block;
  }
  .forum{
    grid-template-columns:1fr;
  }
  .ticketform{
    position:static;
  }
  .tkstats{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:560px){
  .ticket__top{
    grid-template-columns:46px minmax(0,1fr);
  }
  .ticket__top .st{
    grid-column:1/-1;
    width:max-content;
  }
  .composer{
    grid-template-columns:1fr;
  }
  .composer__send{
    width:100%;
  }
  .tk{
    grid-template-columns:42px minmax(0,1fr);
  }
  .tk .st{
    grid-column:2;
    width:max-content;
  }
  .tk__emoji{
    width:42px;
    height:42px;
  }
}

/* =======================================================
   Uploads, policy text, rank images
   ======================================================= */
.attachpick{
  position:relative;
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 12px;
  border-radius:10px;
  color:var(--ink);
  background:#0a0e12;
  border:1px dashed rgba(255,255,255,.14);
  cursor:pointer;
  transition:.2s var(--ease);
  overflow:hidden;
}
.attachpick:hover{
  border-color:#46d979;
  background:rgba(70,217,121,.08);
}
.attachpick .ic{
  width:18px;
  height:18px;
  color:#46d979;
  flex:none;
}
.attachpick input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}
.attach{
  display:inline-flex;
  align-items:center;
  gap:10px;
  max-width:min(380px,100%);
  margin-top:10px;
  padding:8px;
  border-radius:10px;
  color:var(--ink);
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}
.attach:hover{
  border-color:rgba(70,217,121,.28);
  background:rgba(70,217,121,.06);
}
.attach img{
  width:120px;
  height:82px;
  object-fit:cover;
  border-radius:8px;
  background:#05080a;
}
.attach span{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  color:#a8b2bf;
  font-size:13px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.attach span .ic{
  width:16px;
  height:16px;
  color:#46d979;
  flex:none;
}
.composer{
  grid-template-columns:minmax(0,1fr) auto auto;
}
.composer__file{
  min-width:86px;
  min-height:46px;
}
.policybox{
  grid-column:2;
  margin:14px 24px 12px;
  padding:14px;
  border-radius:12px;
  background:#0c1116;
  border:1px solid rgba(255,255,255,.08);
}
.ccard__desc{
  min-height:42px;
  margin:8px 0 10px;
  color:#a8b2bf;
  font-size:12px;
  line-height:1.35;
}
.paystub{
  max-width:760px;
  margin:0 auto;
  padding:22px;
}
.paystub__top{
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
}
.paystub__top h2{
  color:#fff;
  letter-spacing:-.03em;
}
.paystub__top p{
  margin:4px 0 0;
  color:#a8b2bf;
}
.paystub__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:18px 0;
}
.paystub__grid div{
  padding:13px;
  border-radius:10px;
  background:#0a0e12;
  border:1px solid rgba(255,255,255,.07);
}
.paystub__grid span{
  display:block;
  color:#8b96a5;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.paystub__grid b{
  display:block;
  margin-top:5px;
  color:#fff;
  font-size:18px;
}
.paystub__note{
  padding:13px;
  border-radius:10px;
  color:#a8b2bf;
  background:rgba(70,217,121,.075);
  border:1px solid rgba(70,217,121,.14);
  font-size:13px;
  line-height:1.5;
}
.paystub__note code{
  color:#fff;
}
.paystub__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
@media(max-width:640px){
  .paystub__top,
  .paystub__grid{
    grid-template-columns:1fr;
  }
}
.policybox h3{
  margin:0 0 9px;
  color:#fff;
  font-size:14px;
  line-height:1.25;
  letter-spacing:0;
}
.policybox__text{
  max-height:172px;
  overflow:auto;
  padding-right:8px;
  color:#a8b2bf;
  font-size:12px;
  line-height:1.45;
}
.policybox__text p{
  margin:0 0 9px;
}
.policybox__text p:last-child{
  margin-bottom:0;
}
.policybox--compact{
  grid-column:auto;
  margin:0;
}
.policybox--compact .policybox__text{
  max-height:150px;
}
.policyagree{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:9px;
  color:var(--ink);
  font-size:13px;
  line-height:1.35;
}
.policyagree input{
  width:18px;
  height:18px;
  min-width:18px;
  margin:0;
  padding:0;
  flex:none;
  accent-color:#46d979;
}
.policyagree span{
  min-width:0;
}
.topup__agree{
  margin-top:2px;
}
.prow__icon img,
.prow__icon .i,
img.tier__badge{
  object-fit:contain;
}
.prow__icon img,
.prow__icon .i{
  width:26px;
  height:26px;
}
img.tier__badge{
  padding:4px;
}
@media(max-width:760px){
  .policybox{
    grid-column:1;
    margin-left:18px;
    margin-right:18px;
  }
}
@media(max-width:560px){
  .composer{
    grid-template-columns:1fr;
  }
  .attach{
    display:flex;
  }
  .attach img{
    width:96px;
    height:68px;
  }
}
.secretbox{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin:10px 0;
  padding:11px;
  border-radius:10px;
  background:rgba(70,217,121,.075);
  border:1px solid rgba(70,217,121,.14);
  color:#a8b2bf;
  font-size:13px;
}
.secretbox code{
  display:block;
  overflow:auto;
  color:#fff;
  font-size:12px;
  user-select:all;
}

/* =======================================================
   Black / orange shop refresh
   ======================================================= */
:root,
:root[data-theme="dark"],
:root[data-theme="light"]{
  --bg:#050505;
  --panel:#11100f;
  --panel2:#17110d;
  --line:rgba(255,128,31,.25);
  --line2:rgba(255,255,255,.08);
  --accent:#ff7a18;
  --accent2:#ffc247;
  --warn:#ff3d2e;
  --ink:#fff8ef;
  --muted:#b8a99b;
  --panel-grad:linear-gradient(180deg,rgba(25,19,14,.9),rgba(9,9,9,.96));
  --glass-bg:rgba(12,10,8,.68);
  --glass-edge:rgba(255,138,42,.2);
  --dock-glass:rgba(14,11,9,.78);
  --top-bg:rgba(6,6,6,.82);
  --field-bg:rgba(255,255,255,.055);
  --grid-line:rgba(255,122,24,.09);
  --shadow:0 22px 60px rgba(0,0,0,.62);
}

body{
  background:
    radial-gradient(circle at 50% -20%,rgba(255,122,24,.16),transparent 38%),
    linear-gradient(180deg,#070707,#030303 52%,#080604);
}

.fx{
  z-index:-3;
  background:
    linear-gradient(115deg,rgba(255,122,24,.08),transparent 24%,rgba(255,194,71,.055) 58%,transparent 88%),
    radial-gradient(circle at 50% 0%,rgba(255,122,24,.2),transparent 42%),
    #050505;
}
body[style*="--site-bg"] .fx{
  background:
    linear-gradient(rgba(5,5,5,.78),rgba(5,5,5,.92)),
    var(--site-bg);
  background-size:cover;
  background-position:center;
}
.glow{display:none}
.fx::before,
.fx::after,
.scan{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
}
.fx::before{
  background-image:
    radial-gradient(circle,rgba(255,255,255,.95) 0 1px,transparent 1.7px),
    radial-gradient(circle,rgba(255,190,110,.5) 0 1px,transparent 1.9px);
  background-size:88px 88px,132px 132px;
  background-position:0 0,34px -40px;
  opacity:.72;
  mask:linear-gradient(#000,transparent 92%);
  animation:snowFall 18s linear infinite;
}
.fx::after{
  background-image:
    radial-gradient(circle,rgba(255,255,255,.7) 0 1px,transparent 1.8px),
    radial-gradient(circle,rgba(255,122,24,.38) 0 1px,transparent 2px);
  background-size:56px 56px,110px 110px;
  background-position:18px 16px,-22px 8px;
  opacity:.38;
  animation:snowFall2 28s linear infinite;
}
.scan{
  background:
    linear-gradient(90deg,transparent,rgba(255,122,24,.12),transparent),
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 5px);
  opacity:.35;
  animation:scanOrange 10s linear infinite;
}
.vig{
  box-shadow:inset 0 0 190px 58px rgba(0,0,0,.85);
}
.snowfall{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:2;
}
.snowflake{
  position:absolute;
  top:-12vh;
  left:var(--x);
  width:var(--size);
  height:var(--size);
  border-radius:50%;
  opacity:var(--alpha);
  filter:blur(var(--blur));
  background:
    radial-gradient(circle,rgba(255,255,255,.98) 0 35%,rgba(255,255,255,.55) 58%,transparent 72%);
  box-shadow:
    0 0 calc(var(--size) * 2.4) rgba(255,255,255,.55),
    0 0 calc(var(--size) * 4.6) rgba(255,122,24,.18);
  animation:snowflakeFall var(--dur) linear var(--delay) infinite;
  will-change:transform;
}
@keyframes snowflakeFall{
  0%{transform:translate3d(0,-14vh,0)}
  45%{transform:translate3d(var(--drift-mid),48vh,0)}
  100%{transform:translate3d(var(--drift),116vh,0)}
}
@keyframes snowFall{
  from{transform:translate3d(0,-8%,0)}
  to{transform:translate3d(-7%,18%,0)}
}
@keyframes snowFall2{
  from{transform:translate3d(0,-12%,0)}
  to{transform:translate3d(8%,22%,0)}
}
@keyframes scanOrange{
  from{transform:translateX(-12%)}
  to{transform:translateX(12%)}
}

.top{
  border-bottom-color:rgba(255,122,24,.25);
  background:linear-gradient(180deg,rgba(8,8,8,.93),rgba(8,6,4,.78));
}
.brand__cube{
  border-radius:8px;
  color:#160a00;
  background:linear-gradient(160deg,#ffc247,#ff7a18 58%,#9d2d00);
  box-shadow:0 0 0 1px rgba(255,255,255,.18),0 12px 26px rgba(255,122,24,.35);
}
.brand__name i,
.chip .ic,
.cur__sym,
.acct__stat,
.ipbig .ic{
  color:var(--accent2);
}
.chip,
.cur__btn,
.btn-ghost,
.acct__ava img{
  border-color:rgba(255,122,24,.24);
  background:rgba(255,255,255,.045);
}
.chip:hover,
.cur__btn:hover,
.btn-ghost:hover{
  border-color:var(--accent);
  background:rgba(255,122,24,.12);
}
.themebtn{display:none}
.cur__menu{
  border-radius:8px;
  background:linear-gradient(180deg,rgba(23,18,14,.98),rgba(9,9,9,.98));
  border-color:rgba(255,122,24,.28);
}
.cur__menu button:hover{
  background:rgba(255,122,24,.14);
}

.wrap{
  max-width:1180px;
}
.hero{
  grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);
  align-items:stretch;
}
.hero__glasspanel,
.phead--banner{
  isolation:isolate;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(255,122,24,.32);
  background:
    linear-gradient(135deg,rgba(255,122,24,.22),rgba(10,10,10,.92) 40%,rgba(255,194,71,.11)),
    linear-gradient(180deg,rgba(24,17,12,.94),rgba(8,8,8,.97));
  box-shadow:0 28px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08);
}
.hero__glasspanel::before,
.phead--banner::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(100deg,transparent 0 22%,rgba(255,255,255,.09) 34%,transparent 48%),
    repeating-linear-gradient(135deg,rgba(255,122,24,.12) 0 1px,transparent 1px 12px);
  transform:translateX(-28%);
  animation:bannerSweep 7s ease-in-out infinite;
}
.hero__glasspanel::after,
.phead--banner::after{
  content:"";
  position:absolute;
  right:-70px;
  bottom:-90px;
  width:260px;
  height:260px;
  border:1px solid rgba(255,122,24,.2);
  transform:rotate(18deg);
  background:repeating-linear-gradient(90deg,rgba(255,122,24,.12) 0 2px,transparent 2px 16px);
  opacity:.5;
}
@keyframes bannerSweep{
  0%,100%{transform:translateX(-36%)}
  50%{transform:translateX(20%)}
}
.kicker{
  color:var(--accent2);
  letter-spacing:.18em;
}
.hero h1,
.phead h1{
  letter-spacing:0;
  text-shadow:0 0 26px rgba(255,122,24,.22);
}
.hero__sub,
.phead p{
  color:#dccfc0;
}
.hero__cta{
  margin-bottom:24px;
}
.ipbig{
  border-color:rgba(255,122,24,.34);
  background:rgba(0,0,0,.42);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);
}
.ipbig:hover{
  border-color:var(--accent);
  background:rgba(255,122,24,.12);
}
.hero__stats{
  gap:14px;
}
.stat{
  border-radius:8px;
  background:linear-gradient(180deg,rgba(24,17,12,.88),rgba(8,8,8,.92));
  border-color:rgba(255,122,24,.25);
  transition:transform .28s var(--ease),border-color .28s var(--ease),box-shadow .28s var(--ease);
}
.stat:hover{
  transform:translateY(-4px);
  border-color:rgba(255,194,71,.55);
  box-shadow:0 18px 44px rgba(255,122,24,.15);
}
.stat b{
  color:var(--accent2);
}

.promo-banners{
  display:grid;
  grid-template-columns:1.2fr .9fr .9fr;
  gap:14px;
  margin:18px 0 6px;
}
.promo-banner{
  position:relative;
  min-height:86px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding:18px;
  border-radius:8px;
  border:1px solid rgba(255,122,24,.28);
  background:
    linear-gradient(120deg,rgba(255,122,24,.22),rgba(16,12,10,.96) 52%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 1px,transparent 1px 13px);
  box-shadow:0 18px 44px rgba(0,0,0,.36);
  transition:transform .25s var(--ease),border-color .25s var(--ease);
}
.promo-banner::before{
  content:"";
  position:absolute;
  inset:-60% -20%;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.16),transparent);
  transform:translateX(-80%) rotate(8deg);
  animation:promoShine 5.5s ease-in-out infinite;
}
.promo-banner:hover{
  transform:translateY(-4px);
  border-color:rgba(255,194,71,.65);
}
.promo-banner b,
.promo-banner span{
  position:relative;
  z-index:1;
}
.promo-banner b{
  font-size:18px;
  text-transform:uppercase;
}
.promo-banner span{
  color:#160a00;
  font-weight:900;
  padding:7px 10px;
  border-radius:6px;
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
@keyframes promoShine{
  0%,45%{transform:translateX(-90%) rotate(8deg)}
  75%,100%{transform:translateX(90%) rotate(8deg)}
}

.panel,
.tier,
.ccard,
.topup,
.modal__card{
  border-radius:8px;
  border-color:rgba(255,122,24,.24);
  background:linear-gradient(180deg,rgba(24,18,13,.9),rgba(8,8,8,.97));
}
.panel::after{
  background:linear-gradient(90deg,transparent,var(--accent2),transparent);
  opacity:.5;
}
.tier,
.ccard{
  transform-style:preserve-3d;
}
.tier::before,
.ccard::before{
  background:
    radial-gradient(80% 60% at 50% -20%,color-mix(in srgb,var(--c,var(--accent)) 30%,transparent),transparent 70%),
    linear-gradient(145deg,rgba(255,255,255,.04),transparent 45%);
}
.tier:hover,
.ccard:hover{
  transform:translateY(-7px) rotateX(1.5deg);
  border-color:rgba(255,194,71,.58);
  box-shadow:0 28px 70px rgba(0,0,0,.62),0 0 34px color-mix(in srgb,var(--c,var(--accent)) 20%,transparent);
}
.tier__badge,
.ccard__emoji,
.checkout__badge{
  border-radius:8px;
  color:#160a00;
  background:linear-gradient(160deg,var(--accent2),var(--accent));
  box-shadow:0 12px 28px rgba(255,122,24,.28),inset 0 1px 0 rgba(255,255,255,.42);
}
.tier__badge .ic,
.ccard__emoji .ic,
.checkout__badge .ic{
  color:#160a00;
}
.tier__name,
.ccard__name{
  letter-spacing:0;
}
.tier__price b,
.ccard__price,
.checkout__total b{
  color:#fff;
  text-shadow:0 0 18px rgba(255,122,24,.2);
}
.tier__tok,
.ccard__tok{
  color:var(--accent2);
}
.ccard__desc{
  color:#c7b9aa;
  min-height:40px;
}
.ccard .btn-fill,
.tier .btn-fill{
  width:100%;
}
.btn-fill{
  color:#160a00;
  border-radius:7px;
  background:linear-gradient(120deg,#ffc247,#ff7a18 58%,#ff4d00);
  box-shadow:0 14px 32px rgba(255,122,24,.28),inset 0 1px 0 rgba(255,255,255,.45);
}
.btn-fill:hover{
  filter:brightness(1.08) saturate(1.06);
}
.daydock{
  background:rgba(0,0,0,.36);
  border-color:rgba(255,122,24,.2);
}
.daydock__pill{
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
.daydock button.is-active{
  color:#160a00;
}

.phead--banner{
  position:relative;
  padding:24px;
  margin-bottom:22px;
}
.cards{
  gap:16px;
}

.exchange{
  max-width:560px;
  gap:16px;
}
.exchange__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px;
  border-radius:8px;
  background:
    linear-gradient(120deg,rgba(255,122,24,.18),rgba(0,0,0,.28)),
    repeating-linear-gradient(135deg,rgba(255,255,255,.045) 0 1px,transparent 1px 12px);
  border:1px solid rgba(255,122,24,.22);
}
.exchange__head b{
  display:block;
  font-size:18px;
  color:#fff;
}
.exchange__head span{
  display:block;
  margin-top:3px;
  color:#c7b9aa;
  font-size:13px;
}
.exchange__head strong{
  flex:none;
  max-width:45%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:8px 10px;
  border-radius:6px;
  color:#160a00;
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
.exchange__quick{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.exchange__quick button{
  min-height:42px;
  border:1px solid rgba(255,122,24,.26);
  border-radius:7px;
  color:#fff5e8;
  font-weight:900;
  background:rgba(255,255,255,.055);
  transition:transform .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);
}
.exchange__quick button:hover,
.exchange__quick button.is-active{
  transform:translateY(-2px);
  color:#160a00;
  border-color:rgba(255,194,71,.7);
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
input,
select,
textarea{
  border-color:rgba(255,122,24,.2);
  background:rgba(0,0,0,.34);
  color:var(--ink);
}
input:focus,
select:focus,
textarea:focus{
  border-color:rgba(255,194,71,.65);
  box-shadow:0 0 0 3px rgba(255,122,24,.14);
}
.policybox{
  border-radius:8px;
  background:rgba(0,0,0,.32);
  border-color:rgba(255,122,24,.16);
}
.policyagree input{
  accent-color:#ff7a18;
}

.modal{
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(10px);
}
.modal__card{
  border-color:rgba(255,122,24,.36);
}
.modal__x{
  border-radius:7px;
  border-color:rgba(255,122,24,.28);
  background:rgba(0,0,0,.38);
}
.paymethod,
.balrow{
  border-color:rgba(255,122,24,.2);
  background:rgba(255,255,255,.045);
}
.paymethod.is-active{
  color:#160a00;
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
.cardface{
  border-color:rgba(255,122,24,.28);
  background:
    linear-gradient(135deg,#1d130b,#090909 55%,#291306),
    repeating-linear-gradient(135deg,rgba(255,122,24,.22) 0 1px,transparent 1px 14px);
}
.cardface__brand,
.cardface__row small,
.checkout__safe{
  color:#d8c8b8;
}

.dock__bar{
  border-color:rgba(255,122,24,.3);
  background:rgba(9,8,7,.78);
}
.dock__lens{
  background:linear-gradient(145deg,rgba(255,194,71,.24),rgba(255,122,24,.16));
  border-color:rgba(255,194,71,.42);
}
.dtab.is-active,
.dtab.mag{
  color:var(--accent2);
}
.dtab.mag .ic{
  filter:drop-shadow(0 8px 16px rgba(255,122,24,.7));
}
.foot{
  color:#9f9184;
}

@media(max-width:900px){
  .hero,
  .promo-banners{
    grid-template-columns:1fr;
  }
  .promo-banner{
    min-height:74px;
  }
}
@media(max-width:560px){
  .phead--banner{
    padding:18px;
  }
  .exchange__head{
    align-items:flex-start;
    flex-direction:column;
  }
  .exchange__head strong{
    max-width:100%;
  }
  .exchange__quick{
    grid-template-columns:repeat(2,1fr);
  }
  .promo-banner{
    align-items:flex-start;
    flex-direction:column;
  }
}
@media(prefers-reduced-motion:reduce){
  .fx::before,
  .fx::after,
  .scan,
  .hero__glasspanel::before,
  .phead--banner::before,
  .promo-banner::before{
    animation:none;
  }
}

/* =======================================================
   Clean home + rounder UI pass
   ======================================================= */
:root,
:root[data-theme="dark"],
:root[data-theme="light"]{
  --r:18px;
}

.panel,
.tier,
.ccard,
.topup,
.modal__card,
.phead--banner,
.stat,
.policybox,
.cardface{
  border-radius:24px;
}
.btn-fill,
.btn-ghost,
.ipbig,
.cur__btn,
.chip,
input,
select,
textarea,
.exchange__quick button{
  border-radius:999px;
}
.brand__cube,
.acct__ava img,
.tier__badge,
.ccard__emoji,
.checkout__badge,
.modal__x{
  border-radius:18px;
}
.daydock,
.paymethod,
.balrow,
.exchange__head{
  border-radius:22px;
}
.daydock__pill,
.daydock button,
.exchange__head strong{
  border-radius:18px;
}
.dock__bar{
  border-radius:44px;
}
.dock__bar::before{
  border-radius:43px;
}
.dock__lens{
  border-radius:34px;
}
.dtab,
.dtab::before{
  border-radius:28px;
}

.home-clean{
  position:relative;
  min-height:calc(100vh - 230px);
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,122,24,.28);
  background:
    radial-gradient(circle at 50% 40%,rgba(255,122,24,.18),transparent 34%),
    linear-gradient(145deg,rgba(255,122,24,.12),rgba(6,6,6,.92) 48%,rgba(255,194,71,.08)),
    #060606;
  box-shadow:0 30px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.08);
}
.home-clean::before{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    repeating-linear-gradient(135deg,rgba(255,122,24,.08) 0 1px,transparent 1px 18px),
    linear-gradient(100deg,transparent,rgba(255,255,255,.08),transparent);
  animation:homeBeam 10s ease-in-out infinite;
  opacity:.72;
}
.home-clean::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 50%,transparent 0 45%,rgba(0,0,0,.52) 100%);
}
.home-clean__content{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:28px;
  text-align:center;
  padding:36px 18px;
}
.home-clean h1{
  font-size:clamp(58px,13vw,148px);
  line-height:.85;
  letter-spacing:0;
  text-transform:uppercase;
  color:#fff8ef;
  text-shadow:
    0 0 18px rgba(255,122,24,.35),
    0 0 62px rgba(255,122,24,.2),
    0 18px 70px rgba(0,0,0,.65);
}
.home-clean__btn{
  min-width:min(320px,100%);
  padding:17px 28px;
  font-size:15px;
  box-shadow:0 18px 46px rgba(255,122,24,.34),inset 0 1px 0 rgba(255,255,255,.52);
}
.home-clean__particles{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:1;
}
.home-clean__particles span{
  position:absolute;
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(255,220,170,.9);
  box-shadow:0 0 22px rgba(255,122,24,.75);
  opacity:.58;
  animation:homeParticle 9s linear infinite;
}
.home-clean__particles span:nth-child(1){left:8%;top:16%;animation-delay:-1s;animation-duration:11s}
.home-clean__particles span:nth-child(2){left:18%;top:74%;animation-delay:-6s;animation-duration:13s}
.home-clean__particles span:nth-child(3){left:28%;top:28%;animation-delay:-3s;animation-duration:10s}
.home-clean__particles span:nth-child(4){left:38%;top:82%;animation-delay:-8s;animation-duration:12s}
.home-clean__particles span:nth-child(5){left:48%;top:12%;animation-delay:-5s;animation-duration:14s}
.home-clean__particles span:nth-child(6){left:58%;top:68%;animation-delay:-2s;animation-duration:11s}
.home-clean__particles span:nth-child(7){left:70%;top:22%;animation-delay:-9s;animation-duration:13s}
.home-clean__particles span:nth-child(8){left:82%;top:78%;animation-delay:-4s;animation-duration:10s}
.home-clean__particles span:nth-child(9){left:92%;top:38%;animation-delay:-7s;animation-duration:12s}
.home-clean__particles span:nth-child(10){left:12%;top:48%;animation-delay:-10s;animation-duration:15s}
.home-clean__particles span:nth-child(11){left:24%;top:90%;animation-delay:-2.5s;animation-duration:12s}
.home-clean__particles span:nth-child(12){left:36%;top:8%;animation-delay:-7.5s;animation-duration:14s}
.home-clean__particles span:nth-child(13){left:52%;top:46%;animation-delay:-4.5s;animation-duration:11s}
.home-clean__particles span:nth-child(14){left:64%;top:92%;animation-delay:-6.5s;animation-duration:13s}
.home-clean__particles span:nth-child(15){left:76%;top:8%;animation-delay:-3.5s;animation-duration:12s}
.home-clean__particles span:nth-child(16){left:88%;top:58%;animation-delay:-8.5s;animation-duration:14s}
.home-clean__particles span:nth-child(17){left:44%;top:62%;animation-delay:-1.5s;animation-duration:10s}
.home-clean__particles span:nth-child(18){left:6%;top:88%;animation-delay:-5.5s;animation-duration:13s}

@keyframes homeBeam{
  0%,100%{transform:translateX(-10%) rotate(0deg)}
  50%{transform:translateX(10%) rotate(1deg)}
}
@keyframes homeParticle{
  0%{transform:translate3d(0,24px,0) scale(.65);opacity:.15}
  20%{opacity:.7}
  50%{transform:translate3d(26px,-28px,0) scale(1.15)}
  100%{transform:translate3d(-18px,-92px,0) scale(.75);opacity:.08}
}

@media(max-width:760px){
  .home-clean{
    min-height:calc(100vh - 190px);
    border-radius:28px;
  }
  .home-clean__content{
    gap:22px;
  }
  .home-clean__btn{
    width:min(300px,100%);
  }
}
@media(prefers-reduced-motion:reduce){
  .home-clean::before,
  .home-clean__particles span{
    animation:none;
  }
}

/* =======================================================
   Exchange purchase cards
   ======================================================= */
.exchange-board{
  position:relative;
  overflow:hidden;
  display:grid;
  gap:18px;
  padding:22px;
  border-radius:28px;
  border:1px solid rgba(255,122,24,.28);
  background:
    radial-gradient(75% 90% at 8% 0%,rgba(255,122,24,.2),transparent 58%),
    linear-gradient(180deg,rgba(24,18,13,.92),rgba(7,7,7,.97));
  box-shadow:0 24px 70px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);
}
.exchange-board::before{
  content:"";
  position:absolute;
  inset:-30%;
  pointer-events:none;
  background:
    linear-gradient(105deg,transparent 0 38%,rgba(255,255,255,.08) 48%,transparent 58%),
    repeating-linear-gradient(135deg,rgba(255,122,24,.08) 0 1px,transparent 1px 16px);
  animation:bannerSweep 9s ease-in-out infinite;
}
.exchange-board > *{
  position:relative;
  z-index:1;
}
.exchange-board__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.exchange-board__head b{
  display:block;
  color:#fff;
  font-size:22px;
  line-height:1.1;
}
.exchange-board__head span{
  display:block;
  margin-top:5px;
  color:#cbbdad;
  font-weight:700;
}
.exchange-board__head strong{
  max-width:45%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:10px 14px;
  border-radius:999px;
  color:#160a00;
  background:linear-gradient(120deg,var(--accent2),var(--accent));
}
.exchange-cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.exchange-card{
  position:relative;
  min-height:122px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-start;
  padding:18px;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,122,24,.26);
  color:#fff8ef;
  background:
    linear-gradient(145deg,rgba(255,122,24,.18),rgba(255,255,255,.04) 42%,rgba(0,0,0,.22)),
    rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .24s var(--ease),border-color .24s var(--ease),box-shadow .24s var(--ease),background .24s var(--ease);
}
.exchange-card::before{
  content:"";
  position:absolute;
  right:-34px;
  bottom:-40px;
  width:116px;
  height:116px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,194,71,.26),transparent 68%);
}
.exchange-card span{
  position:relative;
  z-index:1;
  font:900 30px/1 var(--mono);
  color:var(--accent2);
}
.exchange-card b{
  position:relative;
  z-index:1;
  color:#fff;
  font:800 15px/1 var(--mono);
}
.exchange-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,194,71,.72);
  background:
    linear-gradient(145deg,rgba(255,122,24,.3),rgba(255,255,255,.07) 42%,rgba(0,0,0,.22)),
    rgba(255,122,24,.08);
  box-shadow:0 22px 54px rgba(255,122,24,.18),inset 0 1px 0 rgba(255,255,255,.12);
}
.exchange-card:disabled,
.exchange-custom .btn-fill:disabled{
  opacity:.48;
  cursor:not-allowed;
  filter:grayscale(.45);
}
.exchange-custom{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
  padding:14px;
  border-radius:24px;
  background:rgba(0,0,0,.24);
  border:1px solid rgba(255,122,24,.18);
}
.exchange-custom label{
  display:grid;
  gap:8px;
  color:#d8c8b8;
  font-weight:800;
}
.exchange-custom input{
  min-height:50px;
}
.exchange-custom .btn-fill{
  min-height:50px;
  padding-inline:24px;
}

@media(max-width:760px){
  .exchange-board{
    padding:16px;
    border-radius:24px;
  }
  .exchange-board__head{
    align-items:flex-start;
    flex-direction:column;
  }
  .exchange-board__head strong{
    max-width:100%;
  }
  .exchange-cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .exchange-card{
    min-height:108px;
  }
  .exchange-custom{
    grid-template-columns:1fr;
  }
  .exchange-custom .btn-fill{
    width:100%;
  }
}

/* =======================================================
   Profile invoices
   ======================================================= */
.profile .pcard{
  grid-row:span 2;
}
.pinvoices,
.phist{
  grid-column:2;
}
.pinvoices{
  padding:22px;
}
.pinvoices h3,
.phist h3{
  margin:0 0 16px;
  color:#fff;
  font-size:18px;
  letter-spacing:0;
}
.invoice-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.invoice-card{
  position:relative;
  overflow:hidden;
  display:grid;
  gap:12px;
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(255,122,24,.22);
  background:
    radial-gradient(80% 90% at 0% 0%,rgba(255,122,24,.16),transparent 58%),
    rgba(255,255,255,.045);
}
.invoice-card::before{
  content:"";
  position:absolute;
  right:-34px;
  top:-42px;
  width:120px;
  height:120px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,194,71,.2),transparent 68%);
}
.invoice-card > *{
  position:relative;
  z-index:1;
}
.invoice-card__top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
}
.invoice-card__top b{
  display:block;
  color:#fff;
  font:900 15px/1.1 var(--mono);
}
.invoice-card__top span:not(.st){
  display:block;
  margin-top:5px;
  color:#b8a99b;
  font-size:12px;
}
.invoice-card__item{
  min-height:38px;
  color:#fff8ef;
  font-weight:800;
  line-height:1.25;
}
.invoice-card__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#cbbdad;
}
.invoice-card__meta span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.invoice-card__meta strong{
  flex:none;
  color:var(--accent2);
  font:900 18px/1 var(--mono);
}
.invoice-card .btn-fill{
  width:100%;
}

@media(max-width:900px){
  .profile .pcard,
  .pinvoices,
  .phist{
    grid-column:1;
    grid-row:auto;
  }
}
@media(max-width:620px){
  .invoice-list{
    grid-template-columns:1fr;
  }
  .invoice-card__top{
    flex-direction:column;
  }
}

/* =======================================================
   Minimal Telegram-like forum
   ======================================================= */
body[data-page="forum"] .wrap{
  max-width:1120px;
}
body[data-page="forum"] .phead{
  margin:0 0 16px;
}
body[data-page="forum"] .phead h1{
  font-size:clamp(28px,5vw,44px);
  letter-spacing:0;
}
body[data-page="forum"] .phead p{
  max-width:520px;
  color:#b8a99b;
}
.forum-head{
  display:flex;
  align-items:center;
  min-height:36px;
}
.tkstats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:0 0 14px;
}
.tkstat{
  padding:12px;
  border-radius:22px;
  border:1px solid rgba(255,122,24,.16);
  background:rgba(255,255,255,.035);
  box-shadow:none;
}
.tkstat b{
  font-size:22px;
}
.tkstat span{
  letter-spacing:0;
  text-transform:none;
}
.forum{
  display:grid;
  grid-template-columns:330px minmax(0,1fr);
  gap:16px;
  align-items:start;
}
.ticketform,
.tickets,
.ticket{
  border-radius:28px;
  border:1px solid rgba(255,122,24,.18);
  background:linear-gradient(180deg,rgba(18,18,18,.94),rgba(8,8,8,.98));
  box-shadow:0 18px 54px rgba(0,0,0,.34);
}
.ticketform{
  position:sticky;
  top:86px;
  padding:18px;
  gap:12px;
}
.ticketform h3{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  color:#fff;
  font-size:17px;
}
.typepick{
  gap:8px;
}
.typeopt span{
  min-height:42px;
  border-radius:999px;
  border-color:rgba(255,122,24,.16);
  background:rgba(255,255,255,.04);
}
.typeopt input:checked + span{
  color:#160a00;
  background:linear-gradient(120deg,var(--accent2),var(--accent));
  border-color:transparent;
  transform:none;
}
.tickets{
  display:grid;
  gap:6px;
  padding:8px;
}
.tk{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:12px;
  border:0;
  border-radius:22px;
  background:transparent;
  box-shadow:none;
}
.tk:hover{
  transform:none;
  background:rgba(255,255,255,.06);
}
.tk__emoji{
  width:42px;
  height:42px;
  border-radius:50%;
  background:rgba(255,122,24,.12);
  color:var(--accent2);
}
.tk__emoji .ic{
  width:20px;
  height:20px;
}
.tk__type{
  color:#fff;
  font-weight:800;
}
.tk__meta{
  margin-top:3px;
  overflow:hidden;
  color:#9e958c;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.tk .st{
  padding:6px 10px;
  font-size:11px;
}
.ticket{
  max-width:940px;
  margin:0 auto;
  padding:0;
  overflow:hidden;
}
.ticket__top{
  position:sticky;
  top:0;
  z-index:5;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  margin:0;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,122,24,.14);
  background:rgba(14,14,14,.95);
  backdrop-filter:blur(14px);
}
.ticket__emoji{
  width:42px;
  height:42px;
  border-radius:50%;
  background:rgba(255,122,24,.12);
  color:var(--accent2);
}
.ticket__emoji .ic{
  width:20px;
  height:20px;
}
.ticket__top h1{
  color:#fff;
  font-size:18px;
  text-transform:none;
}
.ticket__meta{
  gap:8px;
  margin-top:4px;
  color:#9e958c;
  font-size:12px;
}
.tag,
.ttype{
  border-radius:999px;
}
.staffnotice,
.staffbar{
  margin:12px 16px 0;
  padding:10px 12px;
  border-radius:18px;
  border:1px solid rgba(255,122,24,.16);
  background:rgba(255,255,255,.04);
}
.thread{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:430px;
  padding:18px 16px;
  background:
    linear-gradient(135deg,rgba(255,122,24,.04),transparent 32%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 18px),
    #080808;
}
.msg{
  width:fit-content;
  max-width:78%;
  display:flex;
  align-items:flex-end;
  gap:8px;
  animation:msgin .22s var(--ease) both;
}
.msg--staff{
  align-self:flex-end;
  flex-direction:row-reverse;
}
.msg__ava{
  width:32px;
  height:32px;
  border-radius:50%;
  border:0;
}
.msg__body{
  min-width:160px;
  padding:10px 13px;
  border:0;
  border-radius:20px 20px 20px 7px;
  background:#1d1d1d;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.msg--op .msg__body{
  border:0;
}
.msg--staff .msg__body{
  border:0;
  border-radius:20px 20px 7px 20px;
  color:#160a00;
  background:linear-gradient(135deg,#ffc247,#ff8a24);
}
.msg__head{
  gap:7px;
  font-size:12px;
}
.msg__head b{
  color:inherit;
}
.msg__head time{
  color:rgba(255,248,239,.52);
  font-size:11px;
}
.msg--staff .msg__head time{
  color:rgba(22,10,0,.58);
}
.msg__role{
  display:none;
}
.msg__body p{
  margin:5px 0 0;
  line-height:1.45;
}
.thread__empty{
  align-self:center;
  margin:auto;
  padding:14px 18px;
  border-radius:999px;
  color:#b8a99b;
  background:rgba(255,255,255,.05);
}
.composer{
  position:sticky;
  bottom:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:8px;
  margin:0;
  padding:12px;
  border-top:1px solid rgba(255,122,24,.14);
  background:rgba(14,14,14,.96);
  backdrop-filter:blur(16px);
}
.composer__in{
  min-height:46px;
  border:0;
  border-radius:999px;
  background:#1d1d1d;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.composer__file{
  min-width:46px;
  min-height:46px;
  border-radius:50%;
  padding:0;
}
.composer__file span{
  display:none;
}
.composer__send{
  min-width:46px;
  min-height:46px;
  border-radius:50%;
  padding:0;
}
.composer__send .ic{
  margin:0;
}
.composer__send{
  font-size:0;
}
.attach{
  margin-top:8px;
  border-radius:18px;
  background:rgba(0,0,0,.16);
  border-color:rgba(255,255,255,.08);
}
.attach img{
  border-radius:14px;
}

@media(max-width:900px){
  .forum{
    grid-template-columns:1fr;
  }
  .ticketform{
    position:relative;
    top:auto;
  }
  .tkstats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:620px){
  .ticket__top{
    grid-template-columns:36px minmax(0,1fr);
  }
  .ticket__top .st{
    grid-column:1 / -1;
    justify-self:start;
  }
  .msg{
    max-width:92%;
  }
  .msg__ava{
    display:none;
  }
  .composer{
    grid-template-columns:minmax(0,1fr) auto auto;
  }
  .composer__send,
  .composer__file{
    width:46px;
  }
}

.attachpick.has-file{
  border-color:rgba(255,194,71,.72);
  background:rgba(255,122,24,.14);
}
.attachpick__name{
  display:block;
  max-width:180px;
  overflow:hidden;
  color:#fff8ef;
  font-style:normal;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.composer__file.has-file{
  width:auto;
  min-width:130px;
  padding:0 12px;
  border-radius:999px;
}
.composer__file.has-file span{
  display:none;
}
.composer__file.has-file .attachpick__name{
  max-width:92px;
}

/* =======================================================
   Clean black canvas snowfall
   ======================================================= */
body{
  background:#050505;
}
.fx{
  background:#050505 !important;
}
.fx::before,
.fx::after,
.scan,
.vig,
.glow,
.home-clean__particles{
  display:none !important;
}
.snowfall{
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
}
.snowflake{
  position:absolute;
  top:-14vh;
  left:var(--x);
  width:var(--size);
  height:var(--size);
  border-radius:50%;
  opacity:var(--alpha);
  filter:blur(var(--blur));
  background:#fff;
  box-shadow:
    0 0 calc(var(--size) * 2.2) rgba(255,255,255,.72),
    0 0 calc(var(--size) * 5) rgba(255,122,24,.12);
  animation:snowflakeFall var(--dur) linear var(--delay) infinite;
  will-change:transform;
}
.top,
.wrap,
.foot,
.dock,
.modal,
.toast{
  position:relative;
}
.top,
.wrap,
.foot{
  z-index:1;
}
.dock{z-index:50}
.modal{z-index:70}
.toast{z-index:80}
@keyframes snowflakeFall{
  0%{transform:translate3d(0,-18vh,0)}
  45%{transform:translate3d(var(--drift-mid),48vh,0)}
  100%{transform:translate3d(var(--drift),122vh,0)}
}

.modal{
  position:fixed !important;
  inset:0 !important;
  z-index:90 !important;
  display:grid !important;
  place-items:center !important;
  padding:18px !important;
  overflow:auto !important;
}
.modal[hidden]{
  display:none !important;
}
.modal__card{
  margin:auto;
  max-height:calc(100vh - 36px);
  overflow:auto;
}
body:not(.noscroll){
  overflow-y:auto;
}

/* =======================================================
   Living Dock + page slide transition
   ======================================================= */
.dock{
  position:fixed !important;
  left:50%;
  right:auto;
  bottom:max(20px,env(safe-area-inset-bottom));
  transform:translate3d(calc(-50% + var(--dock-x,0px)), var(--dock-y,0px), 0) !important;
  will-change:transform;
  transition:filter .22s var(--ease);
}
.dock:hover{
  filter:drop-shadow(0 18px 36px rgba(255,122,24,.18));
}
.dock__bar{
  overflow:visible;
  box-shadow:
    0 24px 70px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,122,24,.18),
    inset 0 1px 0 rgba(255,255,255,.1);
}
.dock__bar::before{
  pointer-events:none;
}
body.page-leaving .wrap{
  animation:pageSlideOutLeft .28s cubic-bezier(.55,.05,.2,1) both;
}
body.page-entering .wrap{
  opacity:0;
  transform:translate3d(72px,0,0);
}
body.page-entering.page-entered .wrap{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:opacity .42s var(--ease),transform .42s var(--ease);
}
@keyframes pageSlideOutLeft{
  to{
    opacity:0;
    transform:translate3d(-88px,0,0);
  }
}
@media(max-width:640px){
  .dock{
    transform:translate3d(-50%,0,0) !important;
  }
}
@media(prefers-reduced-motion:reduce){
  body.page-leaving .wrap,
  body.page-entering .wrap,
  body.page-entering.page-entered .wrap{
    animation:none;
    opacity:1;
    transform:none;
    transition:none;
  }
}

/* =======================================================
   Rounded footer plaque
   ======================================================= */
.foot{
  position:relative;
  z-index:1;
  width:min(1180px,calc(100% - 28px));
  margin:clamp(34px,7vw,74px) auto 0;
  padding:0 0 max(26px,env(safe-area-inset-bottom));
  color:#fff5ea;
  text-align:left;
}
.foot-panel{
  position:relative;
  overflow:hidden;
  padding:clamp(20px,3.2vw,34px);
  border:1px solid rgba(255,122,24,.2);
  border-radius:32px;
  background:
    radial-gradient(105% 150% at 88% -24%,rgba(255,122,24,.18),transparent 50%),
    linear-gradient(180deg,rgba(22,19,17,.9),rgba(7,7,7,.96));
  box-shadow:
    0 26px 80px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.035),
    inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
}
.foot-panel::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:31px;
  pointer-events:none;
  background:
    linear-gradient(120deg,rgba(255,255,255,.14),transparent 32%,rgba(255,122,24,.08) 66%,transparent),
    linear-gradient(180deg,rgba(255,255,255,.06),transparent 38%);
  mask:linear-gradient(#000,transparent 74%);
}
.foot-panel::after{
  content:"";
  position:absolute;
  right:-120px;
  bottom:-170px;
  width:330px;
  height:330px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,rgba(255,122,24,.24),transparent 68%);
  filter:blur(6px);
}
.foot-panel__top,
.foot-panel__bottom{
  position:relative;
  z-index:1;
}
.foot-panel__top{
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(420px,.95fr);
  gap:clamp(18px,3vw,34px);
  align-items:start;
}
.foot-logo{
  display:inline-flex;
  align-items:center;
  font:950 clamp(24px,4vw,40px)/1 var(--mono);
  letter-spacing:.04em;
  color:#fff;
  text-transform:uppercase;
}
.foot-logo i{
  font-style:normal;
  color:#ff7a18;
  text-shadow:0 0 24px rgba(255,122,24,.42);
}
.foot-brand p{
  max-width:560px;
  margin:16px 0 0;
  color:#a89c91;
  font-size:14px;
  line-height:1.65;
}
.foot-contacts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.foot-contact{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  min-height:76px;
  padding:13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .22s var(--ease),border-color .22s var(--ease),background .22s var(--ease),box-shadow .22s var(--ease);
}
.foot-contact:hover{
  transform:translateY(-3px);
  border-color:rgba(255,122,24,.42);
  background:linear-gradient(180deg,rgba(255,122,24,.14),rgba(255,255,255,.04));
  box-shadow:0 16px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12);
}
.foot-contact__mark{
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:15px;
  color:#120905;
  background:linear-gradient(135deg,#ffd167,#ff7a18 62%,#ff4d00);
  font:950 13px/1 var(--mono);
  box-shadow:0 12px 24px rgba(255,122,24,.24),inset 0 1px 0 rgba(255,255,255,.45);
}
.foot-contact span:last-child{
  min-width:0;
}
.foot-contact b,
.foot-contact em{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.foot-contact b{
  color:#fff7ee;
  font-size:14px;
}
.foot-contact em{
  margin-top:3px;
  color:#a99c90;
  font-style:normal;
  font-size:12px;
}
.foot-panel__bottom{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:18px;
  align-items:center;
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
}
.foot-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
}
.foot-links a,
.foot-made,
.foot-year{
  color:#9f948a;
  font-size:13px;
  line-height:1.3;
}
.foot-links a{
  transition:color .18s var(--ease);
}
.foot-links a:hover{
  color:#ffb14a;
}
.foot-made{
  justify-self:center;
  color:#c6b8aa;
}
.foot-year{
  justify-self:end;
  font:800 13px/1 var(--mono);
}
.doc-page{
  width:min(900px,100%);
  margin:clamp(18px,4vw,42px) auto;
}
.doc-page__tag{
  display:inline-flex;
  margin-bottom:12px;
  padding:8px 12px;
  border:1px solid rgba(255,122,24,.22);
  border-radius:999px;
  color:#ffb14a;
  background:rgba(255,122,24,.08);
  font:800 12px/1 var(--mono);
  text-transform:uppercase;
}
.doc-page h1{
  font-size:clamp(30px,6vw,56px);
  color:#fff7ee;
  text-transform:uppercase;
}
.doc-card,
.contact-tile{
  border:1px solid rgba(255,122,24,.16);
  border-radius:28px;
  background:linear-gradient(180deg,rgba(24,21,18,.82),rgba(8,8,8,.92));
  box-shadow:0 22px 60px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);
}
.doc-card{
  display:grid;
  gap:14px;
  margin-top:20px;
  padding:clamp(18px,3vw,30px);
}
.doc-card p{
  margin:0;
  color:#c8bbae;
  line-height:1.7;
}
.contact-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:22px;
}
.contact-tile{
  padding:22px;
  transition:transform .22s var(--ease),border-color .22s var(--ease);
}
.contact-tile:hover{
  transform:translateY(-3px);
  border-color:rgba(255,122,24,.42);
}
.contact-tile b,
.contact-tile span{
  display:block;
}
.contact-tile b{
  color:#fff6ed;
  font-size:18px;
}
.contact-tile span{
  margin-top:6px;
  color:#a99c90;
}
@media(max-width:980px){
  .foot-panel__top{
    grid-template-columns:1fr;
  }
  .foot-contacts{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .foot{
    width:min(100% - 18px,1180px);
    margin-top:38px;
  }
  .foot-panel{
    border-radius:26px;
    padding:18px;
  }
  .foot-panel::before{
    border-radius:25px;
  }
  .foot-contacts,
  .contact-grid{
    grid-template-columns:1fr;
  }
  .foot-panel__bottom{
    grid-template-columns:1fr;
    gap:12px;
  }
  .foot-made,
  .foot-year{
    justify-self:start;
  }
}

/* =======================================================
   Checkout cleanup over footer/dock
   ======================================================= */
body.noscroll{
  overflow:hidden !important;
}
body.noscroll .dock,
body.noscroll .foot{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.modal{
  position:fixed !important;
  inset:0 !important;
  z-index:240 !important;
  display:grid !important;
  place-items:center !important;
  padding:clamp(12px,2.4vw,28px) !important;
  overflow:auto !important;
  background:
    radial-gradient(70% 72% at 50% 18%,rgba(255,122,24,.12),transparent 62%),
    rgba(0,0,0,.92) !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
}
.modal[hidden]{
  display:none !important;
}
.modal__card{
  width:min(720px,100%) !important;
  max-height:calc(100vh - 32px) !important;
  margin:auto !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid rgba(255,122,24,.34) !important;
  border-radius:30px !important;
  background:
    radial-gradient(90% 110% at 0% 0%,rgba(255,122,24,.12),transparent 52%),
    linear-gradient(180deg,rgba(24,20,17,.98),rgba(8,8,8,.98)) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.74),
    0 0 0 1px rgba(255,255,255,.04),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.modal__card::after{
  display:none !important;
}
.modal__x{
  top:18px !important;
  right:18px !important;
  z-index:4 !important;
  width:38px !important;
  height:38px !important;
  border-radius:50% !important;
  border-color:rgba(255,122,24,.32) !important;
  background:rgba(0,0,0,.34) !important;
}
.checkout{
  display:grid !important;
  grid-template-columns:minmax(0,.9fr) minmax(310px,1.1fr) !important;
  gap:18px 24px !important;
  max-height:calc(100vh - 32px) !important;
  padding:24px !important;
  overflow:auto !important;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,122,24,.72) rgba(255,255,255,.06);
}
.checkout__head{
  grid-column:1 / -1 !important;
  min-width:0;
  margin:0 !important;
  padding:0 54px 18px 0 !important;
  border-bottom:1px solid rgba(255,122,24,.16);
}
.checkout__head h2{
  font-size:clamp(22px,3.2vw,30px) !important;
  line-height:1.05 !important;
}
.checkout__sub{
  color:#b4aa9f !important;
}
.checkout__badge{
  width:50px !important;
  height:50px !important;
  border-radius:17px !important;
  background:linear-gradient(135deg,#ffd167,#ff8a1f 58%,#ff5b00) !important;
}
.cardface{
  grid-column:1 !important;
  grid-row:2 / span 4 !important;
  align-self:start !important;
  height:auto !important;
  min-height:210px !important;
  margin:0 !important;
  padding:18px !important;
  border-radius:24px !important;
  border-color:rgba(255,122,24,.28) !important;
  background:
    linear-gradient(135deg,rgba(255,122,24,.18),transparent 34%),
    linear-gradient(145deg,#141414,#0b0b0b 68%,#1f1309) !important;
}
.cardface__num{
  margin-top:34px !important;
  font-size:19px !important;
  letter-spacing:.08em !important;
}
.cardface__row{
  gap:10px !important;
}
.paymethods,
.fields,
.balrow,
.policybox,
.checkout__total,
.checkout .btn-fill.big,
.checkout__safe{
  grid-column:2 !important;
}
.paymethods{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  margin:0 !important;
}
.paymethod{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  min-height:42px !important;
  border:1px solid rgba(255,122,24,.2) !important;
  border-radius:999px !important;
  color:#c8beb3 !important;
  background:rgba(255,255,255,.035) !important;
  font-weight:850 !important;
}
.paymethod.is-active{
  color:#160b03 !important;
  background:linear-gradient(135deg,#ffd167,#ff8a1f 58%,#ff5b00) !important;
  box-shadow:0 14px 30px rgba(255,122,24,.18) !important;
}
.paymethod .ic{
  width:16px !important;
  height:16px !important;
}
.fields{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}
.fields label{
  gap:7px !important;
  color:#a9a2a0 !important;
  font-size:13px !important;
}
.fields input{
  min-height:44px !important;
  border-radius:999px !important;
  border-color:rgba(255,122,24,.24) !important;
  background:#070a0c !important;
}
.balrow{
  min-height:42px !important;
  margin:0 !important;
  padding:7px 8px 7px 14px !important;
  border:1px solid rgba(255,122,24,.18) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.035) !important;
  font-size:13px !important;
}
.policybox{
  margin:0 !important;
  padding:14px !important;
  border-radius:22px !important;
  border-color:rgba(255,122,24,.2) !important;
  background:rgba(0,0,0,.24) !important;
}
.policybox h3{
  margin:0 0 8px !important;
  font-size:13px !important;
}
.policybox__text{
  max-height:108px !important;
  overflow:auto !important;
  padding-right:8px !important;
  color:#b6aea6 !important;
  font-size:12px !important;
  line-height:1.45 !important;
}
.policyagree{
  margin-top:10px !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  gap:9px !important;
  color:#d8cec4 !important;
}
.policyagree input{
  width:18px !important;
  height:18px !important;
  margin:1px 0 0 !important;
  flex:0 0 18px !important;
}
.checkout__total{
  margin:0 !important;
  padding:14px 0 0 !important;
  border-top:1px solid rgba(255,122,24,.16);
}
.checkout__total b{
  color:#ff9a25 !important;
}
.checkout .btn-fill.big{
  min-height:48px !important;
  border-radius:999px !important;
}
.checkout__safe{
  margin:0 !important;
  color:#918980 !important;
}
@media(max-width:780px){
  .modal{
    align-items:start !important;
  }
  .modal__card{
    width:min(520px,100%) !important;
    border-radius:24px !important;
  }
  .checkout{
    grid-template-columns:1fr !important;
    gap:14px !important;
    padding:18px !important;
  }
  .cardface,
  .paymethods,
  .fields,
  .balrow,
  .policybox,
  .checkout__total,
  .checkout .btn-fill.big,
  .checkout__safe{
    grid-column:1 !important;
  }
  .cardface{
    grid-row:auto !important;
    min-height:150px !important;
  }
  .policybox__text{
    max-height:94px !important;
  }
}

/* =======================================================
   Admin editable extra catalog
   ======================================================= */
.extra-editor{
  display:grid;
  gap:16px;
}
.extra-editor h4{
  margin:12px 0 0;
  color:#ffad45;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.extra-list{
  display:grid;
  gap:10px;
}
.extra-row{
  margin:0;
  padding:14px;
  border:1px solid rgba(255,122,24,.16);
  border-radius:18px;
  background:rgba(0,0,0,.18);
}
.extra-row--blank{
  border-style:dashed;
  opacity:.72;
}
.extra-row__grid{
  display:grid;
  grid-template-columns:1.05fr 1.25fr 1fr .62fr .62fr .78fr 54px .78fr;
  gap:10px;
  align-items:end;
}
.extra-row label{
  min-width:0;
  color:#a99f96;
  font-size:12px;
}
.extra-row input,
.extra-row textarea{
  width:100%;
  min-width:0;
  border-radius:12px;
  border-color:rgba(255,122,24,.2);
  background:#07090a;
}
.extra-row input[type="color"]{
  height:42px;
  padding:3px;
}
.extra-row textarea{
  min-height:62px;
  resize:vertical;
}
.extra-row .wide{
  grid-column:span 4;
}
.extra-row__delete{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:8px !important;
  margin-top:10px;
  color:#ff8b8b !important;
}
.extra-row__delete input{
  width:auto;
}
.extra-editor__actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
}
.extra-editor__reset{
  margin-top:10px;
}
@media(max-width:1180px){
  .extra-row__grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .extra-row .wide{
    grid-column:1 / -1;
  }
}
@media(max-width:680px){
  .extra-row__grid{
    grid-template-columns:1fr;
  }
  .extra-editor__actions{
    justify-content:stretch;
  }
  .extra-editor__actions .btn-fill{
    width:100%;
  }
}

/* =======================================================
   Tokens catalog + six-item dock
   ======================================================= */
.cards--tokens{
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.dock{
  width:min(620px,calc(100% - 24px)) !important;
}
.dock__bar{
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
}
.dock__lens{
  width:min(84px,calc((100% - 26px) / 6)) !important;
}
@media(max-width:980px){
  .cards--tokens{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:620px){
  .cards--tokens{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .dtab{
    min-height:52px !important;
    padding-inline:2px !important;
  }
  .dtab .ic{
    width:20px !important;
    height:20px !important;
  }
  .dtab span{
    font-size:9px !important;
  }
}
@media(max-width:420px){
  .cards--tokens{
    grid-template-columns:1fr;
  }
}

/* =======================================================
   Visual refresh v2
   ======================================================= */
:root,:root[data-theme="dark"]{
  --bg:#070707;
  --panel:#11110f;
  --panel2:#17130f;
  --ink:#fff7ec;
  --muted:#a9aaa4;
  --accent:#ff8a1f;
  --accent2:#3ee68f;
  --line:rgba(255,138,31,.2);
  --line2:rgba(255,255,255,.08);
  --panel-grad:
    linear-gradient(180deg,rgba(22,22,20,.92),rgba(10,10,10,.96));
  --field-bg:rgba(255,255,255,.045);
  --shadow:0 22px 70px rgba(0,0,0,.48);
  --r:12px;
}
body{
  background:
    linear-gradient(180deg,#090909 0%,#050505 48%,#080706 100%) !important;
}
.fx{
  background:
    linear-gradient(180deg,#090909,#050505 52%,#080706) !important;
}
.snowflake{
  opacity:calc(var(--alpha) * .55);
  box-shadow:
    0 0 calc(var(--size) * 2) rgba(255,255,255,.38),
    0 0 calc(var(--size) * 5) rgba(62,230,143,.1);
}
.top{
  border-color:rgba(255,138,31,.18) !important;
  background:rgba(8,8,8,.78) !important;
  box-shadow:0 12px 36px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.brand__cube{
  color:#120700;
  background:linear-gradient(135deg,#ffd36f,#ff8a1f 58%,#3ee68f) !important;
}
.brand__name{
  color:#fff7ec;
}
.brand__name i{
  color:#ff9a2e;
}
.panel,
.ticketform,
.tickets,
.ticket,
.authbox,
.paystub,
.doc-card,
.contact-tile{
  border-color:rgba(255,138,31,.18) !important;
  border-radius:22px !important;
  background:
    linear-gradient(180deg,rgba(26,25,23,.88),rgba(8,8,8,.96)) !important;
  box-shadow:
    0 24px 74px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.panel:hover,
.ccard:hover,
.tier:hover{
  border-color:rgba(255,138,31,.42) !important;
  box-shadow:
    0 30px 84px rgba(0,0,0,.58),
    0 0 0 1px rgba(62,230,143,.08),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.btn-fill{
  color:#160900 !important;
  border-radius:999px !important;
  background:linear-gradient(135deg,#ffd36f,#ff8a1f 58%,#3ee68f) !important;
  box-shadow:0 14px 30px rgba(255,138,31,.22),inset 0 1px 0 rgba(255,255,255,.48) !important;
}
.btn-ghost,
.chip,
.cur__btn{
  border-color:rgba(255,138,31,.18) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.055) !important;
}
.btn-ghost:hover,
.chip:hover,
.cur__btn:hover{
  border-color:rgba(62,230,143,.45) !important;
  background:rgba(62,230,143,.1) !important;
}
.phead h1,
.doc-page h1,
.authbox h1{
  letter-spacing:0 !important;
  color:#fff8ee !important;
}
.phead p{
  color:#b8b3aa !important;
}
.tier,
.ccard{
  border-radius:24px !important;
}
.tier__badge,
.ccard__emoji{
  border-radius:18px !important;
}
.ccard__emoji{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 auto;
  color:#141006;
  background:linear-gradient(135deg,color-mix(in srgb,var(--c,#ff8a1f) 85%,#fff 15%),#fff0 160%);
  box-shadow:0 16px 30px color-mix(in srgb,var(--c,#ff8a1f) 24%,transparent);
}
.ccard__emoji .ic{
  width:28px;
  height:28px;
}
.ccard__name{
  font-size:15px !important;
}
.ccard__desc{
  min-height:38px;
  color:#b8b3aa !important;
}
.pcard__stats--single{
  grid-template-columns:1fr !important;
}
.pcard__stats--single > div{
  min-height:74px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,138,31,.16),rgba(62,230,143,.08));
}
.thread{
  gap:12px !important;
  background:
    linear-gradient(180deg,rgba(255,138,31,.035),rgba(62,230,143,.025)),
    #080808 !important;
}
.msg{
  animation:msgInLive .22s var(--ease) both;
}
@keyframes msgInLive{
  from{opacity:0;transform:translateY(8px) scale(.98)}
  to{opacity:1;transform:none}
}
.msg__body{
  border-radius:22px 22px 22px 7px !important;
  background:#20201d !important;
}
.msg--staff .msg__body{
  color:#160900 !important;
  background:linear-gradient(135deg,#ffd36f,#ff8a1f) !important;
}
.composer{
  border-top-color:rgba(255,138,31,.16) !important;
}
.composer.is-sending{
  opacity:.72;
}
.composer.is-closed{
  display:none !important;
}
.composer__in{
  border-radius:999px !important;
  border-color:rgba(255,138,31,.18) !important;
  background:#181817 !important;
}
.dock__bar{
  border-color:rgba(255,138,31,.22) !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.045)),
    rgba(12,12,12,.78) !important;
}
.dock__lens{
  filter:drop-shadow(0 10px 26px rgba(255,138,31,.18));
}
.dtab.is-active,
.dtab.mag{
  color:#ffb45d !important;
}
input,
select,
textarea{
  border-color:rgba(255,138,31,.18) !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.055) !important;
}
input:focus,
select:focus,
textarea:focus{
  border-color:rgba(62,230,143,.58) !important;
  box-shadow:0 0 0 3px rgba(62,230,143,.14) !important;
}
@media(max-width:620px){
  .top{
    gap:9px;
  }
  .acct{
    width:100%;
    justify-content:flex-end;
  }
  .ccard__desc{
    min-height:auto;
  }
}

/* =======================================================
   HolyTime-like shop skin
   ======================================================= */
:root,:root[data-theme="dark"]{
  --ht-bg:#070707;
  --ht-card:#171717;
  --ht-card2:#202020;
  --ht-orange:#ff7500;
  --ht-orange2:#ff9d23;
  --ht-blue:#126bff;
  --ht-purple:#8759ff;
  --ht-green:#35df79;
  --ht-text:#f6f6f3;
  --ht-muted:#b8b8b2;
}
body{
  color:var(--ht-text) !important;
  background:
    radial-gradient(900px 420px at 50% -160px,rgba(255,255,255,.055),transparent 58%),
    linear-gradient(180deg,#090909,#050505 58%,#090807) !important;
}
.snowfall{
  opacity:.18;
}
.wrap{
  max-width:1068px !important;
  padding-top:24px !important;
}
.top{
  position:sticky !important;
  top:0 !important;
  max-width:1068px;
  margin:0 auto;
  padding:18px 0 10px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.brand__cube{
  display:none !important;
}
.brand__name{
  font-size:23px !important;
  font-weight:950 !important;
  letter-spacing:-.03em !important;
  color:#f7f7f4 !important;
}
.brand__name i{
  color:#f7f7f4 !important;
}
.chip{
  order:0 !important;
  margin-left:0 !important;
  min-height:30px !important;
  padding:7px 10px !important;
  color:#cecec8 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:8px !important;
  background:#333 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.chip .ic{
  color:#d8d8d2 !important;
}
.topnav{
  display:flex;
  align-items:center;
  gap:14px;
  margin-left:auto;
}
.topnav a{
  display:inline-flex;
  align-items:center;
  min-height:48px;
  padding:0 19px;
  border-radius:12px;
  color:#f2f2ef;
  font-weight:850;
  font-size:14px;
  background:transparent;
  transition:background .18s var(--ease),transform .18s var(--ease),color .18s var(--ease);
}
.topnav a:hover,
.topnav a.is-active{
  background:#303030;
  transform:translateY(-1px);
}
.tools{
  display:none !important;
}
.acct{
  margin-left:0;
}
.acct .btn-ghost,
.acct .btn-fill{
  min-height:36px !important;
  padding:0 13px !important;
}
.store-hero{
  display:grid;
  grid-template-columns:minmax(0,3.2fr) minmax(220px,1fr);
  gap:12px;
  margin:18px 0 50px;
}
.store-hero--compact{
  margin-bottom:34px;
}
.store-hero__main,
.store-hero__side{
  position:relative;
  min-height:254px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:30px;
  isolation:isolate;
  box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.2);
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:188px;
}
.store-hero__main{
  background:
    radial-gradient(520px 280px at 72% 26%,rgba(255,255,255,.32),transparent 56%),
    linear-gradient(120deg,#0f5ff7,#4f9cff);
}
.store-hero__side{
  background:
    radial-gradient(260px 200px at 74% 20%,rgba(255,255,255,.28),transparent 58%),
    linear-gradient(130deg,#6b3dff,#9c67ff);
}
.store-hero__main::before,
.store-hero__side::before{
  content:"";
  position:absolute;
  inset:-80px -40px;
  background:
    radial-gradient(circle at 72% 32%,transparent 0 74px,rgba(255,255,255,.18) 75px 76px,transparent 77px 132px,rgba(255,255,255,.12) 133px 134px,transparent 135px),
    linear-gradient(120deg,transparent 35%,rgba(255,255,255,.14),transparent 49%);
  opacity:.72;
  pointer-events:none;
}
.store-hero__side::before{
  opacity:.42;
  transform:rotate(-8deg);
}
.store-hero__copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:min(360px,52%);
  padding:26px;
}
.store-hero__copy b,
.store-hero__side b{
  color:#fff;
  font-weight:950;
  font-size:clamp(23px,3.2vw,30px);
  line-height:.94;
  letter-spacing:-.04em;
}
.store-hero__copy em{
  margin-top:12px;
  color:rgba(255,255,255,.9);
  font-style:normal;
  font-weight:650;
  line-height:1.05;
}
.store-hero__copy i,
.store-hero__side i{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  margin-top:18px;
  border-radius:11px;
  color:#fff;
  font-style:normal;
  font-size:25px;
  line-height:1;
  background:rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}
.store-hero__side{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:26px;
}
.store-hero__side b{
  position:relative;
  z-index:2;
  max-width:190px;
}
.store-hero__side i{
  position:relative;
  z-index:2;
}
.store-hero__scene{
  position:absolute;
  right:20px;
  bottom:-18px;
  width:min(520px,58%);
  height:260px;
  z-index:1;
}
.store-hero--compact .store-hero__scene{
  height:210px;
}
.cube,
.store-hero__crate{
  position:absolute;
  display:block;
  border-radius:12px;
  transform:rotateX(54deg) rotateZ(-38deg);
  box-shadow:
    18px 24px 0 rgba(0,0,0,.18),
    inset 10px 10px 0 rgba(255,255,255,.22),
    inset -10px -12px 0 rgba(0,0,0,.14);
}
.cube::before,
.cube::after,
.store-hero__crate::before,
.store-hero__crate::after{
  content:"";
  position:absolute;
  inset:18%;
  border-radius:7px;
  border:8px solid rgba(0,0,0,.22);
  background:rgba(255,255,255,.12);
}
.cube::after,
.store-hero__crate::after{
  inset:auto 22% 20% 22%;
  height:18px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.28);
}
.cube--blue{
  left:18px;
  bottom:34px;
  width:154px;
  height:122px;
  background:linear-gradient(135deg,#81d5ff,#1d8ccf 65%,#0a507f);
}
.cube--gold{
  right:22px;
  bottom:58px;
  width:208px;
  height:144px;
  background:linear-gradient(135deg,#ffe866,#d99b13 58%,#754c06);
}
.cube--green{
  left:74px;
  bottom:42px;
  width:176px;
  height:128px;
  background:linear-gradient(135deg,#6cff9f,#25a95c 62%,#116137);
}
.cube--tiny{
  right:236px;
  top:30px;
  width:58px;
  height:48px;
  border-radius:8px;
  background:linear-gradient(135deg,#ffffff,#98c7ff);
}
.store-hero__crate{
  right:-24px;
  bottom:-18px;
  width:166px;
  height:128px;
  z-index:1;
  background:linear-gradient(135deg,#eff8ff,#9fb8d7 58%,#667e9c);
}
.shop-tabs{
  display:flex;
  align-items:center;
  gap:34px;
  margin:-12px 0 16px;
}
.shop-tab{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:190px;
  min-height:58px;
  padding:0 22px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;
  color:#eeeeea;
  font-weight:900;
  background:#1a1a1a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.shop-tab .ic{
  width:17px;
  height:17px;
}
.shop-tab.is-active{
  color:#fff;
  border-color:rgba(255,117,0,.48);
  background:
    linear-gradient(120deg,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(135deg,var(--ht-orange),var(--ht-orange2));
  box-shadow:0 18px 34px rgba(255,117,0,.25),inset 0 1px 0 rgba(255,255,255,.26);
}
.shop-tab.is-active::after{
  content:"";
  position:absolute;
  right:15px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:rgba(255,255,255,.2);
}
.home-clean--store{
  min-height:260px !important;
  margin-top:12px;
  border-radius:32px !important;
  background:
    radial-gradient(360px 180px at 76% 22%,rgba(255,117,0,.18),transparent 64%),
    linear-gradient(180deg,#191919,#0b0b0b) !important;
}
.phead{
  margin-top:10px !important;
}
.phead h1{
  font-size:clamp(28px,4.4vw,42px) !important;
}
.tiers,
.tiers--full{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
}
.cards{
  gap:18px !important;
}
.tier,
.ccard,
.exchange-board{
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:28px !important;
  background:
    linear-gradient(180deg,#1b1b1b,#0d0d0d) !important;
}
.tier{
  min-height:295px;
  padding:22px !important;
}
.tier::before{
  width:auto !important;
  height:7px;
  right:22px;
  top:auto !important;
  bottom:0;
  border-radius:999px 999px 0 0;
  background:linear-gradient(90deg,var(--c),transparent) !important;
}
.tier__badge{
  width:62px !important;
  height:62px !important;
  border-radius:18px !important;
  background:#262626 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 28px rgba(0,0,0,.28) !important;
}
.tier__name{
  color:#fff !important;
}
.daydock{
  border:0 !important;
  border-radius:16px !important;
  background:#101010 !important;
}
.daydock__pill{
  border:0 !important;
  border-radius:13px !important;
  background:linear-gradient(135deg,var(--ht-orange),var(--ht-orange2)) !important;
}
.tier__price b,
.ccard__price{
  color:#fff !important;
}
.btn-fill{
  min-height:44px !important;
  color:#fff !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.18),transparent 42%),
    linear-gradient(135deg,var(--ht-orange),var(--ht-orange2)) !important;
}
.ccard{
  min-height:238px;
  padding:22px !important;
}
.ccard::before{
  background:
    radial-gradient(170px 100px at 50% 0%,color-mix(in srgb,var(--c,#ff7500) 22%,transparent),transparent 70%) !important;
}
.ccard__emoji{
  background:#292929 !important;
  color:var(--c,#ff7500) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 16px 28px rgba(0,0,0,.26) !important;
}
.dock{
  opacity:.96;
}
@media(min-width:900px){
  .dock{
    display:none !important;
  }
}
@media(max-width:1080px){
  .top,
  .wrap{
    width:calc(100% - 28px);
  }
  .topnav{
    order:5;
    width:100%;
    overflow:auto;
    padding-bottom:2px;
  }
  .topnav a{
    flex:none;
  }
}
@media(max-width:820px){
  .store-hero{
    grid-template-columns:1fr;
  }
  .store-hero__main,
  .store-hero__side{
    min-height:210px;
  }
  .store-hero__side{
    min-height:156px;
  }
  .shop-tabs{
    gap:10px;
    overflow:auto;
    padding-bottom:4px;
  }
  .shop-tab{
    min-width:154px;
  }
  .tiers,
  .tiers--full{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media(max-width:560px){
  .store-hero__copy{
    width:68%;
    padding:22px;
  }
  .store-hero__scene{
    width:62%;
    right:-10px;
  }
  .cube--gold{
    width:150px;
    height:108px;
  }
  .cube--blue,
  .cube--green{
    width:118px;
    height:92px;
  }
  .tiers,
  .tiers--full{
    grid-template-columns:1fr !important;
  }
}

/* =======================================================
   Simple gray performance skin
   ======================================================= */
:root,:root[data-theme="dark"]{
  --bg:#0b0b0b;
  --panel:#181818;
  --panel2:#202020;
  --line:rgba(255,255,255,.1);
  --line2:rgba(255,255,255,.08);
  --accent:#d8d8d8;
  --accent2:#f28c28;
  --ink:#f2f2f2;
  --muted:#aaa;
  --shadow:none;
  --r:14px;
}
*{text-shadow:none !important}
body{color:#f2f2f2 !important;background:#0b0b0b !important}
.fx,.fx::before,.fx::after,.scan,.vig,.glow,.snowfall,.snowflake,.home-clean__particles,.panel::after,.store-hero__main::before,.store-hero__side::before,.btn-fill::after,.dock__lens,.lens__glass,.lens__ring{
  display:none !important;
  animation:none !important;
}
.reveal{opacity:1 !important;transform:none !important;transition:none !important}
.top{
  width:min(100% - 32px,1068px) !important;
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:18px !important;
  min-height:62px !important;
  margin:0 auto 16px !important;
  padding:10px 0 !important;
  background:#0b0b0b !important;
  border:0 !important;
  box-shadow:none !important;
}
.head-left{display:flex;align-items:center;gap:10px;min-width:0}
.brand__cube{display:none !important}
.brand__name{color:#f2f2f2 !important;font-size:20px !important;letter-spacing:-.02em !important;white-space:nowrap}
.brand__name i{color:#f2f2f2 !important}
.chip{
  max-width:170px !important;
  min-height:30px !important;
  margin:0 !important;
  padding:6px 10px !important;
  overflow:hidden !important;
  color:#d0d0d0 !important;
  border:1px solid #343434 !important;
  border-radius:7px !important;
  background:#242424 !important;
  box-shadow:none !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.topnav{justify-content:end !important;gap:8px !important;min-width:0;margin:0 !important}
.topnav a{
  min-height:38px !important;
  padding:0 13px !important;
  border-radius:9px !important;
  color:#e7e7e7 !important;
  font-size:13px !important;
  background:transparent !important;
}
.topnav a:hover,.topnav a.is-active{color:#fff !important;background:#252525 !important;transform:none !important}
.acct{justify-content:flex-end !important;gap:7px !important;min-width:0}
.acct__stat{
  max-width:92px;
  overflow:hidden;
  padding:7px 9px;
  border:1px solid #303030;
  border-radius:8px;
  color:#d8d8d8 !important;
  background:#181818;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.acct__stat[title="Токены"]{display:none !important}
.acct__ava img{width:34px !important;height:34px !important;border-radius:8px !important}
.tools{display:none !important}
.wrap{width:min(100% - 32px,1068px) !important;max-width:none !important;padding:0 0 32px !important}
.store-hero{grid-template-columns:minmax(0,3fr) minmax(190px,.95fr) !important;gap:12px !important;margin:0 0 20px !important}
.store-hero__main,.store-hero__side{
  min-height:170px !important;
  border:1px solid #2f2f2f !important;
  border-radius:22px !important;
  background:#1d1d1d !important;
  box-shadow:none !important;
}
.store-hero__main{background:linear-gradient(135deg,#2b2b2b,#202020) !important}
.store-hero__side{background:linear-gradient(135deg,#282828,#1f1f1f) !important}
.store-hero__copy{width:min(420px,64%) !important;padding:24px !important}
.store-hero__copy b,.store-hero__side b{color:#f5f5f5 !important;font-size:clamp(24px,3vw,34px) !important;line-height:1 !important}
.store-hero__copy em{color:#bebebe !important}
.store-hero__copy i,.store-hero__side i{width:32px !important;height:32px !important;color:#eee !important;background:#333 !important}
.store-hero__scene,.store-hero__crate{opacity:.28 !important;filter:grayscale(1) !important}
.cube,.store-hero__crate{box-shadow:none !important}
.shop-tabs{gap:12px !important;margin:0 0 16px !important}
.shop-tab{
  min-width:150px !important;
  min-height:50px !important;
  border:1px solid #333 !important;
  border-radius:12px !important;
  color:#dcdcdc !important;
  background:#191919 !important;
  box-shadow:none !important;
}
.shop-tab.is-active{color:#111 !important;border-color:#d6d6d6 !important;background:#d6d6d6 !important;box-shadow:none !important}
.shop-tab.is-active::after{display:none !important}
.phead,.phead--banner{
  padding:22px !important;
  border:1px solid #2f2f2f !important;
  border-radius:20px !important;
  background:#171717 !important;
  box-shadow:none !important;
}
.phead::before,.phead::after,.phead--banner::before,.phead--banner::after{display:none !important}
.phead h1{color:#f2f2f2 !important;font-size:34px !important}
.phead p{color:#aaa !important}
.panel,.tier,.ccard,.exchange-board,.doc-card,.contact-tile,.ticketform,.tickets,.ticket,.authbox,.paystub,.foot-panel{
  border:1px solid #2f2f2f !important;
  border-radius:20px !important;
  background:#171717 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.panel:hover,.tier:hover,.ccard:hover{transform:none !important;border-color:#444 !important;box-shadow:none !important}
.tiers,.tiers--full{gap:16px !important}
.tier{min-height:0 !important;padding:20px !important}
.tier::before,.tier::after,.ccard::before{display:none !important}
.tier__badge,.ccard__emoji{color:#d7d7d7 !important;background:#2b2b2b !important;box-shadow:none !important}
.daydock{background:#111 !important}
.daydock__pill{background:#444 !important;box-shadow:none !important}
.btn-fill{color:#111 !important;border-radius:12px !important;background:#d8d8d8 !important;box-shadow:none !important}
.btn-fill:hover{filter:none !important;transform:none !important;background:#eee !important}
.btn-ghost,input,select,textarea,.composer__in{border-color:#333 !important;background:#111 !important;box-shadow:none !important}
.toast{
  top:76px !important;
  left:auto !important;
  right:18px !important;
  transform:none !important;
  border:1px solid #3a3a3a !important;
  border-radius:12px !important;
  background:#1b1b1b !important;
  box-shadow:none !important;
}
.foot{width:min(100% - 32px,1068px) !important}
.foot-panel{background:#171717 !important}
.foot-panel::before,.foot-panel::after{display:none !important}
.join-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.join-card,.join-ip{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:120px;
  padding:18px;
  border:1px solid #303030;
  border-radius:16px;
  color:#eee;
  background:#171717;
}
.join-card b{font-size:18px}
.join-card span{color:#aaa}
.join-ip{align-items:flex-start;justify-content:center;border-color:#555;font:900 22px/1 var(--mono);cursor:pointer}
.join-ip .ic{width:22px;height:22px}
@media(min-width:900px){.dock{display:none !important}}
@media(max-width:980px){
  .top{grid-template-columns:1fr !important;gap:10px !important}
  .head-left,.topnav,.acct{width:100%}
  .topnav{justify-content:flex-start !important;overflow:auto}
  .acct{justify-content:flex-start !important}
  .store-hero{grid-template-columns:1fr !important}
}
@media(max-width:640px){
  .wrap,.top,.foot{width:min(100% - 18px,1068px) !important}
  .store-hero__copy{width:76% !important}
  .store-hero__side{min-height:130px !important}
  .shop-tabs{overflow:auto}
  .join-grid{grid-template-columns:1fr}
}

/* Balanced dark skin: simple base, colored banners */
.store-hero__main{
  border-color:rgba(47,126,255,.32) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.12),transparent 44%),
    linear-gradient(135deg,#1764e8,#58a0ff) !important;
}
.store-hero__side{
  border-color:rgba(143,93,255,.34) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.12),transparent 42%),
    linear-gradient(135deg,#6d3df2,#9a65ff) !important;
}
.store-hero__scene,
.store-hero__crate{
  opacity:.78 !important;
  filter:none !important;
}
.cube--blue{
  background:linear-gradient(135deg,#85d5ff,#2b92d0 64%,#155d88) !important;
}
.cube--gold{
  background:linear-gradient(135deg,#ffe36a,#dca11a 58%,#855607) !important;
}
.cube--green{
  background:linear-gradient(135deg,#70ef9e,#28a963 62%,#16623c) !important;
}
.store-hero__crate{
  background:linear-gradient(135deg,#f0f5f8,#aebdca 58%,#71808e) !important;
}
.store-hero__copy em{
  color:rgba(255,255,255,.9) !important;
}
.store-hero__copy i,
.store-hero__side i{
  color:#fff !important;
  background:rgba(255,255,255,.18) !important;
}
.shop-tab.is-active{
  color:#fff !important;
  border-color:#f28c28 !important;
  background:#f28c28 !important;
}
.btn-fill{
  color:#111 !important;
  background:#f0f0f0 !important;
}
.ccard .btn-fill,
.tier .btn-fill,
.checkout .btn-fill,
.authbox .btn-fill{
  color:#fff !important;
  background:#f28c28 !important;
}
.phead--banner{
  border-color:rgba(242,140,40,.34) !important;
  background:
    repeating-linear-gradient(135deg,rgba(242,140,40,.08) 0 1px,transparent 1px 13px),
    #171717 !important;
}
.topnav a.is-active{
  color:#111 !important;
  background:#d8d8d8 !important;
}

/* Final header/banner fixes */
.top{
  position:static !important;
  top:auto !important;
  z-index:10 !important;
  margin-top:0 !important;
  margin-bottom:24px !important;
  transform:none !important;
}
.wrap{
  position:relative !important;
  z-index:1 !important;
  padding-top:0 !important;
}
.topnav{
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scrollbar-width:none;
}
.topnav::-webkit-scrollbar{
  display:none;
}
.topnav a{
  flex:0 0 auto !important;
}
.store-hero{
  clear:both !important;
  isolation:isolate !important;
  margin-top:0 !important;
}
.store-hero__main,
.store-hero__side{
  overflow:hidden !important;
  transform:none !important;
  will-change:auto !important;
  transition:background .24s ease,border-color .24s ease,opacity .16s ease !important;
}
.store-hero__main.is-switching,
.store-hero__side.is-switching{
  opacity:.84 !important;
}
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  border-color:rgba(65,132,219,.46) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.13),transparent 44%),
    linear-gradient(135deg,#1f5fb8,#4c91d8) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  border-color:rgba(226,132,41,.48) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.14),transparent 44%),
    linear-gradient(135deg,#a9551a,#de8b32) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  border-color:rgba(67,164,105,.48) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.13),transparent 44%),
    linear-gradient(135deg,#1d7442,#48aa6f) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  border-color:rgba(133,111,207,.48) !important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.13),transparent 44%),
    linear-gradient(135deg,#5b4aa8,#8674d4) !important;
}
@media(max-width:640px){
  .top{
    margin-bottom:18px !important;
  }
  .store-hero__main,
  .store-hero__side{
    border-radius:18px !important;
  }
}

/* Final polish: compact header, restored misc tab, richer banners */
.top{
  width:min(100% - 28px,1160px) !important;
  grid-template-columns:minmax(0,220px) minmax(0,1fr) auto !important;
  gap:12px !important;
  min-height:58px !important;
  padding:8px 10px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:14px !important;
  background:rgba(17,17,17,.96) !important;
}
.head-left{
  width:100% !important;
  max-width:220px !important;
  gap:8px !important;
  overflow:hidden !important;
}
.brand{
  min-width:0 !important;
  flex:0 1 auto !important;
}
.brand__name{
  max-width:112px !important;
  overflow:hidden !important;
  font-size:18px !important;
  text-overflow:ellipsis !important;
}
.chip{
  flex:0 1 92px !important;
  max-width:92px !important;
  min-width:0 !important;
  min-height:32px !important;
  padding:0 9px !important;
  justify-content:center !important;
  font-size:12px !important;
  border-color:rgba(255,255,255,.12) !important;
  background:#242424 !important;
}
.chip .ic{
  flex:0 0 auto !important;
  width:14px !important;
  height:14px !important;
  color:#f2a13b !important;
}
.topnav{
  display:flex !important;
  min-width:0 !important;
  justify-content:flex-start !important;
  gap:6px !important;
  padding:2px !important;
}
.topnav a{
  min-height:34px !important;
  padding:0 10px !important;
  border-radius:8px !important;
  font-size:12px !important;
  color:#dedede !important;
}
.topnav a:hover{
  color:#fff !important;
  background:#282828 !important;
}
.topnav a.is-active{
  color:#151515 !important;
  background:#e8e8e8 !important;
}
.acct{
  flex-wrap:nowrap !important;
}
.btn-ghost,
.btn-fill.sm{
  min-height:34px !important;
  padding:0 11px !important;
  border-radius:8px !important;
  white-space:nowrap !important;
}
.shop-tabs{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}
.shop-tab{
  min-width:0 !important;
  min-height:48px !important;
  justify-content:center !important;
  border-radius:12px !important;
}
.store-hero{
  gap:14px !important;
}
.store-hero__main,
.store-hero__side{
  position:relative !important;
  border-radius:20px !important;
  border-color:rgba(255,255,255,.15) !important;
  background-color:#202020 !important;
}
.store-hero__main::before,
.store-hero__side::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  pointer-events:none !important;
  opacity:.42 !important;
  background:
    radial-gradient(circle at 72% 20%,rgba(255,255,255,.22),transparent 0 20%,transparent 42%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.13) 0 1px,transparent 1px 15px) !important;
  animation:none !important;
}
.store-hero__main::after,
.store-hero__side::after{
  content:"" !important;
  position:absolute !important;
  right:-54px !important;
  bottom:-70px !important;
  display:block !important;
  width:220px !important;
  height:220px !important;
  border-radius:999px !important;
  pointer-events:none !important;
  opacity:.22 !important;
  background:rgba(255,255,255,.7) !important;
}
.store-hero__copy,
.store-hero__side b,
.store-hero__side i,
.store-hero__scene,
.store-hero__crate{
  position:relative !important;
  z-index:2 !important;
}
.store-hero__copy{
  width:min(470px,66%) !important;
}
.store-hero__copy b,
.store-hero__side b{
  letter-spacing:0 !important;
}
.store-hero__copy em{
  max-width:360px !important;
}
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  border-color:rgba(106,159,219,.42) !important;
  background:
    linear-gradient(125deg,rgba(9,31,58,.2),rgba(255,255,255,.08) 42%,transparent 43%),
    linear-gradient(135deg,#244c81 0%,#3b77b8 56%,#6da3d9 100%) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  border-color:rgba(231,150,70,.44) !important;
  background:
    linear-gradient(125deg,rgba(64,27,8,.22),rgba(255,255,255,.09) 42%,transparent 43%),
    linear-gradient(135deg,#8d411a 0%,#c8732c 56%,#eba24f 100%) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  border-color:rgba(89,178,123,.42) !important;
  background:
    linear-gradient(125deg,rgba(8,49,27,.22),rgba(255,255,255,.08) 42%,transparent 43%),
    linear-gradient(135deg,#21613c 0%,#3f945c 56%,#77bf83 100%) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  border-color:rgba(150,132,216,.42) !important;
  background:
    linear-gradient(125deg,rgba(39,27,83,.22),rgba(255,255,255,.08) 42%,transparent 43%),
    linear-gradient(135deg,#4d438f 0%,#7667bf 56%,#a08bd9 100%) !important;
}
.store-hero__main[data-banner-theme="red"],
.store-hero__side[data-banner-theme="red"]{
  border-color:rgba(218,93,93,.42) !important;
  background:
    linear-gradient(125deg,rgba(65,13,18,.22),rgba(255,255,255,.08) 42%,transparent 43%),
    linear-gradient(135deg,#853030 0%,#b84d4d 56%,#dc7770 100%) !important;
}
@media(max-width:1100px){
  .top{
    grid-template-columns:minmax(0,180px) minmax(0,1fr) auto !important;
  }
  .head-left{
    max-width:180px !important;
  }
  .brand__name{
    max-width:92px !important;
  }
  .chip{
    max-width:74px !important;
  }
}
@media(max-width:980px){
  .top{
    grid-template-columns:1fr !important;
    padding:10px !important;
  }
  .head-left{
    max-width:none !important;
  }
  .brand__name{
    max-width:none !important;
  }
  .chip{
    max-width:170px !important;
    flex-basis:170px !important;
  }
}
@media(max-width:720px){
  .shop-tabs{
    display:flex !important;
    overflow-x:auto !important;
    padding-bottom:5px !important;
  }
  .shop-tab{
    flex:0 0 132px !important;
  }
}
@media(max-width:520px){
  .chip{
    flex-basis:118px !important;
    max-width:118px !important;
  }
  .topnav a{
    padding:0 9px !important;
  }
  .store-hero__copy{
    width:78% !important;
    padding:20px !important;
  }
  .store-hero__scene{
    opacity:.55 !important;
  }
}

/* Compact banners and two-step payment sheet */
.store-hero{
  margin-bottom:16px !important;
}
.store-hero__main,
.store-hero__side{
  min-height:142px !important;
  border-radius:18px !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:118px !important;
}
.store-hero__copy{
  padding:20px 22px !important;
}
.store-hero__copy b,
.store-hero__side b{
  font-size:clamp(21px,2.4vw,28px) !important;
}
.store-hero__copy em{
  margin-top:8px !important;
  font-size:14px !important;
}
.store-hero__scene{
  width:44% !important;
  opacity:.62 !important;
}
.store-hero__crate{
  width:118px !important;
  height:92px !important;
  opacity:.55 !important;
}
.store-hero__main::before,
.store-hero__side::before{
  opacity:.55 !important;
  background:
    linear-gradient(115deg,transparent 0 23%,rgba(255,255,255,.14) 23.3% 34%,transparent 34.3% 49%,rgba(255,255,255,.12) 49.3% 60%,transparent 60.3%),
    linear-gradient(180deg,rgba(255,255,255,.12),transparent 55%) !important;
}
.store-hero__main::after,
.store-hero__side::after{
  right:-34px !important;
  bottom:-92px !important;
  width:190px !important;
  height:190px !important;
  opacity:.14 !important;
}

.modal{
  z-index:90 !important;
  place-items:center !important;
  padding:14px !important;
  background:rgba(0,0,0,.62) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.modal__card{
  width:min(474px,100%) !important;
  max-height:calc(100vh - 28px) !important;
  overflow:auto !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.1) !important;
  border-radius:25px !important;
  color:#f4f4f4 !important;
  background:#1c1c1c !important;
  box-shadow:none !important;
}
.modal__x{
  top:18px !important;
  right:18px !important;
  z-index:6 !important;
  width:28px !important;
  height:28px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:7px !important;
  color:#fff !important;
  background:transparent !important;
  font-size:24px !important;
  line-height:1 !important;
}
.payui{
  position:relative !important;
  display:block !important;
  padding:0 !important;
}
.paystep[hidden]{
  display:none !important;
}
.payhero{
  position:relative;
  min-height:114px;
  padding:34px 48px 24px;
  overflow:hidden;
  border-radius:24px 24px 24px 24px;
  background:
    linear-gradient(120deg,transparent 0 24%,rgba(255,255,255,.14) 24.3% 34%,transparent 34.3% 46%,rgba(255,255,255,.12) 46.3% 58%,transparent 58.3%),
    linear-gradient(135deg,#e33d00,#f57900);
}
.payhero span{
  position:relative;
  z-index:1;
  display:block;
  color:rgba(255,255,255,.78);
  font-size:14px;
  font-weight:800;
}
.payhero h2{
  position:relative;
  z-index:1;
  margin:4px 0 0;
  color:#fff;
  font-size:25px;
  line-height:1.05;
}
.paybox,
.paystep--methods{
  padding:26px 25px 24px !important;
}
.paybox{
  border-radius:24px;
  background:
    radial-gradient(circle at 12px 12px,rgba(255,255,255,.06) 1px,transparent 1.5px) 0 0/16px 16px,
    #1f1f1f;
}
.payfield,
.payemail{
  display:block;
}
.payfield input,
.payemail input{
  width:100%;
  min-height:62px;
  padding:0 18px;
  border:1px solid rgba(255,255,255,.11) !important;
  border-radius:19px !important;
  color:#f6f6f6 !important;
  background:#2a2a2a !important;
  font-size:18px;
  font-weight:800;
  text-align:center;
  outline:none;
  box-shadow:none !important;
}
.payfield + .payfield{
  margin-top:10px;
}
.payrow{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}
.payrow[hidden]{display:none;}
.payrow .payfield{margin-top:0;}
.payrow .payfield input{
  /* убираем стрелки у number-полей */
  -moz-appearance:textfield;
}
.payrow .payfield input::-webkit-outer-spin-button,
.payrow .payfield input::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}
.payfield input::placeholder,
.payemail input::placeholder{
  color:#8e8e8e;
}
.payfield input:focus,
.payemail input:focus{
  border-color:rgba(255,135,31,.52) !important;
  background:#303030 !important;
}
.paycheck{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(150px,1.25fr);
  gap:12px;
  margin-top:24px;
}
.paytotal{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:70px;
  padding:0 18px;
  border-radius:18px;
  background:#242424;
}
.paytotal span{
  color:#bdbdbd;
  font-size:13px;
  font-weight:800;
}
.paytotal b{
  color:#fff;
  font-size:20px;
  line-height:1.1;
}
.paycheck__btn,
.pay-submit{
  min-height:70px;
  border:0;
  border-radius:18px;
  color:#303030;
  background:#f7f7f7;
  font-size:17px;
  font-weight:850;
  cursor:pointer;
}
.paycheck__btn:hover,
.pay-submit:hover{
  background:#fff;
}
.paynote{
  max-width:330px;
  margin:18px auto 0;
  color:#9a9a9a;
  font-size:12px;
  font-weight:800;
  line-height:1.25;
  text-align:center;
}
.paynote b,
.paynote a{
  color:#ff7a00;
  text-decoration:none;
}
.paymethods-head h2{
  margin:5px 0 28px;
  color:#fff;
  font-size:21px;
  line-height:1.1;
}
.paymethod-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.paymethod{
  position:relative;
  display:flex;
  min-height:108px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  gap:2px;
  padding:18px;
  border:1px solid transparent !important;
  border-radius:14px !important;
  color:#fff !important;
  background:#2b2b2b !important;
  text-align:left;
  box-shadow:none !important;
  cursor:pointer;
}
.paymethod--wide{
  grid-column:1/-1;
  min-height:108px;
}
.paymethod.is-active{
  border-color:rgba(255,255,255,.14) !important;
  background:#373737 !important;
}
.paymethod.is-active::after{
  content:"";
  position:absolute;
  top:12px;
  right:12px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#22e529;
}
.paymethod strong{
  font-size:15px;
  line-height:1.1;
}
.paymethod em{
  color:#a9a9a9;
  font-size:13px;
  font-style:normal;
  line-height:1.1;
}
.paymethod i{
  position:absolute;
  left:86px;
  top:22px;
  padding:4px 7px;
  border-radius:5px;
  color:#fff;
  background:#ff6540;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
}
.paymark{
  position:absolute;
  left:18px;
  top:19px;
  display:flex;
  align-items:center;
  gap:4px;
  min-height:22px;
  color:#fff;
  font-size:21px;
  font-weight:950;
}
.paymark .ic{
  width:22px;
  height:22px;
}
.paymark--sbp{
  color:#fff;
}
.paymark--mc{
  width:47px;
  overflow:hidden;
  color:transparent;
}
.paymark--mc::before,
.paymark--mc::after{
  content:"";
  width:26px;
  height:26px;
  border-radius:50%;
  background:#ff202b;
}
.paymark--mc::after{
  margin-left:-10px;
  background:#ffad28;
}
.paymark--steam,
.paymark--ton{
  width:30px;
  height:30px;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:#747474;
  font-size:14px;
}
.paymark--ton{
  width:auto;
  height:auto;
  border-radius:0;
  background:transparent;
  color:#58b8ff;
  font-size:15px;
}
.payemail{
  margin-top:10px;
}
.payemail input{
  min-height:66px;
  font-size:17px;
}
.pay-submit{
  width:100%;
  margin-top:8px;
}
.payback{
  width:100%;
  min-height:34px;
  margin-top:8px;
  border:0;
  color:#aaa;
  background:transparent;
  font-weight:800;
  cursor:pointer;
}
.modal__card.is-paying .pay-submit{
  opacity:.72;
  pointer-events:none;
}
.modal__card.is-paying .pay-submit::after{
  content:"...";
}
@media(max-width:560px){
  .modal{
    padding:6px !important;
    align-items:start !important;
  }
  .modal__card{
    border-radius:20px !important;
  }
  .payhero{
    min-height:104px;
    padding:34px 46px 22px;
    border-radius:20px;
  }
  .paybox,
  .paystep--methods{
    padding:20px 18px 22px !important;
  }
  .paycheck{
    grid-template-columns:1fr 1.35fr;
  }
  .paymethod-grid{
    gap:8px;
  }
  .paymethod{
    min-height:106px;
    padding:16px;
  }
  .paymethod strong{
    font-size:14px;
  }
  .paymethod i{
    left:78px;
  }
  .store-hero__main,
  .store-hero__side{
    min-height:124px !important;
  }
  .store-hero__copy b,
  .store-hero__side b{
    font-size:22px !important;
  }
}

/* Image banner pass */
.store-hero{
  margin-bottom:14px !important;
}
.store-hero__main,
.store-hero__side{
  min-height:134px !important;
  border-color:rgba(255,255,255,.13) !important;
  background:#202020 !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:112px !important;
}
.store-hero__main::before,
.store-hero__side::before{
  opacity:.32 !important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.42),rgba(0,0,0,.1) 45%,transparent 72%),
    linear-gradient(115deg,transparent 0 28%,rgba(255,255,255,.12) 28.3% 38%,transparent 38.3% 54%,rgba(255,255,255,.1) 54.3% 62%,transparent 62.3%) !important;
}
.store-hero__main::after,
.store-hero__side::after{
  display:none !important;
}
.store-hero__copy{
  width:min(390px,54%) !important;
  padding:18px 22px !important;
}
.store-hero__copy b,
.store-hero__side b{
  font-size:clamp(21px,2.15vw,27px) !important;
}
.store-hero__copy em{
  max-width:310px !important;
  font-size:13px !important;
}
.store-hero__scene,
.store-hero__crate{
  position:absolute !important;
  z-index:1 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  filter:none !important;
}
.store-hero__scene{
  inset:0 0 0 auto !important;
  width:62% !important;
  height:100% !important;
  opacity:1 !important;
  background-position:center right !important;
  background-size:cover !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 100%);
}
.store-hero__scene .cube{
  display:none !important;
}
.store-hero__crate{
  inset:0 -6px 0 auto !important;
  width:72% !important;
  height:100% !important;
  opacity:1 !important;
  border-radius:0 !important;
  background-color:transparent !important;
  background-position:center right !important;
  background-size:cover !important;
  box-shadow:none !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 32%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 32%,#000 100%);
}
.store-hero__crate::before,
.store-hero__crate::after{
  display:none !important;
}
.store-hero__main[data-banner-image="armors"] .store-hero__scene,
.store-hero__side[data-banner-image="armors"] .store-hero__crate{
  background-image:url("../img/banners/case-armors-wide.jpg") !important;
}
.store-hero__main[data-banner-image="armorsCut"] .store-hero__scene,
.store-hero__side[data-banner-image="armorsCut"] .store-hero__crate{
  background-image:url("../img/banners/case-armors.png") !important;
  background-position:center right !important;
}
.store-hero__main[data-banner-image="crystal"] .store-hero__scene,
.store-hero__side[data-banner-image="crystal"] .store-hero__crate{
  background-image:url("../img/banners/crystal-rank.jpg") !important;
  background-position:center right !important;
}
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  background:linear-gradient(135deg,#173a61 0%,#245c95 56%,#3f8dd0 100%) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  background:linear-gradient(135deg,#7a3312 0%,#b76020 58%,#e49031 100%) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  background:linear-gradient(135deg,#1b5335 0%,#347d51 58%,#5aad72 100%) !important;
}
.store-hero__main[data-banner-theme="red"],
.store-hero__side[data-banner-theme="red"]{
  background:linear-gradient(135deg,#672529 0%,#994243 58%,#cb6862 100%) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  background:linear-gradient(135deg,#43397a 0%,#6658ab 58%,#8f7ed0 100%) !important;
}
.wrap{
  width:min(100% - 30px,1120px) !important;
}
.panel,
.tier,
.ccard,
.exchange-board,
.doc-card,
.contact-tile,
.ticketform,
.tickets,
.ticket,
.authbox,
.paystub,
.foot-panel{
  border-radius:16px !important;
}
.cards,
.tiers,
.tiers--full{
  gap:14px !important;
}
.shop-tabs{
  margin-bottom:14px !important;
}
.phead,
.phead--banner{
  margin-bottom:14px !important;
  border-radius:16px !important;
}
@media(max-width:720px){
  .store-hero__main,
  .store-hero__side{
    min-height:126px !important;
  }
  .store-hero__scene{
    width:70% !important;
    opacity:.9 !important;
  }
  .store-hero__copy{
    width:68% !important;
    padding:17px 18px !important;
  }
  .store-hero__copy b,
  .store-hero__side b{
    font-size:21px !important;
  }
}

/* Final fit pass: contained banner art, short payment, visible admin background */
body[style*="--site-bg"]{
  background-image:
    linear-gradient(180deg,rgba(8,8,8,.82),rgba(8,8,8,.9)),
    var(--site-bg) !important;
  background-size:auto,cover !important;
  background-position:center,center !important;
  background-repeat:no-repeat,no-repeat !important;
  background-attachment:scroll,fixed !important;
}
body[style*="--site-bg"]::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 16%,rgba(255,138,31,.12),transparent 32%),
    radial-gradient(circle at 82% 4%,rgba(75,145,230,.1),transparent 30%),
    rgba(0,0,0,.18);
}
.admin-bg-preview{
  display:flex;
  align-items:flex-end;
  min-height:130px;
  margin:12px 0;
  padding:14px;
  overflow:hidden;
  border:1px dashed rgba(255,255,255,.18);
  border-radius:14px;
  background:
    linear-gradient(135deg,rgba(255,138,31,.12),rgba(255,255,255,.04)),
    #111;
  background-size:cover;
  background-position:center;
}
.admin-bg-preview span{
  padding:7px 10px;
  border-radius:9px;
  color:#eee;
  background:rgba(0,0,0,.58);
  font-weight:800;
  font-size:13px;
}
.store-hero__main,
.store-hero__side{
  min-height:126px !important;
  background:#202020 !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:106px !important;
}
.store-hero__scene{
  width:58% !important;
  background-size:contain !important;
  background-position:right center !important;
  background-blend-mode:multiply !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%);
}
.store-hero__crate{
  width:64% !important;
  background-size:contain !important;
  background-position:right center !important;
  background-blend-mode:multiply !important;
}
.store-hero__main[data-banner-theme="blue"] .store-hero__scene,
.store-hero__side[data-banner-theme="blue"] .store-hero__crate{
  background-color:#2f78bd !important;
}
.store-hero__main[data-banner-theme="orange"] .store-hero__scene,
.store-hero__side[data-banner-theme="orange"] .store-hero__crate{
  background-color:#d27b2d !important;
}
.store-hero__main[data-banner-theme="green"] .store-hero__scene,
.store-hero__side[data-banner-theme="green"] .store-hero__crate{
  background-color:#2f8756 !important;
}
.store-hero__main[data-banner-theme="red"] .store-hero__scene,
.store-hero__side[data-banner-theme="red"] .store-hero__crate{
  background-color:#aa4849 !important;
}
.store-hero__main[data-banner-theme="violet"] .store-hero__scene,
.store-hero__side[data-banner-theme="violet"] .store-hero__crate{
  background-color:#705eb4 !important;
}
.store-hero__main[data-banner-image="armorsCut"] .store-hero__scene,
.store-hero__side[data-banner-image="armorsCut"] .store-hero__crate{
  background-image:url("../img/banners/case-armors-wide.jpg") !important;
}
.store-hero__copy{
  width:min(360px,50%) !important;
  padding:17px 20px !important;
}
.store-hero__side b{
  width:58% !important;
  font-size:22px !important;
  line-height:1.08 !important;
}
.store-hero__copy b{
  font-size:clamp(22px,2vw,26px) !important;
}
.store-hero__copy em{
  font-size:12px !important;
}
.paymethods-head h2{
  margin-bottom:14px !important;
}
.paymethod-grid{
  gap:7px !important;
}
.paymethod,
.paymethod--wide{
  min-height:78px !important;
  padding:15px !important;
}
.paymethod strong{
  margin-top:auto !important;
  font-size:16px !important;
}
.paymethod em,
.paymethod i{
  display:none !important;
}
.paymark{
  top:14px !important;
  left:15px !important;
  font-size:17px !important;
}
.payemail input{
  min-height:58px !important;
}
.pay-submit{
  min-height:62px !important;
}
.paynote{
  max-width:260px !important;
  margin-top:12px !important;
  font-size:11px !important;
}
@media(max-width:720px){
  .store-hero__scene{
    width:60% !important;
  }
  .store-hero__copy{
    width:58% !important;
  }
  .store-hero__side b{
    width:62% !important;
  }
}

/* Clean final skin: editable banners, readable background, minimal checkout */
body[style*="--site-bg"]{
  background:
    linear-gradient(180deg,rgba(10,10,10,.74),rgba(10,10,10,.88)),
    var(--site-bg) center/cover fixed no-repeat !important;
}
body[style*="--site-bg"]::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:rgba(0,0,0,.18);
}
.admin-bg-preview,
.admin-banner-preview{
  display:flex;
  align-items:flex-end;
  min-height:128px;
  margin:12px 0;
  padding:12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background-color:#181818;
  background-size:cover;
  background-position:center;
}
.admin-bg-preview span,
.admin-banner-preview{
  color:#eee;
  font-weight:800;
  font-size:13px;
}
.admin-bg-preview span{
  padding:7px 10px;
  border-radius:9px;
  background:rgba(0,0,0,.56);
}
.admin-banner-form h4{
  margin:0 0 10px;
  color:#f1f1f1;
}
.admin-banner-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.admin-banner-grid label{
  display:block;
}
.admin-banner-preview{
  min-height:92px;
  margin:0 0 8px;
  text-shadow:0 1px 2px rgba(0,0,0,.55) !important;
}

.store-hero{
  grid-template-columns:minmax(0,1fr) minmax(190px,.32fr) !important;
  gap:12px !important;
  margin-bottom:14px !important;
}
.store-hero__main,
.store-hero__side{
  min-height:132px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:16px !important;
  background:#262626 !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:112px !important;
}
.store-hero__main::before,
.store-hero__side::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  opacity:1 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(0,0,0,.46),rgba(0,0,0,.14) 44%,transparent 72%) !important;
}
.store-hero__main::after,
.store-hero__side::after{
  display:none !important;
}
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  background:linear-gradient(135deg,#1e3a53,#2f5f86 58%,#6fa1c9) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  background:linear-gradient(135deg,#6b3a20,#a15e2b 58%,#d9954c) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  background:linear-gradient(135deg,#1f4633,#33714d 58%,#74a982) !important;
}
.store-hero__main[data-banner-theme="red"],
.store-hero__side[data-banner-theme="red"]{
  background:linear-gradient(135deg,#5a3033,#884548 58%,#bc7370) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  background:linear-gradient(135deg,#393456,#5c5282 58%,#9789bd) !important;
}
.store-hero__scene,
.store-hero__crate{
  position:absolute !important;
  inset:0 0 0 auto !important;
  z-index:1 !important;
  width:60% !important;
  height:100% !important;
  opacity:1 !important;
  pointer-events:none !important;
  border-radius:0 !important;
  background-repeat:no-repeat !important;
  background-position:right center !important;
  background-size:contain !important;
  background-blend-mode:multiply !important;
  box-shadow:none !important;
  filter:none !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%) !important;
  mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%) !important;
}
.store-hero__crate{
  width:72% !important;
}
.store-hero__scene .cube,
.store-hero__crate::before,
.store-hero__crate::after{
  display:none !important;
}
.store-hero__main[data-banner-image="armors"] .store-hero__scene,
.store-hero__side[data-banner-image="armors"] .store-hero__crate{
  background-image:var(--banner-armors) !important;
}
.store-hero__main[data-banner-image="armorsCut"] .store-hero__scene,
.store-hero__side[data-banner-image="armorsCut"] .store-hero__crate{
  background-image:var(--banner-misc) !important;
}
.store-hero__main[data-banner-image="crystal"] .store-hero__scene,
.store-hero__side[data-banner-image="crystal"] .store-hero__crate{
  background-image:var(--banner-crystal) !important;
}
.store-hero__main[data-banner-theme="blue"] .store-hero__scene,
.store-hero__side[data-banner-theme="blue"] .store-hero__crate{
  background-color:#dff1ff !important;
}
.store-hero__main[data-banner-theme="orange"] .store-hero__scene,
.store-hero__side[data-banner-theme="orange"] .store-hero__crate{
  background-color:#fff0dc !important;
}
.store-hero__main[data-banner-theme="green"] .store-hero__scene,
.store-hero__side[data-banner-theme="green"] .store-hero__crate{
  background-color:#e4f6e9 !important;
}
.store-hero__main[data-banner-theme="red"] .store-hero__scene,
.store-hero__side[data-banner-theme="red"] .store-hero__crate{
  background-color:#ffe6e3 !important;
}
.store-hero__main[data-banner-theme="violet"] .store-hero__scene,
.store-hero__side[data-banner-theme="violet"] .store-hero__crate{
  background-color:#eee8ff !important;
}
.store-hero__copy{
  position:relative !important;
  z-index:2 !important;
  width:min(380px,52%) !important;
  padding:18px 20px !important;
}
.store-hero__copy b,
.store-hero__side b{
  color:#fff !important;
  font-size:clamp(22px,2vw,27px) !important;
  line-height:1.05 !important;
}
.store-hero__copy em{
  max-width:300px !important;
  margin-top:7px !important;
  color:rgba(255,255,255,.88) !important;
  font-size:12px !important;
}
.store-hero__copy i,
.store-hero__side i{
  position:relative !important;
  z-index:2 !important;
  width:30px !important;
  height:30px !important;
  margin-top:12px !important;
  background:rgba(255,255,255,.18) !important;
}
.store-hero__side{
  padding:18px !important;
}
.store-hero__side b{
  position:relative !important;
  z-index:2 !important;
  width:68% !important;
  font-size:22px !important;
}

.modal{
  background:rgba(0,0,0,.58) !important;
}
.modal__card{
  width:min(430px,100%) !important;
  border-radius:18px !important;
  background:#1d1d1d !important;
}
.payui{
  padding:0 !important;
}
.payhero{
  min-height:0 !important;
  padding:24px 24px 10px !important;
  border-radius:18px 18px 0 0 !important;
  background:#1d1d1d !important;
}
.payhero span{
  color:#999 !important;
  font-size:12px !important;
  text-transform:none !important;
}
.payhero h2{
  margin-top:5px !important;
  font-size:24px !important;
}
.paybox,
.paystep--methods{
  padding:18px 24px 22px !important;
  background:#1d1d1d !important;
}
.payfield input,
.payemail input{
  min-height:52px !important;
  border-radius:12px !important;
  border-color:#383838 !important;
  background:#272727 !important;
  font-size:15px !important;
  font-weight:750 !important;
}
.payfield input:focus,
.payemail input:focus{
  border-color:#777 !important;
  background:#2d2d2d !important;
}
.paycheck{
  grid-template-columns:1fr 1.2fr !important;
  gap:10px !important;
  margin-top:16px !important;
}
.paytotal,
.paycheck__btn,
.pay-submit{
  min-height:56px !important;
  border-radius:12px !important;
}
.paytotal{
  background:#252525 !important;
}
.paycheck__btn,
.pay-submit{
  color:#181818 !important;
  background:#f1f1f1 !important;
  font-size:15px !important;
}
.paymethods-head h2{
  margin:0 0 14px !important;
  font-size:22px !important;
}
.paymethod-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
.paymethod,
.paymethod--wide{
  min-height:74px !important;
  padding:14px !important;
  border-color:#343434 !important;
  border-radius:12px !important;
  background:#272727 !important;
}
.paymethod--wide{
  grid-column:1/-1 !important;
}
.paymethod.is-active{
  border-color:#bdbdbd !important;
  background:#303030 !important;
}
.paymethod strong{
  margin-top:auto !important;
  font-size:15px !important;
}
.paymethod em,
.paymethod i{
  display:none !important;
}
.paymark{
  top:13px !important;
  left:14px !important;
  font-size:15px !important;
}
.paynote{
  max-width:240px !important;
  margin-top:12px !important;
  font-size:11px !important;
  font-weight:700 !important;
}
.payback{
  min-height:32px !important;
}
@media(max-width:720px){
  .store-hero{
    grid-template-columns:1fr !important;
  }
  .store-hero__scene{
    width:68% !important;
  }
  .store-hero__copy{
    width:62% !important;
  }
  .admin-banner-grid{
    grid-template-columns:1fr !important;
  }
}

/* Hotfix: banner images must stay visible, layout wider, payment status clear */
.wrap,
.top,
.foot{
  width:min(100% - 36px,1280px) !important;
}
.store-hero{
  grid-template-columns:minmax(0,1fr) minmax(230px,.34fr) !important;
  gap:14px !important;
}
.store-hero__main,
.store-hero__side{
  min-height:150px !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:128px !important;
}
.store-hero__scene,
.store-hero__crate{
  width:66% !important;
  background-blend-mode:normal !important;
  background-color:transparent !important;
  background-size:contain !important;
  background-position:right center !important;
}
.store-hero__crate{
  width:78% !important;
}
.store-hero__main[data-banner-theme] .store-hero__scene,
.store-hero__side[data-banner-theme] .store-hero__crate{
  background-color:transparent !important;
}
.store-hero__main::before,
.store-hero__side::before{
  background:linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,.16) 44%,rgba(0,0,0,0) 72%) !important;
}
.store-hero__copy{
  width:min(430px,50%) !important;
}
.store-hero__side b{
  width:58% !important;
}
.payment-alert{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
  padding:14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:#202020;
}
.payment-alert > span{
  display:grid;
  flex:0 0 38px;
  width:38px;
  height:38px;
  place-items:center;
  border-radius:11px;
  background:#2b2b2b;
}
.payment-alert .ic{
  width:20px;
  height:20px;
}
.payment-alert b{
  display:block;
  color:#fff;
  font-size:16px;
}
.payment-alert em{
  display:block;
  margin-top:3px;
  color:#aaa;
  font-size:13px;
  font-style:normal;
  line-height:1.3;
}
.payment-alert--ok{
  border-color:rgba(70,190,105,.35);
  background:linear-gradient(135deg,rgba(70,190,105,.14),#202020 55%);
}
.payment-alert--ok > span{
  color:#48d56d;
  background:rgba(70,190,105,.16);
}
.payment-alert--wait > span{
  color:#f2a13b;
  background:rgba(242,161,59,.14);
}
@media(max-width:720px){
  .wrap,
  .top,
  .foot{
    width:min(100% - 18px,1280px) !important;
  }
  .store-hero{
    grid-template-columns:1fr !important;
  }
  .store-hero__scene{
    width:70% !important;
  }
}

/* Real banner images: force visible IMG layer above backgrounds */
.store-hero__scene,
.store-hero__crate{
  background-image:none !important;
  background-color:transparent !important;
  background-blend-mode:normal !important;
}
.store-hero__image{
  position:absolute !important;
  inset:0 0 0 auto !important;
  z-index:2 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:right center !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:none !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
.store-hero__main::before,
.store-hero__side::before{
  z-index:1 !important;
}
.store-hero__copy,
.store-hero__side b,
.store-hero__side i{
  z-index:3 !important;
}
.store-hero__main,
.store-hero__side{
  background-color:#232323 !important;
}
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  background:linear-gradient(135deg,#1d3b56 0%,#2e638b 54%,#dfefff 100%) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  background:linear-gradient(135deg,#65381f 0%,#9b602f 54%,#fff0dd 100%) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  background:linear-gradient(135deg,#1f4934 0%,#347650 54%,#e4f6e9 100%) !important;
}
.store-hero__main[data-banner-theme="red"],
.store-hero__side[data-banner-theme="red"]{
  background:linear-gradient(135deg,#5d2d31 0%,#90494b 54%,#ffe4e0 100%) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  background:linear-gradient(135deg,#373151 0%,#62588b 54%,#eee8ff 100%) !important;
}

/* Full-cover banner images: support normal 16:9 uploads */
.store-hero__main,
.store-hero__side{
  position:relative !important;
  isolation:isolate !important;
}
.store-hero__scene,
.store-hero__crate{
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:0 !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
.store-hero__image{
  inset:0 !important;
  z-index:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}
.store-hero__main::before,
.store-hero__side::before{
  z-index:1 !important;
  opacity:1 !important;
  background:linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.48) 30%,rgba(0,0,0,.14) 62%,rgba(0,0,0,0) 100%) !important;
}
.store-hero__copy,
.store-hero__side b,
.store-hero__side i{
  position:relative !important;
  z-index:2 !important;
}
.admin-banner-preview{
  aspect-ratio:16/9;
  min-height:0 !important;
}

/* =======================================================
   ФИНАЛЬНЫЙ СЛОЙ: кастомный фон сайта и баннеры магазина.
   Должен идти последним — перекрывает старые правила .fx,
   которые закрашивали загруженный фон сплошным цветом.
   ======================================================= */
:root{
  /* затемнение поверх фоновой картинки — крути по вкусу (0 = картинка как есть) */
  --site-bg-overlay-top:rgba(7,7,9,.40);
  --site-bg-overlay-bot:rgba(4,4,6,.66);
}
body[style*="--site-bg"] .fx{
  background:
    linear-gradient(180deg,var(--site-bg-overlay-top),var(--site-bg-overlay-bot)),
    var(--site-bg) !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}
/* приглушаем сетку/скан поверх пользовательского фона, чтобы он читался */
body[style*="--site-bg"] .fx::before{opacity:.18 !important}
body[style*="--site-bg"] .fx::after,
body[style*="--site-bg"] .scan,
body[style*="--site-bg"] .vig{opacity:.25 !important}

/* Баннеры магазина: чистая, читаемая подача загруженной картинки */
.store-hero__main,
.store-hero__side{
  position:relative !important;
  isolation:isolate !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:16px !important;
  box-shadow:0 18px 50px -18px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.store-hero__image{
  inset:0 !important;
  z-index:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}
/* затемнение слева → прозрачное справа: текст читается, картинка видна */
.store-hero__main::before,
.store-hero__side::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.5) 32%,rgba(0,0,0,.16) 64%,rgba(0,0,0,0) 100%) !important;
}
.store-hero__copy,
.store-hero__side b,
.store-hero__side i,
.store-hero__side em{
  position:relative !important;
  z-index:2 !important;
  text-shadow:0 1px 3px rgba(0,0,0,.55) !important;
}

/* =======================================================
   УВЕДОМЛЕНИЯ (тосты) — единый стек, иконки, авто-таймер
   Идёт последним, чтобы перекрыть старые .toast-правила.
   ======================================================= */
/* старый серверный флеш прячем — JS пересоберёт его в .fc-toast */
.toast[data-toast]{display:none !important}

.fc-toasts{
  position:fixed;
  top:calc(env(safe-area-inset-top,0px) + 74px);
  right:clamp(12px,3vw,22px);
  z-index:120;
  display:flex;
  flex-direction:column;
  gap:10px;
  width:min(360px,calc(100vw - 24px));
  pointer-events:none;
}
.fc-toast{
  --toast-accent:var(--accent);
  pointer-events:auto;
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:11px;
  padding:13px 14px;
  border-radius:14px;
  overflow:hidden;
  color:var(--ink,#eef3ef);
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0)),
    color-mix(in srgb,var(--panel,#181b20) 92%,var(--toast-accent) 8%);
  border:1px solid color-mix(in srgb,var(--toast-accent) 38%,rgba(255,255,255,.12));
  box-shadow:
    0 18px 44px -16px rgba(0,0,0,.6),
    0 2px 8px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  /* стартовое состояние для анимации входа */
  opacity:0;
  transform:translateX(18px) scale(.97);
  transition:opacity .3s var(--ease,cubic-bezier(.22,1,.36,1)),
             transform .3s var(--ease,cubic-bezier(.22,1,.36,1));
}
.fc-toast.is-in{opacity:1;transform:none}
.fc-toast.is-leaving{
  opacity:0;
  transform:translateX(18px) scale(.96);
}
.fc-toast--ok{--toast-accent:var(--accent,#39ff8b)}
.fc-toast--err{--toast-accent:var(--warn,#ff5d8f)}
.fc-toast--info{--toast-accent:var(--accent2,#34c7ff)}

.fc-toast__ic{
  width:34px;
  height:34px;
  padding:7px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(160deg,
    color-mix(in srgb,var(--toast-accent) 88%,#fff 6%),
    color-mix(in srgb,var(--toast-accent) 70%,#000 18%));
  box-shadow:0 6px 16px -6px var(--toast-accent),inset 0 1px 0 rgba(255,255,255,.4);
}
.fc-toast__msg{
  min-width:0;
  font-size:14px;
  font-weight:600;
  line-height:1.35;
  word-wrap:break-word;
  overflow-wrap:anywhere;
}
.fc-toast__x{
  flex:none;
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:8px;
  font-size:19px;
  line-height:1;
  color:var(--muted,#8197a0);
  background:transparent;
  transition:.18s;
}
.fc-toast__x:hover{
  color:var(--ink,#fff);
  background:rgba(255,255,255,.1);
}
.fc-toast__bar{
  position:absolute;
  left:0;
  bottom:0;
  height:3px;
  width:100%;
  transform-origin:left center;
  background:linear-gradient(90deg,var(--toast-accent),color-mix(in srgb,var(--toast-accent) 40%,transparent));
  animation:fcToastBar var(--toast-dur,3800ms) linear forwards;
}
/* пауза автозакрытия при наведении/фокусе */
.fc-toast:hover .fc-toast__bar,
.fc-toast:focus-within .fc-toast__bar{animation-play-state:paused}
@keyframes fcToastBar{from{transform:scaleX(1)}to{transform:scaleX(0)}}

@media(max-width:560px){
  .fc-toasts{
    top:auto;
    bottom:calc(env(safe-area-inset-bottom,0px) + 96px);
    left:12px;
    right:12px;
    width:auto;
  }
  .fc-toast{transform:translateY(18px) scale(.97)}
  .fc-toast.is-in{transform:none}
  .fc-toast.is-leaving{transform:translateY(18px) scale(.96)}
}
@media(prefers-reduced-motion:reduce){
  .fc-toast{transition:opacity .2s linear;transform:none}
  .fc-toast.is-leaving{transform:none}
}

/* =======================================================
   БАННЕРЫ МАГАЗИНА v2 — арт целиком, цветной фон, текст слева.
   Идёт последним: перекрывает старые cover/contain-правила.
   ======================================================= */
.store-hero{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(210px,.36fr) !important;
  gap:14px !important;
  margin-bottom:18px !important;
}
.store-hero__main,
.store-hero__side{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  min-height:210px !important;
  padding:30px 32px !important;
  overflow:hidden !important;
  isolation:isolate !important;
  border:0 !important;
  border-radius:26px !important;
  box-shadow:0 22px 60px -24px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.12) !important;
  /* дефолтный фон, если у баннера нет темы */
  background:linear-gradient(120deg,#2a3340,#363f4d) !important;
}
.store-hero--compact .store-hero__main,
.store-hero--compact .store-hero__side{
  min-height:172px !important;
  padding:24px 26px !important;
}

/* мягкие декоративные блики на цветной подложке (как на референсе) */
.store-hero__main::before,
.store-hero__side::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:
    radial-gradient(120% 130% at 88% -10%,rgba(255,255,255,.28),transparent 55%),
    radial-gradient(80% 90% at 0% 110%,rgba(0,0,0,.22),transparent 60%) !important;
}
.store-hero__main::after,
.store-hero__side::after{display:none !important}

/* ----- цветовые темы баннеров ----- */
.store-hero__main[data-banner-theme="blue"],
.store-hero__side[data-banner-theme="blue"]{
  background:linear-gradient(118deg,#1f6dff 0%,#2f8bff 52%,#56a8ff 100%) !important;
}
.store-hero__main[data-banner-theme="violet"],
.store-hero__side[data-banner-theme="violet"]{
  background:linear-gradient(118deg,#7b3ff2 0%,#9354f5 52%,#b07cf8 100%) !important;
}
.store-hero__main[data-banner-theme="orange"],
.store-hero__side[data-banner-theme="orange"]{
  background:linear-gradient(118deg,#ff7a18 0%,#ff9233 52%,#ffb15a 100%) !important;
}
.store-hero__main[data-banner-theme="green"],
.store-hero__side[data-banner-theme="green"]{
  background:linear-gradient(118deg,#13a36b 0%,#1cc07e 52%,#4cd99a 100%) !important;
}
.store-hero__main[data-banner-theme="red"],
.store-hero__side[data-banner-theme="red"]{
  background:linear-gradient(118deg,#e23048 0%,#f0485f 52%,#f87a88 100%) !important;
}

/* ----- картинка арта: целиком, прижата вправо, ничего не режется ----- */
.store-hero__scene,
.store-hero__crate{
  position:absolute !important;
  inset:0 0 0 auto !important;
  z-index:1 !important;
  width:62% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  pointer-events:none !important;
}
.store-hero__side .store-hero__crate{
  width:54% !important;
}
.store-hero__scene .cube{display:none !important}

.store-hero__image{
  position:absolute !important;
  inset:8px 10px 8px auto !important;
  right:10px !important;
  z-index:2 !important;
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:calc(100% - 16px) !important;
  object-fit:contain !important;
  object-position:right center !important;
  opacity:1 !important;
  filter:drop-shadow(0 14px 22px rgba(0,0,0,.42)) !important;
  mix-blend-mode:normal !important;
}

/* ----- текст слева, поверх всего ----- */
.store-hero__copy{
  position:relative !important;
  z-index:3 !important;
  width:min(58%,460px) !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
}
.store-hero__copy b,
.store-hero__side b{
  position:relative !important;
  z-index:3 !important;
  color:#fff !important;
  font-size:clamp(22px,2.3vw,30px) !important;
  font-weight:900 !important;
  line-height:1.08 !important;
  letter-spacing:-.01em !important;
  text-shadow:0 2px 10px rgba(0,0,0,.28) !important;
}
.store-hero__copy em{
  position:relative !important;
  z-index:3 !important;
  display:block !important;
  max-width:300px !important;
  margin-top:9px !important;
  color:rgba(255,255,255,.92) !important;
  font-style:normal !important;
  font-size:13.5px !important;
  font-weight:600 !important;
  line-height:1.4 !important;
  text-shadow:0 1px 4px rgba(0,0,0,.22) !important;
}
.store-hero__copy i,
.store-hero__side i{
  position:relative !important;
  z-index:3 !important;
  display:grid !important;
  place-items:center !important;
  width:40px !important;
  height:40px !important;
  margin-top:18px !important;
  border-radius:50% !important;
  color:#fff !important;
  font-style:normal !important;
  font-size:20px !important;
  background:rgba(255,255,255,.22) !important;
  border:1px solid rgba(255,255,255,.32) !important;
  backdrop-filter:blur(4px) !important;
  transition:background .2s,transform .2s !important;
}
.store-hero__main:hover i,
.store-hero__side:hover i{
  background:rgba(255,255,255,.34) !important;
  transform:translateX(3px) !important;
}
.store-hero__side{
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
}
.store-hero__side b{
  width:min(70%,180px) !important;
  font-size:clamp(19px,1.6vw,23px) !important;
}

@media(max-width:760px){
  .store-hero{grid-template-columns:1fr !important}
  .store-hero__side{min-height:150px !important}
}
@media(max-width:480px){
  .store-hero__main,
  .store-hero__side{min-height:158px !important;padding:20px !important;border-radius:20px !important}
  .store-hero__copy{width:62% !important}
  .store-hero__scene,
  .store-hero__crate{width:48% !important}
}

/* =======================================================
   ДВУХКОЛОНОЧНЫЙ МАГАЗИН ПРИВИЛЕГИЙ (как HOLYTIME)
   ======================================================= */
.shopview{
  display:grid;
  grid-template-columns:minmax(260px,330px) minmax(0,1fr);
  gap:18px;
  align-items:start;
  margin-bottom:28px;
}

/* ----- левая колонка: список товаров ----- */
.shopview__list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.shopview__listhead{
  position:relative;
  padding:18px 20px;
  border-radius:18px;
  overflow:hidden;
  color:#fff;
  font-size:18px;
  font-weight:900;
  letter-spacing:.01em;
  background:
    linear-gradient(120deg,transparent 0 30%,rgba(255,255,255,.16) 30.3% 40%,transparent 40.3% 54%,rgba(255,255,255,.12) 54.3% 64%,transparent 64.3%),
    linear-gradient(120deg,#ff7a18,#ff9a2e);
  box-shadow:0 16px 34px -16px rgba(255,122,24,.6);
}
.shopview__items{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:560px;
  padding:4px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.18) transparent;
}
.shopview__items::-webkit-scrollbar{width:8px}
.shopview__items::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:8px}

.shopitem{
  --c:#ff7a18;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:13px;
  width:100%;
  padding:13px 16px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:15px;
  color:var(--ink,#eef3ef);
  background:rgba(255,255,255,.025);
  text-align:left;
  cursor:pointer;
  transition:border-color .18s,background .18s,transform .12s;
}
.shopitem:hover{
  border-color:color-mix(in srgb,var(--c) 50%,rgba(255,255,255,.1));
  background:rgba(255,255,255,.05);
}
.shopitem.is-active{
  border-color:color-mix(in srgb,var(--c) 70%,transparent);
  background:
    linear-gradient(120deg,color-mix(in srgb,var(--c) 22%,transparent),color-mix(in srgb,var(--c) 6%,transparent)),
    rgba(255,255,255,.02);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 30%,transparent),0 14px 30px -18px var(--c);
}
.shopitem__ico{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:11px;
  background:color-mix(in srgb,var(--c) 18%,rgba(0,0,0,.3));
  overflow:hidden;
}
.shopitem__ico img{width:100%;height:100%;object-fit:cover}
.shopitem__ico .ic{width:24px;height:24px;color:var(--c)}
.shopitem__badge{width:26px;height:26px}
/* буквенная иконка ранга внутри квадрата */
.shopitem__ico .rank-icon,
.buypanel__icon .rank-icon{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:var(--c);
}
.shopitem__ico .rank-icon b,
.buypanel__icon .rank-icon b{font-size:16px}
.shopitem__name{
  font-size:15.5px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.shopitem__from{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:var(--muted,#8197a0);
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
.shopitem__from .price{color:#fff}
.shopitem__from i{font-style:normal;font-size:15px;opacity:.7}

/* ----- правая колонка: панель покупки ----- */
.buypanel{
  --c:#ff7a18;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:rgba(255,255,255,.02);
}
.buypanel__hero{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:96px;
  padding:22px 24px;
  overflow:hidden;
  border-radius:16px;
  background:
    linear-gradient(120deg,color-mix(in srgb,var(--c) 50%,transparent) 0%,transparent 60%),
    linear-gradient(180deg,#161616,#101010);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.buypanel__hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.05) 58.3% 70%,transparent 70.3%);
  pointer-events:none;
}
.buypanel__herotext span{
  display:block;
  color:rgba(255,255,255,.62);
  font-size:13px;
  font-weight:800;
}
.buypanel__herotext h2{
  margin:3px 0 0;
  color:#fff;
  font-size:26px;
  font-weight:900;
  line-height:1.05;
}
.buypanel__flow{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:10px;
}
.buypanel__icon,
.buypanel__cart{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:13px;
  background:rgba(0,0,0,.32);
  border:1px solid rgba(255,255,255,.1);
  overflow:hidden;
}
.buypanel__icon img{width:100%;height:100%;object-fit:cover}
.buypanel__icon .ic{width:26px;height:26px;color:var(--c)}
.buypanel__cart .ic{width:24px;height:24px;color:#fff}
.buypanel__sep{color:rgba(255,255,255,.4);font-size:20px;font-weight:900}

.buypanel__body{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:18px;
  border-radius:16px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
}
.buypanel__infohead{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
  color:#fff;
  font-size:15px;
  font-weight:900;
}
.buypanel__infohead .ic{width:18px;height:18px;color:var(--c)}
.inforow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:11px 0;
  border-top:1px solid rgba(255,255,255,.06);
}
.inforow:first-of-type{border-top:0}
.inforow__k{
  position:relative;
  padding-left:16px;
  color:var(--muted,#8197a0);
  font-size:13.5px;
  font-weight:700;
}
.inforow__k::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--c);
}
.inforow__v{
  color:#f1f1f1;
  font-size:14px;
  font-weight:800;
  text-align:right;
}
.inforow__v--accent{color:#37e08a}

.buypanel__dock{
  margin:0 !important;
  grid-template-columns:repeat(3,1fr);
}

.buypanel__foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 18px;
  border-radius:16px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
}
.buypanel__cost{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.buypanel__cost span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--muted,#8197a0);
  font-size:12.5px;
  font-weight:800;
}
.buypanel__cost span .ic{width:15px;height:15px}
.buypanel__cost b{
  color:#fff;
  font-size:22px;
  font-weight:900;
  line-height:1;
}
.buypanel__buy{
  min-height:54px;
  padding:0 26px !important;
  border-radius:13px !important;
  font-size:15px !important;
}
.buypanel__buy i{font-style:normal;margin-left:2px}

@media(max-width:860px){
  .shopview{grid-template-columns:1fr}
  .shopview__items{max-height:340px}
}
@media(max-width:520px){
  .buypanel__herotext h2{font-size:22px}
  .buypanel__foot{flex-direction:column;align-items:stretch}
  .buypanel__buy{width:100%}
}

/* extra-вариант (кейсы/токены/разное): без переключателя периода */
.buypanel--extra .buypanel__body{
  min-height:200px;
  justify-content:flex-start;
}
.buypanel--extra .inforow__v{max-width:60%}
/* в extra-списке иконка — это svg, центрируем его в квадрате */
.shopview--extra .shopitem__ico .ic{width:24px;height:24px;color:var(--c)}

/* =======================================================
   БАННЕРЫ: картинка на ВЕСЬ баннер (cover), текст слева читаем.
   Идёт последним — перекрывает v2-слой "арт справа", где
   картинка вписывалась (contain) в узкий бокс 54–62% и
   выглядела маленькой в правой части баннера.
   ======================================================= */
/* бокс-обёртка арта растягивается на весь баннер.
   transform:none — гасим старый 3D-«ящик» (rotateX/rotateZ),
   из-за которого боковой баннер выглядел перевёрнутым/наклонённым. */
.store-hero__scene,
.store-hero__crate,
.store-hero__side .store-hero__crate{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  z-index:0 !important;
  transform:none !important;
  background:none !important;
  box-shadow:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  pointer-events:none !important;
}
/* старые декоративные «грани ящика» — не нужны на cover-картинке */
.store-hero__scene::before,
.store-hero__scene::after,
.store-hero__crate::before,
.store-hero__crate::after{display:none !important}
/* сама картинка — заполняет весь баннер без полей */
.store-hero__image{
  position:absolute !important;
  inset:0 !important;
  right:auto !important;
  z-index:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  margin:0 !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:none !important;
}
/* читаемость текста: затемнение слева → прозрачное справа, поверх картинки.
   transform:none — старый слой крутил боковое затемнение на -8deg. */
.store-hero__main::before,
.store-hero__side::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  transform:none !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.55) 30%,rgba(0,0,0,.2) 62%,rgba(0,0,0,0) 100%) !important;
}
.store-hero__main::after,
.store-hero__side::after{display:none !important}
/* текст и стрелка — над картинкой и затемнением */
.store-hero__copy,
.store-hero__copy b,
.store-hero__copy em,
.store-hero__copy i,
.store-hero__side b,
.store-hero__side i,
.store-hero__side em{
  position:relative !important;
  z-index:3 !important;
}

/* =======================================================
   СТЕППЕР КОЛИЧЕСТВА в панели покупки кейса (− N +)
   ======================================================= */
.bxqty{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:14px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.bxqty[hidden]{display:none}
.bxqty__label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.bxqty__label .ic{width:18px;height:18px;color:var(--c,#ff7a18)}
.bxqty__ctrl{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}
.bxqty__btn{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:color-mix(in srgb,var(--c,#ff7a18) 16%,rgba(0,0,0,.3));
  color:#fff;
  font-size:22px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  transition:background .15s,border-color .15s,transform .1s;
}
.bxqty__btn:hover{
  background:color-mix(in srgb,var(--c,#ff7a18) 30%,rgba(0,0,0,.25));
  border-color:color-mix(in srgb,var(--c,#ff7a18) 50%,transparent);
}
.bxqty__btn:active{transform:scale(.94)}
.bxqty__input{
  width:64px;
  height:40px;
  text-align:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(0,0,0,.28);
  color:#fff;
  font-size:16px;
  font-weight:900;
  -moz-appearance:textfield;
}
.bxqty__input::-webkit-outer-spin-button,
.bxqty__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.bxqty__hint{
  flex:1 1 100%;
  color:var(--muted,#8197a0);
  font-size:12.5px;
  font-weight:700;
}
.bxqty__hint:empty{display:none}

/* =========================================================
   v50: документы, оплата с Украины, касса (СБП/крипто/баланс),
   галочки согласий, новая Поддержка и чат
   ========================================================= */

/* ---------- юридические страницы ---------- */
.doc-page--legal{max-width:880px;margin:0 auto}
.doc-page__intro{color:var(--muted,#8197a0);margin:6px 0 18px;font-size:15px;line-height:1.55}
.doc-card--legal{line-height:1.65;font-size:14.5px}
.doc-card--legal h3{
  margin:22px 0 10px;
  font-size:16px;
  letter-spacing:.01em;
  color:var(--accent,#ff7a18);
}
.doc-card--legal h3:first-child{margin-top:0}
.doc-card--legal p{margin:8px 0}
.doc-card--legal ul{margin:8px 0 12px;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.doc-card--legal a{color:var(--accent,#ff7a18)}
.doc-card__final{
  margin-top:20px;
  padding:14px 16px;
  border:1px dashed var(--line,rgba(255,255,255,.12));
  border-radius:12px;
  background:color-mix(in srgb,var(--accent,#ff7a18) 7%,transparent);
  font-weight:700;
}

/* ---------- как оплатить с Украины ---------- */
.ua-page{max-width:680px;margin:0 auto;text-align:center}
.ua-card{
  margin-top:18px;
  padding:34px 26px;
  border-radius:var(--r,16px);
  border:1px solid var(--line,rgba(255,255,255,.12));
  background:var(--panel-grad,rgba(255,255,255,.03));
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}
.ua-card p{font-size:18px;line-height:1.5;max-width:460px}
.ua-card p b{color:var(--accent,#ff7a18)}
.ua-card__flag{
  width:54px;height:38px;border-radius:8px;overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.ua-card__flag i{flex:1}
.ua-card__flag i:first-child{background:#3b6fd6}
.ua-card__flag i:last-child{background:#ffd24a}
.ua-card__btn{min-width:240px;justify-content:center}

/* ---------- кнопки документов в самом низу ---------- */
.foot-docbtns{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  padding:14px 16px 4px;
  border-top:1px solid var(--line,rgba(255,255,255,.1));
  margin-top:12px;
}
.foot-docbtn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 18px;
  border-radius:999px;
  border:1px solid var(--line,rgba(255,255,255,.14));
  background:rgba(255,255,255,.04);
  color:var(--ink,#eef4f6);
  font-weight:800;
  font-size:13px;
  text-decoration:none;
  transition:.2s;
}
.foot-docbtn .ic{width:16px;height:16px}
.foot-docbtn:hover{
  border-color:var(--accent,#ff7a18);
  color:var(--accent,#ff7a18);
  transform:translateY(-1px);
}

/* ---------- касса: 3 способа + иконки-картинки ---------- */
.paymethod-grid--three{grid-template-columns:repeat(2,1fr)}
.paymethod-grid--three .paymethod--wide{grid-column:1/-1}
.paymark--img{background:rgba(255,255,255,.06);overflow:hidden}
.paymark--img img{
  width:26px;height:26px;object-fit:contain;display:block;
}

/* ---------- галочки согласий ---------- */
.payagrees{display:flex;flex-direction:column;gap:8px;margin:12px 0 2px}
.payagree{
  display:flex;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
  font-size:12.5px;
  line-height:1.45;
  color:var(--muted,#8197a0);
  user-select:none;
}
.payagree a{color:var(--accent,#ff7a18);text-decoration:underline}
.payagree input{position:absolute;opacity:0;width:0;height:0}
.payagree__box{
  flex:0 0 auto;
  width:19px;height:19px;
  margin-top:1px;
  border-radius:6px;
  border:1.5px solid var(--line,rgba(255,255,255,.25));
  background:rgba(0,0,0,.25);
  position:relative;
  transition:.18s;
}
.payagree input:checked + .payagree__box{
  background:var(--accent,#ff7a18);
  border-color:var(--accent,#ff7a18);
}
.payagree input:checked + .payagree__box::after{
  content:'';
  position:absolute;
  left:5.5px;top:2px;
  width:5px;height:9px;
  border:solid #14100b;
  border-width:0 2.5px 2.5px 0;
  transform:rotate(42deg);
}
.payagree input:focus-visible + .payagree__box{outline:2px solid var(--accent,#ff7a18);outline-offset:2px}

/* ---------- Поддержка: герой и темы ---------- */
.support-hero{
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(0,1.4fr);
  gap:22px;
  align-items:center;
  padding:26px;
  margin-bottom:18px;
  border-radius:var(--r,16px);
  border:1px solid var(--line,rgba(255,255,255,.12));
  background:
    radial-gradient(420px 200px at 0% 0%,color-mix(in srgb,var(--accent,#ff7a18) 16%,transparent),transparent 70%),
    var(--panel-grad,rgba(255,255,255,.03));
}
.support-hero__tag{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 12px;border-radius:999px;
  font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  color:var(--accent,#ff7a18);
  border:1px solid color-mix(in srgb,var(--accent,#ff7a18) 45%,transparent);
  background:color-mix(in srgb,var(--accent,#ff7a18) 10%,transparent);
}
.support-hero__tag .ic{width:14px;height:14px}
.support-hero__text h1{margin:12px 0 8px;font-size:clamp(26px,4vw,38px)}
.support-hero__text p{color:var(--muted,#8197a0);line-height:1.55;max-width:420px}
.support-hero__topics{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}
.support-topic{
  display:flex;flex-direction:column;gap:4px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid var(--line,rgba(255,255,255,.12));
  background:rgba(255,255,255,.03);
  color:var(--ink,#eef4f6);
  text-decoration:none;
  transition:.2s;
}
.support-topic:hover{transform:translateY(-2px);border-color:var(--accent,#ff7a18)}
.support-topic__ico{
  width:34px;height:34px;
  display:grid;place-items:center;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  margin-bottom:4px;
}
.support-topic__ico .ic{width:18px;height:18px}
.support-topic b{font-size:14px}
.support-topic em{font-style:normal;font-size:12px;color:var(--muted,#8197a0);line-height:1.4}
.support-topic--pay{
  border-color:color-mix(in srgb,var(--accent,#ff7a18) 55%,transparent);
  background:color-mix(in srgb,var(--accent,#ff7a18) 9%,transparent);
}
.support-topic--pay .support-topic__ico{
  background:color-mix(in srgb,var(--accent,#ff7a18) 22%,transparent);
  color:var(--accent,#ff7a18);
}

/* ---------- Поддержка: форма ---------- */
.typepick--support{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.typepick--support .typeopt{width:100%}
.typepick--support .typeopt span{width:100%;justify-content:center;text-align:center}
.support-payhint{
  display:flex;align-items:flex-start;gap:8px;
  padding:11px 13px;
  border-radius:12px;
  font-size:12.5px;line-height:1.45;
  color:var(--accent,#ff7a18);
  border:1px dashed color-mix(in srgb,var(--accent,#ff7a18) 50%,transparent);
  background:color-mix(in srgb,var(--accent,#ff7a18) 8%,transparent);
}
.support-payhint .ic{width:15px;height:15px;flex:0 0 auto;margin-top:1px}
.support-payhint[hidden]{display:none}
#modField[hidden]{display:none}
.support-formnote{font-size:12px;text-align:center}

/* ---------- Поддержка: список и чат ---------- */
.tk{transition:.2s}
.tk:hover{transform:translateY(-2px);border-color:var(--accent,#ff7a18)}
.tk__emoji--st-ok{color:#46d979}
.tk__emoji--st-no{color:#ff6177}
.tk__emoji--st-cl{color:#8b96a5}
.support-ticket .thread{
  padding:16px;
  border-radius:14px;
  border:1px solid var(--line,rgba(255,255,255,.08));
  background:rgba(0,0,0,.18);
  max-height:62vh;
  overflow-y:auto;
  scroll-behavior:smooth;
}
.support-ticket .msg__body{max-width:680px}
.composer--support{
  position:sticky;
  bottom:12px;
  padding:10px;
  border-radius:16px;
  border:1px solid var(--line,rgba(255,255,255,.12));
  background:var(--panel,rgba(20,22,26,.92));
  backdrop-filter:blur(10px);
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.composer--support .composer__in{border-radius:12px}

@media (max-width:860px){
  .support-hero{grid-template-columns:1fr;gap:16px;padding:20px}
  .support-hero__topics{grid-template-columns:1fr 1fr}
  .typepick--support{grid-template-columns:1fr}
  .foot-docbtns{flex-direction:column;align-items:stretch}
  .foot-docbtn{justify-content:center}
}

/* ---------- v50.1: верхняя навигация — горизонтальная прокрутка ---------- */
.topnav{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  min-width:0 !important;
  max-width:100% !important;
  justify-content:flex-start !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
}
.topnav::-webkit-scrollbar{display:none !important;width:0;height:0}
.topnav a{
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

/* ---------- v50.2: шапка — грид, меню не наезжает на Войти ---------- */
@media(min-width:981px){
  .top{
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
  }
  .head-left{min-width:0 !important;flex:none !important}
  .topnav{width:100% !important;margin:0 !important}
  .acct{
    min-width:0 !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
    justify-content:flex-end !important;
  }
}

/* =========================================================
   v50.3: улучшенная касса (шаги, сводка заказа) и профиль
   ========================================================= */

/* ---------- касса: индикатор шагов ---------- */
.paysteps{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 16px;
}
.paysteps__dot{
  width:24px;height:24px;
  display:grid;place-items:center;
  border-radius:50%;
  font-size:12px;font-weight:900;
  color:#9a9a9a;
  background:#2b2b2b;
  border:1px solid rgba(255,255,255,.1);
}
.paysteps__dot.is-active{
  color:#fff;
  background:#ff7a00;
  border-color:#ff7a00;
  box-shadow:0 0 12px rgba(255,122,0,.4);
}
.paysteps__line{
  width:26px;height:2px;
  border-radius:2px;
  background:rgba(255,255,255,.12);
}
.paysteps__label{
  margin-left:auto;
  color:#8a8a8a;
  font-size:11.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.paysteps__label--right{margin-left:auto}
.paymethods-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.paymethods-head h2{margin-bottom:14px !important}

/* ---------- касса: подписи полей ---------- */
.payfield{display:block}
.payfield__cap{
  display:block;
  margin:0 2px 6px;
  color:#9f9f9f;
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
.payfield__cap i{
  font-style:normal;
  color:#6e6e6e;
  font-weight:700;
}
.payfield + .payfield{margin-top:12px}
.payemail .payfield__cap{margin-top:14px}

/* ---------- касса: сводка заказа на шаге оплаты ---------- */
.paysummary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:0 0 16px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(120deg,rgba(255,122,0,.12),rgba(255,255,255,.03) 60%);
}
.paysummary__info{display:flex;flex-direction:column;gap:2px;min-width:0}
.paysummary__info span{
  color:#9a9a9a;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.paysummary__info b{
  color:#fff;
  font-size:15px;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.paysummary__info em{
  font-style:normal;
  color:#ff9b40;
  font-size:12px;
  font-weight:700;
}
.paysummary__info em:empty{display:none}
.paysummary__total{
  flex:0 0 auto;
  color:#ff7a00;
  font-size:21px;
  font-weight:950;
}

/* ---------- касса: кнопки ---------- */
.pay-submit{
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  color:#fff !important;
  background:linear-gradient(135deg,#e33d00,#f57900) !important;
  box-shadow:0 10px 26px rgba(245,121,0,.35) !important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease !important;
}
.pay-submit:hover{
  filter:brightness(1.08);
  transform:translateY(-1px);
  box-shadow:0 14px 32px rgba(245,121,0,.45) !important;
}
.pay-submit:active{transform:translateY(0)}
.pay-submit__lock{font-size:14px;opacity:.85}
.payback{
  display:block;
  width:100%;
  margin-top:10px;
  padding:12px;
  border:0;
  border-radius:12px;
  color:#9a9a9a;
  background:transparent;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  transition:.18s;
}
.payback:hover{color:#fff;background:rgba(255,255,255,.05)}
.paycheck__btn{transition:transform .18s ease,background .18s ease}
.paycheck__btn:hover{transform:translateY(-1px)}

/* ---------- касса: способы оплаты ---------- */
.paymethod{transition:transform .18s ease,background .18s ease,border-color .18s ease !important}
.paymethod:hover{transform:translateY(-2px);background:#333 !important}
.paymethod.is-active{
  border-color:rgba(255,122,0,.55) !important;
  background:#3a322b !important;
}
.paymethod.is-active::after{
  background:#ff7a00;
  box-shadow:0 0 10px rgba(255,122,0,.7);
}

/* ---------- профиль ---------- */
.profile-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.profile-logout{flex:0 0 auto}
.profile-logout .ic{width:14px;height:14px}

.pcard--v2{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:28px 22px 22px;
}
.pcard__avawrap{
  padding:4px;
  border-radius:18px;
  background:linear-gradient(135deg,var(--accent,#ff7a18),transparent 65%);
}
.pcard--v2 .pcard__ava{
  display:block;
  width:104px;height:104px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.4);
}
.pcard--v2 .pcard__name{margin:2px 0 0;font-size:20px}
.pcard__role{margin-top:-4px}
.pcard__email{
  color:var(--muted,#8197a0);
  font-size:12.5px;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pcard__balance{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:2px;
  margin-top:6px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid color-mix(in srgb,var(--accent,#ff7a18) 35%,transparent);
  background:color-mix(in srgb,var(--accent,#ff7a18) 9%,transparent);
  text-align:center;
}
.pcard__balance span{
  color:var(--muted,#8197a0);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.pcard__balance b{
  font:900 24px/1.1 var(--mono,monospace);
  color:var(--accent,#ff7a18);
}
.pcard--v2 .mt{width:100%}
.pcard__avabtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
}
.pcard__avabtn .ic{width:15px;height:15px}
.pcard--v2 .promoredeem{width:100%}
.pcard__links{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:8px;
  padding-top:12px;
  border-top:1px solid var(--line,rgba(255,255,255,.1));
}
.pcard__links a{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 12px;
  border-radius:10px;
  color:var(--ink,#eef4f6);
  font-size:13px;
  font-weight:800;
  text-decoration:none;
  transition:.18s;
}
.pcard__links a:hover{
  background:rgba(255,255,255,.05);
  color:var(--accent,#ff7a18);
}
.pcard__links .ic{width:15px;height:15px;flex:0 0 auto}

.pinvoices h3,
.phist h3{
  display:flex;
  align-items:center;
  gap:9px;
}
.pinvoices h3 .ic,
.phist h3 .ic{width:17px;height:17px;color:var(--accent,#ff7a18)}

.profile-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:30px 16px;
  text-align:center;
}
.profile-empty .ic{
  width:30px;height:30px;
  color:var(--muted,#8197a0);
  opacity:.6;
  margin-bottom:4px;
}
.profile-empty span{font-weight:800}
.profile-empty em{font-style:normal;font-size:13px;line-height:1.5}
.profile-empty a{color:var(--accent,#ff7a18)}

.htab--v2 tr{transition:background .15s}
.htab--v2 tr:hover td{background:rgba(255,255,255,.025)}
.htab--v2 td b{font-weight:800}
.htab__sum{color:var(--accent,#ff7a18);font-weight:900}

@media (max-width:720px){
  .htab--v2,
  .htab--v2 tr,
  .htab--v2 td{display:block;width:100%}
  .htab--v2 tr:first-child{display:none}
  .htab--v2 tr{
    margin-bottom:10px;
    padding:12px 14px;
    border:1px solid var(--line,rgba(255,255,255,.1));
    border-radius:12px;
    background:rgba(255,255,255,.02);
  }
  .htab--v2 td{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:5px 0 !important;
    border:0 !important;
  }
  .htab--v2 td::before{
    content:attr(data-th);
    color:var(--muted,#8197a0);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.06em;
  }
  .paysummary{flex-direction:row}
  .paysummary__total{font-size:18px}
}