@layer components{.zone-card{& .zone-card__head{display:flex;gap:var(--space-2xs);align-items:center;margin-block-end:var(--space-xs)}& .zone-card__dot{inline-size:.75rem;block-size:.75rem;border-radius:var(--radius-pill);background:var(--color-accent)}& [data-zone='2']{background:var(--color-accent-soft)}& [data-zone='3']{background:var(--color-accent-deep)}& [data-zone='4']{background:var(--color-text)}& .zone-card__name{font-size:var(--size-step-1)}& .zone-card__cities{color:var(--color-text-muted);font-size:var(--size-step--1)}& .zone-card__note{display:block;margin-block-start:var(--space-s)}}}