.error[data-astro-cid-r2vbo3yl]{margin-top:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);background:var(--warning-soft);color:var(--warning-text);font-size:var(--text-sm)}.error[data-astro-cid-r2vbo3yl][hidden],.workspace[data-astro-cid-r2vbo3yl][hidden]{display:none}.workspace[data-astro-cid-r2vbo3yl]{gap:var(--space-6);margin-top:var(--space-5);grid-template-columns:minmax(0,1fr) 20rem;align-items:start;display:grid}.file-name[data-astro-cid-r2vbo3yl]{margin-bottom:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary);overflow-wrap:anywhere}.stage[data-astro-cid-r2vbo3yl]{border-radius:var(--radius-panel);background:repeating-conic-gradient(var(--bg-sunken) 0 25%, var(--bg-raised) 0 50%) 0 0 / 16px 16px;box-shadow:inset 0 0 0 1px var(--border);line-height:0;position:relative;overflow:hidden}.stage[data-astro-cid-r2vbo3yl] canvas[data-astro-cid-r2vbo3yl][data-canvas]{width:100%;max-width:calc(75vh * var(--ar,1));cursor:crosshair;touch-action:none;height:auto;margin:0 auto;display:block}.crosshair[data-astro-cid-r2vbo3yl],.loupe[data-astro-cid-r2vbo3yl]{pointer-events:none;opacity:0;transition:opacity var(--dur-fast) ease;position:absolute;top:0;left:0}.stage[data-astro-cid-r2vbo3yl][data-active=true] .crosshair[data-astro-cid-r2vbo3yl],.stage[data-astro-cid-r2vbo3yl][data-active=true] .loupe[data-astro-cid-r2vbo3yl]{opacity:1}.crosshair[data-astro-cid-r2vbo3yl]{width:0;height:0}.crosshair[data-astro-cid-r2vbo3yl]:before,.crosshair[data-astro-cid-r2vbo3yl]:after{content:"";background:#fff;position:absolute;box-shadow:0 0 0 1px #0009}.crosshair[data-astro-cid-r2vbo3yl]:before{width:16px;height:1px;top:-.5px;left:-8px}.crosshair[data-astro-cid-r2vbo3yl]:after{width:1px;height:16px;top:-8px;left:-.5px}.loupe[data-astro-cid-r2vbo3yl]{width:143px;height:143px;image-rendering:pixelated;border:3px solid #fff;border-radius:50%;box-shadow:0 6px 20px -6px #0f172a80}.help[data-astro-cid-r2vbo3yl]{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--text-secondary)}.panel[data-astro-cid-r2vbo3yl]{padding:var(--space-5);border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--bg-raised);box-shadow:var(--shadow-sm)}.current[data-astro-cid-r2vbo3yl]{align-items:center;gap:var(--space-4);display:flex}.current-swatch[data-astro-cid-r2vbo3yl]{border-radius:var(--radius-control);flex:none;width:3.5rem;height:3.5rem;box-shadow:inset 0 0 0 1px #0000001f}.current-hex[data-astro-cid-r2vbo3yl]{font-family:var(--font-mono,ui-monospace, monospace);font-size:var(--text-xl);font-variant-numeric:tabular-nums;font-weight:650}.current-rgb[data-astro-cid-r2vbo3yl]{font-size:var(--text-sm);color:var(--text-secondary)}.controls[data-astro-cid-r2vbo3yl]{align-items:end;gap:var(--space-3);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.control[data-astro-cid-r2vbo3yl]{gap:var(--space-1);font-size:var(--text-xs);color:var(--text-secondary);font-weight:600;display:grid}.control[data-astro-cid-r2vbo3yl] select[data-astro-cid-r2vbo3yl]{height:2.25rem;padding:0 2.25rem 0 var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-control);background-color:var(--bg);color:var(--text);font:inherit;font-size:var(--text-sm);background-position:right .625rem center}.panel-title[data-astro-cid-r2vbo3yl]{margin-top:var(--space-5);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:650}.picked-empty[data-astro-cid-r2vbo3yl]{margin-top:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary)}.picked-empty[data-astro-cid-r2vbo3yl][hidden]{display:none}.picked[data-astro-cid-r2vbo3yl]{margin:var(--space-2) 0 0;gap:var(--space-2);max-height:26rem;padding:0;list-style:none;display:grid;overflow:auto}@media (width<=56rem){.workspace[data-astro-cid-r2vbo3yl]{grid-template-columns:1fr}}.picker .picked-item{align-items:center;gap:var(--space-3);grid-template-columns:2.25rem minmax(0,1fr) auto;display:grid}.picker .picked-swatch{border-radius:var(--radius-control);width:2.25rem;height:2.25rem;box-shadow:inset 0 0 0 1px #0000001f}.picker .picked-values{gap:2px var(--space-2);flex-wrap:wrap;min-width:0;display:flex}.picker .value{color:var(--text);font:inherit;font-size:var(--text-xs);font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:0;border-radius:6px;padding:2px 6px}.picker .value:first-child{font-weight:650}.picker .value:hover{background:var(--bg-sunken)}.picker .value[data-copied]{background:var(--success-soft);color:var(--success-text)}