.ColorPalette-module__XQIvra__scroll{color:var(--clay-ink);background:0 0;flex:1;overflow-y:auto}.ColorPalette-module__XQIvra__container{max-width:1100px;padding:var(--clay-space-xxl)var(--clay-space-xl);background:linear-gradient(to bottom,var(--clay-canvas)0%,var(--clay-canvas)calc(100% - 64px),#fffaf000 100%);margin:0 auto}.ColorPalette-module__XQIvra__header{margin-bottom:var(--clay-space-xxl)}.ColorPalette-module__XQIvra__eyebrow{letter-spacing:1.5px;text-transform:uppercase;color:var(--clay-muted);margin-bottom:var(--clay-space-xs);font-size:12px;font-weight:600}.ColorPalette-module__XQIvra__title{font-family:var(--clay-font-display);letter-spacing:-1px;color:var(--clay-ink);margin-bottom:var(--clay-space-xs);font-size:clamp(28px,4vw,44px);font-weight:500;line-height:1.05}.ColorPalette-module__XQIvra__lede{color:var(--clay-body);max-width:480px;font-size:15px;line-height:1.55}.ColorPalette-module__XQIvra__workspace{gap:var(--clay-space-lg);grid-template-columns:1fr 1fr;align-items:start;display:grid}@media (max-width:720px){.ColorPalette-module__XQIvra__workspace{grid-template-columns:1fr}}.ColorPalette-module__XQIvra__dropZone{aspect-ratio:4/3;border:2px dashed var(--clay-hairline);border-radius:var(--clay-radius-xl);background:var(--clay-surface-soft);cursor:pointer;justify-content:center;align-items:center;transition:border-color .15s,background .15s;display:flex;position:relative;overflow:hidden}.ColorPalette-module__XQIvra__dropZone:hover,.ColorPalette-module__XQIvra__dropZoneOver{border-color:var(--clay-ink);background:var(--clay-surface-card)}.ColorPalette-module__XQIvra__dropZoneHasImage{border-style:solid;border-color:var(--clay-hairline);background:#000}.ColorPalette-module__XQIvra__dropZoneHasImage:hover{border-color:var(--clay-ink)}.ColorPalette-module__XQIvra__dropPrompt{align-items:center;gap:var(--clay-space-xs);pointer-events:none;flex-direction:column;display:flex}.ColorPalette-module__XQIvra__dropGlyph{color:var(--clay-muted-soft);font-size:40px;line-height:1}.ColorPalette-module__XQIvra__dropTitle{color:var(--clay-body);font-size:16px;font-weight:600}.ColorPalette-module__XQIvra__dropSub{color:var(--clay-muted);font-size:13px}.ColorPalette-module__XQIvra__preview{object-fit:contain;width:100%;height:100%;display:block}.ColorPalette-module__XQIvra__palettePanel{gap:var(--clay-space-md);flex-direction:column;min-height:200px;display:flex}.ColorPalette-module__XQIvra__busyState{align-items:center;gap:var(--clay-space-sm);color:var(--clay-muted);padding:var(--clay-space-xl)0;font-size:14px;display:flex}.ColorPalette-module__XQIvra__spinner{border:2px solid var(--clay-hairline);border-top-color:var(--clay-ink);border-radius:50%;flex-shrink:0;width:18px;height:18px;animation:.7s linear infinite ColorPalette-module__XQIvra__spin}@keyframes ColorPalette-module__XQIvra__spin{to{transform:rotate(360deg)}}.ColorPalette-module__XQIvra__emptyState{padding:var(--clay-space-xxl)0;color:var(--clay-muted);justify-content:center;align-items:center;font-size:14px;display:flex}.ColorPalette-module__XQIvra__proportionBar{border-radius:var(--clay-radius-pill);gap:2px;height:10px;display:flex;overflow:hidden}.ColorPalette-module__XQIvra__proportionSegment{border-radius:var(--clay-radius-pill);transition:flex .3s}.ColorPalette-module__XQIvra__swatches{gap:var(--clay-space-xs);grid-template-columns:repeat(4,1fr);display:grid}@media (max-width:520px){.ColorPalette-module__XQIvra__swatches{grid-template-columns:repeat(4,1fr)}}.ColorPalette-module__XQIvra__swatch{padding:var(--clay-space-xs)var(--clay-space-xs)var(--clay-space-sm);background:var(--clay-canvas);border:1px solid var(--clay-hairline);border-radius:var(--clay-radius-md);cursor:pointer;font-family:var(--clay-font-body);flex-direction:column;align-items:center;gap:6px;transition:border-color .12s,transform .12s,box-shadow .12s;display:flex;position:relative}.ColorPalette-module__XQIvra__swatch:hover{border-color:var(--clay-ink);transform:translateY(-2px);box-shadow:0 4px 12px #0a0a0a14}.ColorPalette-module__XQIvra__swatchColor{aspect-ratio:1;border-radius:var(--clay-radius-sm);width:100%;display:block;box-shadow:inset 0 0 0 1px #00000014}.ColorPalette-module__XQIvra__swatchHex{color:var(--clay-ink);letter-spacing:.3px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500}.ColorPalette-module__XQIvra__swatchPct{color:var(--clay-muted);font-size:10px}.ColorPalette-module__XQIvra__swatchCopied{border-radius:var(--clay-radius-md);color:var(--clay-success);background:#fffaf0e0;justify-content:center;align-items:center;font-size:18px;font-weight:700;display:flex;position:absolute;inset:0}.ColorPalette-module__XQIvra__exportRow{align-items:center;gap:var(--clay-space-xs);padding-top:var(--clay-space-xs);border-top:1px solid var(--clay-hairline-soft);flex-wrap:wrap;display:flex}.ColorPalette-module__XQIvra__exportLabel{color:var(--clay-muted);margin-right:2px;font-size:12px;font-weight:500}.ColorPalette-module__XQIvra__exportBtn{background:var(--clay-surface-card);border:1px solid var(--clay-hairline);border-radius:var(--clay-radius-pill);height:32px;font-family:var(--clay-font-body);color:var(--clay-body);cursor:pointer;padding:0 14px;font-size:12px;font-weight:500;transition:background .12s,border-color .12s,color .12s}.ColorPalette-module__XQIvra__exportBtn:hover{background:var(--clay-surface-strong);color:var(--clay-ink);border-color:var(--clay-surface-strong)}.ColorPalette-module__XQIvra__exportBtnSecondary{border:1px solid var(--clay-hairline);border-radius:var(--clay-radius-pill);height:32px;font-family:var(--clay-font-body);color:var(--clay-muted);cursor:pointer;background:0 0;margin-left:auto;padding:0 14px;font-size:12px;transition:color .12s,border-color .12s}.ColorPalette-module__XQIvra__exportBtnSecondary:hover{color:var(--clay-error);border-color:var(--clay-error)}