/* Бонусы: значки «можно забрать», ежедневный бонус (серия 7 дней), колесо бонусов, приветственный пакет, окно «Бонусы».
   Цвета только из токенов скина. */

/* ---------- значки ---------- */
.nbadge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-grid;place-items:center;font:700 11.5px/1 var(--ui);font-style:normal;
  color:var(--bg);background:var(--hot)}
.menu .nbadge{margin-left:auto}
.acc-nav .nbadge{margin-left:2px}
.tgift{position:relative;color:var(--text);background:var(--panel);box-shadow:inset 0 0 0 1px var(--line-2)}
.tgift .i{width:20px;height:20px}
@media (hover:hover) and (pointer:fine){.tgift:hover{background:var(--panel-2)}}
.tbadge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:grid;place-items:center;font:700 11px/1 var(--ui);font-style:normal;
  color:var(--bg);background:var(--hot);box-shadow:0 0 0 2px var(--bg)}
.botnav .bdot{position:absolute;top:9px;left:calc(50% + 7px);width:9px;height:9px;border-radius:50%;background:var(--hot);box-shadow:0 0 0 2px var(--bg);font-size:0;overflow:hidden}

/* ---------- карточки раздела ---------- */
.bon{display:grid;gap:20px}
.bon-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:start}
.bon-2>:only-child{grid-column:1/-1}
.bcard{position:relative;isolation:isolate;overflow:hidden;padding:24px 26px;border-radius:var(--r-lg);background:var(--panel);box-shadow:inset 0 0 0 1px var(--line)}
.bcard-k{margin:0 0 6px;font-size:14px;color:var(--muted)}
.bcard-t{font-family:var(--display);font-weight:var(--display-w);letter-spacing:var(--display-track);font-size:clamp(24px,2.3vw,30px);line-height:1.1;margin:0;outline:none}
.bcard-s{margin:10px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted);max-width:56ch}
.bcard-art{position:absolute;right:-16px;top:-24px;width:150px;z-index:-1;transform:rotate(12deg);filter:drop-shadow(0 18px 26px rgba(0,0,0,.55));pointer-events:none}
.b-wait{display:flex;align-items:center;gap:12px;min-height:52px;font-size:15px}
.b-wait>.i{width:22px;height:22px;flex:none;color:var(--accent-hi)}
.b-wait b{font-family:var(--display);font-weight:var(--display-w);letter-spacing:var(--display-track);font-size:20px;margin-left:4px;vertical-align:-1px}
.b-wait small{display:block;font-size:13px;color:var(--muted);margin-top:2px}

/* ежедневный: главная карточка раздела */
.bd{background:radial-gradient(70% 90% at 100% 0%,rgba(var(--glow-2),.32),transparent 70%),linear-gradient(155deg,rgba(var(--glow-1),.30),var(--panel) 65%);
  box-shadow:inset 0 0 0 1px rgba(var(--glow-1),.3),0 30px 50px -36px rgba(0,0,0,.9);container-type:inline-size}
.bd .bcard-k,.bd .bcard-t,.bd>.bcard-s{max-width:calc(100% - 130px)}
.bd-got{color:var(--accent-hi)}
.bd-strip{list-style:none;margin:20px 0 18px;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.bd-c{position:relative;display:grid;justify-items:center;align-content:center;gap:6px;min-height:118px;padding:14px 4px 12px;border-radius:var(--r-md);text-align:center;
  background:color-mix(in srgb,var(--bg) 55%,transparent);box-shadow:inset 0 0 0 1px var(--line-2);transition:background-color 200ms ease,box-shadow 200ms ease,color 200ms ease}
.bd-c small{font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.bd-n{display:none}
.bd-c img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(0,0,0,.5));transition:opacity 200ms ease}
.bd-c b{font-family:var(--display);font-weight:var(--display-w);letter-spacing:var(--display-track);font-size:17px;line-height:1;white-space:nowrap}
.bd-c.last b{color:var(--gold)}
.bd-c.done{background:rgba(var(--glow-1),.14);box-shadow:inset 0 0 0 1px rgba(var(--glow-1),.4)}
.bd-c.done img{opacity:.5}
.bd-c.done b{color:var(--accent-hi)}
.bd-c.now{background:var(--btn);color:var(--accent-ink);box-shadow:0 14px 30px -14px rgba(var(--glow-1),.95),inset 0 1px 0 rgba(255,255,255,.28)}
.bd-c.now small,.bd-c.now b{color:inherit}
.bd-c.now img{transform:translateY(-2px) scale(1.08)}
.bd-c.next{box-shadow:inset 0 0 0 1.5px rgba(var(--glow-1),.55)}
.bd-c.next small{color:var(--accent-hi)}
.bd-ok{position:absolute;top:7px;right:7px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink)}
.bd-ok .i{width:12px;height:12px}
.bd-c.just .bd-ok{animation:bdOk 380ms var(--ease-out) both}
.bd-c.just img{animation:bdCoin 420ms var(--ease-out) both}
@keyframes bdOk{from{opacity:0;transform:scale(.6)}}
@keyframes bdCoin{from{opacity:1;transform:translateY(-6px) scale(1.12)}}
.bd-act{display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap}
.bd-go{min-width:240px}
/* узкий контейнер (окно, телефон): клетки без подписи «День», цифры интерфейсным шрифтом */
@container (max-width:560px){
  .bd-strip{gap:5px;margin:16px 0 14px}
  .bd-c{min-height:84px;padding:9px 1px 8px;gap:4px;border-radius:var(--r-sm)}
  .bd-c small{font-size:11px}
  .bd-l{display:none}.bd-n{display:inline}
  .bd-c.next .bd-n{display:none}.bd-c.next .bd-l{display:inline;font-size:10px}
  .bd-c img{width:26px;height:26px}
  .bd-c b{font:700 12.5px/1 var(--ui);letter-spacing:0}
  .bd-ok{top:-5px;right:-5px;width:17px;height:17px;box-shadow:0 0 0 2px var(--panel)}
  .bd-ok .i{width:10px;height:10px}
  .bd-act .btn{width:100%}
  .bd-go{min-width:0}
}

/* колесо */
.bw .bcard-t{margin-bottom:4px}
.bw-stage{position:relative;width:min(300px,100%);aspect-ratio:1;margin:16px auto 18px}
.bw-rot{display:block;width:100%;height:100%;will-change:transform}
.bw-rim{fill:var(--bg);stroke:rgba(var(--glow-1),.55);stroke-width:6}
.bw-g path{stroke:rgba(0,0,0,.28);stroke-width:1;transition:filter 300ms ease}
.bw-g.s0 path{fill:rgba(var(--glow-1),.62)}
.bw-g.s1 path{fill:var(--panel-3)}
.bw-g.st path{fill:var(--gold)}
.bw-g text{font-family:var(--display);font-weight:var(--display-w);font-size:15px;fill:var(--text);letter-spacing:.01em}
.bw-g.st text{fill:var(--bg)}
.bw-g.win path{filter:brightness(1.3) saturate(1.15)}
.bw-dots circle{fill:rgba(255,255,255,.7)}
.bw-dots circle:nth-child(odd){fill:rgba(var(--glow-1),.9)}
.bw-hub{position:absolute;left:50%;top:50%;width:24%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,var(--panel-3),var(--panel));box-shadow:0 0 0 4px rgba(var(--glow-1),.45),0 10px 24px rgba(0,0,0,.55)}
.bw-hub img{width:66%;height:66%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.bw-pin{position:absolute;left:50%;top:-8px;translate:-50% 0;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6));z-index:2}
.bw-pin i{display:block;width:28px;height:34px;background:var(--text);clip-path:polygon(0 0,100% 0,50% 100%)}
.bw-act{min-height:52px}
.bw-res{display:flex;align-items:baseline;justify-content:center;gap:10px;margin:0 0 8px}
.bw-res span{color:var(--muted);font-size:14px}
.bw-res b{font-family:var(--display);font-weight:var(--display-w);letter-spacing:var(--display-track);font-size:30px;color:var(--accent-hi)}
.bw .b-wait{justify-content:center;text-align:left}
.bw-odds{margin-top:14px;font-size:13px;color:var(--muted)}
.bw-odds summary{cursor:pointer;width:max-content;margin:0 auto;padding:8px 4px;list-style:none}
.bw-odds summary::-webkit-details-marker{display:none}
.bw-odds summary::after{content:"";display:inline-block;width:7px;height:7px;margin-left:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-3px) rotate(45deg);transition:transform 160ms var(--ease-out)}
.bw-odds[open] summary::after{transform:translateY(0) rotate(-135deg)}
.bw-odds ul{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 20px;text-align:left}
.bw-odds li{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--line)}
.bw-odds li span:first-child{color:var(--text)}

/* приветственный пакет */
.bwl-bar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:5px;margin:14px 0 4px}
.bwl-bar span{height:6px;border-radius:3px;background:var(--panel-3)}
.bwl-bar span.on{background:var(--btn)}
.bwl-l{list-style:none;margin:14px 0 18px;padding:0;display:grid;gap:8px}
.bwl-l li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:var(--r-md);background:rgba(255,255,255,.025)}
.bwl-l i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:700 14px/1 var(--ui);font-style:normal;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-2)}
.bwl-l i .i{width:16px;height:16px}
.bwl-l li.got i{background:var(--accent);color:var(--accent-ink);box-shadow:none}
.bwl-l li.now{background:rgba(var(--glow-1),.12);box-shadow:inset 0 0 0 1px rgba(var(--glow-1),.45)}
.bwl-l li.now i{color:var(--accent-hi);box-shadow:inset 0 0 0 1.5px rgba(var(--glow-1),.8)}
.bwl-l b{display:block;font-weight:600;font-size:14.5px}
.bwl-l small{display:block;font-size:12.5px;color:var(--muted);margin-top:1px}
.bwl-l .v{font-size:14.5px;font-weight:600;white-space:nowrap}
.bwl-l li.got .v{color:var(--accent-hi)}
.bwl-l li.now .v{font-size:12.5px;color:var(--accent-hi)}
.bwl-act{display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap}
.bwl-act .bcard-s{margin:0;flex:1 1 220px}
.bon-rules{margin-top:26px}
.bpromo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:center}
.bpromo .form-err{margin:8px 0 0}
.bp-in{text-transform:uppercase;letter-spacing:.06em}
.bp-in::placeholder{text-transform:none;letter-spacing:0}
@media (max-width:760px){.bpromo{grid-template-columns:1fr}}

/* касса и окно пополнения: строка пакета */
.dep-bon{align-items:flex-start;line-height:1.45}
.dep-bon img{width:36px;height:36px}
.dep-bon b{font-weight:650}
.dep-bon b.num{color:var(--accent-hi)}
.cash .dep-bon{margin:-4px 0 16px}

/* окно «Бонусы» */
.bon-dlg{display:grid;gap:10px}
.bon-sk{height:250px}
.bon-dlg .bd{padding:18px 16px 16px}
.bon-dlg .bd .bcard-k,.bon-dlg .bd .bcard-t{max-width:none}
.bon-dlg .bcard-t{font-size:22px}
.brow{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px 10px 10px;border-radius:var(--r-md);background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);
  transition:background-color 150ms ease}
.brow img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
.brow b{display:block;font-weight:600;font-size:14.5px}
.brow small{display:block;font-size:12.5px;color:var(--muted);margin-top:1px}
.brow small b{display:inline;font-size:inherit;font-family:var(--ui);margin:0}
@media (hover:hover) and (pointer:fine){a.brow:hover{background:var(--panel-2)}}
.bon-all{margin-top:4px}

/* монеты получения */
.bcoin{position:fixed;width:28px;height:28px;z-index:95;pointer-events:none;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}

/* главная: карточка ежедневного бонуса вместо «Покупки бонуса» у вошедшего */
.mini-bon .mini-s b{font-family:var(--ui);font-weight:700;color:var(--text)}
.mini-dot{position:absolute;top:16px;right:16px;width:10px;height:10px;border-radius:50%;background:var(--hot);box-shadow:0 0 0 3px color-mix(in srgb,var(--hot) 28%,transparent);z-index:3}
.mini-bon.ready .mini-s{color:var(--text)}

@media (max-width:960px){.bon-2{grid-template-columns:1fr}}
@media (max-width:640px){
  .bon{gap:14px}.bon-2{gap:14px}
  .bcard{padding:20px 18px}
  .bcard-art{width:112px;right:-14px;top:-18px}
  .bd .bcard-k,.bd .bcard-t,.bd>.bcard-s{max-width:calc(100% - 92px)}
  .bcard-t{font-size:23px}
  .bw-stage{width:min(270px,100%)}
  .bwl-l li{padding:8px 12px 8px 8px;gap:10px}
  .bwl-act .btn{width:100%}
}
@media (pointer:coarse){.bw-odds summary{padding:12px 4px}}
@media (prefers-reduced-motion:reduce){.bd-c.just .bd-ok,.bd-c.just img{animation:none}}
/* телефон: подарок в шапке налезал на логотип (390px) — там вход в бонусы через точку на «Кабинете» и карточку на главной */
@media (max-width:440px){.tgift{display:none}}
@media (max-width:720px){.mini-bon .mini-t{max-width:none;font-size:15px}.mini-dot{top:10px;right:10px;width:8px;height:8px}}