.oklch-color-picker-module__JIi2Aq__tool{gap:var(--space-3);grid-template-columns:minmax(0,1fr);grid-template-areas:"controls""paste""banners""swatch""notations""footer";display:grid}@media (min-width:1024px){.oklch-color-picker-module__JIi2Aq__tool{grid-template:"controls paste""controls banners""controls swatch""controls notations"1fr"footer footer"/minmax(0,22rem) minmax(0,1fr)}}@media (min-width:1440px){.oklch-color-picker-module__JIi2Aq__tool{grid-template:"controls paste paste""controls banners banners""controls swatch notations"1fr"footer footer footer"/minmax(0,21rem) minmax(0,1fr) minmax(0,28rem)}}.oklch-color-picker-module__JIi2Aq__controlsPane{grid-area:controls;}.oklch-color-picker-module__JIi2Aq__pastePane{grid-area:paste;align-self:start;}.oklch-color-picker-module__JIi2Aq__bannerZone{gap:var(--space-2);flex-direction:column;grid-area:banners;display:flex}.oklch-color-picker-module__JIi2Aq__swatchPane{grid-area:swatch;align-self:start;}.oklch-color-picker-module__JIi2Aq__notationsPane{grid-area:notations;align-self:start;}.oklch-color-picker-module__JIi2Aq__footerZone{gap:var(--space-2);flex-direction:column;grid-area:footer;display:flex}.oklch-color-picker-module__JIi2Aq__paneHeader{}.oklch-color-picker-module__JIi2Aq__paneLabel{}.oklch-color-picker-module__JIi2Aq__liveBadge{flex:none;margin-inline-start:auto}.oklch-color-picker-module__JIi2Aq__controlsBody{gap:var(--space-3);padding:var(--pane-padding);flex-direction:column;display:flex}.oklch-color-picker-module__JIi2Aq__controlGroup{gap:var(--space-1);flex-direction:column;min-inline-size:0;display:flex}.oklch-color-picker-module__JIi2Aq__groupLabel{font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary)}.oklch-color-picker-module__JIi2Aq__sliderRow{gap:var(--space-2);grid-template-columns:minmax(0,1fr) minmax(0,5.5rem);align-items:center;display:grid}.oklch-color-picker-module__JIi2Aq__slider{accent-color:var(--color-accent-fg);min-block-size:var(--control-height);min-inline-size:0;margin:0}.oklch-color-picker-module__JIi2Aq__numberInput{font-variant-numeric:tabular-nums;inline-size:100%;min-inline-size:0;}.oklch-color-picker-module__JIi2Aq__chromaHint{min-block-size:calc(2 * var(--text-ui-xs-line));}.oklch-color-picker-module__JIi2Aq__hintLine{min-block-size:var(--text-ui-xs-line);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted);margin:0}.oklch-color-picker-module__JIi2Aq__noteLine{block-size:calc(3 * var(--text-ui-xs-line));font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted);margin:0;overflow-y:auto}.oklch-color-picker-module__JIi2Aq__optionFieldset{gap:var(--space-2);border:none;flex-direction:column;min-inline-size:0;margin:0;padding:0;display:flex}.oklch-color-picker-module__JIi2Aq__legend{padding-inline:var(--space-1);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);font-weight:var(--weight-medium);color:var(--color-text-secondary)}.oklch-color-picker-module__JIi2Aq__optionsRow{gap:var(--space-1);flex-wrap:wrap;display:flex}.oklch-color-picker-module__JIi2Aq__optionChip{min-block-size:var(--control-height);padding-inline:var(--space-3);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);cursor:pointer;justify-content:center;align-items:center;display:inline-flex;position:relative}.oklch-color-picker-module__JIi2Aq__optionChip:hover{border-color:var(--color-border-control);color:var(--color-text-primary)}.oklch-color-picker-module__JIi2Aq__optionChipOn{background:color-mix(in srgb, var(--color-text-primary) 8%, transparent);border-color:var(--color-border-control);color:var(--color-text-primary)}.oklch-color-picker-module__JIi2Aq__optionChip:active{transform:scale(.98)}.oklch-color-picker-module__JIi2Aq__optionInput{opacity:0;cursor:pointer;block-size:100%;inline-size:100%;margin:0;position:absolute;inset:0}.oklch-color-picker-module__JIi2Aq__optionChip:has(.oklch-color-picker-module__JIi2Aq__optionInput:focus-visible){outline:var(--focus-ring-width) solid var(--color-accent-fg);outline-offset:var(--focus-ring-offset)}.oklch-color-picker-module__JIi2Aq__pasteBody{gap:var(--space-2);padding:var(--pane-padding);flex-direction:column;display:flex}.oklch-color-picker-module__JIi2Aq__pasteRow{gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.oklch-color-picker-module__JIi2Aq__pasteInput{min-inline-size:0;font-family:var(--font-mono);font-feature-settings:"zero";flex:14rem;}.oklch-color-picker-module__JIi2Aq__rowError{block-size:calc(2 * var(--text-ui-xs-line));font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-danger-fg);overflow-wrap:anywhere;margin:0;overflow-y:auto}.oklch-color-picker-module__JIi2Aq__swatchBody{gap:var(--space-3);padding:var(--pane-padding);flex-direction:column;display:flex}.oklch-color-picker-module__JIi2Aq__swatchSplit{gap:var(--space-2);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.oklch-color-picker-module__JIi2Aq__swatchCell{gap:var(--space-1);flex-direction:column;min-inline-size:0;display:flex}.oklch-color-picker-module__JIi2Aq__swatch{border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);background-color:#0000;background-image:linear-gradient(45deg, var(--color-border-subtle) 25%, transparent 25%), linear-gradient(-45deg, var(--color-border-subtle) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--color-border-subtle) 75%), linear-gradient(-45deg, transparent 75%, var(--color-border-subtle) 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;block-size:132px;position:relative}.oklch-color-picker-module__JIi2Aq__swatchFill{border-radius:inherit;position:absolute;inset:0}.oklch-color-picker-module__JIi2Aq__swatchCaption{font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-secondary)}.oklch-color-picker-module__JIi2Aq__badgeRow{min-block-size:calc(var(--text-ui-sm-line) + 2 * var(--space-1) + 2px);align-items:center;margin:0;display:flex}.oklch-color-picker-module__JIi2Aq__badge:not(:empty){padding:var(--space-1) var(--space-3);border:1px solid var(--color-border-control);border-radius:var(--radius-full);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-primary);align-items:center;display:inline-flex}.oklch-color-picker-module__JIi2Aq__chips{gap:var(--space-2);flex-wrap:wrap;align-content:flex-start;block-size:72px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.oklch-color-picker-module__JIi2Aq__chip{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);background:var(--color-info-bg);color:var(--color-info-fg);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);align-items:center;display:inline-flex}.oklch-color-picker-module__JIi2Aq__notationsBody{gap:var(--space-3);padding:var(--pane-padding);flex-direction:column;display:flex}.oklch-color-picker-module__JIi2Aq__notationList{gap:var(--space-1);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.oklch-color-picker-module__JIi2Aq__notationRow{gap:var(--space-2);min-block-size:var(--target-min);grid-template-columns:minmax(0,7rem) minmax(0,1fr) auto;align-items:center;display:grid}.oklch-color-picker-module__JIi2Aq__notationName{font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);overflow-wrap:anywhere}.oklch-color-picker-module__JIi2Aq__notationValue{white-space:pre;min-inline-size:0;font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-code-size);line-height:var(--text-code-line);color:var(--color-text-primary);overflow-x:auto}.oklch-color-picker-module__JIi2Aq__rowCopy{}.oklch-color-picker-module__JIi2Aq__rowCopyAccent{}.oklch-color-picker-module__JIi2Aq__blockHeading{font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);font-weight:var(--weight-medium);color:var(--color-text-secondary);margin:0}.oklch-color-picker-module__JIi2Aq__codeBox{padding:var(--space-2) var(--space-3);block-size:calc(var(--text-code-line) * 2 + var(--space-4));background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-code-size);line-height:var(--text-code-line);color:var(--color-text-primary);white-space:pre;margin:0;overflow:auto}.oklch-color-picker-module__JIi2Aq__statusLine{}.oklch-color-picker-module__JIi2Aq__rowActions{gap:var(--space-2);flex-wrap:wrap;display:flex}.oklch-color-picker-module__JIi2Aq__banner{}.oklch-color-picker-module__JIi2Aq__refusalBanner{background:var(--color-danger-bg);color:var(--color-danger-fg);overflow-wrap:anywhere;border-color:#0000}.oklch-color-picker-module__JIi2Aq__bannerAction{color:var(--color-accent-fg);cursor:pointer;font-size:inherit;line-height:inherit;background:0 0;border:none;padding:0;text-decoration-line:underline}.oklch-color-picker-module__JIi2Aq__actions{}.oklch-color-picker-module__JIi2Aq__actionButton{}.oklch-color-picker-module__JIi2Aq__swapWrap{}.oklch-color-picker-module__JIi2Aq__swapSizer{}.oklch-color-picker-module__JIi2Aq__echoSlot{inline-size:1ch;display:inline-block}.oklch-color-picker-module__JIi2Aq__shareNote,.oklch-color-picker-module__JIi2Aq__storedLine,.oklch-color-picker-module__JIi2Aq__keyboardHint{min-block-size:var(--text-ui-sm-line);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);margin:0}.oklch-color-picker-module__JIi2Aq__dialog{}.oklch-color-picker-module__JIi2Aq__dialogTitle{margin:0 0 var(--space-4);font-size:var(--text-h4-size);line-height:var(--text-h4-line);font-weight:var(--weight-medium)}.oklch-color-picker-module__JIi2Aq__dialogNote{margin:var(--space-3) 0;font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary)}.oklch-color-picker-module__JIi2Aq__shortcutList{margin:0 0 var(--space-4);gap:var(--space-2);flex-direction:column;padding:0;list-style:none;display:flex}.oklch-color-picker-module__JIi2Aq__shortcutItem{align-items:center;gap:var(--space-3);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);display:flex}.oklch-color-picker-module__JIi2Aq__kbd{}.oklch-color-picker-module__JIi2Aq__checkbox{}.oklch-color-picker-module__JIi2Aq__optionCheck{align-items:center;gap:var(--space-2);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);cursor:pointer;margin-block-end:var(--space-4);display:flex}@media (pointer:coarse){.oklch-color-picker-module__JIi2Aq__optionChip,.oklch-color-picker-module__JIi2Aq__slider{min-block-size:var(--target-touch)}.oklch-color-picker-module__JIi2Aq__optionCheck,.oklch-color-picker-module__JIi2Aq__bannerAction{min-block-size:var(--target-touch);align-items:center;display:inline-flex}.oklch-color-picker-module__JIi2Aq__notationRow{min-block-size:var(--target-touch)}}