@layer components{:where(.colour[data-v-5b40ab77]){gap:var(--space-5);padding:var(--space-6) var(--space-5) var(--space-5);grid-template-rows:minmax(0,1fr) auto;display:grid}.screen[data-v-5b40ab77]{grid-area:1/1;grid-template-rows:minmax(12rem,1fr) auto}[data-idle] .screen[data-v-5b40ab77]{visibility:hidden}.start[data-v-5b40ab77]{grid-area:1/1}.picture[data-v-5b40ab77]{min-block-size:0;display:grid;overflow:clip}:where(.colour:not([data-live])) .picture[data-v-5b40ab77]{background-color:var(--colour-picked,transparent)}.view[data-v-5b40ab77],.ring[data-v-5b40ab77]{grid-area:1/1}.view[data-v-5b40ab77]{object-fit:cover;block-size:100%;inline-size:100%}.ring[data-v-5b40ab77]{--_lit:color-mix(in oklab, var(--edc-hue), oklch(100% 0 none) 20%);--_deep:color-mix(in oklab, var(--edc-hue) 35%, var(--color-zinc-950));aspect-ratio:1;border:2px solid var(--_lit);border-radius:var(--radius-full);inline-size:2.75rem;box-shadow:0 0 0 1px var(--_deep), inset 0 0 0 1px var(--_deep), 0 0 10px 1px color-mix(in oklab, var(--edc-hue) 55%, transparent);place-self:center}.reading[data-v-5b40ab77]{gap:var(--space-2) var(--space-4);padding:var(--space-4) var(--space-5) var(--space-5);background:linear-gradient(oklch(100% 0 none/.03),#0000);grid-template-rows:auto auto;grid-template-columns:auto minmax(0,1fr);align-items:center;display:grid;box-shadow:inset 0 1px oklch(0% 0 none/.5)}.swatch[data-v-5b40ab77]{aspect-ratio:1;border-radius:var(--radius-xl);background-color:var(--colour-picked,var(--color-zinc-900));inline-size:4.5rem;box-shadow:inset 0 1px 0 0 oklch(100% 0 none/.3), inset 0 -2px 0 0 color-mix(in oklab, var(--colour-picked,var(--color-zinc-900)) 72%, oklch(0% 0 none)), 0 0 0 1px oklch(100% 0 none/.1);grid-row:1/-1}.name[data-v-5b40ab77]{font-family:var(--font-title);font-size:var(--text-2xl);font-weight:700;line-height:var(--leading-2xl);overflow-wrap:anywhere;margin:0}.codes[data-v-5b40ab77]{gap:var(--space-1) var(--space-5);flex-wrap:wrap;margin:0;display:flex}.code[data-v-5b40ab77]{gap:.125rem;display:grid}.code-name[data-v-5b40ab77]{color:var(--color-zinc-400);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-widest);line-height:var(--leading-xs);text-transform:uppercase}.code-value[data-v-5b40ab77]{color:var(--edc-readout-ink);font-family:var(--font-mono);font-size:var(--text-sm);font-variant-numeric:tabular-nums;line-height:var(--leading-sm);text-shadow:var(--edc-readout-glow);white-space:nowrap;margin:0}.keys[data-v-5b40ab77]{gap:var(--space-3);flex-wrap:wrap;display:flex}.keys[data-v-5b40ab77]>*{flex:auto}}