#modal.case-detail-modal .case-phone-shell,
#modal.case-stage-modal .case-opening-shell-v2{
  display:grid;
  gap:18px;
  padding:18px;
  background:linear-gradient(180deg, #090b19, #050612);
}

#modal.case-detail-modal .case-phone-hero{
  display:grid;
  gap:14px;
  padding:18px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(18,20,50,.92), rgba(9,11,29,.96));
  box-shadow:0 22px 56px rgba(0,0,0,.28);
}

#modal.case-detail-modal .case-phone-back{
  justify-self:start;
  border:none;
  color:#dce8ff;
  background:rgba(255,255,255,.06);
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}

#modal.case-detail-modal .case-phone-hero-copy{
  display:grid;
  gap:10px;
}

#modal.case-detail-modal .case-phone-hero-copy h2{
  margin:0;
  font-size:clamp(30px, 5vw, 42px);
  line-height:.92;
  letter-spacing:-.04em;
}

#modal.case-detail-modal .case-phone-price-line{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}

#modal.case-detail-modal .case-phone-price .balance-inline,
#modal.case-stage-modal .case-opening-price-v2 .balance-inline{
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

#modal.case-detail-modal .case-phone-mode-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 11px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

#modal.case-detail-modal .case-phone-mode-badge.is-demo{
  color:#cfe3ff;
  background:rgba(59,130,246,.18);
}

#modal.case-detail-modal .case-phone-mode-badge.is-live{
  color:#e4f8ff;
  background:rgba(16,185,129,.16);
}

#modal.case-detail-modal .case-phone-cover{
  position:relative;
  min-height:280px;
  border-radius:26px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(15,18,41,.98), rgba(7,9,23,.98));
}

#modal.case-detail-modal .case-phone-cover::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:58%;
  height:14%;
  transform:translateX(-50%);
  border-radius:999px;
  background:radial-gradient(circle, rgba(59,130,246,.22), transparent 72%);
}

#modal.case-detail-modal .case-phone-cover img{
  width:100%;
  height:100%;
  object-fit:contain;
  transform:scale(1.18);
  filter:none;
}

#modal.case-detail-modal .case-phone-controls{
  display:grid;
  gap:12px;
  padding:16px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(18,20,50,.72), rgba(9,11,29,.9));
}

#modal.case-detail-modal .case-phone-control-block{
  display:grid;
  gap:8px;
}

#modal.case-detail-modal .case-open-counts-wide{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:8px;
}

#modal.case-detail-modal .case-phone-switch-row{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

#modal.case-detail-modal .case-mode-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#9da9bb;
  font-weight:800;
  cursor:pointer;
}

#modal.case-detail-modal .case-mode-chip.active{
  color:#fff;
  border-color:rgba(59,130,246,.36);
  background:rgba(59,130,246,.14);
}

#modal.case-detail-modal .case-mode-chip.is-fast.active{
  border-color:rgba(250,204,21,.38);
  background:rgba(250,204,21,.14);
}

#modal.case-detail-modal .case-mode-chip-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:currentColor;
}

#modal.case-detail-modal .case-phone-note,
#modal.case-detail-modal .case-phone-hint{
  color:#9ba8bc;
  font-size:12px;
  line-height:1.5;
}

#modal.case-detail-modal .case-phone-open-btn{
  min-height:54px;
  border-radius:20px;
}

#modal.case-detail-modal .case-phone-prizes{
  display:grid;
  gap:14px;
}

#modal.case-detail-modal .case-phone-prizes-head{
  display:grid;
  gap:4px;
  text-align:center;
}

#modal.case-detail-modal .case-phone-prizes-head h3{
  margin:0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:#8f9db4;
}

#modal.case-detail-modal .case-prize-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

#modal.case-detail-modal .case-prize-card{
  position:relative;
  display:grid;
  gap:10px;
  padding:10px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(18,20,50,.7), rgba(10,11,29,.86));
  overflow:hidden;
}

#modal.case-detail-modal .case-prize-card-price{
  position:absolute;
  top:10px;
  right:10px;
  z-index:2;
  padding:4px 7px;
  border-radius:999px;
  background:rgba(10,12,26,.72);
  font-size:10px;
  font-weight:900;
}

#modal.case-detail-modal .case-prize-card-visual{
  display:grid;
  place-items:center;
  aspect-ratio:1/1;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(26,27,58,.98), rgba(18,20,44,.96));
}

#modal.case-detail-modal .case-prize-card-visual img{
  width:74%;
  height:74%;
  object-fit:contain;
  filter:none;
}

#modal.case-detail-modal .case-prize-card-bottom{
  display:grid;
  gap:8px;
  justify-items:center;
}

#modal.case-detail-modal .case-prize-card-name{
  width:100%;
  min-height:32px;
  text-align:center;
  font-size:11px;
  font-weight:800;
  line-height:1.35;
}

#modal.case-stage-modal .case-opening-topline-v2{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

#modal.case-stage-modal .case-opening-topline-v2 h3{
  margin:6px 0 0;
  font-size:clamp(28px, 4vw, 38px);
  line-height:.95;
}

#modal.case-stage-modal .case-opening-stage-v2{
  position:relative;
  display:grid;
  gap:12px;
  padding:22px 0 8px;
}

#modal.case-stage-modal .case-opening-pointer-v2{
  position:absolute;
  top:0;
  left:50%;
  z-index:4;
  width:18px;
  height:14px;
  transform:translateX(-50%);
  background:linear-gradient(180deg, #60a5fa, #2563eb);
  clip-path:polygon(50% 100%, 0 0, 100% 0);
}

#modal.case-stage-modal .case-opening-rows-v2{
  display:grid;
  gap:12px;
}

#modal.case-stage-modal .case-open-row{
  display:grid;
  gap:8px;
}

#modal.case-stage-modal .case-open-result{
  min-height:18px;
  opacity:0;
  text-align:center;
  transition:opacity .2s ease, transform .2s ease;
}

#modal.case-stage-modal .case-open-result-top{
  color:#fff;
  font-size:12px;
  font-weight:900;
  transform:translateY(8px);
}

#modal.case-stage-modal .case-open-result-bottom{
  color:#d4e7ff;
  font-size:12px;
  font-weight:800;
  transform:translateY(-8px);
}

#modal.case-stage-modal .case-open-row.is-finished .case-open-result{
  opacity:1;
  transform:none;
}

#modal.case-stage-modal .case-open-row-shell{
  position:relative;
  padding:10px 0;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(14,15,34,.98), rgba(8,10,24,.98));
  box-shadow:0 12px 26px rgba(0,0,0,.18);
}

#modal.case-stage-modal .case-open-row-shell::before{
  content:"";
  position:absolute;
  inset:10px calc(50% - 44px);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  pointer-events:none;
}

#modal.case-stage-modal .case-open-row-window{
  position:relative;
  overflow:hidden;
}

#modal.case-stage-modal .case-open-row-track{
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 calc(50% - 40px);
  will-change:transform;
}

#modal.case-stage-modal .case-open-reel-card{
  display:grid;
  place-items:center;
  width:80px;
  min-width:80px;
  height:80px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:#151933;
  opacity:.28;
  transition:transform .55s cubic-bezier(.34,1.56,.64,1), opacity .3s ease, border-color .3s ease, box-shadow .3s ease;
  box-shadow:none;
  filter:none;
}

#modal.case-stage-modal .case-open-reel-visual{
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
}

#modal.case-stage-modal .case-open-reel-visual img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:none;
  image-rendering:auto;
}

#modal.case-stage-modal .case-open-reel-card.is-winning{
  opacity:1;
  transform:scale(1.16);
  border-color:#3b82f6;
  box-shadow:0 0 0 1px rgba(59,130,246,.45), 0 10px 24px rgba(59,130,246,.18);
  z-index:2;
}

#modal.case-stage-modal .case-opening-status-v2{
  min-height:20px;
  text-align:center;
  color:#9fb1c8;
  font-size:12px;
  font-weight:700;
}

#modal.case-stage-modal .case-opening-actions-v2{
  display:grid;
}

@media (max-width:560px){
  #modal.case-detail-modal .case-phone-switch-row{
    grid-template-columns:1fr;
  }

  #modal.case-detail-modal .case-prize-grid{
    gap:8px;
  }

  #modal.case-detail-modal .case-prize-card{
    padding:8px;
    border-radius:20px;
  }

  #modal.case-detail-modal .case-prize-card-name{
    font-size:10px;
  }

  #modal.case-stage-modal .case-open-row-track{
    gap:12px;
    padding:0 calc(50% - 32px);
  }

  #modal.case-stage-modal .case-open-reel-card{
    width:64px;
    min-width:64px;
    height:64px;
    border-radius:18px;
  }

  #modal.case-stage-modal .case-open-reel-visual{
    width:44px;
    height:44px;
  }
}
