.variant-picker{border:0;padding:0;margin:2rem 0 1.25rem}.variant-picker legend{display:block;width:100%;font-size:16px;font-weight:800;margin-bottom:.8rem}.variant-option{position:relative;margin-bottom:.75rem}.variant-option input{position:absolute;opacity:0;pointer-events:none}.variant-option label{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:1rem;align-items:center;width:100%;padding:1.15rem 1.2rem;border:2px solid var(--line);background:#fff;cursor:pointer;transition:.2s}.variant-option label:hover{border-color:#8ec8f2;background:#f7fbfe}.variant-check{display:block;width:20px;height:20px;border:2px solid #9eabb4;border-radius:50%;box-shadow:inset 0 0 0 4px #fff}.variant-name{min-width:0}.variant-name b{display:block;font-size:16px;line-height:1.5;overflow-wrap:anywhere}.variant-name small{display:block;font-size:12px;color:var(--muted);margin-top:.25rem}.variant-option label>strong{font-size:17px;white-space:nowrap}.variant-option input:checked+label{border-color:var(--blue);background:#f0f8fe;box-shadow:0 0 0 1px var(--blue)}.variant-option input:checked+label .variant-check{background:var(--blue);border-color:var(--blue)}.variant-option input:disabled+label{opacity:.5;cursor:not-allowed;background:#f3f4f5}.variant-option input:focus-visible+label{outline:3px solid #8bc9f7;outline-offset:2px}@media(max-width:560px){.variant-picker{margin-top:1.5rem}.variant-option label{grid-template-columns:22px minmax(0,1fr);padding:1rem;gap:.8rem}.variant-option label>strong{grid-column:2;font-size:16px}.variant-name b{font-size:16px}.variant-name small{font-size:12px}}