/* All cities page /catalog/mista/ (owner request 02.10.2026): biggest cities, A-Я index, quick filter. */
.cities-page{max-width:1240px;margin:0 auto;padding:18px 24px 56px;color:var(--c-ink)}
.cities-page .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cities-head{margin:6px 0 30px}
.cities-head h1{margin:0 0 8px;font-size:clamp(30px,4vw,40px);line-height:1.15;letter-spacing:-.5px}
.cities-head p{margin:0 0 18px;max-width:640px;font-size:var(--fs-base);line-height:1.55;color:var(--c-muted)}
.cities-search{display:block;max-width:520px}
.cities-search input{width:100%;min-height:48px;padding:0 16px;border:1px solid var(--c-line-strong);border-radius:var(--r-md);font:inherit;font-size:var(--fs-md);background:var(--c-surface);color:var(--c-ink)}
.cities-search input:focus{outline:2px solid var(--c-primary);outline-offset:1px;border-color:var(--c-primary)}
.cities-block{margin:0 0 34px}
.cities-block h2{margin:0 0 12px;font-size:var(--fs-h3);line-height:1.3}
.cities-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px}
.cities-top a,.cities-all li{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-bottom:1px solid var(--c-line)}
.cities-top a{padding:10px 2px;font-size:var(--fs-base);color:var(--c-ink);text-decoration:none}
.cities-top a span{min-width:0}
.cities-top a:hover,.cities-all a:hover{color:var(--c-primary)}
.cities-top small,.cities-all small{flex-shrink:0;font-size:var(--fs-sm);color:var(--c-muted);font-variant-numeric:tabular-nums}
.cities-letters{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;gap:4px;margin:0 0 18px;padding:8px 0;background:var(--c-surface)}
.cities-letters a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 6px;border-radius:var(--r-md);background:var(--c-surface-alt);color:var(--c-ink);font-size:var(--fs-ui);font-weight:600;text-decoration:none}
.cities-letters a:hover{background:var(--c-primary);color:#fff}
.cities-letters a[hidden]{display:none}
.cities-all{display:block}
.cities-group{margin:0 0 22px;scroll-margin-top:64px}
.cities-group h3{margin:0 0 4px;padding-top:2px;font-size:var(--fs-lg);line-height:1.3;color:var(--c-primary);break-after:avoid}
.cities-group ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));column-gap:28px;margin:0;padding:0;list-style:none}
.cities-all li{padding:6px 2px;break-inside:avoid}
.cities-all a{min-width:0;font-size:var(--fs-base);line-height:1.35;color:var(--c-ink);text-decoration:none;overflow-wrap:anywhere}
.cities-empty{margin:8px 0 0;font-size:var(--fs-base);color:var(--c-muted)}
.cities-all li[hidden],.cities-group[hidden],.cities-block[hidden],.cities-empty[hidden]{display:none}
@media(max-width:760px){
 .cities-page{padding:12px 16px 40px}
 .cities-head{margin-bottom:24px}
 .cities-head h1{font-size:var(--fs-h1)}
 .cities-top{grid-template-columns:1fr 1fr;gap:0 14px}
 .cities-top a{gap:6px;padding:10px 0}
 .cities-top small,.cities-all small{font-size:var(--fs-xs)}
 .cities-all li{gap:6px;padding:6px 0}
 .cities-group ul{grid-template-columns:1fr 1fr;column-gap:16px}
 .cities-letters{flex-wrap:nowrap;gap:4px;margin:0 -16px 14px;padding:8px 16px;overflow-x:auto;scrollbar-width:none}
 .cities-letters::-webkit-scrollbar{display:none}
 .cities-letters a{flex-shrink:0}
 .cities-group{scroll-margin-top:60px}
 .cities-letters a{min-width:30px;height:32px;font-size:var(--fs-sm)}
}
/* Oblasts (owner request 02.10.2026): A-Я / oblast switch, oblast under each city name. */
.cities-all-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px;margin:0 0 12px}
.cities-all-head h2{margin:0}
.cities-views{display:inline-flex;padding:3px;border-radius:var(--r-md);background:var(--c-surface-alt)}
.cities-views button{min-height:36px;padding:0 14px;border:0;border-radius:var(--r-md);background:none;color:var(--c-text);font:inherit;font-size:var(--fs-ui);font-weight:600;cursor:pointer}
.cities-views button[aria-pressed=true]{background:var(--c-surface);color:var(--c-ink);box-shadow:0 1px 3px rgba(23,34,44,.12)}
.cities-views button:focus-visible{outline:2px solid var(--c-primary);outline-offset:1px}
.cities-pane[hidden],.cities-letters a[hidden]{display:none}
.cities-all li a{display:flex;flex-direction:column;gap:1px}
.cities-all .city-region{font-size:var(--fs-xs);line-height:1.3;color:var(--c-muted)}
.cities-all li>.city-count{flex-shrink:0;font-size:var(--fs-sm);color:var(--c-muted);font-variant-numeric:tabular-nums}
.cities-region h3{color:var(--c-ink)}
.cities-regions-nav a{min-width:0;padding:0 10px;font-weight:500}
@media(max-width:760px){
 .cities-all-head{align-items:flex-start;flex-direction:column}
 .cities-views{width:100%}
 .cities-views button{flex:1}
 .cities-all li>.city-count{font-size:var(--fs-xs)}
}
/* Search status and empty-state actions (UX2-07); whole-row links and a fading index edge (UX2-08, 03.10.2026). */
.cities-status{margin:10px 0 0;font-size:var(--fs-ui);color:var(--c-muted)}
.cities-status:empty{display:none}
.cities-empty p{margin:0}
.cities-empty .cities-empty-actions{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:6px}
.cities-empty-actions a{display:inline-flex;align-items:center;min-height:40px;color:var(--c-primary);font-weight:600;text-decoration:none}
.cities-empty-actions a:hover{text-decoration:underline;text-underline-offset:3px}
.cities-all li a{flex:1 1 auto;min-height:40px;justify-content:center}
.cities-all .cities-region li{padding-top:0;padding-bottom:0}
.cities-letters-track{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 auto;min-width:0}
@media(max-width:760px){
 .cities-letters{overflow:visible;padding-right:0}
 .cities-letters-track{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-right:28px;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}
 .cities-letters-track::-webkit-scrollbar{display:none}
}