.variant-picker{margin:0 0 28px;padding:20px;border:1px solid var(--line);background:rgba(255,255,255,.58)}
.variant-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.variant-heading strong{font-size:.9rem}
.variant-heading small,.variant-selection-status{color:var(--muted);font-size:.72rem}
.variant-options{display:flex;flex-wrap:wrap;gap:8px;max-height:220px;overflow-y:auto;scrollbar-width:thin}
.variant-option{display:flex;flex-direction:column;align-items:flex-start;gap:3px;max-width:240px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);text-align:left;cursor:pointer}
.variant-option span{overflow:hidden;max-width:100%;font-size:.75rem;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.variant-option small{color:var(--muted);font-size:.68rem}
.variant-option:hover,.variant-option.active{border-color:var(--violet);box-shadow:0 0 0 1px var(--violet)}
.variant-option.active small{color:var(--violet)}
.variant-selection-status{min-height:1em;margin:12px 0 0}
@media(max-width:720px){.variant-picker{padding:16px}.variant-options{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity}.variant-option{flex:0 0 auto;max-width:72vw;scroll-snap-align:start}}