/* پایه */
*{ box-sizing:border-box }
#blt-app { max-width:720px; margin:24px auto; font-family:iransans,tahoma,sans-serif; }
.blt-card { background:#0f1220; color:#e9ecf1; border-radius:16px; padding:20px; box-shadow:0 10px 24px rgba(0,0,0,.35); border:1px solid #1e2345; }
.blt-title { font-size:20px; font-weight:700; margin-bottom:12px; }

/* فرم ثبت نام */
.blt-register label { display:block; margin-top:10px; opacity:.9 }
.blt-register input { width:100%; padding:10px 12px; border-radius:12px; border:1px solid #2b335e; background:#151936; color:#fff; outline:none; }
.blt-register button { margin-top:12px; width:100%; padding:12px; border:none; border-radius:14px; background:linear-gradient(135deg,#ff8a00,#ff5500); color:#fff; font-weight:700; cursor:pointer; }
.blt-note { margin-top:8px; font-size:12px; opacity:.7; }

/* انتظار */
.blt-loading { width:36px; height:36px; border-radius:50%; border:3px solid #3a4272; border-top-color:#ff8a00; animation:spin 1s linear infinite; margin:14px auto; }
@keyframes spin { to { transform: rotate(360deg);} }

/* حدس + نام/موبایل */
.blt-yourguess { text-align:right; margin:6px 0 2px; }
.blt-yourguess.top { text-align:right; font-weight:700; margin-bottom:4px; }
.blt-userinfo{ margin:2px 0 8px; font-size:13px; opacity:.85; text-align:right; }
.blt-userinfo.top{ margin-top:0; }

/* اسلات‌ها */
.blt-live .blt-slots{
  direction:ltr; width:100%;
  display:grid;
  grid-template-columns: repeat(11, minmax(0,1fr));
  gap:6px; margin:10px 0 14px;
}
.blt-slot {
  aspect-ratio:1/1;
  min-width: 0; /* برای جلوگیری از بیرون‌زدن گرید */
  display:flex; align-items:center; justify-content:center;
  border-radius:12px; font-weight:800; font-family:ui-monospace,monospace;
  font-size:clamp(12px, 2.8vw, 18px);
  border:1px solid transparent;
}
.blt-grey { background:#2a2e55; color:#9aa1d6; border-color:#39407a; border-style:dashed; }
.blt-green{ background:#1e3b2a; color:#a7ffb3; border-color:#1ed760; box-shadow:0 0 0 2px rgba(30,215,96,.25) inset; }
.blt-red  { background:#3b1e1e; color:#ffb3b3; border-color:#ff4444; box-shadow:0 0 0 2px rgba(255,68,68,.2) inset; }

/* خلاصه پایین کارت */
.blt-summary{ display:flex; align-items:center; justify-content:space-between; background:#141938; padding:10px 12px; border-radius:12px; border:1px solid #263169; }

/* افکت سکه */
.blt-coin{ position:fixed; width:18px; height:18px; border-radius:50%; background: radial-gradient(circle at 30% 30%, #fff2, #0000), #f2d16b; box-shadow:0 2px 8px rgba(0,0,0,.5); z-index:9999; animation:drop .8s ease-out forwards; pointer-events:none; }
@keyframes drop { 0%{ transform:translateY(-40px); opacity:.0 } 100%{ transform:translateY(0); opacity:1 } }

/* باران سکه */
@keyframes rain { 0%{ transform:translateY(-10vh) rotate(0); opacity:0 } 10%{opacity:1} 100%{ transform:translateY(110vh) rotate(360deg); opacity:0 } }
.blt-coin-rain{ position:fixed; inset:0; pointer-events:none; z-index:9998; }
.blt-coin-rain .c{ position:absolute; width:16px; height:16px; border-radius:50%; background:#f2d16b; box-shadow:inset 0 0 3px #a0781f, 0 2px 6px rgba(0,0,0,.35); animation:rain 1.6s linear forwards; }

/* ریسپانسیو موبایل */
@media (max-width:480px){
  .blt-card{ padding:14px }
  .blt-live .blt-slots{ gap:4px; }
  .blt-slot{ border-radius:10px; }
}
@media (max-width:360px){
  .blt-live .blt-slots{ gap:3px; }
  .blt-slot{ font-size:12px; }
}
