.color-picker-module__OUFS5W__root{--surface:var(--site-surface);--surface-muted:var(--site-subtle);--border:var(--site-border);--border-strong:var(--site-border-strong);--foreground:var(--site-text);--text-secondary:var(--site-muted);--success:#2e844a;--warning:#a96404;--danger:#c23934;--duration-fast:.16s;--duration-standard:.24s;--ease-standard:cubic-bezier(.22, 1, .36, 1);--duration-spring:.26s;--ease-spring:cubic-bezier(.34, 1.4, .64, 1);--picker-width:288px;color:var(--foreground);display:inline-block;position:relative}[data-site-mode=dark] .color-picker-module__OUFS5W__root{--success:#45c65a;--warning:#fcc003;--danger:#fe5c4c}.color-picker-module__OUFS5W__trigger,.color-picker-module__OUFS5W__head{align-items:center;gap:10px;height:44px;padding:6px 16px 6px 6px;display:flex}.color-picker-module__OUFS5W__trigger{border:1px solid var(--border);background:var(--surface);color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color var(--duration-fast) var(--ease-standard);border-radius:22px}.color-picker-module__OUFS5W__trigger:focus-visible{outline:2px solid var(--foreground);outline-offset:2px}.color-picker-module__OUFS5W__triggerText{text-align:start;min-width:0;line-height:1.15;display:grid}.color-picker-module__OUFS5W__name{color:var(--text-secondary);font-size:12px}.color-picker-module__OUFS5W__hex{font-variant-numeric:tabular-nums;font-size:13px;font-weight:500}.color-picker-module__OUFS5W__chip{border-radius:50%;flex:none;width:32px;height:32px;display:block;position:relative;overflow:hidden}.color-picker-module__OUFS5W__chip>span{border-radius:inherit;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #0000001a;box-shadow:inset 0 0 0 1px lab(0% 0 0/.1)}.color-picker-module__OUFS5W__dotRoot{display:contents;position:static}.color-picker-module__OUFS5W__dot{cursor:pointer;outline-offset:2px;width:24px;height:24px;transition:transform .15s var(--ease-standard);border:0;border-radius:50%;flex:none;padding:0}.color-picker-module__OUFS5W__dot:hover{transform:scale(1.1)}.color-picker-module__OUFS5W__dot:focus-visible{outline:2px solid var(--foreground)}.color-picker-module__OUFS5W__dot[data-selected]{box-shadow:0 0 0 2px var(--surface), 0 0 0 3.5px var(--foreground)}.color-picker-module__OUFS5W__float{z-index:20;filter:drop-shadow(0 18px 36px #0000001f)drop-shadow(0 2px 6px #0000000f);filter:drop-shadow(0 18px 36px lab(0% 0 0/.12))drop-shadow(0 2px 6px lab(0% 0 0/.06));pointer-events:none;position:absolute;top:-1px;left:-1px}[data-site-mode=dark] .color-picker-module__OUFS5W__float{filter:drop-shadow(0 20px 44px #00000080);filter:drop-shadow(0 20px 44px lab(0% 0 0/.5))}.color-picker-module__OUFS5W__floatBelow{z-index:20;filter:drop-shadow(0 18px 36px #0000001f)drop-shadow(0 2px 6px #0000000f);filter:drop-shadow(0 18px 36px lab(0% 0 0/.12))drop-shadow(0 2px 6px lab(0% 0 0/.06));pointer-events:none;position:absolute;top:calc(100% + 8px);left:0}[data-site-mode=dark] .color-picker-module__OUFS5W__floatBelow{filter:drop-shadow(0 20px 44px #00000080);filter:drop-shadow(0 20px 44px lab(0% 0 0/.5))}.color-picker-module__OUFS5W__float[data-open],.color-picker-module__OUFS5W__floatBelow[data-open]{pointer-events:auto}.color-picker-module__OUFS5W__panel{width:var(--picker-width);border:1px solid var(--border);background:var(--surface);will-change:clip-path;border-radius:14px;padding-bottom:14px}.color-picker-module__OUFS5W__head{padding-right:6px}.color-picker-module__OUFS5W__head .color-picker-module__OUFS5W__triggerText{flex:1}.color-picker-module__OUFS5W__headActions{gap:2px;display:flex}.color-picker-module__OUFS5W__iconButton{width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);background:0 0;border:0;border-radius:10px;place-items:center;padding:0;display:grid}.color-picker-module__OUFS5W__iconButton:active{transform:scale(.94)}.color-picker-module__OUFS5W__iconButton:focus-visible,.color-picker-module__OUFS5W__areaThumb:focus-visible,.color-picker-module__OUFS5W__sliderThumb:focus-visible{outline:2px solid var(--foreground);outline-offset:3px}.color-picker-module__OUFS5W__body{grid-template-columns:minmax(0,1fr);gap:14px;padding:8px 14px 0;display:grid}.color-picker-module__OUFS5W__area{cursor:crosshair;touch-action:none;background:linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), var(--picker-hue);border-radius:12px;height:148px;position:relative;box-shadow:inset 0 0 0 1px #00000014;box-shadow:inset 0 0 0 1px lab(0% 0 0/.08)}.color-picker-module__OUFS5W__areaThumb,.color-picker-module__OUFS5W__sliderThumb{cursor:grab;width:22px;height:22px;transition:scale var(--duration-spring) var(--ease-spring);border-radius:50%;position:absolute;translate:-50% -50%;box-shadow:0 0 0 3px #fff,0 2px 8px #0000004d,inset 0 0 0 1px #0000001f;box-shadow:0 0 0 3px lab(100% 0 0),0 2px 8px lab(0% 0 0/.3),inset 0 0 0 1px lab(0% 0 0/.12)}.color-picker-module__OUFS5W__areaThumb{background:var(--picker-color)}.color-picker-module__OUFS5W__area[data-active] .color-picker-module__OUFS5W__areaThumb,.color-picker-module__OUFS5W__sliderThumb[data-active]{cursor:grabbing;scale:1.2}.color-picker-module__OUFS5W__slider{cursor:pointer;touch-action:none;border-radius:999px;height:14px;margin:0 11px;position:relative}.color-picker-module__OUFS5W__slider:before{content:"";border-radius:inherit;background:var(--track);position:absolute;inset:0 -11px;box-shadow:inset 0 0 0 1px #00000014;box-shadow:inset 0 0 0 1px lab(0% 0 0/.08)}.color-picker-module__OUFS5W__sliderThumb{background:var(--thumb-fill);top:50%}.color-picker-module__OUFS5W__hue{--track:linear-gradient(to right, red 11px, #ff0 calc(11px + (100% - 22px) * .1666), #0f0 calc(11px + (100% - 22px) * .3333), #0ff 50%, #00f calc(11px + (100% - 22px) * .6666), #f0f calc(11px + (100% - 22px) * .8333), red calc(100% - 11px))}.color-picker-module__OUFS5W__field{border:1px solid var(--border);background:var(--surface-muted);height:36px;transition:border-color var(--duration-fast) var(--ease-standard);border-radius:10px;align-items:stretch;margin-top:2px;display:flex;overflow:hidden}.color-picker-module__OUFS5W__field:focus-within{border-color:var(--foreground)}.color-picker-module__OUFS5W__field[data-invalid]{border-color:var(--danger)}.color-picker-module__OUFS5W__format{border-right:1px solid var(--border);min-width:48px;color:var(--text-secondary);justify-content:center;align-items:center;padding:0 10px;font-size:12px;font-weight:500;display:flex}.color-picker-module__OUFS5W__input{width:100%;min-width:0;color:var(--foreground);caret-color:var(--foreground);font:inherit;font-variant-numeric:tabular-nums;text-transform:uppercase;background:0 0;border:0;outline:none;padding:0 10px;font-size:13px}.color-picker-module__OUFS5W__error{min-height:0;color:var(--danger);margin:-10px 2px -4px;font-size:12px}.color-picker-module__OUFS5W__error:empty{display:none}.color-picker-module__OUFS5W__contrast{align-items:center;gap:10px;font-size:13px;display:flex}.color-picker-module__OUFS5W__sample{background:var(--picker-measured);width:36px;height:28px;color:var(--picker-bg);border-radius:8px;flex:none;place-items:center;font-weight:500;display:grid}.color-picker-module__OUFS5W__ratio{font-variant-numeric:tabular-nums;min-width:4.4ch;font-weight:500}.color-picker-module__OUFS5W__against{min-width:0;color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:12px;overflow:hidden}.color-picker-module__OUFS5W__grade{white-space:nowrap;height:22px;transition:background-color var(--duration-standard) var(--ease-standard), color var(--duration-standard) var(--ease-standard);border-radius:999px;align-items:center;padding:0 8px;font-size:12px;font-weight:500;display:inline-grid;position:relative}.color-picker-module__OUFS5W__grade[data-grade=pass]{background:color-mix(in oklab, var(--success) 14%, transparent);color:var(--success)}.color-picker-module__OUFS5W__grade[data-grade=large]{background:color-mix(in oklab, var(--warning) 16%, transparent);color:var(--warning)}.color-picker-module__OUFS5W__grade[data-grade=fail]{background:color-mix(in oklab, var(--danger) 12%, transparent);color:var(--danger)}.color-picker-module__OUFS5W__srOnly{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (hover:hover) and (pointer:fine){.color-picker-module__OUFS5W__trigger:hover{border-color:var(--border-strong)}.color-picker-module__OUFS5W__iconButton:hover{background:var(--surface-muted);color:var(--foreground)}}@media (prefers-contrast:more){.color-picker-module__OUFS5W__trigger,.color-picker-module__OUFS5W__panel,.color-picker-module__OUFS5W__field{border-color:var(--border-strong)}}@media (prefers-reduced-motion:reduce){.color-picker-module__OUFS5W__areaThumb,.color-picker-module__OUFS5W__sliderThumb,.color-picker-module__OUFS5W__iconButton{transition:none}}