@layer components{.palette-panel{left:12px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:90;background:var(--color-field);border:2px solid var(--color-border-strong);width:300px;padding:10px var(--space-12) var(--space-12);font:var(--fs-13)/1.4 var(--font);color:var(--color-text);box-shadow:0 10px 30px rgb(var(--shade) / .2);position:fixed}.palette-panel.is-min{width:auto;padding:0}.palette-panel__head{align-items:center;gap:var(--space-8);width:100%;font:500 var(--fs-11) var(--font);letter-spacing:.1em;text-transform:uppercase;padding:var(--space-4) 0 var(--space-8);cursor:pointer;color:var(--color-text);background:0 0;border:0;display:flex}.palette-panel.is-min .palette-panel__head{padding:var(--space-8) var(--space-12)}.palette-panel__head i{border:1px solid var(--color-border-strong);width:14px;height:14px}.palette-panel__head span{font-size:var(--text-sm);margin-left:auto}.palette-panel__swatch{grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:10px;display:grid}.palette-panel__swatch button{aspect-ratio:1;border:2px solid var(--color-field);cursor:pointer;box-shadow:0 0 0 1px var(--color-border)}.palette-panel__swatch button.on{box-shadow:0 0 0 2px var(--color-border-strong)}.palette-panel__row{align-items:center;gap:var(--space-8);display:flex}.palette-panel__row input{border:1px solid var(--color-border);cursor:pointer;background:0 0;width:34px;height:28px;padding:0}.palette-panel__row code{font:500 var(--text-xs) ui-monospace, monospace}.palette-panel__contrast{font:500 var(--fs-10) var(--font);background:var(--color-danger-line);padding:3px 6px}.palette-panel__contrast.ok{background:var(--color-surface-alt)}.palette-panel__row>button{font:500 var(--fs-11) var(--font);border:1.5px solid var(--color-border-strong);padding:var(--space-4) var(--space-8);cursor:pointer;color:var(--color-text);background:0 0;margin-left:auto}.palette-panel small{margin-top:var(--space-8);color:var(--color-text-muted);font-size:var(--fs-11);display:block}@media (min-width:1000px){.palette-panel{bottom:16px}}}