/* «Колесо удачи» — общий виджет. Цвета берутся из переменных хоста (--lw-*), по умолчанию — тёмная тема «Искры». */
.lw-panel { --lw-accent: var(--accent, #22c55e); --lw-text: var(--text, #e9efec); --lw-muted: var(--muted, #8a9690); --lw-card: var(--panel, #151c19); --lw-line: var(--line-2, rgba(255,255,255,.09));
  display: grid; justify-items: center; gap: 12px; color: var(--lw-text); font-family: inherit; text-align: center; }
.lw-stage { width: min(300px, 78vw); aspect-ratio: 1; position: relative; }
.lw-compact .lw-stage { width: min(240px, 66vw); }
.lw-wheel { position: absolute; inset: 0; }
.lw-wheel > svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 10px 28px rgba(0,0,0,.45)); overflow: visible; }
.lw-rot { transform-origin: 0 0; transform-box: view-box; will-change: transform; }
.lw-rim { fill: #0c1110; stroke: rgba(var(--accent-rgb, 34,197,94), .55); stroke-width: 3; }
.lw-seg { stroke: rgba(0,0,0,.35); stroke-width: .8; transition: filter .3s; }
.lw-seg.lw-win { animation: lw-flash .45s ease-in-out 4 alternate; }
@keyframes lw-flash { to { filter: brightness(1.45) saturate(1.2); } }
.lw-label { fill: #fff; font: 700 10.5px/1 var(--font, Inter, system-ui, sans-serif); paint-order: stroke; stroke: rgba(0,0,0,.35); stroke-width: 2px; letter-spacing: .1px; }
.lw-label-empty { fill: #c5ccc9; font-weight: 600; }
.lw-pin { fill: #f8fafc; opacity: .85; }
.lw-hub { position: absolute; left: 50%; top: 50%; width: 19%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #2a3430, #0d1311); border: 3px solid var(--lw-accent); color: var(--lw-accent); display: grid; place-items: center; box-shadow: 0 0 18px rgba(var(--accent-rgb, 34,197,94), .35); }
.lw-pointer { position: absolute; left: 50%; top: -4%; width: 0; height: 0; transform: translateX(-50%);
  border-left: 13px solid transparent; border-right: 13px solid transparent; border-top: 26px solid #f8fafc; filter: drop-shadow(0 3px 4px rgba(0,0,0,.5)); }
.lw-spinning .lw-pointer { animation: lw-tick .12s ease-in-out infinite alternate; }
@keyframes lw-tick { to { transform: translateX(-50%) rotate(-9deg); } }
.lw-info { display: grid; gap: 3px; min-height: 40px; }
.lw-state { font-weight: 700; font-size: 15px; }
.lw-sub { color: var(--lw-muted); font-size: 13px; }
.lw-go { min-width: 200px; border: 0; border-radius: 999px; padding: 13px 28px; font-weight: 700; font-size: 16px; line-height: 1; font-family: inherit; cursor: pointer;
  background: linear-gradient(135deg, var(--lw-accent), #16a34a); color: var(--on-accent, #05210f); box-shadow: 0 8px 22px rgba(var(--accent-rgb, 34,197,94), .35); transition: transform .15s, opacity .2s; }
.lw-go:not([disabled]):hover { transform: translateY(-1px); }
.lw-go:not([disabled]):active { transform: scale(.97); }
.lw-go[disabled] { opacity: .45; cursor: default; box-shadow: none; }
.lw-result { width: 100%; max-width: 360px; border-radius: 16px; padding: 14px 16px; display: grid; gap: 6px; justify-items: center; animation: lw-pop .35s cubic-bezier(.2,.9,.3,1.3); }
.lw-r-win { background: rgba(var(--accent-rgb, 34,197,94), .14); border: 1px solid rgba(var(--accent-rgb, 34,197,94), .4); }
.lw-r-empty { background: rgba(148,163,184,.10); border: 1px solid rgba(148,163,184,.28); }
@keyframes lw-pop { from { transform: scale(.85); opacity: 0; } }
.lw-res-ico { font-size: 30px; line-height: 1; }
.lw-res-text { font-weight: 800; font-size: 17px; }
.lw-res-note { color: var(--lw-muted); font-size: 13px; word-break: break-word; }
.lw-res-note:empty, .lw-res-actions:empty { display: none; }
.lw-act { border: 1px solid rgba(var(--accent-rgb, 34,197,94), .55); background: transparent; color: var(--lw-accent); border-radius: 999px; padding: 9px 18px; font-weight: 600; font-size: 14px; line-height: 1; font-family: inherit; cursor: pointer; }
.lw-odds { width: 100%; max-width: 360px; font-size: 13px; color: var(--lw-muted); text-align: left; }
.lw-odds summary { cursor: pointer; text-align: center; }
.lw-odds ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px; }
.lw-odds li { display: flex; justify-content: space-between; border-bottom: 1px dashed var(--lw-line); padding: 3px 0; }
.lw-odds li b { color: var(--lw-text); font-weight: 600; }
.lw-o-empty span { color: #9aa4a0; }
.lw-fine { margin: 8px 0 0; font-size: 12px; line-height: 1.45; }
@media (prefers-reduced-motion: reduce) { .lw-result { animation: none; } .lw-spinning .lw-pointer { animation: none; } }