/* ═══════════ NFTишник · дизайн-система «Telegram Native + Premium NFT» ═══════════
   Подключается ПОСЛЕ app.css и переопределяет токены и компоненты. Один источник правды:
   цвета, радиусы, отступы, типографика, свечения, состояния. Экраны только собирают компоненты. */
:root,:root.light{
  /* поверхности: глубокий тёмно-синий */
  --bg:#0b1324; --bg2:#070d19; --card:#111c33; --card2:#18274a; --elev:#1d2f57;
  --text:#f2f6ff; --hint:#8c9cc0; --muted:#8c9cc0;
  --line:rgba(96,160,255,.16); --sep:rgba(96,160,255,.14);
  /* фирменный голубой */
  --accent:#2f8bff; --accent2:#1b6fe8; --accent-hi:#58a6ff; --link:#58a6ff;
  --grad-btn:linear-gradient(180deg,#3a95ff 0%,#1f74f0 100%);
  --glow:0 0 0 1px rgba(88,166,255,.35),0 8px 28px -8px rgba(47,139,255,.55);
  --danger:#ff5468; --ok:#38d98a; --gold:#ffc24a;
  /* шкала */
  --sp1:4px; --sp2:8px; --sp3:12px; --sp4:16px; --sp5:24px;
  --r:18px; --r-sm:12px; --r-lg:24px;
  --fs-xs:11px; --fs-sm:13px; --fs-md:15px; --fs-lg:18px; --fs-xl:26px;
  --tab-h:68px;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}
html,body{background:var(--bg2)}
body{background:radial-gradient(120% 60% at 50% -10%,#14305f 0%,transparent 60%),radial-gradient(90% 50% at 100% 100%,#0d2247 0%,transparent 60%),var(--bg2);background-attachment:fixed}
#app{max-width:520px;margin:0 auto}
.screen{padding:calc(var(--safe-t) + 10px) var(--sp4) calc(var(--tab-h) + var(--safe-b) + 28px);scrollbar-width:none}
.screen::-webkit-scrollbar{display:none}
h1{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.4px}
h2{font-size:var(--fs-sm);font-weight:700;color:var(--hint);text-transform:none;letter-spacing:.2px;margin:22px 4px 10px}

/* ── Шапка приложения ── */
.appbar{display:flex;align-items:center;gap:12px;padding:2px 0 14px}
.appbar .logo{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--grad-btn);box-shadow:var(--glow);font-size:21px}
.appbar .ttl{font-size:20px;font-weight:800;letter-spacing:-.2px;flex:1}
.appbar .ib{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);font-size:17px;transition:transform .2s var(--spring)}
.appbar .ib:active{transform:scale(.9)}
.appbar .avatar{width:38px;height:38px}

/* ── Плитки-показатели ── */
.stats3{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--sp2);margin-bottom:var(--sp3)}
.stat-tile{display:flex;align-items:center;gap:9px;padding:10px 11px;border-radius:16px;background:linear-gradient(180deg,rgba(29,47,87,.7),rgba(17,28,51,.9));border:1px solid var(--line);min-width:0;text-align:left;transition:transform .2s var(--ease)}
button.stat-tile:active{transform:scale(.96)}
.stat-tile .si{font-size:22px;flex:none;filter:drop-shadow(0 2px 6px rgba(47,139,255,.5))}
.stat-tile b{display:block;font-size:14.5px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-tile span{display:block;font-size:var(--fs-xs);color:var(--hint);white-space:nowrap}
.chips-row{display:flex;gap:var(--sp2);flex-wrap:wrap;margin:-2px 0 var(--sp3)}
.chip-s{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:999px;background:rgba(47,139,255,.14);border:1px solid var(--line);font-size:var(--fs-xs);font-weight:700;color:var(--accent-hi)}

/* ── Карточки ── */
.card,.season,.hero-card,.mn-card,.fc-card,.sheet .card{border-radius:var(--r)}
.card{background:linear-gradient(180deg,rgba(24,39,74,.55),rgba(17,28,51,.92));border:1px solid var(--line)}
.list>*+*{border-top:1px solid var(--line)}
.cell:active{background:rgba(47,139,255,.1)}
.cell .s{color:var(--hint)}
.sq{border-radius:11px;width:36px;height:36px;font-size:19px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.list.ic>*+*::before{left:64px}

/* ── Герой «Открыть подарок» ── */
.hero2{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:18px 16px 16px;margin-bottom:var(--sp3);border:1px solid rgba(88,166,255,.35);background:radial-gradient(90% 120% at 85% 20%,rgba(58,149,255,.45),transparent 60%),linear-gradient(160deg,#1a3a78 0%,#0f2150 55%,#0c1a3d 100%);box-shadow:0 18px 40px -20px rgba(47,139,255,.7)}
.hero2::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 30%,rgba(255,255,255,.12),transparent 40%);pointer-events:none}
.hero2 .tx{position:relative;z-index:1;width:58%}
.hero2 h3{font-size:20px;line-height:1.12;font-weight:800;letter-spacing:-.4px;margin-bottom:8px}
.hero2 p{font-size:var(--fs-sm);color:#b9c8ea;line-height:1.35;margin-bottom:14px}
.hero2 .art{position:absolute;right:-6px;top:6px;width:46%;aspect-ratio:1;z-index:0;animation:float 4s ease-in-out infinite;filter:drop-shadow(0 14px 22px rgba(0,0,0,.45)) drop-shadow(0 0 30px rgba(88,166,255,.45))}
.hero2 .art .gift{background:none!important;box-shadow:none!important;border-radius:0}
.hero2 .art .gift::after{display:none}
.hero2 .art .gift .mdl{inset:0}
.btn-big{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:15px 18px;border-radius:999px;background:var(--grad-btn);color:#fff;font-weight:800;font-size:16px;box-shadow:var(--glow),inset 0 1px 0 rgba(255,255,255,.3);transition:transform .15s var(--ease),filter .2s}
.btn-big:active{transform:scale(.97);filter:brightness(.92)}
.btn-big[disabled]{opacity:.45;pointer-events:none}
.btn-big .arr{margin-left:auto;opacity:.85;font-size:20px}
.tiles2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp2);margin-bottom:var(--sp3)}
.spin-tile{display:flex;align-items:center;gap:11px;padding:12px;border-radius:16px;background:linear-gradient(180deg,rgba(29,47,87,.7),rgba(17,28,51,.92));border:1px solid var(--line);text-align:left;transition:transform .2s var(--ease),border-color .2s}
.spin-tile:active{transform:scale(.97);border-color:rgba(88,166,255,.5)}
.spin-tile .ico{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:22px;background:rgba(47,139,255,.18);flex:none}
.spin-tile b{display:block;font-size:17px;font-weight:800}
.spin-tile span{font-size:var(--fs-xs);color:var(--hint)}

/* ── Кнопки ── */
.btn-main{border-radius:999px;background:var(--grad-btn);box-shadow:var(--glow),inset 0 1px 0 rgba(255,255,255,.28);padding:14px 18px;font-weight:800}
.btn-sec{border-radius:999px;background:rgba(47,139,255,.14);border:1px solid var(--line);color:var(--accent-hi);font-weight:700}
.btn-sec:active{background:rgba(47,139,255,.26)}
.btn-danger{background:rgba(255,84,104,.14);color:var(--danger);border-color:rgba(255,84,104,.3)}
.pill{background:rgba(24,39,74,.8);border:1px solid var(--line)}
.seg{border-radius:999px;background:rgba(17,28,51,.9);border:1px solid var(--line);padding:3px}
.seg button{border-radius:999px;padding:9px 8px;font-weight:700}
.seg button.on{background:var(--grad-btn);color:#fff;box-shadow:0 4px 14px -4px rgba(47,139,255,.7)}
.progress{height:7px;border-radius:99px;background:rgba(96,160,255,.14)}
.progress i{background:linear-gradient(90deg,#2f8bff,#6cc4ff);border-radius:99px;box-shadow:0 0 10px rgba(88,166,255,.6)}
select.tf{width:100%;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);color:var(--text);font:inherit;margin-bottom:8px}

/* ── Нижняя панель ── */
.tabbar{max-width:520px;margin:0 auto;background:rgba(9,16,32,.82);border-top:1px solid var(--line);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6)}
.tabbar button{position:relative;color:var(--hint);font-size:10.5px;font-weight:600}
.tabbar button .i{filter:none;width:25px;height:25px;display:grid;place-items:center}
.tabbar button .i svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tabbar button.on{color:var(--accent-hi)}
.tabbar button.on .i svg{filter:drop-shadow(0 0 8px rgba(88,166,255,.9))}
.tabbar button.on::before{content:"";position:absolute;top:0;left:30%;right:30%;height:2px;border-radius:0 0 3px 3px;background:var(--accent-hi);box-shadow:0 0 10px var(--accent-hi)}

/* ── NFT-карточка (инвентарь и рынок) ── */
.nft{position:relative;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;text-align:left;background:var(--card);border:1.5px solid var(--rc,var(--line));box-shadow:0 0 0 1px rgba(0,0,0,.3),0 10px 24px -14px var(--rc,transparent);transition:transform .25s var(--ease);isolation:isolate}
.nft:active{transform:scale(.96)}
.nft .vis{position:relative}
.nft .vis .gift{border-radius:0;aspect-ratio:1}
.nft .rtag{position:absolute;top:6px;left:6px;z-index:3;font-size:9.5px;font-weight:800;padding:3px 7px;border-radius:8px;color:#0b1324;background:var(--rc,#9aa7b5);letter-spacing:.1px}
.nft .sn{position:absolute;top:7px;right:7px;z-index:3;font-size:10.5px;font-weight:800;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.nft .info{padding:8px 9px 9px;background:linear-gradient(180deg,rgba(11,19,36,.2),rgba(11,19,36,.92))}
.nft .nm{font-size:var(--fs-sm);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nft .val{display:flex;align-items:center;gap:5px;margin-top:3px;font-size:12px;font-weight:700;color:var(--accent-hi);white-space:nowrap}

.nft .own{font-size:var(--fs-xs);color:var(--hint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nft .act{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:7px;padding:6px 8px;border-radius:999px;background:rgba(47,139,255,.18);border:1px solid var(--line);color:var(--accent-hi);font-size:11.5px;font-weight:800}
.nft .act.up{background:rgba(56,217,138,.14);color:var(--ok);border-color:rgba(56,217,138,.3)}
.nft .act.sale{background:var(--grad-btn);color:#fff;border:0}
.nft.sel{box-shadow:0 0 0 2px var(--accent-hi),0 0 22px rgba(88,166,255,.6)}
.nft.t6{--rc:#ff6a86}.nft.t5{--rc:#ffc24a}.nft.t4{--rc:#b27cff}.nft.t3{--rc:#4da8ff}.nft.t2{--rc:#53d28f}.nft.t1{--rc:#7f8db0}
.grid{gap:10px}
.sc,.cardgift{border-radius:var(--r);background:var(--card);border:1px solid var(--line)}
.sc .buy,.cardgift .buy{background:var(--grad-btn);box-shadow:0 6px 16px -6px rgba(47,139,255,.8)}

.inv-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.inv-head .btn-craft{display:flex;align-items:center;gap:7px;padding:10px 16px;border-radius:999px;background:var(--grad-btn);box-shadow:var(--glow);font-weight:800;font-size:14px}
.filters{display:flex;gap:var(--sp2);overflow-x:auto;scrollbar-width:none;margin-bottom:10px;align-items:center}
.filters::-webkit-scrollbar{display:none}
.fchip{flex:none;padding:9px 16px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:var(--fs-sm);color:var(--hint);transition:all .2s var(--ease)}
.fchip.on{background:var(--grad-btn);color:#fff;border-color:transparent;box-shadow:0 4px 14px -4px rgba(47,139,255,.8)}
.count-line{font-size:var(--fs-sm);color:var(--hint);margin:2px 2px 10px}

/* ── Шторки ── */
.sheet{background:linear-gradient(180deg,#0f1b35,#0a1224);border-top:1px solid rgba(88,166,255,.3);border-radius:26px 26px 0 0;box-shadow:0 -20px 60px -20px rgba(47,139,255,.35)}
.scrim{background:rgba(3,7,16,.7);backdrop-filter:blur(4px)}
.sheet .x{background:rgba(24,39,74,.8);border:1px solid var(--line)}
.sheet .head{font-size:17px;font-weight:800}

/* ── Рулетка ── */
.roll-wrap{background:radial-gradient(ellipse at 50% 28%,#16346a,#070d19 70%)}
.roll-title{font-size:24px;font-weight:800;letter-spacing:-.3px}
.roll-card{background:linear-gradient(180deg,#16254a,#0f1a35);border:1px solid var(--line);border-bottom:3px solid var(--tc);border-radius:18px;opacity:.72;transform:scale(.94);transition:opacity .2s}
.roll-marker{background:linear-gradient(#bfe0ff,var(--accent));box-shadow:0 0 22px 3px rgba(88,166,255,.9)}
.roll-marker::before{border-top-color:#bfe0ff}
.roll-marker::after{content:"";position:absolute;bottom:-2px;left:-6px;border:7px solid transparent;border-bottom-color:#bfe0ff}
.reveal .big{filter:drop-shadow(0 0 40px rgba(88,166,255,.7))}
.reveal .big .gift{animation:revealPop .7s var(--spring) both}
@keyframes revealPop{from{opacity:0;transform:scale(.4) rotate(-12deg)}to{opacity:1;transform:none}}
.reveal h3{font-size:24px;font-weight:800}
.rev-rar{display:inline-block;padding:4px 12px;border-radius:999px;font-weight:800;font-size:12px;color:#0b1324;background:var(--tc);margin:6px 0}

/* ── Крафт ── */
.craftbox{background:transparent}
.slot{border-radius:20px;background:var(--card);border:1.5px dashed rgba(96,160,255,.35);color:var(--accent-hi)}
.slot:has(.gift){border-style:solid;border-color:var(--line)}
.ring{background:#0b1324;box-shadow:0 0 0 5px #0f1b35,0 0 24px rgba(47,139,255,.5)}
.chip{border-radius:14px;background:var(--card);border:1px solid var(--line)}
.note{color:var(--hint)}

/* ── Майнинг, друзья, сезон ── */
.mn-card,.fc-card{border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,rgba(24,39,74,.6),rgba(17,28,51,.95))}
.mn-ico,.fc-ico{background:rgba(47,139,255,.16);border:1px solid var(--line)}
.mn-bar{height:7px;background:rgba(96,160,255,.14)}
.mn-bar i{background:linear-gradient(90deg,#2f8bff,#6cc4ff);box-shadow:0 0 10px rgba(88,166,255,.6)}
.fc-dots i{background:rgba(96,160,255,.16)}.fc-dots i.on{background:linear-gradient(90deg,#2f8bff,#6cc4ff);box-shadow:0 0 8px rgba(88,166,255,.6)}
.season{border-radius:var(--r);background:linear-gradient(180deg,rgba(24,39,74,.5),rgba(17,28,51,.9));border:1px solid var(--line);padding:14px}
.sgrid{grid-template-columns:repeat(3,1fr);gap:8px}
.sc .sn{font-size:12.5px}.sc .buy{font-size:12px;padding:6px 8px}
.announce{border-radius:16px;border:1px solid var(--line);background:rgba(47,139,255,.12)}

/* ── Профиль и топ ── */
.prof-head{padding:6px 0 10px}
.stats{gap:8px}
.stats .stat{border-radius:16px;background:linear-gradient(180deg,rgba(29,47,87,.6),rgba(17,28,51,.92));border:1px solid var(--line)}
.stats .stat b{color:var(--text)}
.utabs{border-bottom:1px solid var(--line)}
.skeleton{background:linear-gradient(90deg,#111c33 25%,#1a2a4d 50%,#111c33 75%);background-size:200% 100%;border-radius:16px}
.empty .big{filter:drop-shadow(0 0 18px rgba(88,166,255,.5))}
.toast{background:rgba(24,39,74,.95);border:1px solid var(--line);backdrop-filter:blur(14px)}

/* ── Движение: уважаем настройки системы ── */
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.screen>*{animation:fadeUp .4s var(--ease) both}
.screen>*:nth-child(2){animation-delay:.04s}.screen>*:nth-child(3){animation-delay:.08s}.screen>*:nth-child(4){animation-delay:.12s}.screen>*:nth-child(n+5){animation-delay:.16s}

.seg.fit{display:inline-flex}.seg.fit button{flex:none;padding:9px 20px}
.nft .rtag{max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;padding:3px 6px}
.roll-card.hot{opacity:1;transform:scale(1.08);border-color:#58a6ff;box-shadow:0 0 0 1px #58a6ff,0 0 26px rgba(88,166,255,.7);transition:transform .15s var(--spring),opacity .15s}
.roll-card{transition:transform .2s,opacity .2s}
.stats{background:none;padding:0}.prof-head .st{color:var(--hint)}

/* ── Адаптивность и доступность: финальная полировка ── */
:root { --focus-ring: 0 0 0 3px color-mix(in srgb, var(--accent-hi) 72%, transparent); }
:where(button,a,input,select,textarea,[role="button"],[tabindex]):focus-visible {
  outline: 2px solid var(--accent-hi);
  outline-offset: 3px;
  box-shadow: var(--focus-ring);
}
:where(button,a,[role="button"]):disabled,
:where(button,a,[role="button"])[aria-disabled="true"] { cursor: not-allowed; }
button, [role="button"] { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
input, textarea, select { font-size: max(16px, 1em); }
.screen { overflow-wrap: anywhere; }
.nft, .sc, .cardgift, .stat-tile, .spin-tile { min-width: 0; }
.nft .nm, .nft .val, .sc .sn, .cardgift .n { overflow-wrap: normal; }
@media (max-width: 360px) {
  .screen { padding-left: 12px; padding-right: 12px; }
  .stats3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .stat-tile { gap: 6px; padding: 9px 7px; }
  .stat-tile .si { font-size: 18px; }
  .stat-tile b { font-size: 12px; }
  .stat-tile span { font-size: 10px; }
  .hero2 { padding: 15px 12px 12px; }
  .hero2 .tx { width: 62%; }
  .hero2 h3 { font-size: 18px; }
  .hero2 p { font-size: 12px; }
  .sgrid { gap: 6px; }
  .sc { padding: 6px 5px 8px; }
  .sc .sn { font-size: 11px; }
  .tabbar button { min-width: 0; }
}
@media (min-width: 521px) {
  #app { box-shadow: 0 0 0 1px rgba(96,160,255,.12), 0 20px 80px rgba(0,0,0,.24); min-height: 100dvh; }
  .tabbar { box-shadow: 0 -8px 30px rgba(0,0,0,.12); }
}
@media (prefers-reduced-motion: reduce) {
  html:focus-within { scroll-behavior: auto; }
  *, *::before, *::after { animation-delay: 0ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* ── Обучение и руководство (на токенах дизайн-системы) ── */
.appbar .guide-open{font-size:15px;font-weight:800}
.ob-back{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:14px;background:rgba(3,7,16,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity .25s}
.ob-back.in{opacity:1}
.ob-panel{width:min(100%,420px);max-height:94dvh;overflow:auto;border-radius:var(--r-lg);border:1px solid rgba(88,166,255,.35);background:radial-gradient(90% 60% at 50% 0%,rgba(58,149,255,.28),transparent 70%),linear-gradient(180deg,#14275a,#0b1530 70%);box-shadow:0 24px 80px -20px rgba(47,139,255,.55);padding-bottom:16px;transform:translateY(14px) scale(.98);transition:transform .35s var(--spring)}
.ob-back.in .ob-panel{transform:none}
.ob-top{display:flex;align-items:center;gap:10px;padding:14px 14px 12px}
.ob-top .logo{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--grad-btn);box-shadow:var(--glow);font-size:18px}
.ob-top b{flex:1;font-size:17px;font-weight:800}
.ob-top .ib{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);font-size:14px}
.ob-art{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:10px;align-items:center;padding:6px 16px 14px}
.ob-g{border-radius:16px;box-shadow:0 12px 26px -12px var(--tc),0 0 0 1px rgba(255,255,255,.08);animation:pop .45s var(--spring) both}
.ob-g.mid{transform:translateY(-6px) scale(1.05)}
.ob-copy{padding:0 18px}
.ob-tag{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--accent-hi);margin-bottom:6px}
.ob-copy h2{font-size:23px;line-height:1.15;letter-spacing:-.4px;margin:0 0 8px;color:var(--text);text-transform:none;font-weight:800}
.ob-copy p{font-size:14px;line-height:1.5;color:#b9c8ea}
.ob-dots{display:flex;gap:6px;justify-content:center;margin:14px 0 12px}
.ob-dots span{width:7px;height:7px;border-radius:99px;background:rgba(96,160,255,.25);transition:all .25s var(--ease)}
.ob-dots span.on{width:22px;background:var(--accent-hi);box-shadow:0 0 10px var(--accent-hi)}
.ob-foot{display:flex;align-items:center;gap:12px;padding:0 16px}
.ob-skip{color:var(--hint);font-weight:700;padding:10px 4px}
.ob-next{flex:1;width:auto}
@media(max-width:360px){.ob-copy h2{font-size:20px}.ob-art{gap:6px;padding:4px 10px 12px}}

/* ── Иконки (вместо системных эмодзи) ── */
.ei{display:inline-block;width:1.18em;height:1.18em;vertical-align:-.24em;line-height:1;font-style:normal;flex:none;color:currentColor}
.ei svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 1px 0 rgba(0,0,0,.18))}
.ei[data-n=star],.ei[data-n=crown],.ei[data-n=trophy],.ei[data-n=coin]{color:#ffc24a}
.ei[data-n=gem]{color:#6cc4ff}.ei[data-n=clover]{color:#4fd98a}.ei[data-n=flame]{color:#ff8a3d}.ei[data-n=bolt]{color:#ffd24a}
.ei[data-n=cash]{color:#4fd98a}.ei[data-n=medal][data-t=gold]{color:#ffc24a}.ei[data-n=medal][data-t=silver]{color:#c9d3e6}.ei[data-n=medal][data-t=bronze]{color:#d08a5a}
.sq{background-image:linear-gradient(150deg,rgba(255,255,255,.32),rgba(255,255,255,0) 45%,rgba(0,0,0,.2));box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px -8px rgba(0,0,0,.6);color:#fff}
.sq .ei,.mn-ico .ei,.fc-ico .ei,.spin-tile .ico .ei,.stat-tile .si .ei,.appbar .logo .ei,.ob-top .logo .ei,.hero2 .ei,.btn-big .ei,.btn-main .ei,.pill .ei{color:#fff}
.sq .ei{width:21px;height:21px}
.stat-tile .si{font-size:22px;filter:none}
.stat-tile .si .ei[data-n=gem]{color:#6cc4ff}
.stat-tile .si .ei{width:24px;height:24px}
.stat-tile .si .ei[data-n=wallet]{color:#ff7aa8}.stat-tile .si .ei[data-n=shield]{color:#8fb8ff}
.spin-tile .ico .ei{width:24px;height:24px}
.pill .ei[data-n=star],.btn-sec .ei[data-n=star]{color:#ffc24a}
.mn-ico .ei,.fc-ico .ei{width:26px;height:26px}
.appbar .ib .ei{width:19px;height:19px}.appbar .ib .ei[data-n=star]{color:#ffc24a}
.appbar .logo .ei{width:22px;height:22px}
.nft .act .ei,.nft .val .ei{width:1em;height:1em}
.shop-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;font-size:22px;color:#fff}

/* ── Варианты моделей, крафт как в Telegram ── */
.var-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:4px 14px 18px}
.var-cell{border-radius:16px;background:var(--card);border:1px solid var(--line);padding:8px 6px 9px;text-align:center;position:relative;min-width:0}
.var-art{aspect-ratio:1;position:relative}.var-art .mdl{position:absolute;inset:6%}.var-art .mdl>*{width:100%;height:100%}
.var-n{font-size:11.5px;font-weight:700;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.var-t{position:absolute;top:6px;right:6px;font-size:9px;font-weight:800;padding:2px 6px;border-radius:8px;background:var(--gold);color:#0b1324}
.slot .pc{position:absolute;left:8px;top:6px;z-index:6;font-size:11px;font-weight:800;color:var(--accent-hi);text-shadow:0 1px 3px rgba(0,0,0,.7)}
.ring .anv{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;color:var(--accent-hi);z-index:2}
.ring .anv .ei{width:100%;height:100%;color:var(--accent-hi)}
.ring{flex-direction:column;gap:2px;padding-top:12px}
.craft-pill{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px auto 2px;padding:9px 16px;border-radius:999px;background:rgba(47,139,255,.14);border:1px solid var(--line);color:var(--accent-hi);font-weight:700;font-size:13px;width:fit-content}
.craft-sub{text-align:center;font-size:13px;color:var(--hint);padding:0 24px;line-height:1.45}
.craft-sub b{color:var(--text)}
.banner-top{position:fixed;left:12px;right:12px;top:calc(var(--safe-t) + 10px);z-index:300;display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:rgba(14,24,48,.96);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:0 14px 40px -12px rgba(0,0,0,.7);animation:fadeUp .4s var(--ease);font-size:13px}
.banner-top b{display:block;font-size:14px;margin-bottom:2px}

/* ───── Коллекции подарков в профиле ───── */
.ptabs{display:flex;gap:8px;overflow-x:auto;margin:20px -16px 4px;padding:2px 16px 8px;scrollbar-width:none}
.ptabs::-webkit-scrollbar{display:none}
.ptab{flex:none;padding:8px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:var(--fs-sm);color:var(--hint);transition:all .2s var(--ease);white-space:nowrap}
.ptab small{margin-left:6px;opacity:.7;font-weight:600}
.ptab.on{background:var(--grad-btn);color:#fff;border-color:transparent;box-shadow:0 4px 14px -4px rgba(47,139,255,.8)}
.ptab.add{color:var(--accent);border-style:dashed}
.pbar{display:flex;align-items:center;gap:6px;justify-content:flex-end;min-height:38px;margin-bottom:6px}
.pbar .muted{margin-right:auto}
.pbar .ib{width:36px;height:36px;border-radius:50%;background:var(--card);border:1px solid var(--line);font-size:18px;line-height:1;color:var(--text)}
.btn-sm{flex:none;white-space:nowrap;padding:8px 16px;border-radius:999px;background:var(--grad-btn);color:#fff;font-weight:700}
.pgrid.big1>:first-child{grid-column:span 2;grid-row:span 2}
.pgrid.reorder>[data-id]{cursor:grab;animation:wig .5s ease-in-out infinite alternate}
.pgrid.reorder>[data-id]:nth-child(2n){animation-delay:-.25s}
.pgrid.reorder>.dragging{animation:none;transform:scale(1.07);z-index:5;box-shadow:0 14px 30px -8px rgba(0,0,0,.6)}
@keyframes wig{from{transform:rotate(-1.2deg)}to{transform:rotate(1.2deg)}}
.pick-mark{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,.45);border:2px solid #fff;color:transparent;display:grid;place-items:center;font-size:14px;font-weight:800;z-index:4}
.gift.picked{outline:3px solid var(--accent);outline-offset:-3px}
.gift.picked .pick-mark{background:var(--accent);color:#fff}
.sec-t{margin:6px 16px 8px;font-size:var(--fs-sm);color:var(--hint);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.chips-row{display:flex;flex-wrap:wrap;gap:8px;padding:0 14px 8px}
@media (prefers-reduced-motion:reduce){.pgrid.reorder>[data-id]{animation:none}}

/* ───── Рекламные баннеры главной (управляются из админки) ───── */
.bn-row{scroll-padding:0 16px;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px 12px;padding:0 16px;scrollbar-width:none}
.bn-row::-webkit-scrollbar{display:none}
.bn{flex:0 0 86%;scroll-snap-align:start;position:relative;overflow:hidden;border-radius:20px;padding:16px;min-height:112px;display:flex;align-items:center;color:#fff;border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 28px -14px rgba(0,0,0,.7)}
.bn-row.one .bn{flex-basis:100%}
.bn.tap{cursor:pointer;transition:transform .15s var(--ease)}.bn.tap:active{transform:scale(.985)}
.bn.c-blue{background:linear-gradient(135deg,#2f6bff,#1aa7ff)}.bn.c-purple{background:linear-gradient(135deg,#7a4dff,#c04dff)}
.bn.c-green{background:linear-gradient(135deg,#16a34a,#38d39f)}.bn.c-orange{background:linear-gradient(135deg,#ff7a18,#ffb02e)}
.bn.c-pink{background:linear-gradient(135deg,#ff4d8d,#ff8a5c)}.bn.c-dark{background:linear-gradient(135deg,#1b2436,#2b3550)}
.bn-tx{position:relative;z-index:1;max-width:64%}
.bn-t{font-weight:800;font-size:17px;line-height:1.2;letter-spacing:-.01em}
.bn-s{margin-top:4px;font-size:13px;line-height:1.3;opacity:.92}
.bn-btn{display:inline-block;margin-top:10px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.95);color:#10203a;font-weight:700;font-size:13px}
.bn-img{position:absolute;right:0;top:0;bottom:0;width:42%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}

/* ───── Обязательная подписка ───── */
.subgate{position:absolute;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:calc(var(--safe-t) + 20px) 20px calc(var(--safe-b) + 20px);background:radial-gradient(circle at 50% 20%,#14306b,#070d19 70%)}
.sg-card{width:100%;max-width:380px;text-align:center;display:grid;gap:14px}
.sg-ic{width:76px;height:76px;margin:0 auto;border-radius:24px;background:var(--grad-btn);display:grid;place-items:center;font-size:36px;box-shadow:0 14px 34px -12px rgba(47,139,255,.8)}
.sg-card h2{margin:4px 0 0;font-size:22px;letter-spacing:-.01em}
.sg-p{margin:0;color:var(--hint);font-size:14px;line-height:1.4}
.sg-list{display:grid;gap:8px;text-align:left}
.sg-row{display:flex;align-items:center;gap:10px;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.sg-t{font-weight:700;min-width:0;overflow-wrap:anywhere}
.sg-go{flex:none;padding:8px 14px;border-radius:999px;background:var(--grad-btn);color:#fff;font-weight:700;font-size:13px}

/* ───── Скидки в магазине ───── */
.offer-line{margin-top:3px;font-size:12px;font-weight:700;color:#ffb020}
.pill.sale{display:flex;flex-direction:column;align-items:center;line-height:1.1;gap:1px;background:linear-gradient(135deg,#ff6a3d,#ff3d77)!important}
.pill .old{font-size:11px;opacity:.75;font-weight:600}
.cell.hl{animation:hlpulse 1.4s ease 2}
@keyframes hlpulse{50%{background:rgba(255,176,32,.18)}}
.offer-banner{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border-radius:18px;padding:12px 14px;margin-bottom:12px;color:#fff;background:linear-gradient(135deg,#ff6a3d,#ff3d77);box-shadow:0 12px 28px -14px rgba(255,61,119,.8)}
.offer-banner .ob-pct{flex:none;font-weight:800;font-size:22px;letter-spacing:-.02em}
.offer-banner .ob-t{font-weight:700;font-size:14px;line-height:1.25}
.offer-banner .ob-s{font-size:12px;opacity:.9;margin-top:2px}

/* без масштабирования щипком и двойным тапом */
html,body{touch-action:pan-x pan-y;-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* уведомления в цвет игры: ошибка — тот же синий, но с янтарной полоской вместо красного */
.toast.err{background:rgba(24,39,74,.97);border:1px solid #3e88f7;border-left:4px solid #ffb02e;color:#fff}
.toast.err::before{content:"!";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#ffb02e;color:#10203f;font-weight:800;font-size:13px;flex:none}
/* загрузка анимации подарка: мягкое появление вместо мигающей заглушки */
.mdl.ld{opacity:0}.mdl{transition:opacity .25s ease}

.odds-link{display:block;margin:10px auto 0;background:none;border:0;color:#9db8e8;font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.roll-card .odd{display:block;font-size:11px;font-weight:800;color:var(--tc);margin-top:2px}

.beta-pill{margin-left:8px;padding:2px 7px;border-radius:7px;background:linear-gradient(135deg,#ffb02e,#ff7a1a);color:#2a1700;font-size:10px;font-weight:900;letter-spacing:.06em;vertical-align:middle}
.toast{width:max-content;max-width:min(92vw,400px);text-align:left;line-height:1.35}
.story-prev img{width:100%;border-radius:18px;display:block;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.story-prev{max-width:320px;margin:0 auto;width:100%}