.color-swatch:where(.astro-agbxdnd4){grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:.75rem;margin:1.5rem 0;display:grid}.color-swatch--pair:where(.astro-agbxdnd4){border:1px solid var(--sl-color-border);background:var(--sl-color-border);border-radius:18px;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;overflow:hidden}.color-swatch--pair:where(.astro-agbxdnd4) .color-swatch__item:where(.astro-agbxdnd4){border:0;border-radius:0;margin:0}.color-swatch--pair:where(.astro-agbxdnd4) .color-swatch__chip:where(.astro-agbxdnd4){aspect-ratio:16/10;border-radius:0}.color-swatch__item:where(.astro-agbxdnd4){border:1px solid var(--sl-color-border);background:var(--sl-color-bg);color:inherit;cursor:pointer;text-align:center;font:inherit;border-radius:14px;flex-direction:column;margin:0;padding:0;transition:transform .15s,border-color .15s;display:flex;overflow:hidden}.color-swatch__item:where(.astro-agbxdnd4):hover{border-color:color-mix(in srgb, var(--brand-fg) 35%, transparent);transform:translateY(-2px)}.color-swatch__item:where(.astro-agbxdnd4):focus-visible{outline:2px solid var(--brand-fg);outline-offset:2px}.color-swatch__chip:where(.astro-agbxdnd4){aspect-ratio:1;background:var(--swatch);color:var(--swatch-fg);flex-direction:column;justify-content:flex-end;align-items:center;gap:.25rem;padding:.65rem .5rem;display:flex}.color-swatch__hex:where(.astro-agbxdnd4){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;letter-spacing:.02em;font-size:11px;font-weight:600}.color-swatch__hint:where(.astro-agbxdnd4){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;letter-spacing:.08em;text-transform:uppercase;opacity:0;font-size:9px;font-weight:500;transition:opacity .15s}.color-swatch__item:where(.astro-agbxdnd4):hover .color-swatch__hint:where(.astro-agbxdnd4),.color-swatch__item:where(.astro-agbxdnd4)[data-copied] .color-swatch__hint:where(.astro-agbxdnd4){opacity:.75}.color-swatch__name:where(.astro-agbxdnd4){min-height:38px;color:var(--sl-color-text);justify-content:center;align-items:center;padding:.4rem .6rem;font-size:12px;font-weight:600;line-height:1.2;display:flex}@media (width<=520px){.color-swatch--pair:where(.astro-agbxdnd4){grid-template-columns:1fr}}.color-ramp:where(.astro-cwtur43c){margin:1.5rem 0}.color-ramp__strip:where(.astro-cwtur43c){border:1px solid var(--sl-color-border);border-radius:16px;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:0;min-height:120px;display:grid;overflow:hidden}.color-ramp__stop:where(.astro-cwtur43c){background:var(--stop);min-width:0;min-height:120px;color:var(--stop-fg);cursor:pointer;text-align:left;font:inherit;border:0;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:.2rem;margin:0;padding:.75rem .55rem;transition:filter .15s;display:flex}.color-ramp__stop:where(.astro-cwtur43c):hover{filter:brightness(1.06);z-index:1}.color-ramp__stop:where(.astro-cwtur43c):focus-visible{outline:2px solid var(--brand-fg);outline-offset:-2px;z-index:2}.color-ramp__label:where(.astro-cwtur43c){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;font-size:11px;font-weight:700}.color-ramp__hex:where(.astro-cwtur43c){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;opacity:.8;letter-spacing:.02em;font-size:10px;font-weight:500}.color-ramp__hint:where(.astro-cwtur43c){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;letter-spacing:.06em;text-transform:uppercase;opacity:0;font-size:9px;transition:opacity .15s}.color-ramp__stop:where(.astro-cwtur43c):hover .color-ramp__hint:where(.astro-cwtur43c),.color-ramp__stop:where(.astro-cwtur43c)[data-copied] .color-ramp__hint:where(.astro-cwtur43c){opacity:.7}@media (width<=720px){.color-ramp__strip:where(.astro-cwtur43c){grid-template-columns:1fr;min-height:0}.color-ramp__stop:where(.astro-cwtur43c){flex-direction:row;justify-content:flex-start;align-items:center;gap:.75rem;min-height:52px}.color-ramp__hint:where(.astro-cwtur43c){margin-left:auto}}.status-preview:where(.astro-5gylejy2){grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin:1.25rem 0 1.75rem;display:grid}.status-preview__card:where(.astro-5gylejy2){border:1px solid var(--sl-color-border);background:var(--sl-color-bg);border-radius:16px;min-width:0;padding:1rem 1.05rem 1.05rem}.status-preview__head:where(.astro-5gylejy2){flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.85rem;display:flex}.status-preview__dot:where(.astro-5gylejy2){background:var(--status);border-radius:50%;flex-shrink:0;width:10px;height:10px}.status-preview__head:where(.astro-5gylejy2) strong:where(.astro-5gylejy2){font-size:.92rem;font-weight:600}.status-preview__head:where(.astro-5gylejy2) code:where(.astro-5gylejy2){font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;opacity:.72;margin-left:auto;font-size:11px}.status-preview__samples:where(.astro-5gylejy2){flex-direction:column;gap:.55rem;display:flex}.status-preview__badge:where(.astro-5gylejy2){background:var(--status);color:var(--status-fg);font-family:"JetBrains Mono", var(--ds-font-mono,ui-monospace), monospace;border-radius:999px;align-self:flex-start;padding:.28rem .65rem;font-size:11px;font-weight:600;display:inline-flex}.status-preview__surface:where(.astro-5gylejy2){background:color-mix(in srgb, var(--status) 10%, transparent);border:1px solid color-mix(in srgb, var(--status) 20%, transparent);color:var(--sl-color-text);border-radius:10px;padding:.7rem .8rem;font-size:.86rem;line-height:1.35;display:block}.status-preview__text:where(.astro-5gylejy2){color:var(--status);font-size:.88rem;font-weight:600}@media (width<=720px){.status-preview:where(.astro-5gylejy2){grid-template-columns:1fr}}