.ColorPicker-module__vQQgFG__shell{gap:1.25rem}.ColorPicker-module__vQQgFG__head{grid-template-columns:minmax(0,12rem) minmax(0,1fr);align-items:stretch;gap:1rem;display:grid}.ColorPicker-module__vQQgFG__preview{border-radius:var(--radius-lg);border:1px solid var(--color-border-subtle);flex-direction:column;justify-content:flex-end;min-height:9rem;padding:.9rem;display:flex;position:relative}.ColorPicker-module__vQQgFG__previewHex{font-family:var(--font-mono);letter-spacing:.02em;border-radius:var(--radius-sm);align-self:flex-start;padding:.2rem .45rem;font-size:1.05rem}.ColorPicker-module__vQQgFG__inputs{flex-direction:column;gap:.75rem;min-width:0;display:flex}.ColorPicker-module__vQQgFG__field{gap:.35rem;display:grid}.ColorPicker-module__vQQgFG__actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.ColorPicker-module__vQQgFG__actions button{min-height:2.75rem;padding-inline:.85rem;font-size:.88rem}.ColorPicker-module__vQQgFG__nativeWrap{border-radius:var(--radius-md);border:1px solid var(--color-border-subtle);place-items:center;block-size:2.75rem;inline-size:2.75rem;display:inline-grid;overflow:hidden}.ColorPicker-module__vQQgFG__nativePicker{cursor:pointer;background:0 0;border:0;block-size:3.5rem;inline-size:3.5rem;padding:0}.ColorPicker-module__vQQgFG__nativePicker:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.ColorPicker-module__vQQgFG__hidden{display:none}.ColorPicker-module__vQQgFG__sliders{gap:.65rem;display:grid}.ColorPicker-module__vQQgFG__slider{gap:.15rem;display:grid}.ColorPicker-module__vQQgFG__colorRange{appearance:none;cursor:pointer;background:0 0;width:100%;min-height:2.75rem}.ColorPicker-module__vQQgFG__colorRange::-webkit-slider-runnable-track{border:1px solid var(--color-border-subtle);background-image:var(--track);border-radius:999px;height:8px}.ColorPicker-module__vQQgFG__colorRange::-moz-range-track{border:1px solid var(--color-border-subtle);background-image:var(--track);border-radius:999px;height:8px}.ColorPicker-module__vQQgFG__colorRange::-webkit-slider-thumb{appearance:none;background:var(--color-surface);border:2px solid var(--color-text-primary);border-radius:999px;block-size:18px;inline-size:18px;margin-top:-5px}.ColorPicker-module__vQQgFG__colorRange::-moz-range-thumb{background:var(--color-surface);border:2px solid var(--color-text-primary);border-radius:999px;block-size:18px;inline-size:18px}.ColorPicker-module__vQQgFG__colorRange:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--color-accent-soft);border-color:var(--color-accent)}.ColorPicker-module__vQQgFG__colorRange:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px var(--color-accent-soft);border-color:var(--color-accent)}.ColorPicker-module__vQQgFG__imageBlock{gap:.6rem;display:grid}.ColorPicker-module__vQQgFG__stage{border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);background:var(--color-surface-elevated);cursor:crosshair;width:100%;padding:0;line-height:0;display:block;position:relative;overflow:hidden}.ColorPicker-module__vQQgFG__stage:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.ColorPicker-module__vQQgFG__canvas{object-fit:contain;width:100%;height:auto;max-height:22rem;display:block}.ColorPicker-module__vQQgFG__crosshair{pointer-events:none;border:2px solid #fff;border-radius:999px;block-size:18px;inline-size:18px;margin-block-start:-9px;margin-inline-start:-9px;position:absolute;box-shadow:0 0 0 1px #0009}.ColorPicker-module__vQQgFG__harmonyBlock{gap:.6rem;display:grid}.ColorPicker-module__vQQgFG__headerRow{flex-wrap:wrap;row-gap:.5rem}.ColorPicker-module__vQQgFG__schemeField{flex:12rem;gap:.3rem;min-width:0;display:grid}.ColorPicker-module__vQQgFG__schemeSelect{min-height:2.75rem}.ColorPicker-module__vQQgFG__swatchRow{grid-template-columns:repeat(auto-fit,minmax(5.5rem,1fr));gap:.45rem;display:grid}.ColorPicker-module__vQQgFG__swatch{appearance:none;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);cursor:pointer;justify-content:center;align-items:flex-end;min-height:4rem;padding:.4rem;display:flex}.ColorPicker-module__vQQgFG__swatch span{border-radius:var(--radius-sm);font-family:var(--font-mono);padding:.1rem .3rem;font-size:.72rem}.ColorPicker-module__vQQgFG__swatch[aria-current]{border-color:var(--color-accent);box-shadow:0 0 0 2px var(--color-accent-soft)}.ColorPicker-module__vQQgFG__formats{gap:.45rem;display:grid}.ColorPicker-module__vQQgFG__format{appearance:none;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);background:var(--color-surface-elevated);color:var(--color-text-secondary);cursor:pointer;text-align:left;grid-template-columns:minmax(5.5rem,auto) minmax(0,1fr);align-items:center;gap:.8rem;min-height:2.85rem;padding:.65rem .75rem;display:grid}.ColorPicker-module__vQQgFG__format:hover{border-color:var(--color-border-strong)}.ColorPicker-module__vQQgFG__format code{color:var(--color-text-primary);font-family:var(--font-mono);overflow-wrap:anywhere;text-align:right;justify-self:end;font-size:.88rem}.ColorPicker-module__vQQgFG__formatLabel{letter-spacing:.08em;text-transform:uppercase;align-items:baseline;gap:.4rem;font-size:.78rem;font-weight:500;display:flex}.ColorPicker-module__vQQgFG__formatTag,.ColorPicker-module__vQQgFG__baseTag,.ColorPicker-module__vQQgFG__bestTag{letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-disabled);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);padding:.05rem .3rem;font-size:.66rem;font-style:normal}.ColorPicker-module__vQQgFG__baseTag,.ColorPicker-module__vQQgFG__bestTag{color:var(--color-accent);border-color:color-mix(in srgb, var(--color-accent) 45%, transparent)}.ColorPicker-module__vQQgFG__stopList{gap:.3rem;margin:0;padding:0;list-style:none;display:grid}.ColorPicker-module__vQQgFG__stopRow{border-top:1px solid var(--color-border-subtle);grid-template-columns:2.5rem minmax(0,1fr) auto auto;align-items:center;gap:.6rem;padding:.2rem 0;display:grid}.ColorPicker-module__vQQgFG__stopRow:first-child{border-top:0}.ColorPicker-module__vQQgFG__stopSwatch{appearance:none;border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);cursor:pointer;block-size:2.25rem;inline-size:2.5rem}.ColorPicker-module__vQQgFG__stopStep{color:var(--color-text-secondary);font-family:var(--font-mono);align-items:center;gap:.4rem;font-size:.85rem;display:flex}.ColorPicker-module__vQQgFG__stopHex{color:var(--color-text-primary);font-family:var(--font-mono);font-size:.85rem}.ColorPicker-module__vQQgFG__exportRow{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.ColorPicker-module__vQQgFG__contrastGrid{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.75rem;display:grid}.ColorPicker-module__vQQgFG__contrastCard{border:1px solid var(--color-border-subtle);border-left:3px solid var(--color-border-strong);border-radius:var(--radius-md);gap:.5rem;padding:.75rem .85rem;display:grid}.ColorPicker-module__vQQgFG__contrastCard[data-kind=critical]{border-left-color:#b42435}.ColorPicker-module__vQQgFG__contrastCard[data-kind=moderate]{border-left-color:#8a6614}.ColorPicker-module__vQQgFG__contrastCard[data-kind=low]{border-left-color:#2d7f5e}.ColorPicker-module__vQQgFG__contrastHead{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.ColorPicker-module__vQQgFG__ratio{color:var(--color-text-primary);font-family:var(--font-mono);font-size:clamp(1.6rem,1.1rem + 1.6vw,2.2rem);font-weight:500;line-height:1.1}.ColorPicker-module__vQQgFG__ratio span{color:var(--color-text-disabled);font-size:.9rem}.ColorPicker-module__vQQgFG__criteria{gap:.2rem;margin:0;padding:0;list-style:none;display:grid}.ColorPicker-module__vQQgFG__criterion{color:var(--color-text-disabled);grid-template-columns:1.1rem minmax(0,1fr);align-items:baseline;gap:.35rem;font-size:.82rem;display:grid}.ColorPicker-module__vQQgFG__criterion[data-pass]{color:var(--color-text-secondary)}.ColorPicker-module__vQQgFG__criterionMark{font-family:var(--font-mono);color:var(--color-error)}.ColorPicker-module__vQQgFG__criterion[data-pass] .ColorPicker-module__vQQgFG__criterionMark{color:var(--color-accent)}.ColorPicker-module__vQQgFG__paletteGrid{grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.ColorPicker-module__vQQgFG__paletteItem{display:grid;position:relative}.ColorPicker-module__vQQgFG__removeSwatch{border-radius:var(--radius-sm);background:var(--color-surface);block-size:1.6rem;inline-size:1.6rem;color:var(--color-text-secondary);cursor:pointer;opacity:.85;border:0;place-items:center;display:grid;position:absolute;inset-block-start:.2rem;inset-inline-end:.2rem}.ColorPicker-module__vQQgFG__removeSwatch:hover{color:var(--color-error);opacity:1}.ColorPicker-module__vQQgFG__removeSwatch svg{block-size:.8rem;inline-size:.8rem}.ColorPicker-module__vQQgFG__emptyLine{color:var(--color-text-disabled);margin:0;font-size:.86rem}.ColorPicker-module__vQQgFG__srOnly{clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:640px){.ColorPicker-module__vQQgFG__head{grid-template-columns:minmax(0,1fr)}.ColorPicker-module__vQQgFG__preview{min-height:7rem}.ColorPicker-module__vQQgFG__stopRow{grid-template-columns:2.25rem auto minmax(0,1fr) auto}.ColorPicker-module__vQQgFG__stopHex{justify-self:end}}@media (prefers-reduced-motion:reduce){.ColorPicker-module__vQQgFG__swatch,.ColorPicker-module__vQQgFG__stopSwatch,.ColorPicker-module__vQQgFG__format{transition:none}}