:root {
  --automaticlists-gap: 16px;
  --automaticlists-radius: 6px;
  --automaticlists-accent: #5f3f68;
  --automaticlists-border: rgba(95, 63, 104, .28);
  --automaticlists-shadow: 0 8px 24px rgba(0, 0, 0, .08);
}
.automaticlists-navigation { margin-right: var(--automaticlists-gap); }
.automaticlists-layout { display: grid; grid-template-columns: minmax(180px, 230px) minmax(0, 1fr); gap: var(--automaticlists-gap); align-items: start; }
.automaticlists-main { min-width: 0; }
.automaticlists-heading { margin-bottom: var(--automaticlists-gap); overflow: hidden; border-radius: var(--automaticlists-radius); }
.automaticlists-heading h1 { margin: 0; font-size: inherit; }
.automaticlists-navigation { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--automaticlists-radius); }
.automaticlists-navigation > strong, .automaticlists-navigation-item { display: block; padding: 10px; }
.automaticlists-navigation-items { display: flex; flex-direction: column; }
.automaticlists-group, .automaticlists-avatar-group { border-radius: var(--automaticlists-radius); box-shadow: var(--automaticlists-shadow); overflow: hidden; }
.automaticlists-group { margin-bottom: var(--automaticlists-gap); }
.automaticlists-group h2, .automaticlists-group h3 { margin: 0; }
.automaticlists-gender-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.automaticlists-person { padding: 8px 12px; border-bottom: 1px solid var(--automaticlists-border); }
@media (max-width: 700px) { .automaticlists-layout, .automaticlists-gender-grid { grid-template-columns: 1fr; } .automaticlists-navigation { margin-right: 0; } }