.bonuses-page[hidden]{display:none!important}
.view-bonuses>.promo-board,.view-bonuses>.case-filters,.view-bonuses>.case-catalog,.view-bonuses>.payment-methods{display:none!important}
.bonuses-page{color:#fff;width:100%;max-width:1440px;flex:none;margin:0 auto 26px}
.bonuses-heading{display:flex;align-items:center;justify-content:center;height:96px}
.bonuses-heading h1{margin:0;font-size:27px;line-height:1.2;font-weight:750;letter-spacing:-.03em}
.bonuses-board{display:grid;grid-template-columns:.9fr 1.1fr;gap:16px;padding:16px;border-radius:20px;background:#121222}
.bonus-card{min-width:0;min-height:344px;position:relative;isolation:isolate;overflow:hidden;border-radius:16px;padding:32px 34px;display:flex;flex-direction:column;justify-content:space-between}
.bonus-card--rewards{background:linear-gradient(117deg,#191828 9%,#493635 34%,#bc793d 72%,#f7a439 108%)}
.bonus-card--promo{background:linear-gradient(115deg,#181627 14%,#301c49 43%,#6e25a9 75%,#9b2adb 108%)}
.bonus-copy,.bonus-bottom{position:relative;z-index:2}
.bonus-copy h2{font-size:30px;line-height:1.2;font-weight:750;letter-spacing:-.025em;margin:0 0 22px}
.bonus-copy p{font-size:14px;font-weight:400;line-height:1.65;margin:0;max-width:72%;color:#f6f2f9}
.bonus-copy strong{font-weight:750;white-space:nowrap}
.bonus-art{position:absolute;z-index:0;pointer-events:none;user-select:none;max-width:none;object-fit:contain;aspect-ratio:1;height:auto}
.bonus-art--chest{width:338px;right:-108px;bottom:-67px}
.bonus-art--percent{width:310px;right:-78px;bottom:-78px;transform:rotate(-13deg)}
.bonus-badge{position:absolute;top:34px;right:26px;z-index:2;display:flex;align-items:center;gap:6px;padding:7px 9px;border-radius:var(--tab-radius);font-size:10px;font-weight:750;background:#29aa54;color:#fff;white-space:nowrap}
.bonus-badge svg{width:15px;height:15px;flex:none}
.bonus-badge--ready{background:#12122280}
.bonus-bottom{margin-top:30px}
.bonus-bottom--rewards{width:65%}
.bonus-card button{font:inherit;cursor:pointer;border:0;color:#fff;transition:background-color .18s,filter .18s}
.bonus-join{min-height:46px;min-width:168px;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:13px 20px;background:var(--gloss-blue);border-radius:var(--tab-radius);font-weight:750!important;font-size:14px!important;white-space:nowrap}
.bonus-join svg{width:17px;height:17px;transition:transform .18s}
.bonus-join:hover{filter:brightness(1.08)}
.bonus-join:hover svg{transform:translateX(2px)}
.bonus-join:disabled{opacity:.65;cursor:wait}
.bonus-join[hidden],.bonus-countdown[hidden]{display:none!important}
.bonus-countdown{display:inline-flex;flex-direction:column;align-items:flex-start;gap:8px}
.bonus-countdown>span{font-size:11px;color:#eee5db;font-weight:500}
.bonus-countdown time{display:block;padding:11px 21px;border-radius:var(--tab-radius);background:#121222;color:#fff;font-weight:750;font-size:26px;line-height:1.3;font-variant-numeric:tabular-nums;letter-spacing:.025em}
.bonus-reward-status{font-size:12px;line-height:1.5;color:#fff;margin:10px 0 0}
.bonus-reward-status:empty{display:none}
.bonus-bottom--promo{width:100%;max-width:370px}
.bonus-promo-form{display:flex;align-items:center;gap:6px;width:100%;padding:6px;background:#111020;border:1px solid #ffffff08;border-radius:calc(var(--tab-radius) + 4px);transition:border-color .18s}
.bonus-promo-form:focus-within{border-color:#68afff}
.bonus-promo-form input{min-width:0;flex:1;width:100%;font:inherit;font-size:12px;padding:10px 13px;background:transparent;border:0;outline:0;color:#fff;font-weight:650;text-transform:uppercase}
.bonus-promo-form input::placeholder{color:#858097;opacity:1}
.bonus-promo-form button{flex:none;min-height:42px;padding:12px 17px;border-radius:var(--tab-radius);background:var(--gloss-blue);font-size:12px;font-weight:750}
.bonus-promo-form button:hover{filter:brightness(1.08)}
.bonus-card :focus-visible{outline:2px solid #fff;outline-offset:4px}
.bonus-card input:focus-visible{outline:0}
.bonus-message{font-size:12px;line-height:1.6;font-weight:500;color:#fff;margin:12px 0 0;padding:10px 13px;border-radius:10px;background:#111020e8}
.bonus-message:empty,.bonus-message[hidden]{display:none}
.bonus-socials{position:absolute;z-index:3;top:34px;right:28px;display:flex;align-items:center;gap:9px}
.bonus-socials button{display:grid;place-items:center;padding:3px;width:26px;height:26px;background:transparent;border-radius:7px}
.bonus-socials button:hover{background:#ffffff20}
.bonus-socials span{display:block;width:20px;height:20px;background:#fff;mask:var(--bonus-social) center/contain no-repeat;-webkit-mask:var(--bonus-social) center/contain no-repeat}
.bonuses-page .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:1200px){
  .bonus-card{padding:28px;min-height:338px}
  .bonus-copy h2{font-size:27px}
  .bonus-copy p{font-size:13px;max-width:70%}
  .bonus-badge{top:29px;right:22px;font-size:9px}
  .bonus-socials{top:28px;right:22px;gap:4px}
  .bonus-socials button{width:23px;height:23px}
  .bonus-socials span{width:18px;height:18px}
  .bonus-art--chest{width:302px;right:-108px;bottom:-58px}
  .bonus-art--percent{width:285px;right:-93px;bottom:-63px}
  .bonus-bottom--promo{max-width:330px}
  .bonus-promo-form button{padding:12px;font-size:11px}
  .bonus-desktop-break{display:none}
}
@media(max-width:1000px){
  .bonuses-page{max-width:620px;margin-bottom:16px}
  .bonuses-heading{height:76px}
  .bonuses-heading h1{font-size:24px}
  .bonuses-board{grid-template-columns:1fr;padding:10px;gap:12px;border-radius:17px}
  .bonus-card{min-height:320px;padding:28px 25px;border-radius:13px}
  .bonus-copy h2{font-size:28px;margin-bottom:18px}
  .bonus-copy p{font-size:13px;max-width:67%}
  .bonus-badge{top:28px;right:22px}
  .bonus-socials{position:relative;top:auto;right:auto;align-self:flex-start;margin-bottom:18px;gap:8px}
  .bonus-card--promo{min-height:334px}
  .bonus-bottom{margin-top:27px}
  .bonus-bottom--promo{max-width:370px}
  .bonus-art--chest{width:310px;right:-92px;bottom:-60px}
  .bonus-art--percent{width:280px;right:-89px;bottom:10px}
}
@media(max-width:460px){
  .bonus-card{padding:22px 20px;min-height:322px}
  .bonus-card--rewards{padding-top:60px}
  .bonus-copy h2{font-size:25px}
  .bonus-copy p{font-size:12px;max-width:75%}
  .bonus-badge{top:20px;left:20px;right:auto;font-size:9px}
  .bonus-art--chest{width:248px;right:-100px;bottom:-41px}
  .bonus-art--percent{width:185px;right:-88px;bottom:63px}
  .bonus-card--promo .bonus-copy p{max-width:70%}
  .bonus-bottom--rewards{width:75%}
  .bonus-join{min-width:150px;padding:12px 16px;font-size:13px!important;gap:13px}
  .bonus-countdown time{padding:10px 18px;font-size:24px}
  .bonus-promo-form input{font-size:11px;padding:9px 6px}
  .bonus-promo-form button{font-size:10px;padding:12px 10px}
  .bonus-socials{margin-bottom:15px}
  .bonus-message{font-size:11px}
}
@media(max-width:360px){
  .bonus-card{padding-left:17px;padding-right:17px}
  .bonus-copy h2{font-size:23px}
  .bonus-art--chest{width:207px;right:-84px;bottom:-40px}
  .bonus-art--percent{width:140px;right:-75px;bottom:62px}
  .bonus-card--promo .bonus-copy p{max-width:75%}
  .bonus-promo-form{gap:3px;padding:5px}
}
@media(prefers-reduced-motion:reduce){.bonus-card *{transition:none!important}}
