.wheel-profile-pane{overflow:hidden}
.wheel-shell{display:grid;grid-template-columns:minmax(320px,520px) minmax(280px,1fr);gap:28px;align-items:start}
.wheel-stage{position:relative;display:grid;place-items:center;padding:22px}
.wheel-pointer{position:absolute;z-index:5;top:5px;width:0;height:0;border-left:18px solid transparent;border-right:18px solid transparent;border-top:34px solid #111827;filter:drop-shadow(0 5px 4px rgba(15,23,42,.18))}
.fortune-wheel{position:relative;width:min(440px,86vw);aspect-ratio:1;border-radius:50%;border:12px solid #101827;box-shadow:0 22px 50px rgba(15,23,42,.18),inset 0 0 0 5px #fff;transition:transform 5.3s cubic-bezier(.12,.72,.08,1);overflow:hidden}
.fortune-wheel::after{content:"AS";position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:#101827;color:#2be31d;font-size:24px;font-weight:1000;border:6px solid #fff;box-shadow:0 8px 25px rgba(15,23,42,.25)}
.wheel-label{position:absolute;left:50%;top:50%;width:42%;transform-origin:0 0;text-align:right;padding-right:18px;color:#fff;font-weight:900;font-size:12px;text-shadow:0 1px 3px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wheel-panel{background:#fff;border:1px solid #e5eaf1;border-radius:24px;padding:24px;box-shadow:0 14px 34px rgba(15,23,42,.08)}
.wheel-panel h3{margin:0 0 8px;font-size:24px}
.wheel-status{padding:13px 15px;border-radius:14px;background:#f4f7fb;color:#475569;font-weight:800;margin:14px 0}
.wheel-spin-btn{width:100%;min-height:52px;border:0;border-radius:16px;background:linear-gradient(135deg,#2be31d,#18a90f);color:#071407;font-weight:1000;font-size:16px;cursor:pointer;box-shadow:0 12px 26px rgba(43,227,29,.25)}
.wheel-spin-btn:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}
.wheel-prizes{display:grid;gap:12px;margin-top:20px}
.wheel-prize-card{display:grid;grid-template-columns:74px 1fr;gap:14px;padding:14px;border-radius:18px;background:#fff;border:1px solid #e4e9ef}
.wheel-prize-card img{width:74px;height:74px;object-fit:contain;border-radius:12px;background:#fff}
.wheel-prize-card b{display:block;margin-bottom:4px}
.wheel-prize-meta{font-size:12px;color:#64748b;line-height:1.5}
.wheel-barcode{grid-column:1/-1;background:#fff;border:1px dashed #cbd5e1;border-radius:12px;padding:10px;overflow:auto;text-align:center}
.wheel-barcode svg{max-width:100%;height:72px}
.wheel-expired{opacity:.58}
.wheel-admin-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:20px}
.wheel-admin-card{background:#fff;border:1px solid #e1e7ef;border-radius:22px;padding:20px}
.wheel-admin-products{display:grid;gap:10px;max-height:520px;overflow:auto}
.wheel-admin-product{display:grid;grid-template-columns:52px 1fr 90px 38px;gap:10px;align-items:center;padding:10px;border:1px solid #e7ebf1;border-radius:14px}
.wheel-admin-product img{width:52px;height:52px;object-fit:contain}
.wheel-admin-product input{width:100%;height:40px;border:1px solid #d9e1eb;border-radius:10px;padding:0 10px}
.wheel-admin-remove{width:38px;height:38px;border:0;border-radius:10px;background:#fee2e2;color:#b91c1c;font-weight:900;cursor:pointer}
.wheel-product-picker{position:relative}
.wheel-picker-results{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);max-height:330px;overflow:auto;background:#fff;border:1px solid #dbe2eb;border-radius:14px;box-shadow:0 20px 45px rgba(15,23,42,.16)}
.wheel-picker-item{display:grid;grid-template-columns:44px 1fr;gap:10px;width:100%;padding:9px;border:0;border-bottom:1px solid #eef2f6;background:#fff;text-align:left;cursor:pointer}
.wheel-picker-item:hover{background:#f0fdf4}
.wheel-picker-item img{width:44px;height:44px;object-fit:contain}
.wheel-winner-table{width:100%;border-collapse:collapse}
.wheel-winner-table th,.wheel-winner-table td{padding:10px;border-bottom:1px solid #edf1f5;text-align:left;font-size:13px}
.wheel-scan-box{width:min(760px,calc(100% - 30px));margin:32px auto;background:#fff;padding:26px;border-radius:24px;box-shadow:0 18px 45px rgba(15,23,42,.1)}
.wheel-scan-input{width:100%;height:58px;border:2px solid #22c55e;border-radius:16px;padding:0 18px;font-size:20px;font-weight:900}
.wheel-scan-result{margin-top:18px}
@media(max-width:900px){.wheel-shell,.wheel-admin-grid{grid-template-columns:1fr}.fortune-wheel{width:min(390px,88vw)}}

/* Современное колесо: фото товаров вместо длинных названий */
.fortune-wheel{
  --wheel-radius:145px;
  transition:transform 6.1s cubic-bezier(.08,.78,.08,1);
  will-change:transform,filter;
}
.wheel-label{display:none!important}
.wheel-prize-visual{
  position:absolute;
  left:50%;
  top:50%;
  width:78px;
  height:78px;
  z-index:2;
  display:grid;
  place-items:center;
  transform:
    translate(-50%,-50%)
    rotate(var(--segment-angle))
    translateY(calc(var(--wheel-radius) * -1))
    rotate(calc(var(--segment-angle) * -1));
  transform-origin:center;
  pointer-events:none;
}
.wheel-prize-visual img,
.wheel-empty-icon{
  width:72px;
  height:72px;
  object-fit:contain;
  padding:7px;
  border-radius:20px;
  background:rgba(255,255,255,.96);
  border:3px solid rgba(255,255,255,.9);
  box-shadow:0 10px 22px rgba(15,23,42,.24),inset 0 0 0 1px rgba(15,23,42,.05);
}
.wheel-empty-icon{
  display:grid;
  place-items:center;
  color:#111827;
  font-size:34px;
  font-weight:1000;
}
.wheel-stage.is-spinning .wheel-pointer{animation:wheelPointerTick .16s ease-in-out infinite alternate}
.fortune-wheel.is-spinning{
  filter:saturate(1.16) drop-shadow(0 24px 30px rgba(43,227,29,.20));
  animation:wheelSpinGlow .7s ease-in-out infinite alternate;
}
.fortune-wheel.is-spinning .wheel-prize-visual img,
.fortune-wheel.is-spinning .wheel-empty-icon{
  animation:wheelPrizePulse .42s ease-in-out infinite alternate;
}
.fortune-wheel.is-finished{animation:wheelFinishPulse .8s ease-out}
@keyframes wheelPointerTick{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(5px) rotate(2deg)}}
@keyframes wheelSpinGlow{from{box-shadow:0 22px 50px rgba(15,23,42,.18),inset 0 0 0 5px #fff}to{box-shadow:0 28px 62px rgba(43,227,29,.32),inset 0 0 0 5px #fff}}
@keyframes wheelPrizePulse{from{transform:scale(.96)}to{transform:scale(1.03)}}
@keyframes wheelFinishPulse{0%{filter:brightness(1)}45%{filter:brightness(1.25) saturate(1.35)}100%{filter:brightness(1)}}
@media(max-width:900px){
  .fortune-wheel{--wheel-radius:125px}
  .wheel-prize-visual{width:66px;height:66px}
  .wheel-prize-visual img,.wheel-empty-icon{width:60px;height:60px;border-radius:17px}
}
@media(max-width:520px){
  .fortune-wheel{--wheel-radius:108px}
  .wheel-prize-visual{width:56px;height:56px}
  .wheel-prize-visual img,.wheel-empty-icon{width:52px;height:52px;padding:5px;border-radius:14px}
}


/* Улучшенный интерфейс настройки колеса в админке */
#wheel{
  --wheel-admin-green:#20c941;
  --wheel-admin-green-dark:#13a732;
  --wheel-admin-ink:#111827;
  --wheel-admin-muted:#667085;
  --wheel-admin-line:#e4e9f0;
  --wheel-admin-soft:#f6f8fb;
}

.wheel-admin-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:24px 26px;
  margin-bottom:18px;
  border-radius:24px;
  color:#fff;
  background:
    radial-gradient(circle at 85% 20%,rgba(43,227,29,.22),transparent 30%),
    linear-gradient(135deg,#101827,#18253b);
  box-shadow:0 18px 42px rgba(15,23,42,.16);
}

.wheel-admin-hero h2{
  margin:4px 0 7px;
  font-size:30px;
  line-height:1;
}

.wheel-admin-hero p{
  margin:0;
  color:#b7c0d1;
}

.wheel-admin-kicker,
.wheel-card-eyebrow{
  display:block;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.wheel-admin-kicker{color:#4bf153}
.wheel-card-eyebrow{color:#7a8699;margin-bottom:7px}

.wheel-admin-save{
  min-width:190px;
  min-height:48px;
  padding:0 20px;
  border:0;
  border-radius:15px;
  background:linear-gradient(135deg,#38ec4b,#1fbd36);
  color:#06150a;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 12px 26px rgba(32,201,65,.25);
}

.wheel-admin-save:disabled{opacity:.6;cursor:wait}

.wheel-admin-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
}

.wheel-summary-card{
  padding:15px 17px;
  border:1px solid var(--wheel-admin-line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}

.wheel-summary-card span{
  display:block;
  margin-bottom:5px;
  color:var(--wheel-admin-muted);
  font-size:12px;
}

.wheel-summary-card b{
  color:var(--wheel-admin-ink);
  font-size:19px;
}

#wheelSummaryStatus.is-on{color:var(--wheel-admin-green-dark)}

.wheel-admin-grid{
  grid-template-columns:minmax(330px,.86fr) minmax(480px,1.4fr);
  gap:18px;
}

.wheel-admin-card{
  padding:21px;
  border:1px solid var(--wheel-admin-line);
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 28px rgba(15,23,42,.055);
}

.wheel-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}

.wheel-card-head h3{
  margin:0;
  color:var(--wheel-admin-ink);
  font-size:20px;
}

.wheel-switch-row{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px;
  margin-bottom:15px;
  border:1px solid var(--wheel-admin-line);
  border-radius:16px;
  background:var(--wheel-admin-soft);
  cursor:pointer;
}

.wheel-switch-row span b{
  display:block;
  margin-bottom:4px;
  color:var(--wheel-admin-ink);
}

.wheel-switch-row span small{
  color:var(--wheel-admin-muted);
  line-height:1.35;
}

.wheel-switch-row input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.wheel-switch-row i{
  position:relative;
  flex:0 0 52px;
  width:52px;
  height:30px;
  border-radius:999px;
  background:#cbd3de;
  transition:.2s ease;
}

.wheel-switch-row i::after{
  content:"";
  position:absolute;
  left:4px;
  top:4px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 3px 8px rgba(15,23,42,.2);
  transition:.2s ease;
}

.wheel-switch-row input:checked+i{
  background:var(--wheel-admin-green);
}

.wheel-switch-row input:checked+i::after{
  transform:translateX(22px);
}

.wheel-settings-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.wheel-field{
  display:block;
  padding:13px;
  border:1px solid var(--wheel-admin-line);
  border-radius:15px;
}

.wheel-field>span{
  display:block;
  margin-bottom:8px;
  color:var(--wheel-admin-ink);
  font-size:12px;
  font-weight:900;
}

.wheel-field>div{
  display:flex;
  align-items:center;
  border:1px solid #d9e1eb;
  border-radius:11px;
  overflow:hidden;
  background:#fff;
}

.wheel-field input{
  width:100%;
  height:41px;
  padding:0 11px;
  border:0!important;
  outline:0;
  font-weight:900;
}

.wheel-field em{
  padding:0 10px;
  color:#7a8699;
  font-size:12px;
  font-style:normal;
}

.wheel-field small{
  display:block;
  margin-top:7px;
  color:#7a8699;
  font-size:10px;
  line-height:1.3;
}

.wheel-chance-box{
  padding:15px;
  margin-top:12px;
  border-radius:16px;
  background:#f7f9fc;
}

.wheel-chance-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
  font-size:12px;
  font-weight:900;
}

.wheel-chance-track{
  height:10px;
  overflow:hidden;
  border-radius:999px;
  background:#dde4ec;
}

.wheel-chance-track i{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#2be31d,#18a90f);
  transition:width .25s ease,background .25s ease;
}

.wheel-chance-track i.is-over{
  width:100%!important;
  background:linear-gradient(90deg,#ef4444,#c81e1e);
}

#wheelChanceTotal{
  margin:8px 0 0;
  font-size:11px;
}

.wheel-add-block{
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--wheel-admin-line);
}

.wheel-product-picker>input{
  width:100%;
  height:47px;
  padding:0 15px;
  border:1px solid #d8e0e9;
  border-radius:14px;
  outline:0;
  background:#fff;
  font-size:13px;
}

.wheel-product-picker>input:focus{
  border-color:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.10);
}

.wheel-products-note{
  padding:10px 12px;
  margin:-3px 0 14px;
  border-radius:12px;
  background:#f0fdf4;
  color:#327142;
  font-size:11px;
  line-height:1.4;
}

.wheel-count-badge{
  padding:7px 10px;
  border-radius:999px;
  background:#eef2f7;
  color:#536174;
  font-size:11px;
  font-weight:900;
}

.wheel-admin-products{
  gap:8px;
  max-height:545px;
  padding-right:4px;
}

.wheel-admin-product{
  grid-template-columns:58px minmax(0,1fr) 98px 38px;
  gap:11px;
  padding:10px;
  border:1px solid var(--wheel-admin-line);
  border-radius:16px;
  background:#fff;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.wheel-admin-product:hover{
  transform:translateY(-1px);
  border-color:#cbd5e1;
  box-shadow:0 8px 18px rgba(15,23,42,.07);
}

.wheel-product-image{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:12px;
  background:#f7f9fb;
}

.wheel-product-image img{
  width:100%;
  height:100%;
  padding:5px;
  object-fit:contain;
}

.wheel-product-copy{
  min-width:0;
}

.wheel-product-copy b{
  display:-webkit-box;
  overflow:hidden;
  color:var(--wheel-admin-ink);
  font-size:13px;
  line-height:1.25;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.wheel-product-copy small{
  display:block;
  margin-top:5px;
  color:#7b8798;
  font-size:10px;
}

.wheel-chance-input>span{
  display:block;
  margin-bottom:5px;
  color:#7b8798;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
}

.wheel-chance-input>div{
  display:flex;
  align-items:center;
  overflow:hidden;
  border:1px solid #d7dfe9;
  border-radius:11px;
  background:#fff;
}

.wheel-chance-input input{
  width:100%;
  height:38px;
  padding:0 8px;
  border:0!important;
  outline:0;
  font-weight:900;
}

.wheel-chance-input em{
  padding-right:8px;
  color:#7b8798;
  font-size:11px;
  font-style:normal;
}

.wheel-admin-remove{
  width:38px;
  height:38px;
  border-radius:11px;
  font-size:18px;
}

.wheel-products-empty{
  min-height:230px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:7px;
  padding:24px;
  border:1px dashed #ccd5e1;
  border-radius:16px;
  color:#7a8699;
  text-align:center;
}

.wheel-products-empty div{font-size:34px}
.wheel-products-empty b{color:#344054}
.wheel-products-empty span{max-width:280px;font-size:11px;line-height:1.4}

.wheel-picker-results{
  border-radius:16px;
}

.wheel-picker-item{
  padding:10px;
}

.wheel-winners-card{
  margin-top:18px;
}

.wheel-table-wrap{
  overflow:auto;
  border:1px solid var(--wheel-admin-line);
  border-radius:15px;
}

.wheel-winner-table{
  min-width:760px;
}

.wheel-winner-table th{
  padding:11px 13px;
  background:#f7f9fc;
  color:#6b7789;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.wheel-winner-table td{
  padding:12px 13px;
  font-size:12px;
}

.wheel-winner-table code{
  padding:5px 8px;
  border-radius:8px;
  background:#f2f4f7;
  color:#344054;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:11px;
  font-weight:900;
}

.wheel-status-pill{
  display:inline-flex;
  align-items:center;
  padding:6px 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
}

.wheel-status-pill.is-active{background:#fff7d6;color:#8a6500}
.wheel-status-pill.is-done{background:#dcfce7;color:#157b37}
.wheel-status-pill.is-expired{background:#fee2e2;color:#b42318}

.wheel-table-empty{
  padding:28px;
  color:#7b8798;
  text-align:center;
}

@media(max-width:1050px){
  .wheel-admin-summary{grid-template-columns:repeat(2,1fr)}
  .wheel-admin-grid{grid-template-columns:1fr}
}

@media(max-width:650px){
  .wheel-admin-hero{align-items:flex-start;flex-direction:column}
  .wheel-admin-save{width:100%}
  .wheel-admin-summary{grid-template-columns:1fr 1fr}
  .wheel-settings-fields{grid-template-columns:1fr}
  .wheel-admin-product{grid-template-columns:52px minmax(0,1fr) 84px 36px}
}


/* AutoStyle — лёгкое визуальное улучшение клиентского колеса */
.wheel-profile-pane{
  position:relative;
  border:1px solid #dfe6ee;
  border-radius:28px;
  background:
    radial-gradient(circle at 7% 5%,rgba(43,227,29,.07),transparent 24%),
    linear-gradient(180deg,#ffffff 0%,#fbfcfe 100%);
}

.wheel-profile-pane::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:4px;
  border-radius:28px 28px 0 0;
  background:linear-gradient(90deg,#22d31b,#7af06c,#22d31b);
}

.wheel-profile-pane > h2{
  margin-bottom:8px;
  letter-spacing:-.02em;
}

.wheel-profile-pane > p{
  max-width:620px;
  margin-top:0;
  color:#6b778c;
}

.wheel-shell{
  gap:34px;
  padding-top:10px;
}

.wheel-stage{
  min-height:520px;
  padding:30px 24px 34px;
  border-radius:28px;
  background:
    radial-gradient(circle at 50% 48%,rgba(43,227,29,.09),transparent 42%);
}

.fortune-wheel{
  border-width:11px;
  border-color:#121a2a;
  outline:5px solid rgba(255,255,255,.92);
  outline-offset:-18px;
  box-shadow:
    0 20px 46px rgba(15,23,42,.16),
    0 0 0 1px rgba(15,23,42,.08);
}

.fortune-wheel::before{
  content:"";
  position:absolute;
  inset:17px;
  z-index:1;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  pointer-events:none;
}

.fortune-wheel::after{
  width:94px;
  height:94px;
  border:7px solid #fff;
  box-shadow:
    0 8px 22px rgba(15,23,42,.22),
    inset 0 0 0 1px rgba(255,255,255,.16);
  letter-spacing:-.04em;
}

.wheel-pointer{
  top:7px;
  border-left-width:19px;
  border-right-width:19px;
  border-top-width:35px;
  border-top-color:#121a2a;
  filter:drop-shadow(0 5px 5px rgba(15,23,42,.22));
}

.wheel-prize-visual img,
.wheel-empty-icon{
  border:2px solid rgba(255,255,255,.95);
  background:#fff;
  box-shadow:
    0 7px 16px rgba(15,23,42,.16),
    inset 0 0 0 1px #e7ebf0;
}

.wheel-panel{
  border-color:#dfe6ee;
  background:linear-gradient(180deg,#ffffff,#fbfdfb);
  box-shadow:0 14px 34px rgba(15,23,42,.07);
}

.wheel-panel h3{
  letter-spacing:-.025em;
}

.wheel-panel > p{
  color:#6b778c;
  line-height:1.45;
}

.wheel-status{
  border:1px solid #e5eaf0;
  background:#f3f6fa;
}

.wheel-spin-btn{
  border:1px solid rgba(16,137,12,.18);
  background:linear-gradient(180deg,#27df20,#18be13);
  box-shadow:0 10px 22px rgba(36,211,28,.22);
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}

.wheel-spin-btn:not(:disabled):hover{
  transform:translateY(-1px);
  filter:brightness(1.025);
  box-shadow:0 13px 26px rgba(36,211,28,.27);
}

.wheel-spin-btn:not(:disabled):active{
  transform:translateY(0);
}

.wheel-prizes{
  gap:10px;
}

.wheel-prize-card{
  border-color:#e1e7ee;
  box-shadow:0 6px 16px rgba(15,23,42,.035);
}

.wheel-prize-card img{
  border:1px solid #eef1f5;
}

.wheel-prize-card b{
  line-height:1.2;
}

.wheel-barcode{
  background:#fff;
  border-color:#cbd4df;
}

@media(max-width:900px){
  .wheel-stage{
    min-height:auto;
    padding:24px 12px 30px;
  }

  .wheel-shell{
    gap:24px;
  }
}

@media(max-width:520px){
  .wheel-profile-pane{
    border-radius:22px;
  }

  .wheel-profile-pane::before{
    border-radius:22px 22px 0 0;
  }

  .wheel-stage{
    padding-left:0;
    padding-right:0;
    background:none;
  }

  .fortune-wheel{
    border-width:9px;
    outline-width:4px;
    outline-offset:-15px;
  }

  .fortune-wheel::after{
    width:78px;
    height:78px;
    border-width:6px;
    font-size:21px;
  }

  .wheel-panel{
    padding:20px;
    border-radius:20px;
  }
}

@media(prefers-reduced-motion:reduce){
  .wheel-spin-btn{
    transition:none;
  }
}


/* winnings collapse */
.wheel-prize-extra{display:none;}
.wheel-prizes.is-expanded .wheel-prize-extra,
#wheelPrizeList.is-expanded .wheel-prize-extra{display:grid;}
.wheel-prizes-toggle{
width:100%;
margin-top:14px;
padding:12px 16px;
border:1px solid #d9e1ea;
background:#fff;
border-radius:14px;
font-weight:700;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}
.wheel-prizes-toggle:hover{background:#f5f7fa;}


/* AUTO-STYLE MOBILE-FIRST MEGA WHEEL */
.wheel-mobile-hero{display:none}
.wheel-game-card{position:relative}
.wheel-light-ring,.wheel-center-cap,.wheel-mobile-status-card,.wheel-spin-main,.wheel-result-modal{display:none}
.wheel-panel-kicker,.wheel-prizes-head span{
  display:block;
  margin-bottom:7px;
  color:#18b92c;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.13em;
}
.wheel-prizes-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:end;
  margin:22px 0 10px;
}
.wheel-prizes-head h3{margin:0;font-size:21px}
.wheel-prizes-head small{max-width:190px;color:#7b8492;text-align:right;font-size:11px}

@media(max-width:700px){
  html.wheel-modal-open,html.wheel-modal-open body{overflow:hidden!important}
  .wheel-profile-pane{
    padding:0!important;
    overflow:visible!important;
    border:0!important;
    background:
      radial-gradient(circle at 50% 7%,rgba(43,227,29,.18),transparent 30%),
      linear-gradient(180deg,#0b0f15 0 495px,#f4f6f9 495px 100%);
  }
  .wheel-desktop-heading{display:none!important}
  .wheel-mobile-hero{
    display:block;
    padding:24px 20px 12px;
    color:#fff;
    text-align:center;
  }
  .wheel-mobile-kicker{
    display:inline-flex;
    padding:7px 10px;
    border:1px solid rgba(75,241,83,.35);
    border-radius:999px;
    background:rgba(75,241,83,.09);
    color:#4bf153;
    font-size:9px;
    font-weight:1000;
    letter-spacing:.15em;
  }
  .wheel-mobile-hero h2{
    margin:12px 0 7px;
    color:#fff;
    font-size:30px;
    line-height:1;
    letter-spacing:-.04em;
  }
  .wheel-mobile-hero p{
    max-width:330px;
    margin:0 auto;
    color:#b9c1cf;
    font-size:13px;
    line-height:1.45;
  }
  .wheel-mobile-trust{
    display:flex;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:13px;
  }
  .wheel-mobile-trust span{
    padding:6px 9px;
    border-radius:999px;
    background:#171e29;
    color:#dbe2ec;
    font-size:10px;
    font-weight:800;
  }
  .wheel-shell{
    display:block!important;
    padding:0 12px calc(34px + env(safe-area-inset-bottom));
  }
  .wheel-game-card{
    padding:10px 10px 14px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:29px;
    background:linear-gradient(155deg,#151d29,#080b10);
    box-shadow:0 25px 50px rgba(0,0,0,.32);
    overflow:hidden;
  }
  .wheel-game-card::before{
    content:"";
    position:absolute;
    inset:-40% 5% auto;
    height:260px;
    background:radial-gradient(circle,rgba(43,227,29,.16),transparent 65%);
    pointer-events:none;
  }
  .wheel-stage{
    position:relative;
    width:100%;
    padding:14px 0 10px!important;
    overflow:visible;
  }
  .wheel-light-ring{
    display:block;
    position:absolute;
    z-index:0;
    width:min(88vw,365px);
    aspect-ratio:1;
    border-radius:50%;
    background:
      repeating-conic-gradient(from -2deg,#45f34a 0 2deg,transparent 2deg 12deg);
    filter:drop-shadow(0 0 14px rgba(43,227,29,.35));
    opacity:.55;
    animation:wheelLights 5s linear infinite;
  }
  .fortune-wheel{
    z-index:1;
    width:min(82vw,340px)!important;
    --wheel-radius:calc(min(82vw,340px) * .34)!important;
    border-width:9px!important;
    border-color:#111a28!important;
    box-shadow:
      0 22px 45px rgba(0,0,0,.42),
      0 0 0 3px rgba(75,241,83,.24),
      inset 0 0 0 4px rgba(255,255,255,.92)!important;
  }
  .fortune-wheel::after{display:none!important}
  .wheel-center-cap{
    display:grid;
    position:absolute;
    z-index:6;
    left:50%;
    top:50%;
    width:72px;
    height:72px;
    transform:translate(-50%,-50%);
    place-items:center;
    align-content:center;
    border:5px solid #fff;
    border-radius:50%;
    background:linear-gradient(145deg,#182435,#080d14);
    color:#40f044;
    box-shadow:0 12px 28px rgba(0,0,0,.42),inset 0 0 0 2px rgba(75,241,83,.25);
  }
  .wheel-center-cap b{font-size:23px;line-height:.9}
  .wheel-center-cap small{font-size:8px;font-weight:1000;color:#fff;letter-spacing:.16em}
  .wheel-pointer{
    top:2px!important;
    z-index:8!important;
    width:52px!important;
    height:64px!important;
    border:0!important;
    border-radius:17px 17px 28px 28px;
    background:linear-gradient(180deg,#46f34a,#16a82a);
    box-shadow:0 10px 26px rgba(43,227,29,.38),inset 0 0 0 4px rgba(255,255,255,.28);
    filter:none!important;
  }
  .wheel-pointer::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-13px;
    transform:translateX(-50%);
    border-left:13px solid transparent;
    border-right:13px solid transparent;
    border-top:19px solid #16a82a;
  }
  .wheel-pointer i{
    display:block;
    width:13px;
    height:13px;
    margin:13px auto 0;
    border-radius:50%;
    background:#071008;
    box-shadow:0 0 0 4px rgba(255,255,255,.7);
  }
  .wheel-prize-visual{width:58px!important;height:58px!important}
  .wheel-prize-visual img,.wheel-empty-icon{
    width:54px!important;
    height:54px!important;
    padding:5px!important;
    border-width:2px!important;
    border-radius:16px!important;
    box-shadow:0 7px 18px rgba(0,0,0,.28)!important;
  }
  .wheel-empty-icon{font-size:27px!important}
  .wheel-mobile-status-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin:7px 4px 10px;
    padding:12px 14px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:17px;
    background:rgba(255,255,255,.055);
  }
  .wheel-mobile-status-card small{
    display:block;
    margin-bottom:4px;
    color:#7f8999;
    font-size:8px;
    font-weight:1000;
    letter-spacing:.13em;
  }
  .wheel-mobile-status-card strong{
    display:block;
    color:#fff;
    font-size:13px;
    line-height:1.25;
  }
  .wheel-live-dot{
    width:12px;
    height:12px;
    flex:0 0 auto;
    border-radius:50%;
    background:#35e944;
    box-shadow:0 0 0 5px rgba(53,233,68,.12),0 0 18px rgba(53,233,68,.6);
    animation:wheelLive 1.6s ease-in-out infinite;
  }
  .wheel-spin-main{
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-height:64px!important;
    border-radius:20px!important;
    font-size:14px!important;
    box-shadow:0 14px 32px rgba(43,227,29,.27)!important;
  }
  .wheel-spin-main .wheel-spin-icon{
    font-size:29px;
    line-height:1;
  }
  .wheel-spin-main span:last-child{display:flex;flex-direction:column;text-align:left}
  .wheel-spin-main b{font-size:14px;letter-spacing:.03em}
  .wheel-spin-main small{margin-top:3px;font-size:9px;font-weight:800;opacity:.67}
  .wheel-spin-main:disabled{
    background:#29313d!important;
    color:#a8b1bf!important;
    opacity:1!important;
  }
  .wheel-side{
    margin-top:14px;
    padding:18px 14px;
    border-radius:26px;
    background:#fff;
  }
  .wheel-panel{display:none!important}
  .wheel-prizes-head{margin:0 0 12px}
  .wheel-prizes-head span{font-size:9px}
  .wheel-prizes-head h3{font-size:22px}
  .wheel-prizes-head small{max-width:135px;font-size:9px}
  .wheel-prizes{margin:0!important}
  .wheel-prize-items{display:grid;gap:10px}
  .wheel-prize-card{
    grid-template-columns:62px minmax(0,1fr)!important;
    gap:11px!important;
    padding:11px!important;
    border-radius:18px!important;
    background:#f7f9fb!important;
  }
  .wheel-prize-card img{width:62px!important;height:62px!important;border-radius:14px!important}
  .wheel-prize-card b{font-size:13px;line-height:1.25}
  .wheel-prize-meta{font-size:10px!important;line-height:1.45!important}
  .wheel-barcode{padding:8px!important;border-radius:12px!important}
  .wheel-barcode svg{height:55px!important}
  .wheel-barcode div b{font-size:10px}
  .wheel-prizes-toggle{min-height:46px;border-radius:15px!important}
  .wheel-result-modal{
    display:block;
    position:fixed;
    z-index:100000;
    inset:0;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease;
  }
  .wheel-result-modal.is-open{opacity:1;pointer-events:auto}
  .wheel-result-backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,6,12,.78);
    backdrop-filter:blur(9px);
  }
  .wheel-result-sheet{
    position:absolute;
    z-index:2;
    left:12px;
    right:12px;
    bottom:max(12px,env(safe-area-inset-bottom));
    padding:28px 20px 18px;
    border-radius:30px;
    background:
      radial-gradient(circle at 50% 0,rgba(43,227,29,.18),transparent 40%),
      #fff;
    text-align:center;
    transform:translateY(110%);
    transition:transform .38s cubic-bezier(.16,.8,.2,1);
    box-shadow:0 30px 90px rgba(0,0,0,.45);
  }
  .wheel-result-modal.is-open .wheel-result-sheet{transform:translateY(0)}
  .wheel-result-close{
    position:absolute;
    top:12px;
    right:12px;
    width:39px;
    height:39px;
    border:0;
    border-radius:14px;
    background:#eef1f5;
    font-size:25px;
    color:#111827;
  }
  .wheel-result-burst{
    width:70px;
    height:70px;
    display:grid;
    place-items:center;
    margin:0 auto 10px;
    border-radius:22px;
    background:#0f1722;
    font-size:36px;
    box-shadow:0 12px 26px rgba(15,23,34,.2);
  }
  .wheel-result-badge{
    display:inline-flex;
    padding:6px 9px;
    border-radius:999px;
    background:#e9fce8;
    color:#159326;
    font-size:9px;
    font-weight:1000;
    letter-spacing:.13em;
  }
  .wheel-result-sheet h3{margin:10px 0 12px;font-size:29px;letter-spacing:-.04em}
  .wheel-result-sheet img{
    width:130px;
    height:130px;
    object-fit:contain;
    padding:10px;
    border-radius:24px;
    background:#f6f8fa;
  }
  .wheel-result-sheet strong{
    display:block;
    margin:13px auto 5px;
    max-width:290px;
    font-size:19px;
    line-height:1.18;
  }
  .wheel-result-sheet p{
    max-width:310px;
    margin:0 auto;
    color:#667085;
    font-size:12px;
    line-height:1.5;
  }
  .wheel-result-action{
    width:100%;
    min-height:55px;
    margin-top:17px;
    border:0;
    border-radius:18px;
    background:linear-gradient(135deg,#35ec43,#1dbc31);
    color:#061208;
    font-size:15px;
    font-weight:1000;
  }
  .wheel-result-modal.is-empty-result .wheel-result-badge{background:#fff1dc;color:#a95b00}
  .wheel-result-modal.is-empty-result .wheel-result-action{background:#111827;color:#fff}
  .wheel-confetti{
    position:absolute;
    z-index:3;
    inset:0;
    overflow:hidden;
    pointer-events:none;
  }
  .wheel-confetti i{
    position:absolute;
    top:-30px;
    left:var(--x);
    color:#35e944;
    font-style:normal;
    font-size:13px;
    animation:wheelConfetti var(--duration) var(--delay) ease-in forwards;
  }
  .wheel-game-card.is-spinning .wheel-light-ring{
    opacity:1;
    animation-duration:.7s;
  }
  @keyframes wheelLights{to{transform:rotate(360deg)}}
  @keyframes wheelLive{50%{opacity:.45;transform:scale(.78)}}
  @keyframes wheelConfetti{
    0%{transform:translate3d(0,-30px,0) rotate(0);opacity:0}
    10%{opacity:1}
    100%{transform:translate3d(var(--drift),105vh,0) rotate(var(--spin));opacity:.9}
  }
}
@media(max-width:370px){
  .wheel-mobile-hero h2{font-size:27px}
  .fortune-wheel{width:min(80vw,305px)!important;--wheel-radius:calc(min(80vw,305px) * .34)!important}
  .wheel-light-ring{width:min(86vw,327px)}
  .wheel-prize-visual{width:51px!important;height:51px!important}
  .wheel-prize-visual img,.wheel-empty-icon{width:48px!important;height:48px!important}
  .wheel-center-cap{width:65px;height:65px}
}
@media(prefers-reduced-motion:reduce){
  .wheel-light-ring,.wheel-live-dot,.wheel-confetti i{animation:none!important}
}