/* CSGOTUNE · neon v3 — own identity: "cut gem" facets, electric sweeps, diamond motifs. Loaded after neon2.css */
:root{--cut:14px}

/* background: drifting gem facets + vignette */
body{background-image:radial-gradient(900px 500px at 12% -8%,rgba(47,155,255,.16),transparent 70%),radial-gradient(800px 520px at 100% 30%,rgba(154,120,255,.10),transparent 70%)!important;background-size:auto!important;background-attachment:fixed!important}

/* section titles: diamond bullet + fading rule */
.sec h2{display:flex;align-items:center;gap:12px}
.sec h2:before{content:"";width:12px;height:12px;flex:0 0 auto;background:linear-gradient(135deg,#bff0ff,#3fa9ff);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);filter:drop-shadow(0 0 6px #3fa9ff)}
.sec h2:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(63,169,255,.6),transparent)}

/* cut-corner cards */
.ccard,.mode,.step{clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));border-radius:0!important;border:0!important;position:relative}
.ccard{padding:16px 14px 14px;background:radial-gradient(220px 150px at 50% 36%,rgba(63,169,255,.28),transparent 72%),linear-gradient(180deg,#0c1a3c,#060c1f)!important;transition:transform .2s,filter .2s;overflow:hidden}
.ccard:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(127,227,255,.7),transparent 28%,transparent 72%,rgba(154,120,255,.6));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);padding:1px;pointer-events:none}
.ccard:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(190,240,255,.25),transparent);transform:skewX(-20deg);transition:left .6s}
.ccard:hover{transform:translateY(-5px);filter:drop-shadow(0 12px 22px rgba(63,169,255,.55))}
.ccard:hover:after{left:130%}
.ccard>svg,.ccard>.art,.ccard .cicon{transition:transform .25s;filter:drop-shadow(0 10px 14px rgba(63,169,255,.55))}
.ccard:hover>svg,.ccard:hover>.art,.ccard:hover .cicon{transform:translateY(-6px) scale(1.07)}
.ccard .gold{font:800 18px var(--display);color:#ffd36b;text-shadow:0 0 14px rgba(255,200,80,.5)}
.mode{background:linear-gradient(180deg,#0c1a3c,#060c1f)!important}
.mode:before{height:3px}
.step{background:linear-gradient(180deg,#0b1736,#060c1f)!important}

/* hero: electric sweep + corner brackets */
.hero{border-radius:6px!important;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.hero:after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:22%;background:linear-gradient(100deg,transparent,rgba(127,227,255,.16),transparent);transform:skewX(-22deg);animation:sweep 6s ease-in-out infinite;pointer-events:none}
@keyframes sweep{0%,55%{left:-30%}100%{left:130%}}
.hero h1{font-style:italic;text-transform:uppercase;letter-spacing:.01em}
.stats{border-radius:6px!important}

/* buttons: shine sweep */
.btn{position:relative;overflow:hidden}
.btn.primary:not(:disabled):after{content:"";position:absolute;top:0;bottom:0;left:-70%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .5s}
.btn.primary:not(:disabled):hover:after{left:130%}

/* sidebar: active item bar + gem */
.mi.on:after{content:"";margin-left:auto;width:8px;height:8px;background:var(--neon2);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);box-shadow:0 0 8px var(--neon2)}

/* modals + dropdowns */
.modal-box{border-radius:6px;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));border:0;background:linear-gradient(180deg,#0c1a3c,#050a1c)}
.chat{background:linear-gradient(180deg,rgba(6,12,30,.95),rgba(3,6,16,.95))}

/* balance chip + user */
.bal{border-radius:999px;border-color:rgba(255,200,80,.45);box-shadow:0 0 18px -6px rgba(255,200,80,.6)}
.userbtn{border-radius:999px}

/* ticker items */
.tkbtn{border-radius:999px}

/* reel: charge-up pulse before the stop + deeper vignette */
.reel.spinning:after{background:linear-gradient(#04081600,#040816)!important}
.reel{contain:paint}
.wonlist .wcard:first-child{box-shadow:0 0 22px -6px var(--rc)}

/* inputs */
input,select,textarea{border-radius:10px;background:rgba(4,10,26,.85);border-color:var(--edge)}

@media(max-width:820px){.hero{clip-path:none;border-radius:14px!important}:root{--cut:10px}}
@media(prefers-reduced-motion:reduce){.hero:after,.ccard:after{animation:none;transition:none}}

/* ================= BATTLE LIST FIX (v4) =================
   Проблемы: колонка имени была 170px, а имя 32px + бейджи (SPONSORED / замок / GROUP) шире -> налезали на кейсы;
   кейсы без "плитки"-обёртки и обрезались посреди иконки. */
.blist .brow{
  grid-template-columns:minmax(210px,270px) minmax(0,1fr) auto auto 130px;
  column-gap:20px;align-items:center;
}
/* --- колонка с именем --- */
.blist .b-id{min-width:0;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 8px}
.blist .b-id b.disp{
  flex:0 0 100%;min-width:0;max-width:100%;
  font-size:clamp(20px,2.1vw,30px);line-height:1.2;
  padding:0 .2em 3px 0;               /* запас под курсив и нижние выносные, иначе background-clip обрезает */
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.blist .b-id > span:not(.tag):not(.fb-tags){font-size:12px}
.blist .b-id .fb-tags{
  margin:0;display:inline-flex;flex-wrap:wrap;gap:6px;max-width:100%;font-size:0;
}
.blist .b-id .fb-tag{font-size:10px!important;line-height:1.2;padding:4px 8px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.blist .b-id .tag{align-self:center}

/* --- кейсы: плитка-обёртка у каждого --- */
.blist .b-cases{
  display:flex;flex-wrap:nowrap;align-items:center;gap:10px;min-width:0;overflow:hidden;padding:8px 4px;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent);
          mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent);
}
.blist .b-case{
  flex:0 0 auto;width:62px;height:62px;padding:5px;box-sizing:border-box;border-radius:14px;
  background:radial-gradient(circle at 50% 38%,rgba(63,169,255,.28),rgba(6,14,36,.9) 72%),#071230;
  border:1px solid rgba(110,190,255,.35);
  box-shadow:inset 0 0 14px rgba(63,169,255,.14),0 6px 16px -8px rgba(63,169,255,.7);
  filter:none;overflow:hidden;
  transition:transform .2s,border-color .2s,box-shadow .2s;
}
.blist .b-case:after{display:none}                       /* второй "эллипс" под кейсом дублировал .crate:before */
.blist .b-case:hover{transform:translateY(-3px);border-color:rgba(160,225,255,.8);box-shadow:inset 0 0 14px rgba(63,169,255,.25),0 10px 22px -8px #3fa9ff}
.blist .b-case .crate{width:100%;height:100%}
.blist .b-case .crate img{width:100%;height:100%}

/* --- места игроков --- */
.blist .b-seats{flex:none;min-width:0}

/* --- адаптив: перебиваем main-css (там .brow, у нас .blist .brow = выше специфичность) --- */
@media(max-width:1180px){
  .blist .brow{grid-template-columns:minmax(180px,230px) minmax(0,1fr) auto 120px}
  .blist .b-seats{display:none}
  .blist .b-case{width:54px;height:54px}
}
@media(max-width:820px){
  .blist .brow{grid-template-columns:minmax(0,1fr) auto;row-gap:10px;padding:12px 14px 12px 18px}
  .blist .b-cases{grid-column:1/-1;order:3}
  .blist .b-act{grid-column:1/-1;order:4}
  .blist .b-cost{text-align:right}
  .blist .b-state{display:none!important}
  .blist .b-id b.disp{font-size:22px}
  .blist .b-case{width:48px;height:48px;border-radius:12px;padding:4px}
}

/* --- обрезка курсива с градиентной заливкой (background-clip:text режет всё, что выходит за коробку) --- */
.b-id b.disp{display:block;line-height:1.2;padding:0 .2em 3px 0}
.page-head h1,.sec h2{padding-right:.2em;padding-bottom:2px}

/* ================= BATTLE ROOM: цепочка кейсов (v4) =================
   Было: drop-shadow активного кейса резался .chain{overflow:hidden} -> прямоугольник со сдвигом; у кейсов не было рамки. */
.rbar .chain{
  align-items:center;gap:10px;padding:22px 16px;margin:-10px 0;min-width:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);
          mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);
}
.rbar .chain .cc,.rbar .chain .cc.act{
  position:relative;box-sizing:border-box;flex:0 0 auto;width:48px;height:48px;padding:5px;margin:0;
  border-radius:13px;filter:none;
  background:radial-gradient(circle at 50% 38%,rgba(63,169,255,.22),rgba(6,14,36,.92) 74%),#071230;
  border:1px solid rgba(110,190,255,.28);
  box-shadow:inset 0 0 12px rgba(63,169,255,.12);
  opacity:.5;transition:opacity .25s,border-color .25s,box-shadow .25s,transform .25s;
}
.rbar .chain .cc.past{opacity:.8}
.rbar .chain .cc.act{
  opacity:1;transform:scale(1.1);border-color:#7fe3ff;
  box-shadow:inset 0 0 14px rgba(127,227,255,.3),0 0 0 1px rgba(127,227,255,.35),0 0 18px -2px #3fa9ff;
  animation:ccp2 1.1s ease-in-out infinite;
}
@keyframes ccp2{50%{transform:scale(1.18);box-shadow:inset 0 0 16px rgba(127,227,255,.4),0 0 0 1px rgba(127,227,255,.5),0 0 22px 0 #3fa9ff}}
.rbar .chain .cc .crate{width:100%;height:100%}
.rbar .chain .cc .crate img{width:100%;height:100%}
.rbar .chain .cc .crate:after{display:none}          /* прямоугольный радиальный градиент давал "смещённый оверлей" */
@media(prefers-reduced-motion:reduce){.rbar .chain .cc.act{animation:none}}

/* ================= CREATE BATTLE: выбор кейсов в ОТДЕЛЬНОМ окне (v4) =================
   Раньше сетка кейсов жила внутри окна создания со своим скроллом (max-height:46vh) внутри скролла модалки -> дёргалось.
   Теперь: окно создания показывает только выбранные кейсы, а выбор — отдельное окно (.cbp) с одним скроллом. */

/* --- окно создания: кнопка + компактный список выбранных --- */
.cb-pickbtn{padding:10px 18px;border:0;border-radius:9px;font:800 12px var(--display);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;color:#fff;
  background:linear-gradient(180deg,#63c2ff,#2a7ff2);box-shadow:0 0 18px -5px #3fa9ff,inset 0 1px 0 rgba(255,255,255,.4)}
.cb-pickbtn:hover{filter:brightness(1.12)}
.cb-bar .cb-clear{margin-left:auto}
.cb-empty{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin-top:12px;padding:26px 14px;border-radius:14px;cursor:pointer;
  border:1.5px dashed rgba(110,190,255,.45);background:rgba(8,18,42,.55);color:#cfe0ff;font:700 14px var(--display);transition:.15s}
.cb-empty:hover{border-color:var(--neon2);background:rgba(63,169,255,.12);color:#fff}
.cb-empty .cb-plus{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--neon2);font:700 20px/1 var(--display);color:var(--neon2)}
.cb-selgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:10px;margin-top:12px}
.cb-selgrid .pick{padding:10px 8px 9px;border-radius:13px;border:1px solid var(--neon2);gap:4px;
  background:radial-gradient(130px 90px at 50% 25%,rgba(63,169,255,.22),transparent 75%),linear-gradient(180deg,#0b1736,#060c1f);box-shadow:0 0 18px -8px var(--neon)}
.cb-selgrid .pick-art{width:48%}
.cb-selgrid .pick b{font-size:12.5px}
.cb-selgrid .pick .gold{font:800 13px var(--display);color:#ffd36b}

/* --- отдельное окно выбора --- */
.modal.wide:has(.cbp){width:min(1040px,96vw);max-width:none;padding:0;overflow:hidden}
.cbp{display:flex;flex-direction:column;height:min(86vh,820px);min-height:0}
.cbp-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px 60px 12px 20px}
.cbp-head h3{margin:0;padding:0;font:800 24px var(--display);font-style:italic;text-transform:uppercase;padding-right:.2em}
.cbp-sp{flex:1 1 0}
.cbp-back{padding:9px 14px;border-radius:9px;border:1px solid var(--edge);background:rgba(8,18,42,.8);color:#cfe0ff;font:700 12px var(--display);cursor:pointer;white-space:nowrap}
.cbp-back:hover{border-color:var(--neon2);color:#fff}
.cbp-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:0 20px 12px;border-bottom:1px solid var(--edge)}
.cbp-tools .cb-clear{margin-left:auto}
.cbp-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 20px;scrollbar-width:thin;scrollbar-color:#2a5aa8 transparent}
.cbp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;align-items:stretch}
.cbp-grid .pick{padding:14px 10px 12px;border-radius:14px;border:1px solid var(--edge);gap:6px;
  background:radial-gradient(150px 100px at 50% 30%,rgba(63,169,255,.2),transparent 75%),linear-gradient(180deg,#0b1736,#060c1f)}
.cbp-grid .pick.on{border-color:var(--neon2);box-shadow:0 0 22px -6px var(--neon)}
.cbp-grid .pick-art{width:62%;filter:drop-shadow(0 8px 10px rgba(63,169,255,.5))}
.cbp-grid .pick .gold{font:800 14px var(--display);color:#ffd36b}
.cbp-grid .pick .cb-add,.cbp-grid .pick .qty{margin-top:auto}      /* кнопки/счётчики на одной линии у всех карточек */
.cbp-grid .pick .qty{padding-top:4px}
.cbp-foot{display:flex;align-items:center;gap:12px;padding:12px 20px;border-top:1px solid var(--edge);background:rgba(4,9,24,.85)}
.cbp-foot .sp{flex:1}
@media(max-width:820px){
  .cbp{height:92vh}
  .cbp-head{padding:14px 52px 10px 14px}.cbp-head h3{font-size:20px}
  .cbp-tools{padding:0 14px 10px}.cbp-tools .cb-search{flex:1 1 100%}.cbp-tools .cb-clear{margin-left:0}
  .cbp-body{padding:12px 14px}.cbp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cbp-foot{padding:10px 14px}.cbp-foot .btn{flex:1}.cbp-foot .sp{display:none}
  .cb-selgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cb-bar .cb-pickbtn{flex:1 1 100%}
}