.wrap.svelte-gbsl87{max-width:960px;margin:0 auto;padding:24px 32px 64px}.head.svelte-gbsl87{display:flex;justify-content:space-between;align-items:flex-end;margin:14px 0 18px}h1.svelte-gbsl87{margin:0;font-size:24px;letter-spacing:-.02em}.kind.svelte-gbsl87{margin:4px 0 0;font-family:var(--cm-font-mono);font-size:11px;text-transform:uppercase;color:var(--cm-text-mute)}.modeswitch.svelte-gbsl87{display:inline-flex;border:1px solid var(--cm-border);border-radius:var(--cm-radius-sm);overflow:hidden}.modeswitch.svelte-gbsl87 button:where(.svelte-gbsl87){font-family:var(--cm-font-mono);font-size:11.5px;letter-spacing:.08em;background:transparent;color:var(--cm-text-mute);border:none;padding:7px 16px;cursor:pointer;text-transform:uppercase}.modeswitch.svelte-gbsl87 button:where(.svelte-gbsl87)+button:where(.svelte-gbsl87){border-left:1px solid var(--cm-border)}.modeswitch.svelte-gbsl87 button.active:where(.svelte-gbsl87){color:var(--cm-bg);background:var(--cm-accent-page);font-weight:600}.grid.svelte-gbsl87{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:start}.square-row.svelte-gbsl87{display:flex;gap:12px}.square-wrap.svelte-gbsl87{position:relative;width:clamp(300px,46vw,540px);max-width:100%;aspect-ratio:1/1}.square-wrap.svelte-gbsl87 canvas:where(.svelte-gbsl87){position:absolute;inset:0;width:100%;height:100%;border:1px solid var(--cm-border);border-radius:var(--cm-radius-sm)}.square-wrap.svelte-gbsl87 canvas:where(.svelte-gbsl87):first-child{cursor:crosshair;touch-action:none}.overlay.svelte-gbsl87{pointer-events:none}.hue.svelte-gbsl87{width:28px;height:clamp(300px,46vw,540px);border:1px solid var(--cm-border);border-radius:var(--cm-radius-sm);cursor:ns-resize;touch-action:none}.axes.svelte-gbsl87{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;font-family:var(--cm-font-mono);font-size:10px;color:var(--cm-text-mute)}.readout.svelte-gbsl87{margin-top:14px;display:flex;gap:10px;align-items:center}.swatch.svelte-gbsl87{width:40px;height:40px;border-radius:var(--cm-radius-sm);border:1px solid var(--cm-border)}.gamut.svelte-gbsl87{display:inline-flex;gap:6px;font-family:var(--cm-font-mono);font-size:10px}.gamut.svelte-gbsl87 span:where(.svelte-gbsl87){padding:2px 8px;border-radius:3px;border:1px solid var(--cm-border-soft)}.gamut.svelte-gbsl87 .in:where(.svelte-gbsl87){color:var(--cm-text);border-color:var(--cm-border)}.gamut.svelte-gbsl87 .out:where(.svelte-gbsl87){color:var(--cm-text-mute);border-color:var(--cm-border-soft);text-decoration:line-through;opacity:.6}.notations.svelte-gbsl87 h2:where(.svelte-gbsl87){font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-family:var(--cm-font-mono);color:var(--cm-text-mute);font-weight:600;margin:0 0 8px}.notations.svelte-gbsl87 ul:where(.svelte-gbsl87){list-style:none;margin:0;padding:0}.notations.svelte-gbsl87 li:where(.svelte-gbsl87){display:grid;grid-template-columns:80px 1fr auto;gap:8px;align-items:baseline;padding:4px 0;border-bottom:1px solid var(--cm-border-soft)}.lbl.svelte-gbsl87{font-family:var(--cm-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--cm-text-mute)}.val.svelte-gbsl87{appearance:none;background:transparent;border:0;color:var(--cm-text);font:inherit;font-family:var(--cm-font-mono);font-size:12px;text-align:left;padding:0;cursor:copy}.val.svelte-gbsl87:hover{color:var(--cm-accent-page)}.copied.svelte-gbsl87{font-family:var(--cm-font-mono);font-size:10px;color:var(--cm-accent-page)}@media(max-width:760px){.grid.svelte-gbsl87{grid-template-columns:1fr;gap:24px}}