.wheel-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px;align-items:start}
.wheel-stage{display:flex;flex-direction:column;align-items:center;min-width:0}
.wheel-wrap{position:relative;width:min(100%,420px);aspect-ratio:1}
.wheel-rotor{display:block;width:100%;height:100%;transform-origin:50% 50%}
.wheel-rotor.spinning{transition:transform 4.6s cubic-bezier(.12,.62,.08,1)}
.wheel-rim{fill:var(--surface);stroke:var(--border);stroke-width:2}
.wheel-slice{stroke:var(--surface);stroke-width:.8}
.wheel-label{fill:#fff;font-weight:700;text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:#0003;stroke-width:.6}
.wheel-hub-ring{fill:var(--surface);stroke:var(--border);stroke-width:1.5}
.wheel-pointer{position:absolute;left:50%;top:-6px;width:0;height:0;transform:translateX(-50%);border-left:14px solid transparent;border-right:14px solid transparent;border-top:28px solid var(--ink);filter:drop-shadow(0 2px 2px #0003)}
.wheel-spin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:19%;aspect-ratio:1;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:clamp(12px,3.2vw,15px);box-shadow:0 2px 8px #0003}
.wheel-spin:hover:not(:disabled){filter:brightness(1.08)}
.wheel-busy .wheel-spin,.wheel-busy .wheel-editor{pointer-events:none}
.wheel-busy .wheel-editor{opacity:.6}
.wheel-result{min-height:34px;margin:18px 0 0;font-size:22px;font-weight:800;text-align:center;color:var(--ink);border-bottom:4px solid var(--color,transparent);padding:0 6px 2px;overflow-wrap:anywhere}
.wheel-actions{justify-content:center;margin-top:12px}
.wheel-history{width:100%;margin-top:20px;padding-top:14px;border-top:1px solid var(--border)}
.wheel-history h2{font-size:14px;margin:0 0 8px}
.wheel-history ol{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.wheel-history li{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--border);border-radius:99px;background:var(--paper);font-size:13px}
.wheel-history li::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--color)}
.wheel-history li:first-child{font-weight:700}

.wheel-editor{min-width:0}
.item-count{font:12px var(--mono);color:var(--muted)}
.presets{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px;font-size:13px}
.presets span{color:var(--muted);margin-right:2px}
.presets button{padding:5px 10px;border:1px solid var(--border);border-radius:99px;background:var(--paper);font-size:13px}
.presets button:hover{border-color:var(--accent)}
.wheel-items{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.wheel-items li{display:grid;grid-template-columns:10px minmax(0,1fr) 64px 36px;gap:8px;align-items:center}
.wheel-items .swatch{width:10px;height:28px;border-radius:4px;background:var(--color)}
.wheel-items input,.wheel-items select{width:100%;min-width:0;height:40px;padding:0 10px;border:1px solid var(--border);border-radius:10px;background:var(--paper)}
.wheel-items input:focus,.wheel-items select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)}
.item-remove{height:40px;border-radius:10px;border:1px solid var(--border);font-size:18px;color:var(--muted)}
.wheel-items li.excluded input{text-decoration:line-through;color:var(--muted)}
.wheel-items li.excluded .swatch{opacity:.3}
.add-item{width:100%}

@media(max-width:820px){
  .wheel-layout{grid-template-columns:1fr;gap:24px}
}
@media(prefers-reduced-motion:reduce){.wheel-rotor.spinning{transition:none}}