@layer features{.palette-button{border:var(--line-width) solid var(--border-control);border-radius:var(--radius-round);block-size:2.75rem;inline-size:2.75rem;color:var(--text);transition:background-color var(--dur-quick) var(--ease-settle), color var(--dur-quick) var(--ease-settle);background:0 0;place-items:center;padding:0;display:none}html[data-js] .palette-button{display:inline-grid}.palette-button:hover,.palette-button[aria-expanded=true]{background:var(--text);color:var(--surface)}@media (width<=25.999rem){html[data-js] .palette-button{display:none}}.palette-row{align-items:center;gap:var(--space-3);min-block-size:2.75rem;inline-size:100%;padding:var(--space-3) var(--space-4);border:var(--line-width) solid var(--border-control);border-radius:var(--radius-s);color:var(--text-muted);font-family:var(--font-display);font-size:var(--step-0);font-weight:var(--weight-strong);line-height:var(--leading-snug);text-align:start;background:0 0;margin-block-end:var(--space-5);display:none}@media (width<=25.999rem){html[data-js] .palette-row{display:flex}}html[data-palette-open]{overflow:hidden}.palette{z-index:var(--z-overlay);visibility:hidden;pointer-events:none;transition:visibility 0s linear var(--dur-base);justify-content:center;align-items:flex-start;display:flex;position:fixed;inset:0}.palette[data-open]{visibility:visible;pointer-events:auto;transition:visibility}.palette__backdrop{background-color:color-mix(in srgb, var(--on-first-light) 62%, transparent);opacity:0;transition:opacity var(--dur-base) var(--ease-settle);position:absolute;inset:0}.palette[data-open] .palette__backdrop{opacity:1}.palette__panel{inline-size:min(46rem, calc(100% - 2 * var(--margin-outer)));max-block-size:calc(100dvh - clamp(var(--space-4), 10dvh, var(--space-9)) - var(--space-4));background-color:var(--surface-raised);color:var(--text);border:var(--line-width) solid var(--border-control);border-radius:var(--radius-m);opacity:0;clip-path:polygon(49.5% 0,49% 11%,50.4% 22%,48.8% 34%,50.2% 46%,49.1% 58%,50.3% 70%,49% 82%,49.6% 100%,50.4% 100%,51% 82%,49.7% 70%,51.2% 58%,49.8% 46%,51.2% 34%,49.6% 22%,51% 11%,50.5% 0);transition:clip-path var(--dur-base) var(--ease-rift), opacity var(--dur-quick) linear var(--dur-base);flex-direction:column;margin-block-start:clamp(var(--space-4), 10dvh, var(--space-9));display:flex;position:relative}.palette[data-open] .palette__panel{opacity:1;clip-path:polygon(-2% -2%,-1% 11%,-3% 22%,-1% 34%,-2% 46%,-1% 58%,-3% 70%,-1% 82%,-2% 102%,102% 102%,101% 82%,103% 70%,101% 58%,102% 46%,101% 34%,103% 22%,101% 11%,102% -2%);transition:clip-path var(--dur-base) var(--ease-rift), opacity 0s}@media (prefers-reduced-motion:reduce){.palette__panel,.palette[data-open] .palette__panel{clip-path:none;transition:opacity var(--dur-quick) linear}}.palette__field{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3) var(--space-2) var(--space-4);border-block-end:var(--line-width) solid var(--border);display:flex}.palette__field:has(.palette__input:focus-visible){box-shadow:inset 0 calc(-1 * var(--line-width-strong)) 0 var(--focus)}.palette__icon{color:var(--text-muted);flex:none}.palette__input{min-inline-size:0;padding:var(--space-3) 0;color:var(--text);font-family:var(--font-display);font-size:var(--step-1);font-weight:var(--weight-strong);letter-spacing:var(--tracking-heading);line-height:var(--leading-snug);background:0 0;border:0;flex:auto}.palette__input:focus-visible{outline:none}.palette__input::placeholder{color:var(--text-muted);opacity:1}.palette__close{min-block-size:2.75rem;padding:0 var(--space-4);border:var(--line-width) solid var(--border-control);border-radius:var(--radius-s);color:var(--text);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:var(--tracking-label);text-transform:uppercase;transition:background-color var(--dur-quick) var(--ease-settle), color var(--dur-quick) var(--ease-settle);background:0 0;flex:none;font-weight:500}.palette__close:hover{background:var(--text);color:var(--surface)}.palette__empty{gap:var(--space-1);padding:var(--space-5) var(--space-4) var(--space-3);display:grid}.palette__empty-title,.palette__empty-text{margin:0}.palette__empty-title{font-size:var(--step-0);font-weight:var(--weight-strong);overflow-wrap:anywhere}.palette__empty-text{color:var(--text-muted);font-size:var(--step--1)}.palette__list{overscroll-behavior:contain;min-block-size:0;padding:var(--space-2);flex:auto;overflow-y:auto}.palette__group+.palette__group{margin-block-start:var(--space-2)}.palette__group-label{padding:var(--space-2) var(--space-3);color:var(--text-muted);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:var(--tracking-label);text-transform:uppercase;font-weight:500}.palette__option{align-content:center;gap:var(--space-1);min-block-size:2.75rem;padding:var(--space-3);border-radius:var(--radius-s);color:var(--text);font-size:var(--step-0);line-height:var(--leading-snug);cursor:pointer;text-decoration:none;display:grid}.palette__option[data-active]{background-color:var(--text);color:var(--surface)}.palette__label{overflow-wrap:anywhere;min-inline-size:0}.palette__mark{color:inherit;font-weight:var(--weight-strong);text-decoration:underline;text-decoration-thickness:var(--line-width-strong);text-underline-offset:.2em;background:0 0}.palette__hint{overflow-wrap:anywhere;min-inline-size:0;color:var(--text-muted);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:var(--tracking-label);text-transform:uppercase}.palette__option[data-active] .palette__hint{color:inherit}@media (forced-colors:active){.palette__option[data-active]{outline:var(--line-width-strong) solid currentColor;outline-offset:calc(-1 * var(--line-width-strong))}}.palette__foot{justify-content:space-between;align-items:baseline;gap:var(--space-1) var(--space-4);padding:var(--space-3) var(--space-4);border-block-start:var(--line-width) solid var(--border);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:var(--tracking-label);flex-wrap:wrap;display:flex}.palette__keys,.palette__feedback{margin:0}.palette__keys{color:var(--text-muted)}.palette__feedback{color:var(--text);margin-inline-start:auto}@media (hover:none){.palette__keys{display:none}}}