/* ===========================================================
   DonatGo — дизайн-система (тёмная, неон-циан + зелёный)
   Вдохновлено Playerok (UX), KupiKod (скидки), Donatov (каталог)
   =========================================================== */
:root{
  --bg:#0A0D14; --bg-2:#0B0F18; --surface:#121826; --surface-2:#18202F; --surface-3:#202A3C;
  --border:rgba(255,255,255,.07); --border-2:rgba(255,255,255,.12);
  --accent:#22D3EE; --accent-2:#34D399; --accent-3:#0EA5C4;
  --grad:linear-gradient(135deg,#22D3EE 0%,#34D399 100%);
  --grad-soft:linear-gradient(135deg,rgba(34,211,238,.18),rgba(52,211,153,.14));
  --success:#34D399; --danger:#FF3B5C; --warn:#FBBF24;
  --text:#EAF1FB; --text-muted:#8A97AD; --text-dim:#5E6B81;
  --radius:18px; --radius-sm:12px; --radius-lg:24px;
  --shadow:0 10px 30px rgba(0,0,0,.45);
  --glow:0 0 0 1px rgba(34,211,238,.4), 0 8px 30px rgba(34,211,238,.25);
  --maxw:1200px;
  --font:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Inter,system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font); background:var(--bg); color:var(--text);
  -webkit-font-smoothing:antialiased; line-height:1.5; min-height:100vh;
  background-image:
    radial-gradient(900px 500px at 85% -8%, rgba(34,211,238,.10), transparent 60%),
    radial-gradient(800px 500px at 5% 0%, rgba(52,211,153,.08), transparent 55%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.muted{color:var(--text-muted)}
.hidden{display:none!important}

/* scrollbar */
::-webkit-scrollbar{height:8px;width:8px}
::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* ===================== buttons ===================== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 20px;border-radius:var(--radius-sm);font-weight:700;font-size:15px;
  transition:.18s transform,.18s box-shadow,.18s background,.18s border-color;white-space:nowrap}
.btn:active{transform:translateY(1px) scale(.99)}
.btn-accent{background:var(--grad);color:#04222a;box-shadow:0 6px 22px rgba(34,211,238,.35)}
.btn-accent:hover{box-shadow:0 10px 30px rgba(34,211,238,.5);transform:translateY(-1px)}
.btn-ghost{background:var(--surface-2);color:var(--text);border:1px solid var(--border-2)}
.btn-ghost:hover{background:var(--surface-3);border-color:var(--accent)}
.btn-danger{background:rgba(255,59,92,.12);color:#ff8198;border:1px solid rgba(255,59,92,.3)}
.btn-danger:hover{background:rgba(255,59,92,.2)}
.btn-sm{padding:8px 14px;font-size:13px;border-radius:10px}
.btn-block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ===================== badges ===================== */
.tag{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:800;letter-spacing:.2px}
.tag-accent{background:var(--grad);color:#04222a}
.tag-soft{background:var(--surface-3);color:var(--text-muted);border:1px solid var(--border)}
.tag-auto{background:rgba(52,211,153,.14);color:#5ee7a8;border:1px solid rgba(52,211,153,.3)}
.discount{display:inline-flex;align-items:center;padding:3px 8px;border-radius:8px;background:var(--danger);color:#fff;font-weight:800;font-size:12px}
.oldprice{color:var(--text-dim);text-decoration:line-through;font-size:13px;font-weight:600}

/* ===================== header ===================== */
.header{position:sticky;top:0;z-index:50;background:rgba(10,13,20,.82);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border)}
.header-row{display:flex;align-items:center;gap:18px;height:68px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:21px;letter-spacing:-.5px}
.brand .logo{width:34px;height:34px;border-radius:10px;background:var(--grad);display:grid;place-items:center;
  font-size:18px;box-shadow:0 4px 16px rgba(34,211,238,.4);overflow:hidden}
.brand .logo img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.brand .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.search{flex:1;position:relative;max-width:560px}
.search input{width:100%;height:44px;border-radius:12px;background:var(--surface);border:1px solid var(--border-2);
  color:var(--text);padding:0 16px 0 42px;font-size:15px;outline:none;transition:.15s}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(34,211,238,.15)}
.search .ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted)}
.search-results{position:absolute;top:52px;left:0;right:0;background:var(--surface);border:1px solid var(--border-2);
  border-radius:14px;box-shadow:var(--shadow);overflow:hidden;z-index:60;max-height:60vh;overflow-y:auto}
.sr-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--border)}
.sr-item:hover{background:var(--surface-2)}
.sr-item:last-child{border-bottom:none}
.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.icon-btn{position:relative;width:44px;height:44px;border-radius:12px;background:var(--surface);border:1px solid var(--border-2);
  display:grid;place-items:center;font-size:18px;transition:.15s}
.icon-btn:hover{border-color:var(--accent);color:var(--accent)}
.icon-btn svg{display:block}
.cart-btn{color:var(--accent);border-color:rgba(34,211,238,.32)}
.cart-btn:hover{background:var(--grad);border-color:transparent;color:#04222a;box-shadow:0 6px 18px rgba(34,211,238,.4)}
.cart-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  background:var(--danger);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center}

/* ===================== hero ===================== */
.hero{margin:18px 0;border-radius:var(--radius-lg);overflow:hidden;position:relative;
  background:linear-gradient(120deg,#0d2530,#0c1f2a 40%,#0e2622);border:1px solid var(--border)}
.hero-inner{position:relative;z-index:2;padding:28px 34px;max-width:600px}
.hero h1{font-size:29px;line-height:1.12;margin:0 0 9px;font-weight:900;letter-spacing:-.6px}
.hero h1 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:14.5px;color:#bcd4dc;margin:0 0 16px;max-width:540px;line-height:1.5}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}
.hero-glow{position:absolute;right:-60px;top:-50px;width:330px;height:330px;border-radius:50%;
  background:radial-gradient(circle,rgba(34,211,238,.30),transparent 65%);filter:blur(20px);z-index:1}
.hero-emojis{position:absolute;right:28px;bottom:-6px;font-size:88px;opacity:.16;z-index:1;transform:rotate(-8deg)}

/* trust strip */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0}
.trust-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;
  display:flex;align-items:center;gap:13px}
.trust-card .ic{width:42px;height:42px;border-radius:12px;background:var(--grad-soft);display:grid;place-items:center;font-size:21px;flex-shrink:0}
.trust-card b{display:block;font-size:14.5px}
.trust-card span{font-size:12.5px;color:var(--text-muted)}

/* category chips */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 4px}
.chip{padding:9px 16px;border-radius:999px;background:var(--surface);border:1px solid var(--border-2);
  font-weight:700;font-size:14px;color:var(--text-muted);transition:.15s}
.chip:hover{border-color:var(--accent);color:var(--text)}
.chip.active{background:var(--grad);color:#04222a;border-color:transparent}

/* section header */
.section{margin:34px 0}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.section-head h2{font-size:24px;font-weight:900;margin:0;letter-spacing:-.5px;display:flex;align-items:center;gap:10px}
.section-head .link{color:var(--accent);font-weight:700;font-size:14px}
.dg-hicon{display:inline-grid;place-items:center;width:33px;height:33px;border-radius:10px;background:var(--grad);box-shadow:0 4px 14px rgba(34,211,238,.42);flex-shrink:0}

/* ===================== game grid ===================== */
.games-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.game-card{position:relative;border-radius:var(--radius);overflow:hidden;cursor:pointer;
  background:var(--surface);border:1px solid var(--border);transition:.2s transform,.2s box-shadow,.2s border-color}
.game-card:hover{transform:translateY(-4px);border-color:var(--border-2);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.game-cover{height:150px;position:relative;display:grid;place-items:center;overflow:hidden}
.game-cover::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.25),transparent 55%);mix-blend-mode:overlay}
.game-cover-blur{position:absolute;inset:-22%;width:144%;height:144%;object-fit:cover;display:block;
  filter:blur(26px) saturate(1.45) brightness(.82);opacity:.9;transform:scale(1.08);transition:.3s transform}
.game-cover::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,15,24,.08),rgba(10,15,24,.42));pointer-events:none}
.game-cover-img{position:relative;z-index:2;width:96px;height:96px;object-fit:cover;border-radius:24px;display:block;
  box-shadow:0 0 0 7px rgba(12,16,26,.30),0 0 26px 14px rgba(8,11,18,.38),0 14px 32px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.14);transition:.25s transform}
.game-card:hover .game-cover-img{transform:scale(1.07)}
/* подложка под иконку и для эмодзи/вектора (чтобы иконка не терялась на фоне) */
.game-cover .emoji{filter:drop-shadow(0 6px 14px rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(8,11,18,.5))}
.game-card:hover .game-cover-blur{transform:scale(1.16)}
.game-tag,.game-fav{z-index:3}
/* свой фон карточки (загружается в админке) — прячем размытую иконку, фоном служит картинка */
.game-cover.has-cover-bg .game-cover-blur{display:none}
.game-cover.has-cover-bg::before{background:linear-gradient(180deg,rgba(10,15,24,.12),rgba(10,15,24,.5))}
.game-cover .emoji{font-size:64px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.4));transition:.25s transform}
.game-card:hover .game-cover .emoji{transform:scale(1.12) rotate(-4deg)}
.game-tag{position:absolute;top:12px;left:12px;z-index:2}
.game-fav{position:absolute;top:10px;right:10px;z-index:2;width:32px;height:32px;border-radius:9px;
  background:rgba(0,0,0,.32);display:grid;place-items:center;font-size:15px;backdrop-filter:blur(4px)}
.game-body{padding:14px 16px 16px}
.game-body h3{margin:0 0 3px;font-size:16.5px;font-weight:800}
.game-body .sub{font-size:12.5px;color:var(--text-muted);margin-bottom:9px;min-height:17px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.game-rating{display:flex;align-items:center;gap:6px;margin-bottom:11px;font-size:12.5px}
.game-rating .gr-stars{display:inline-flex;gap:1px;font-size:12px;line-height:1}
.game-rating .grs{color:#3a4356}
.game-rating .grs.on{color:#fbbf24}
.game-rating b{font-weight:800;font-size:13px;color:var(--text)}
.game-rating .gr-count{color:var(--text-muted)}
.game-meta{display:flex;align-items:center;justify-content:space-between}
.price-from{font-size:12px;color:var(--text-muted)}
.price-from b{display:block;font-size:17px;color:var(--text);font-weight:800}
.game-body .count{font-size:12px;color:var(--text-muted);background:var(--surface-2);padding:5px 10px;border-radius:8px}

/* ===================== product / discount cards (hot) ===================== */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.prod-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;
  display:flex;flex-direction:column;gap:10px;transition:.18s;cursor:pointer}
.prod-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.prod-top{display:flex;align-items:center;gap:11px}
.prod-ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:24px;flex-shrink:0}
.prod-card .pname{font-weight:800;font-size:15px;line-height:1.25}
.prod-card .pgame{font-size:12px;color:var(--text-muted)}
.price-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:auto}
.price-now{font-size:21px;font-weight:900}
.price-row .discount{align-self:center}

/* ===================== featured / Хиты продаж ===================== */
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.feat-grid-full{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.feat-card{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:9px 11px;transition:.16s transform,.16s border-color}
.feat-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.feat-card:hover .feat-go{background:var(--grad);color:#04222a}
.feat-img{flex-shrink:0;line-height:0}
.feat-img svg,.feat-img img{border-radius:11px;display:block}
.feat-body{flex:1;min-width:0}
.feat-name{font-weight:800;font-size:13.5px;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feat-game{font-size:11.5px;color:var(--text-muted);margin:1px 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feat-price{display:flex;align-items:center;gap:6px;white-space:nowrap}
.feat-price .now{font-size:15px;font-weight:900}
.feat-price .discount{font-size:10.5px;padding:2px 6px}
.feat-go{flex-shrink:0;width:30px;height:30px;border-radius:9px;background:var(--surface-2);color:var(--text-muted);display:grid;place-items:center;transition:.16s}

/* ===================== game page ===================== */
.gp-hero{position:relative;border-radius:var(--radius-lg);overflow:hidden;padding:34px;margin:22px 0 26px;
  display:flex;align-items:center;gap:26px;border:1px solid var(--border)}
.gp-hero .cover{width:108px;height:108px;border-radius:22px;display:grid;place-items:center;font-size:60px;flex-shrink:0;
  box-shadow:0 12px 30px rgba(0,0,0,.4)}
.gp-hero h1{margin:0 0 6px;font-size:32px;font-weight:900;letter-spacing:-.6px}
.gp-hero .sub{color:#cfe3ea;font-size:15.5px;margin-bottom:14px}
.gp-badges{display:flex;gap:9px;flex-wrap:wrap}
.gp-layout{display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:start}
.cat-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.cat-tab{padding:9px 16px;border-radius:11px;background:var(--surface);border:1px solid var(--border-2);font-weight:700;font-size:14px;color:var(--text-muted)}
.cat-tab.active{background:var(--surface-3);color:var(--text);border-color:var(--accent)}
.denoms{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.denom{position:relative;background:var(--surface);border:1.5px solid var(--border);border-radius:14px;padding:12px 14px;
  cursor:pointer;transition:.15s;display:flex;flex-direction:row;align-items:center;gap:14px}
.denom:hover{border-color:var(--border-2);transform:translateY(-2px)}
.denom.selected{border-color:var(--accent);background:linear-gradient(180deg,rgba(34,211,238,.10),rgba(34,211,238,.02));box-shadow:0 0 0 3px rgba(34,211,238,.14)}
.denom-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.denom .dn{font-weight:800;font-size:15px;line-height:1.2}
.denom .dprice{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.denom .dprice .now{font-size:18px;font-weight:900}
.denom .auto{position:absolute;top:10px;right:10px}
.denom .check{position:absolute;top:8px;left:8px;width:22px;height:22px;border-radius:50%;background:var(--grad);
  display:none;place-items:center;color:#04222a;font-size:13px;font-weight:900;z-index:2}
.denom.selected .check{display:grid}
.denom.selected .auto{display:none}
/* кнопка «в корзину» на плитке товара (в стиле маркетплейсов) */
.denom-cart{flex:none;width:44px;height:44px;border-radius:13px;background:var(--grad);color:#04222a;
  display:grid;place-items:center;position:relative;cursor:pointer;border:none;
  box-shadow:0 6px 16px rgba(34,211,238,.34);transition:.15s transform,.15s box-shadow}
.denom-cart:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 10px 24px rgba(34,211,238,.5)}
.denom-cart:active{transform:scale(.94)}
.denom-cart svg{width:21px;height:21px;stroke:#04222a;stroke-width:2}
.denom-cart .dc-plus{position:absolute;top:-6px;right:-6px;width:19px;height:19px;border-radius:50%;
  background:#062028;color:#5ef0c6;font-size:13px;font-weight:900;line-height:1;display:grid;place-items:center;
  border:2px solid var(--surface)}
.denom.selected .denom-cart{background:#062028;color:#5ef0c6}
.denom.selected .denom-cart svg{stroke:#5ef0c6}
.denom.selected .denom-cart .dc-plus{background:var(--grad);color:#04222a;border-color:var(--surface)}

/* Super Sale Store — вкладка-магазин, баннер, под-вкладки, бонусы */
.cat-tab.store-tab{background:linear-gradient(120deg,rgba(255,138,42,.16),rgba(255,72,110,.14));border-color:rgba(255,120,60,.55);color:#ffcaa0}
.cat-tab.store-tab.active{background:linear-gradient(120deg,rgba(255,138,42,.30),rgba(255,72,110,.26));border-color:#ff8a2a;color:#fff}
.store-banner{display:flex;align-items:flex-start;gap:13px;margin-bottom:16px;padding:14px 16px;border-radius:14px;
  background:linear-gradient(120deg,rgba(255,138,42,.14),rgba(255,72,110,.10));border:1px solid rgba(255,120,60,.42)}
.store-banner .sb-ic{font-size:24px;line-height:1;margin-top:1px;filter:drop-shadow(0 2px 6px rgba(255,120,40,.5))}
.store-banner .sb-txt{display:flex;flex-direction:column;gap:4px}
.store-banner .sb-txt b{font-size:15px;font-weight:900;color:#ffd9bd}
.store-banner .sb-txt .sb-line{font-size:12.5px;line-height:1.45;color:var(--text-muted)}
.store-banner .sb-txt .sb-warn{color:#ffb27a;font-weight:600}
.subcat-tabs{margin-bottom:16px}
.subcat-tab.active{border-color:#ff8a2a;background:rgba(255,138,42,.14);color:#fff}
.denom-bonus{position:absolute;top:8px;right:8px;z-index:2;padding:3px 8px;border-radius:9px;font-size:11px;font-weight:800;
  background:linear-gradient(120deg,#ff8a2a,#ff486e);color:#fff;box-shadow:0 3px 10px rgba(255,90,60,.4)}
.denom.has-bonus{border-color:rgba(255,120,60,.4)}
.denom.has-bonus.selected{border-color:var(--accent)}
.dn-bonus{font-size:12px;font-weight:700;color:#ffb27a;line-height:1.25}
.bb-bonus{display:flex;align-items:flex-start;gap:10px;margin-top:12px;padding:11px 13px;border-radius:12px;
  background:linear-gradient(120deg,rgba(255,138,42,.14),rgba(255,72,110,.10));border:1px solid rgba(255,120,60,.4)}
.bb-bonus-ic{font-size:20px;line-height:1}
.bb-bonus div{display:flex;flex-direction:column;gap:2px}
.bb-bonus b{font-size:13px;font-weight:900;color:#ffd9bd}
.bb-bonus div span{font-size:12.5px;color:var(--text-muted)}

/* buy box */
.buybox{position:sticky;top:88px;background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius);padding:20px}
.buybox h3{margin:0 0 14px;font-size:17px;font-weight:800}
.bb-selected{background:var(--surface-2);border-radius:12px;padding:12px 14px;margin-bottom:14px;font-size:14px}
.bb-selected .row{display:flex;justify-content:space-between;align-items:center}
.bb-selected .big{font-size:22px;font-weight:900}
.bb-prod{display:flex;align-items:center;gap:14px;margin-top:12px}
.bb-prod-img{flex-shrink:0;line-height:0}
.bb-prod-img img,.bb-prod-img svg{border-radius:16px}
.bb-prod-info{min-width:0}
.bb-prod-info b{display:block;font-size:15.5px;margin-bottom:5px;line-height:1.2}
.bb-prod-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.field .hint{font-size:11.5px;color:var(--text-muted);margin-top:5px}
.input{width:100%;height:46px;border-radius:12px;background:var(--bg-2);border:1px solid var(--border-2);
  color:var(--text);padding:0 14px;font-size:15px;outline:none;transition:.15s}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(34,211,238,.15)}
textarea.input{height:auto;padding:12px 14px;resize:vertical}
.qty{display:flex;align-items:center;gap:0;border:1px solid var(--border-2);border-radius:12px;overflow:hidden;width:fit-content}
.qty button{width:42px;height:42px;font-size:20px;background:var(--surface-2)}
.qty button:hover{background:var(--surface-3);color:var(--accent)}
.qty span{width:48px;text-align:center;font-weight:800}
.bb-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.secure-note{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);margin-top:12px;justify-content:center}

/* reviews */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.review{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.review .stars{color:#FBBF24;font-size:14px;margin-bottom:8px}
.review p{margin:0 0 12px;font-size:14px;color:#cdd7e6}
.review .who{display:flex;align-items:center;gap:10px}
.review .av{width:34px;height:34px;border-radius:50%;background:var(--grad);display:grid;place-items:center;color:#04222a;font-weight:900}
.review .who b{font-size:13.5px}.review .who span{font-size:11.5px;color:var(--text-muted)}

/* ===================== cart / checkout ===================== */
.page-title{font-size:28px;font-weight:900;margin:22px 0 18px;letter-spacing:-.5px;display:flex;align-items:center;gap:11px}
.cart-layout{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.cart-item{display:flex;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:14px 16px;margin-bottom:12px}
.cart-item .ic{width:50px;height:50px;border-radius:12px;display:grid;place-items:center;font-size:26px;flex-shrink:0}
.cart-item .grow{flex:1;min-width:0}
.cart-item .pname{font-weight:800;font-size:15px}
.cart-item .pacc{font-size:12px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ci-controls{display:flex;align-items:center;gap:14px;flex-shrink:0}
.ci-price{text-align:right;min-width:84px}
.ci-del{width:38px;height:38px;flex-shrink:0}
.summary{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius);padding:20px;position:sticky;top:88px}
.summary h3{margin:0 0 16px;font-size:18px;font-weight:900}
.sum-row{display:flex;justify-content:space-between;margin-bottom:11px;font-size:14.5px;color:var(--text-muted)}
.sum-row.save{color:var(--success);font-weight:700}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--border);
  margin-top:14px;padding-top:14px;font-weight:900}
.sum-total .big{font-size:26px}
.pay-methods{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.pay-opt{border:1.5px solid var(--border-2);border-radius:12px;padding:13px;text-align:center;font-weight:700;font-size:13.5px;cursor:pointer;transition:.15s}
.pay-opt:hover{border-color:var(--border-2)}
.pay-opt.selected{border-color:var(--accent);background:rgba(34,211,238,.08)}
.pay-opt .pm-ic{font-size:22px;display:block;margin-bottom:4px}
.empty{text-align:center;padding:70px 20px;color:var(--text-muted)}
.empty .e-ic{font-size:64px;margin-bottom:14px}

/* order success */
.order-ok{max-width:620px;margin:40px auto;background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius-lg);padding:38px;text-align:center}
.order-ok .check-big{width:84px;height:84px;border-radius:50%;background:var(--grad);display:grid;place-items:center;font-size:42px;margin:0 auto 18px;color:#04222a;box-shadow:0 10px 30px rgba(34,211,238,.4)}
.order-ok h1{font-size:26px;margin:0 0 8px}
.order-id{display:inline-block;background:var(--surface-2);border:1px dashed var(--border-2);border-radius:10px;padding:8px 16px;font-weight:900;font-size:18px;letter-spacing:1px;margin:10px 0}
.order-items{text-align:left;margin:22px 0;border-top:1px solid var(--border);padding-top:18px}

/* ===================== footer ===================== */
.footer{margin-top:60px;border-top:1px solid var(--border);background:var(--bg-2);padding:42px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;margin-bottom:30px}
.footer h4{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin:0 0 14px}
.footer a{display:block;color:#b6c2d4;font-size:14px;margin-bottom:9px;transition:.15s}
.footer a:hover{color:var(--accent)}
.footer .pays{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.pay-badge{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:6px 11px;font-size:12px;font-weight:700;color:var(--text-muted)}
.footer-bottom{border-top:1px solid var(--border);padding-top:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;font-size:13px;color:var(--text-muted)}
.seller-link{color:var(--text-dim);font-size:12.5px}
.seller-link:hover{color:var(--accent)}

/* ===================== toast ===================== */
.toast-wrap{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:10px;align-items:center}
.toast{background:var(--surface-3);border:1px solid var(--border-2);border-radius:12px;padding:13px 20px;font-weight:700;font-size:14px;
  box-shadow:var(--shadow);animation:tin .25s ease;display:flex;align-items:center;gap:10px}
.toast.ok{border-color:rgba(52,211,153,.4)}
.toast.err{border-color:rgba(255,59,92,.4)}
@keyframes tin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* skeleton / loader */
.loader{display:grid;place-items:center;padding:80px;color:var(--text-muted)}
.spin{width:34px;height:34px;border:3px solid var(--surface-3);border-top-color:var(--accent);border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* ===================== install (PWA) ===================== */
.install-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  background:var(--grad-soft);border:1px solid rgba(34,211,238,.25);border-radius:16px;padding:18px 22px;margin-bottom:24px}
.install-cta-text b{display:block;font-size:16px}
.install-cta-text span{font-size:13px;color:var(--text-muted)}
.im-overlay{position:fixed;inset:0;z-index:300;background:rgba(4,8,14,.72);backdrop-filter:blur(6px);
  display:flex;align-items:flex-end;justify-content:center;padding:14px;animation:imf .2s ease}
@keyframes imf{from{opacity:0}to{opacity:1}}
.im-card{width:100%;max-width:440px;background:var(--surface);border:1px solid var(--border-2);
  border-radius:22px;padding:20px;margin-bottom:6px;box-shadow:var(--shadow);animation:imup .25s ease}
@keyframes imup{from{transform:translateY(24px);opacity:.5}to{transform:none;opacity:1}}
.im-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.im-head b{font-size:18px;font-weight:900}
.im-x{width:30px;height:30px;border-radius:9px;background:var(--surface-2);font-size:14px;color:var(--text-muted)}
.im-x:hover{background:var(--surface-3);color:var(--text)}
.im-app{display:flex;align-items:center;gap:14px;background:var(--surface-2);border-radius:16px;padding:12px 14px;margin-bottom:18px}
.im-ic{width:54px;height:54px;border-radius:14px;flex-shrink:0}
.im-app b{display:block;font-size:16px}
.im-app span{font-size:13px;color:var(--text-muted)}
.im-steps{display:flex;flex-direction:column;gap:13px}
.im-step{display:flex;gap:12px;align-items:flex-start}
.im-n{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--grad);color:#04222a;font-weight:900;font-size:14px;display:grid;place-items:center}
.im-st b{display:block;font-size:14.5px;font-weight:700}
.im-st span{font-size:13px;color:var(--text-muted)}
.im-note{margin-top:16px;font-size:12.5px;color:var(--text-muted);background:var(--surface-2);padding:10px 12px;border-radius:10px}

/* ===================== game info / FAQ ===================== */
.gp-info{margin-top:30px}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.info-col{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px}
.info-h{font-size:16px;font-weight:800;margin:0 0 10px;display:flex;align-items:center;gap:8px}
.info-col .info-h + .info-h,.how-list + .info-h,.info-desc + .info-h{margin-top:20px}
.info-desc{font-size:14px;color:#cdd7e6;line-height:1.6;margin:0}
.how-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.how-list li{font-size:14px;color:#cdd7e6;line-height:1.45;padding-left:4px}
.how-list li::marker{color:var(--accent);font-weight:800}
.guar-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.faq{display:flex;flex-direction:column;gap:8px}
.faq-item{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:0 14px}
.faq-item summary{cursor:pointer;font-weight:700;font-size:14px;padding:13px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";color:var(--accent);font-size:19px;font-weight:800;line-height:1}
.faq-item[open] summary::after{content:"–"}
.faq-item p{margin:0 0 14px;font-size:13.5px;color:var(--text-muted);line-height:1.55}
.disclaimer{margin:18px auto 0;font-size:12px;color:var(--text-dim);line-height:1.5;text-align:center;max-width:780px}

/* ===================== content pages ===================== */
.page-doc{max-width:760px;margin:0 auto;padding:6px 0 44px;line-height:1.65}
.page-doc .back-link{display:inline-block;color:var(--text-muted);font-size:13.5px;margin-bottom:12px;text-decoration:none}
.page-doc .back-link:hover{color:var(--accent)}
.page-doc h1.page-title{margin-bottom:14px}
.page-doc h3{font-size:16.5px;font-weight:800;color:var(--text);margin:22px 0 8px}
.page-doc p{color:#c4cbd6;margin:0 0 12px;font-size:14.5px}
.page-doc ul,.page-doc ol{margin:0 0 14px;padding-left:22px;color:#c4cbd6;font-size:14.5px}
.page-doc li{margin-bottom:7px}
.page-doc li b,.page-doc p b{color:var(--text)}
.page-doc a{color:var(--accent);text-decoration:none}
.page-doc a:hover{text-decoration:underline}
.page-doc .doc-note{background:rgba(251,191,36,.09);border:1px solid rgba(251,191,36,.28);color:#e7c15f;border-radius:12px;padding:11px 14px;font-size:13px;margin:0 0 18px}
.page-doc .contact-row{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 4px}

/* ===================== промо-карусель (анимированная) ===================== */
.promo-carousel{margin-top:22px;border-radius:18px;overflow:hidden;position:relative}
.promo-track{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1)}
.promo-slide{position:relative;overflow:hidden;flex:0 0 100%;min-width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:26px 34px;text-decoration:none;color:#fff;min-height:190px;
  background:radial-gradient(130% 150% at 82% 50%, rgba(255,255,255,.22), rgba(255,255,255,0) 46%), linear-gradient(120deg,var(--c1),var(--c2))}
.promo-txt{position:relative;z-index:3;display:flex;flex-direction:column;gap:6px;max-width:58%}
.promo-badge{align-self:flex-start;background:rgba(0,0,0,.30);color:#fff;font-size:12px;font-weight:800;padding:5px 11px;border-radius:999px}
.promo-slide h3{margin:2px 0 0;font-size:26px;font-weight:900;letter-spacing:-.5px;line-height:1.05;text-shadow:0 2px 10px rgba(0,0,0,.20)}
.promo-game{font-size:14px;opacity:.9;font-weight:600}
.promo-price{display:flex;align-items:baseline;gap:10px;margin-top:4px}
.promo-price .now{font-size:23px;font-weight:900}
.promo-price .oldprice{opacity:.75;text-decoration:line-through;font-size:14px}
.promo-cta{align-self:flex-start;margin-top:10px;background:#fff;color:#0a0d14;font-weight:800;font-size:14px;padding:9px 17px;border-radius:11px;box-shadow:0 6px 16px rgba(0,0,0,.18);transition:.15s}
.promo-slide:hover .promo-cta{transform:translateY(-2px)}
/* декоративные слои */
.promo-deco{position:absolute;inset:0;z-index:1;pointer-events:none}
.promo-deco i{position:absolute;display:block}
.pd-shape{background:rgba(255,255,255,.10)}
.pd-shape.s1{width:72px;height:72px;border-radius:22px;left:40%;top:-20px;animation:pdFloatA 7s ease-in-out infinite}
.pd-shape.s2{width:46px;height:46px;border-radius:13px;left:53%;bottom:-16px;animation:pdFloatB 9s ease-in-out infinite}
.pd-shape.s3{width:130px;height:130px;border-radius:50%;left:66%;top:14%;background:rgba(255,255,255,.06);animation:pdFloatA 12s ease-in-out infinite}
.pd-shape.s4{width:30px;height:30px;border-radius:9px;left:31%;bottom:20%;animation:pdFloatB 6s ease-in-out infinite}
.pd-spark{width:18px;height:18px;background:#fff;opacity:.85;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);animation:twinkle 3.2s ease-in-out infinite}
.pd-spark.k1{left:19%;top:22%}
.pd-spark.k2{left:47%;top:64%;animation-delay:1.1s}
.pd-spark.k3{left:72%;top:16%;width:13px;height:13px;animation-delay:.5s}
.pd-spark.k4{left:33%;top:74%;width:12px;height:12px;animation-delay:1.7s}
.pd-shape.s5{width:26px;height:26px;left:24%;top:26%;background:rgba(255,255,255,.13);transform:rotate(45deg);animation:pdFloatB 8s ease-in-out infinite}
.pd-shape.s6{width:96px;height:96px;border-radius:50%;left:11%;bottom:-34px;background:rgba(255,255,255,.06);filter:blur(3px);animation:pdFloatA 15s ease-in-out infinite}
.pd-glow{width:230px;height:230px;border-radius:50%;left:6%;top:-46%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 62%);filter:blur(6px);animation:pdFloatA 14s ease-in-out infinite}
.promo-slide::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.07) 1.4px,transparent 1.6px);background-size:24px 24px;opacity:.55}
.promo-art-wrap::after{content:"";position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:150px;height:24px;z-index:1;background:radial-gradient(ellipse,rgba(0,0,0,.30),transparent 70%);filter:blur(2px)}
/* оригинальный «рассветный» пейзаж-фон (нарисован с нуля) */
.promo-scene{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.promo-scene::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(to top,rgba(255,255,255,.15),transparent)}
.ps-sun{position:absolute;left:50%;bottom:-60px;transform:translateX(-50%);width:210px;height:210px;border-radius:50%;background:radial-gradient(circle at 50% 46%,#fff 0%,rgba(255,255,255,.9) 32%,rgba(255,255,255,.32) 54%,transparent 72%);animation:sunPulse 6s ease-in-out infinite}
.ps-cloud{position:absolute;height:26px;width:120px;background:rgba(255,255,255,.16);border-radius:30px;filter:blur(1px)}
.ps-cloud::before,.ps-cloud::after{content:"";position:absolute;background:inherit;border-radius:50%}
.ps-cloud::before{width:44px;height:44px;left:16px;top:-20px}
.ps-cloud::after{width:32px;height:32px;right:18px;top:-12px}
.ps-cloud.c1{top:24%;animation:drift 30s linear infinite}
.ps-cloud.c2{top:42%;width:92px;opacity:.6;animation:drift 40s linear infinite;animation-delay:-12s}
.ps-cloud.c3{top:15%;width:74px;opacity:.45;filter:blur(2px);animation:drift 52s linear infinite;animation-delay:-28s}
@keyframes drift{from{left:-22%}to{left:120%}}
@keyframes sunPulse{0%,100%{opacity:.92}50%{opacity:1;filter:brightness(1.1)}}
/* анимированный пин-маскот (видео с прозрачностью) */
.promo-pin{position:absolute;right:270px;bottom:12px;width:98px;height:98px;object-fit:contain;z-index:6;pointer-events:none;filter:drop-shadow(0 9px 16px rgba(0,0,0,.40));animation:promoFloat 4.5s ease-in-out infinite}
@media(max-width:960px){.promo-pin{display:none}}
/* товар с сиянием */
.promo-art-wrap{position:relative;z-index:2;flex-shrink:0;width:210px;height:180px;display:grid;place-items:center}
.promo-burst{position:absolute;left:50%;top:50%;width:300px;height:300px;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-conic-gradient(from 0deg, rgba(255,255,255,.16) 0deg 7deg, transparent 7deg 20deg);
  -webkit-mask:radial-gradient(circle,#000 34%,transparent 68%);mask:radial-gradient(circle,#000 34%,transparent 68%);
  animation:spinSlow 22s linear infinite}
.promo-art{position:relative;z-index:2;width:150px;height:150px;display:grid;place-items:center;filter:drop-shadow(0 12px 22px rgba(0,0,0,.32));animation:promoFloat 4.5s ease-in-out infinite}
.promo-art img,.promo-art svg{width:100%;height:100%;object-fit:contain}
.promo-art img{border-radius:16px}
.promo-dots{position:absolute;bottom:12px;left:0;right:0;z-index:4;display:flex;gap:7px;justify-content:center}
.promo-dots .pd{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.45);cursor:pointer;transition:.2s}
.promo-dots .pd.on{background:#fff;width:22px;border-radius:5px}
@keyframes promoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes spinSlow{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes pdFloatA{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(14px,-16px) rotate(22deg)}}
@keyframes pdFloatB{0%,100%{transform:translate(0,0) rotate(45deg)}50%{transform:translate(-16px,12px) rotate(20deg)}}
@keyframes twinkle{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}}
@media (prefers-reduced-motion:reduce){.promo-art,.promo-burst,.pd-shape,.pd-spark,.pd-glow,.ps-cloud,.ps-sun,.promo-pin{animation:none!important}}
/* ===================== живая лента ===================== */
.live-strip{display:flex;align-items:center;gap:10px;margin-top:14px;padding:9px 14px;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.live-dot{width:9px;height:9px;border-radius:50%;background:#34D399;animation:pulse 1.8s infinite;flex-shrink:0}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.live-track{display:flex;gap:26px;white-space:nowrap;animation:marquee 34s linear infinite}
.live-strip:hover .live-track{animation-play-state:paused}
.lt-chip{font-size:13px;color:var(--text-muted);font-weight:600}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
/* ===================== заявка «нет игры» ===================== */
.req-box{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px 22px}
.req-txt b{display:block;font-size:16px}
.req-txt span{font-size:13.5px;color:var(--text-muted)}
/* ===================== избранное ===================== */
.game-fav{position:absolute;top:10px;right:10px;z-index:2;width:32px;height:32px;border:none;border-radius:50%;background:rgba(4,8,14,.5);color:#fff;font-size:17px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.15s}
.game-fav:hover{background:rgba(4,8,14,.78);transform:scale(1.1)}
.game-fav.on{color:#ff5c7a}
/* ===================== форма отзыва ===================== */
.rev-form{margin-top:18px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px}
.rev-form>b{display:block;margin-bottom:10px;font-size:15px}
.rev-stars{display:flex;gap:4px;margin-bottom:10px;font-size:26px;cursor:pointer;width:max-content}
.rev-stars .rs{color:#39435a;transition:.1s}
.rev-stars .rs.on{color:#fbbf24}
.rev-form .input{width:100%;margin-bottom:10px;background:var(--bg-2);border:1px solid var(--border-2);border-radius:11px;color:var(--text);padding:11px 13px;font-size:14px;font-family:inherit;outline:none}
.rev-form .input:focus{border-color:var(--accent)}
.rev-form textarea.input{resize:vertical}
/* промокод */
.promo-row{display:flex;gap:8px}
.promo-row .input{flex:1}
/* ===================== соцсети + плавающая TG ===================== */
.socials{display:flex;gap:8px;margin-top:14px}
.soc{width:34px;height:34px;border-radius:9px;background:var(--surface-2,#141a26);border:1px solid var(--border);display:grid;place-items:center;font-size:14px;font-weight:800;color:var(--text-muted);text-decoration:none;transition:.15s}
.soc:hover{border-color:var(--accent);color:var(--accent)}
.fab-tg{position:fixed;right:20px;bottom:20px;z-index:60;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#2AABEE,#229ED9);color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px rgba(34,158,217,.45);transition:.18s}
.fab-tg:hover{transform:scale(1.08) translateY(-2px)}
/* ===================== профиль + авторизация ===================== */
.profile-btn{display:flex;align-items:center;gap:8px;width:auto;padding:0 14px}
.profile-btn .pf-label{font-size:13.5px;font-weight:700}
.profile-btn.authed{padding:0 12px 0 6px}
.profile-btn .pf-av{width:30px;height:30px;border-radius:50%;background:var(--grad);color:#04222a;display:grid;place-items:center;font-weight:900;font-size:14px;flex-shrink:0}
.profile-btn .pf-name{font-size:13.5px;font-weight:700;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-overlay{position:fixed;inset:0;z-index:120;background:rgba(4,8,14,.72);backdrop-filter:blur(6px);display:grid;place-items:center;padding:18px;animation:aFade .18s ease}
.auth-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--border-2);border-radius:20px;padding:26px 24px;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.5);animation:aPop .22s cubic-bezier(.2,.9,.3,1.2)}
.auth-x{position:absolute;top:14px;right:14px;width:32px;height:32px;border:none;border-radius:9px;background:var(--surface-2,#141a26);color:var(--text-muted);font-size:15px;cursor:pointer}
.auth-x:hover{color:var(--text)}
.auth-brand{display:flex;align-items:center;gap:10px;justify-content:center;font-size:21px;font-weight:900}
.auth-brand .logo{width:34px;height:34px;border-radius:9px;overflow:hidden;display:block}
.auth-brand .logo img{width:100%;height:100%;object-fit:cover}
.auth-sub{text-align:center;color:var(--text-muted);font-size:13px;margin:6px 0 16px}
.auth-tabs{display:flex;gap:6px;background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:4px;margin-bottom:16px}
.auth-tab{flex:1;border:none;background:none;color:var(--text-muted);font-weight:800;font-size:14px;padding:9px;border-radius:9px;cursor:pointer;transition:.15s}
.auth-tab.on{background:var(--grad);color:#04222a}
.afield{margin-bottom:12px}
.afield label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;color:var(--text-muted)}
.auth-card .input{width:100%;background:var(--bg-2);border:1px solid var(--border-2);border-radius:11px;color:var(--text);padding:12px 13px;font-size:14.5px;outline:none;font-family:inherit}
.auth-card .input:focus{border-color:var(--accent)}
.auth-or{display:flex;align-items:center;gap:12px;margin:18px 0 14px;color:var(--text-dim);font-size:12.5px}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--border)}
.auth-provs{display:flex;flex-direction:column;gap:9px}
.prov{display:flex;align-items:center;justify-content:center;gap:10px;padding:11px;border-radius:12px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font-weight:700;font-size:14px;cursor:pointer;transition:.15s}
.prov:hover{transform:translateY(-1px);border-color:var(--accent)}
.prov-ic{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font-weight:900;font-size:13px;color:#fff}
.prov.vk .prov-ic{background:#07F}
.prov.gg .prov-ic{background:#fff;color:#4285F4}
.prov.tg .prov-ic{background:#2AABEE}
.auth-agree{text-align:center;color:var(--text-dim);font-size:11.5px;line-height:1.5;margin:16px 0 0}
.auth-agree a{color:var(--text-muted)}
@keyframes aFade{from{opacity:0}to{opacity:1}}
@keyframes aPop{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
/* личный кабинет */
.cab{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start;margin-bottom:40px}
.cab-side{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;position:sticky;top:88px}
.cab-user{display:flex;align-items:center;gap:12px}
.cab-av{width:52px;height:52px;border-radius:50%;background:var(--grad);color:#04222a;display:grid;place-items:center;font-weight:900;font-size:22px;flex-shrink:0}
.cab-uinfo b{display:block;font-size:16px}
.cab-uinfo span{font-size:12.5px;color:var(--text-muted);word-break:break-all}
.cab-meta{margin-top:14px;font-size:12px;color:var(--text-dim);line-height:1.5}
.cab-orders{display:flex;flex-direction:column;gap:10px}
.cab-order{display:grid;grid-template-columns:160px 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:14px 16px;text-decoration:none;color:var(--text);transition:.15s}
.cab-order:hover{border-color:var(--accent)}
.co-l b{display:block;font-size:14px}
.co-l span{font-size:11.5px;color:var(--text-muted)}
.co-items{font-size:13px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.co-r{display:flex;align-items:center;gap:12px;white-space:nowrap}
@media(max-width:820px){.cab{grid-template-columns:1fr}.cab-side{position:static}.cab-order{grid-template-columns:1fr auto}.co-items{display:none}}
@media(max-width:560px){.profile-btn .pf-label,.profile-btn .pf-name{display:none}.profile-btn{padding:0;width:44px;justify-content:center}.profile-btn.authed{padding:0}}
/* страница отзывов (игра + купленный товар) */
.rv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:14px}
.rv-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.rv-top{display:flex;align-items:center;gap:11px}
.rv-av{width:40px;height:40px;border-radius:50%;background:var(--grad);color:#04222a;display:grid;place-items:center;font-weight:900;font-size:17px;flex-shrink:0}
.rv-who{flex:1;min-width:0}
.rv-who b{display:block;font-size:14.5px}
.rv-verif{font-size:11.5px;color:#5ee7a8;font-weight:600}
.rv-date{font-size:11.5px;color:var(--text-dim);white-space:nowrap}
.rv-stars{color:#fbbf24;font-size:16px;letter-spacing:2px;line-height:1}
.rv-stars .rv-empty{color:#39435a}
.rv-text{margin:0;font-size:14px;line-height:1.55;color:#c4cbd6}
.rv-item{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;background:var(--bg-2);border:1px solid var(--border);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--text-muted);text-decoration:none;transition:.15s}
.rv-item:hover{border-color:var(--accent);color:var(--accent)}
.rv-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}
.rv-check{text-align:center;margin:22px 0 42px;color:var(--text-muted);font-size:13.5px}
.rv-check a{color:var(--accent);text-decoration:none;font-weight:700}
.how-guide li{color:var(--text-muted)}
.guide-img{width:100%;height:auto;border-radius:14px;margin-top:6px;display:block;border:1px solid var(--border)}
.guide-sub{font-size:14.5px;font-weight:800;margin:2px 0 10px;color:var(--text);line-height:1.4}
/* фирменные фоны шапок игр (оригинальные, без лого игр) */
.gp-hero{position:relative;overflow:hidden}
.gp-hero>*{position:relative;z-index:1}
.gp-hero .hero-fx{position:absolute;inset:0;z-index:0;pointer-events:none}
.gp-hero .hero-fx svg{width:100%;height:100%;display:block}
.gp-hero.hero-brawl{background:linear-gradient(115deg,#0a1730 0%,#0b1c38 52%,#10305f 100%)!important;border:1px solid rgba(60,150,255,.22)}
.gp-hero.hero-coc{background:linear-gradient(115deg,#0e1508 0%,#141c0a 50%,#2a380f 100%)!important;border:1px solid rgba(150,170,50,.2)}
.gp-hero.hero-hayday{background:linear-gradient(115deg,#08170f 0%,#0c2018 48%,#1e3a1a 100%)!important;border:1px solid rgba(120,190,60,.2)}
.gp-hero.hero-cr{background:linear-gradient(115deg,#081428 0%,#0a1b36 52%,#0f2c58 100%)!important;border:1px solid rgba(60,140,255,.2)}
.gp-hero .hero-fx .hspk use{animation:heroTwinkle 3.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.gp-hero .hero-fx .hspk use:nth-child(2){animation-delay:.7s}
.gp-hero .hero-fx .hspk use:nth-child(3){animation-delay:1.4s}
.gp-hero .hero-fx .hspk use:nth-child(4){animation-delay:.4s}
.gp-hero .hero-fx .hspk use:nth-child(5){animation-delay:1.1s}
@keyframes heroTwinkle{0%,100%{opacity:.2;transform:scale(.72)}50%{opacity:.95;transform:scale(1)}}
@media(max-width:600px){.promo-slide{padding:20px;min-height:154px}.promo-slide h3{font-size:19px}.promo-art-wrap{width:118px;height:120px}.promo-art{width:92px;height:92px}.promo-burst{width:180px;height:180px}.promo-txt{max-width:54%}.promo-pin{width:50px;height:50px;right:6px;bottom:2px}.fab-tg{width:48px;height:48px;right:14px;bottom:14px}}

/* ===================== icons / art ===================== */
.game-cover svg, .prod-ic svg, .cart-item .ic svg, .denom-art svg{display:block}
.denom-art{flex-shrink:0;line-height:0}
.prod-ic{background:none;overflow:hidden}
.cart-item .ic{background:none}
.sr-item .prod-ic{overflow:hidden}

/* ===================== responsive ===================== */
@media(max-width:980px){
  .games-grid,.prod-grid{grid-template-columns:repeat(3,1fr)}
  .gp-layout,.cart-layout,.info-grid{grid-template-columns:1fr}
  .feat-grid:not(.feat-grid-full){grid-template-columns:repeat(2,1fr)}
  .buybox,.summary{position:static}
  .trust{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .reviews{grid-template-columns:1fr}
}
@media(max-width:640px){
  .header-row{height:60px;gap:10px}
  .brand span.txt{display:none}
  .hero-inner{padding:30px 22px}.hero h1{font-size:28px}
  .games-grid,.prod-grid{grid-template-columns:repeat(2,1fr)}
  .denoms,.feat-grid:not(.feat-grid-full){grid-template-columns:1fr}
  .trust{grid-template-columns:1fr}
  .section-head h2{font-size:20px}
}

/* ============ мобильная витрина игры: компактнее + шторка оформления ============ */
/* «Описание и как пополнить» внутри окна оформления */
.bb-how{margin-top:14px;border-top:1px solid var(--border);padding-top:2px}
.bb-how summary{cursor:pointer;font-weight:800;font-size:13.5px;color:var(--text-muted);padding:9px 0;list-style:none;display:flex;align-items:center;gap:8px}
.bb-how summary::-webkit-details-marker{display:none}
.bb-how summary::after{content:"⌄";margin-left:auto;font-size:15px;transition:.2s}
.bb-how[open] summary{color:var(--text)}
.bb-how[open] summary::after{transform:rotate(180deg)}
.bb-how-desc{font-size:13px;color:var(--text-muted);line-height:1.55;margin:2px 0 10px}
.bb-how-steps{margin:0 0 10px;padding-left:18px;font-size:13px;color:var(--text-muted);line-height:1.7}
.bb-how-guar{display:flex;gap:6px;flex-wrap:wrap}
.bb-how-guar .tag{font-size:11px;padding:5px 9px}

/* нижняя «пилюля-корзина» (быстрый путь к оплате) — только на телефоне */
.cart-pill{display:none}

/* элементы шторки скрыты на десктопе */
.sheet-head,.sheet-backdrop{display:none}

@media(max-width:980px){
  /* шапка игры компактнее */
  .gp-hero{padding:18px;gap:14px;margin:14px 0 16px;border-radius:16px}
  .gp-hero .cover{width:66px;height:66px;border-radius:15px;font-size:34px}
  .gp-hero h1{font-size:22px;margin-bottom:3px}
  .gp-hero .sub{font-size:12.5px;margin-bottom:9px}
  .gp-badges{gap:6px}
  .gp-badges .tag{font-size:11px;padding:5px 9px}
  /* категории — перенос в несколько строк, чтобы все были видны (в т.ч. Supercell Store) */
  .cat-tabs{gap:7px;margin-bottom:14px;flex-wrap:wrap;overflow:visible}
  .cat-tab{flex:0 1 auto;max-width:100%;padding:8px 13px;font-size:13px;white-space:normal;text-align:center}
  /* «Supercell Store» — на всю ширину строки, заметный акцент, всегда виден */
  .cat-tabs .cat-tab.store-tab{flex:1 1 100%;justify-content:center;font-weight:800}
  /* карточки товаров плотнее */
  .denoms{gap:9px}
  .denom{padding:10px 12px;border-radius:12px;gap:11px}
  .denom-art svg,.denom-art img{width:52px!important;height:52px!important}
  .denom .dn{font-size:13.5px}
  .denom .dprice .now{font-size:15.5px}
  .denom.selected{box-shadow:0 0 0 2px rgba(34,211,238,.18)}

  /* окно «Оформление» превращается в шторку снизу */
  #buyPane.buy-pane{position:fixed;left:0;right:0;bottom:0;z-index:130;
    background:var(--surface);border-top:1px solid var(--border-2);border-radius:20px 20px 0 0;
    max-height:90vh;overflow-y:auto;transform:translateY(106%);
    transition:transform .32s cubic-bezier(.25,.9,.3,1);box-shadow:0 -14px 44px rgba(0,0,0,.55);
    padding:0 0 calc(18px + env(safe-area-inset-bottom))}
  #buyPane.buy-pane.open{transform:translateY(0)}
  #buyPane .sheet-head{display:block;position:sticky;top:0;background:var(--surface);padding:10px 0 6px;z-index:2}
  #buyPane .sheet-grab{display:block;width:42px;height:5px;border-radius:3px;background:var(--border-2);margin:0 auto}
  #buyPane .sheet-close{display:grid;place-items:center;position:absolute;top:8px;right:14px;width:32px;height:32px;border-radius:9px;background:var(--surface-2,#141a26);color:var(--text-muted);font-size:14px}
  #buyPane .buybox{border:none;padding:2px 18px 8px;background:transparent;border-radius:0}
  .sheet-backdrop{display:block;position:fixed;inset:0;z-index:129;background:rgba(4,8,14,.62);opacity:0;pointer-events:none;transition:opacity .3s}
  .sheet-backdrop.open{opacity:1;pointer-events:auto}
  body.sheet-lock{overflow:hidden}

  /* пилюля-корзина */
  .cart-pill{display:flex;position:fixed;left:12px;right:12px;bottom:14px;z-index:70;
    align-items:center;justify-content:space-between;gap:12px;background:var(--grad);color:#04222a;
    font-weight:900;font-size:15px;padding:13px 18px;border-radius:15px;text-decoration:none;
    box-shadow:0 10px 30px rgba(34,211,238,.32);margin-bottom:env(safe-area-inset-bottom)}
  .cart-pill .cp-l{display:flex;align-items:center;gap:8px}
  body[data-route="cart"] .cart-pill,body[data-route="checkout"] .cart-pill,body[data-route="order"] .cart-pill,body.sheet-lock .cart-pill{display:none}
  /* TG-кнопку поднимаем, чтобы не налезала на пилюлю/контент */
  .fab-tg{bottom:80px}
  body.sheet-lock .fab-tg{display:none}
}

/* =====================================================================
   ПОЛНАЯ АДАПТАЦИЯ: телефон + планшет + ландшафт + оптимизация
   ===================================================================== */
/* 1) Никакого горизонтального «разделения экрана» — жёсткий предохранитель.
   overflow-x:clip не ломает sticky-шапку (в отличие от hidden) */
html,body{overflow-x:clip}
img,svg,video,canvas{max-width:100%}
.container{width:100%}
/* карусель и горизонтальные ленты сами клипаются своим контейнером */
.promo-carousel,.live-strip{max-width:100%}

/* 2) Оптимизация: тяжёлый фиксированный фон и лишние анимации — только на десктопе */
@media(max-width:1024px){
  body{background-attachment:scroll}
  .header{backdrop-filter:blur(8px)}
  /* декоративные бесконечные анимации гасим на тач-устройствах — меньше нагрузка, нет лагов */
  .promo-burst,.pd-shape,.pd-spark,.pd-glow,.ps-cloud,.ps-sun,.promo-pin,.hero-glow{animation:none!important}
  .promo-art{animation:none!important}
  .gp-hero .hero-fx .hspk use{animation:none!important}
}

/* 3) ПЛАНШЕТ (641–980) */
@media(max-width:980px) and (min-width:641px){
  .games-grid,.prod-grid{grid-template-columns:repeat(3,1fr)!important}
  .feat-grid:not(.feat-grid-full){grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:22px}
}

/* 4) ТЕЛЕФОН (≤640) — размеры под палец, без «несуразных» карточек */
@media(max-width:640px){
  .container{padding:0 14px}
  .page-title{font-size:23px;margin:16px 0 14px}
  /* каталог: 2 колонки ровных карточек */
  .games-grid,.prod-grid{grid-template-columns:repeat(2,1fr);gap:11px}
  .game-cover{height:118px}
  .game-cover-img{width:72px;height:72px;border-radius:18px}
  .game-cover .emoji{font-size:48px}
  .game-body{padding:11px 12px 13px}
  .game-body h3{font-size:15px}
  .prod-card{padding:13px}
  .price-now{font-size:19px}
  /* главный экран-баннер */
  .hero-inner{padding:22px 18px;max-width:100%}
  .hero h1{font-size:23px}
  .hero p{font-size:13px}
  .hero-cta .btn{flex:1 1 auto;justify-content:center}
  .hero-emojis{font-size:60px;right:12px}
  /* доверие/чипы */
  .chips{gap:8px}
  .chip{padding:8px 13px;font-size:13px}
  /* хиты/лента карточек — одной колонкой, читаемо */
  .feat-grid:not(.feat-grid-full){grid-template-columns:1fr}
  .feat-grid-full{grid-template-columns:1fr;gap:10px}
  /* КОРЗИНА: строка в 2 ряда — иконка+название сверху, управление снизу (убирает overflow) */
  .cart-item{flex-wrap:wrap;padding:12px 14px}
  .cart-item .grow{flex:1 1 auto}
  .ci-controls{width:100%;justify-content:space-between;gap:10px;margin-top:10px;padding-top:11px;border-top:1px solid var(--border)}
  .ci-price{min-width:0;flex:1;text-align:left}
  .sum-total .big{font-size:23px}
  /* отзывы — одна колонка */
  .rv-grid{grid-template-columns:1fr}
  /* инфо-блок игры */
  .info-col{padding:16px 16px}
  /* футер — 2 колонки, читаемо */
  .footer{padding:32px 0 24px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:20px 18px}
  .install-cta{flex-direction:column;align-items:flex-start;gap:12px}
  .install-cta .btn{width:100%}
  /* модалки/шторки по ширине экрана */
  .auth-card,.im-card{max-width:100%}
  /* заголовки секций не разъезжаются */
  .section-head{flex-wrap:wrap;gap:6px}
}

/* очень узкие телефоны (≤360) */
@media(max-width:360px){
  .games-grid,.prod-grid,.feat-grid-full{grid-template-columns:1fr}
  .cat-tab{font-size:12.5px}
}

/* 5) ЛАНДШАФТ телефона — низкая высота, чтобы баннеры не занимали весь экран */
@media(max-height:520px) and (orientation:landscape){
  .promo-carousel{max-height:190px}
  .promo-slide{min-height:120px;padding:14px 20px}
  .promo-slide h3{font-size:18px}
  .gp-hero{padding:14px;margin:10px 0 12px}
  .gp-hero .cover{width:56px;height:56px}
  #buyPane.buy-pane{max-height:96vh}
  .hero-inner{padding:16px 18px}
}

/* 6) отступ снизу под пилюлю-корзину, чтобы она не перекрывала футер/контент */
@media(max-width:980px){
  .footer{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
  body[data-route="home"] .footer,body[data-route="game"] .footer,body[data-route="hits"] .footer,body[data-route="reviews"] .footer{margin-bottom:64px}
}

/* 7) уважать системную настройку «уменьшить движение» */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ===== плашка установки приложения: только телефон/планшет, компактно ===== */
.install-cta{display:none}
@media(max-width:1024px){
  .install-cta{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;
    gap:12px;padding:11px 14px;margin-bottom:16px;border-radius:14px}
  .install-cta-text b{font-size:13.5px;display:block}
  .install-cta-text span{font-size:11.5px;line-height:1.35;color:var(--text-muted)}
  .install-cta .btn{flex-shrink:0;padding:9px 15px;font-size:13px;border-radius:11px}
}
@media(max-width:430px){
  .install-cta-text span{display:none}   /* совсем компактно на узких телефонах */
  .install-cta{padding:10px 12px}
}

/* Виджет выбора количества Звёзд Telegram */
.star-chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:10px}
@media(max-width:560px){.star-chips{justify-content:flex-start}}
.star-chip{padding:7px 14px;border-radius:10px;border:1px solid var(--line,rgba(255,255,255,.12));background:rgba(255,255,255,.03);color:var(--text);font-weight:700;font-size:14px;cursor:pointer;transition:.15s}
.star-chip:hover{border-color:var(--accent,#38e1c4);background:rgba(56,225,196,.08)}
.star-chip:active{transform:scale(.96)}

/* Playerok-стиль: большая плашка пополнения звёзд */
.gp-layout.star-mode{grid-template-columns:1fr}
.gp-layout.star-mode .buy-pane{display:none}
.star-card{background:var(--surface);border:1px solid var(--line,rgba(255,255,255,.09));border-radius:18px;padding:20px 20px 16px;margin-top:4px}
.star-card-top{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.star-card-ic{width:56px;height:56px;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(56,225,196,.08);border-radius:14px}
.star-card-ttl h3{margin:0;font-size:19px;font-weight:800;line-height:1.2}
.star-rate{display:flex;align-items:center;gap:2px;flex-wrap:wrap;font-size:16px;font-weight:700;color:var(--text,#e8ecf3);margin-top:7px}
.star-rate-pill{display:inline-block;background:linear-gradient(135deg,#37bbfe,#1c93e3);color:#fff;font-weight:900;font-size:19px;line-height:1;padding:7px 15px;border-radius:12px;box-shadow:0 5px 16px rgba(28,147,227,.42);letter-spacing:.2px;white-space:nowrap}
.star-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.star-fld label{display:block;font-size:13px;font-weight:700;color:#aeb7ca;margin-bottom:7px;letter-spacing:.1px}
.star-fld .input{font-size:17px;font-weight:600;height:54px;padding:0 16px;background:rgba(255,255,255,.02);transition:border-color .15s,box-shadow .15s}
.star-fld .input::placeholder{font-weight:500;color:#5a6478}
.star-fld .input:focus{border-color:var(--accent,#38e1c4);box-shadow:0 0 0 3px rgba(56,225,196,.16);background:rgba(56,225,196,.03)}
.star-fld .input.warn,.star-fld .input.warn:focus{border-color:#ff8a5c;box-shadow:0 0 0 3px rgba(255,138,92,.16)}
.star-hint{font-size:12.5px;color:var(--muted,#8b93a7);margin-top:7px;opacity:.9}
.star-hint.warn{color:#ff8a5c;font-weight:700;opacity:1}
.star-actions{display:flex;gap:10px;margin-top:6px}
.star-buy{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;font-size:16px;font-weight:800;padding:14px 18px}
.star-buy b{font-weight:900}
.star-cart{flex:none;width:54px;padding:0;display:flex;align-items:center;justify-content:center}
.star-note{display:flex;align-items:center;gap:6px;color:var(--muted,#8b93a7);font-size:12px;margin-top:13px;line-height:1.35}
@media(max-width:560px){.star-grid{grid-template-columns:1fr}}

/* Фирменный бейдж мгновенной автовыдачи DonatGo */
.dg-instant{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,#3aa2ff,#1f7ceb);box-shadow:0 5px 16px rgba(31,124,235,.42);position:relative;overflow:hidden;white-space:nowrap}
.dg-instant::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);animation:dgShine 2.8s ease-in-out infinite}
@keyframes dgShine{0%{left:-60%}55%,100%{left:140%}}
.star-card-top{flex-wrap:wrap}
.star-instant-top{margin-left:auto}
.game-instant{margin:2px 0 8px}
.game-instant .dg-instant{font-size:11.5px;padding:4px 9px}
@media(max-width:560px){.star-instant-top{margin-left:0;margin-top:10px;width:100%}}
@media(prefers-reduced-motion:reduce){.dg-instant::after{animation:none;display:none}}

.star-instant-row{margin-top:11px}

.gp-instant{margin:14px 0 14px}

/* Элегантный минималистичный бейдж автовыдачи (переопределяет предыдущий) */
.dg-instant{background:rgba(45,212,191,.07) !important;border:1px solid rgba(45,212,191,.30);color:#cfeee6 !important;font-weight:700;font-size:12.5px;box-shadow:none !important;overflow:visible}
.dg-instant svg{color:#2fddc4}
.dg-instant::after{content:none !important;display:none !important;animation:none !important}