.color-pill{background-color:color-mix(in srgb, var(--pill-color-start,var(--color-primary)) 15%, transparent);border:1px solid color-mix(in srgb, var(--pill-color-start,var(--color-primary)) 35%, transparent);border-radius:var(--radius-sm);align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);width:min-content;display:flex}.color-pill--multi{background:linear-gradient(to right, color-mix(in srgb, var(--pill-color-start,var(--color-primary)) 15%, transparent), color-mix(in srgb, var(--pill-color-end,var(--color-primary)) 15%, transparent));border-color:color-mix(in srgb, var(--pill-color-start,var(--color-primary)) 25%, transparent)}[dir=rtl] .color-pill--multi{background:linear-gradient(to left, color-mix(in srgb, var(--pill-color-start,var(--color-primary)) 15%, transparent), color-mix(in srgb, var(--pill-color-end,var(--color-primary)) 15%, transparent))}.color-pill__dots{gap:var(--space-1);display:flex}.color-pill__dot{background-color:var(--dot-color,var(--color-primary));box-shadow:0 0 6px 1px var(--dot-color,var(--color-primary));height:var(--space-3);width:var(--space-3);border-radius:50%;flex-shrink:0}.color-pill__name{color:var(--color-text-secondary);font-size:var(--font-size-xs);letter-spacing:.04em;text-transform:capitalize;font-weight:500}
.panel{background-color:var(--color-bg-elevated);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);flex-direction:column;display:flex;overflow:hidden}.panel--accent{background-color:var(--color-bg-inset);border:1px solid var(--color-primary)}.panel--muted{background-color:var(--color-bg-inset);border:1px solid var(--color-border)}.panel--gradient{background:var(--gradient-surface)}.panel--padding-sm{padding:var(--space-6)}.panel--padding-md,.panel--padding-lg{padding:var(--space-7)}@media (min-width:768px){.panel--padding-sm{padding:var(--space-7)}.panel--padding-md{padding:var(--space-8)}.panel--padding-lg{padding:var(--space-9)}}@media (min-width:1024px){.panel--padding-md{padding:var(--space-9)}.panel--padding-lg{padding:var(--space-10)}}
