/* Выбор города — общий для gorynychelectro.ru и a2k.pro (scripts/city.ts). Цвета — из токенов сайта:
   --ink, --muted, --line, --focus; акцент — --cy-accent (бренд: чёрный, a2k.pro: оранжевый). */
:root{--cy-accent:var(--ink);--cy-soft:#f3f4f6;--cy-shadow:0 1px 2px rgba(22,23,26,.06),0 12px 32px rgba(22,23,26,.14)}

/* Кнопка города */
.citychip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0;border:0;background:none;color:inherit;font:600 13px/18px "Onest",system-ui,sans-serif;cursor:pointer}
.citychip[hidden]{display:none}
.citychip span{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;text-decoration-color:currentColor}
.citychip:hover span{text-decoration-style:solid}
.citychip svg{flex:none;opacity:.85}
.citychip--light{min-height:44px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-size:15px;justify-self:start}

/* «Ваш город — X?» */
.top__city{position:relative;display:inline-flex}
.cityq{position:absolute;top:calc(100% + 10px);left:0;z-index:100;width:min(300px,calc(100vw - 32px));background:#fff;color:var(--ink);border-radius:16px;padding:16px;box-shadow:var(--cy-shadow);font-size:15px;line-height:22px;animation:cy-in .18s ease-out}
.cityq::before{content:"";position:absolute;top:-6px;left:22px;width:12px;height:12px;background:#fff;transform:rotate(45deg);border-radius:2px}
.cityq p{margin:0 0 12px}
.cityq b{color:var(--ink);font-weight:700}
.cityq div{display:flex;gap:8px}
.cityq button{flex:1;min-height:40px;border-radius:999px;border:0;font:600 14px/1 "Onest",system-ui,sans-serif;cursor:pointer;background:var(--cy-soft);color:var(--ink)}
.cityq .cityq__yes{background:var(--cy-accent);color:#fff}
@keyframes cy-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* Окно справочника */
.cityd{border:0;padding:0;width:min(680px,calc(100vw - 32px));height:min(760px,calc(100dvh - 48px));border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 24px 70px rgba(22,23,26,.28);overflow:hidden}
.cityd[open]{display:flex;flex-direction:column;animation:cy-in .2s ease-out}
.cityd::backdrop{background:rgba(22,23,26,.45);backdrop-filter:blur(2px)}
.cityd__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 24px 0}
.cityd__head h2{margin:0;font-size:26px;line-height:32px;font-weight:800;letter-spacing:-.01em}
.cityd__x{width:44px;height:44px;border-radius:50%;border:0;background:var(--cy-soft);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.cityd__x:hover{background:#e7e8eb}
.cityd__intro{margin:6px 24px 0;color:var(--muted);font-size:15px;line-height:22px}
.cityd__bar{display:grid;gap:8px;padding:16px 24px 0;grid-template-columns:minmax(0,1fr)}
@media(min-width:600px){.cityd__bar{grid-template-columns:minmax(0,1fr) auto}}
.cityd__search{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 16px;border-radius:16px;background:var(--cy-soft);color:var(--muted);box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .15s}
.cityd__search:focus-within{background:#fff;box-shadow:inset 0 0 0 2px var(--cy-accent)}
.cityd__q{flex:1;min-width:0;border:0;background:none;outline:0;font:500 16px/24px "Onest",system-ui,sans-serif;color:var(--ink)}
.cityd__q::-webkit-search-cancel-button{cursor:pointer}
.cityd__geo{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 18px;border-radius:16px;border:0;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font:600 15px/1 "Onest",system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.cityd__geo:hover{background:var(--cy-soft)}
.cityd__geo svg{color:var(--cy-mark,var(--cy-accent))}
.cityd__geo[disabled]{opacity:.6;cursor:progress}
.cityd__msg{margin:8px 24px 0;font-size:14px;line-height:20px;color:var(--muted)}
.cityd__msg:empty{display:none}
.cityd__tabs{display:inline-flex;gap:4px;margin:16px 24px 0;padding:4px;border-radius:999px;background:var(--cy-soft);align-self:flex-start}
.cityd__tabs button{min-height:36px;padding:0 16px;border-radius:999px;border:0;background:none;color:var(--muted);font:600 14px/1 "Onest",system-ui,sans-serif;cursor:pointer}
.cityd__tabs button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(22,23,26,.12)}
.cityd__pop{display:flex;flex-wrap:wrap;gap:8px;padding:14px 24px 0}
.cityd__chip{min-height:36px;padding:0 14px;border-radius:999px;border:0;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font:500 14px/1 "Onest",system-ui,sans-serif;cursor:pointer}
.cityd__chip:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.cityd.is-search .cityd__tabs,.cityd.is-search .cityd__pop,.cityd.is-world .cityd__pop{display:none}
.cityd__list{flex:1;min-height:0;overflow:auto;margin:14px 0 0;padding:4px 16px 24px;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:2px;border-top:1px solid var(--line);overscroll-behavior:contain}
@media(min-width:600px){.cityd__list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px}}
.cityd__letter,.cityd__group{grid-column:1/-1;padding:16px 8px 6px;font-size:13px;line-height:16px;font-weight:700;color:var(--cy-accent)}
.cityd__group{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:12px}
.cityd__note,.cityd__custom{grid-column:1/-1}
.cityd__note{padding:12px 8px;color:var(--muted);font-size:14px}
.cityd__opt{position:relative;display:grid;gap:2px;width:100%;min-height:52px;padding:9px 36px 9px 12px;border:0;border-radius:12px;background:none;color:var(--ink);text-align:left;font:inherit;cursor:pointer}
.cityd__opt:hover,.cityd__opt:focus-visible{background:var(--cy-soft)}
.cityd__opt b{font-size:16px;line-height:22px;font-weight:600}
.cityd__opt span{font-size:13px;line-height:18px;color:var(--muted)}
.cityd__opt[aria-current="true"]{background:var(--cy-soft)}
.cityd__opt[aria-current="true"]::after{content:"";position:absolute;right:14px;top:50%;width:12px;height:7px;margin-top:-6px;border-left:2px solid var(--cy-mark,var(--cy-accent));border-bottom:2px solid var(--cy-mark,var(--cy-accent));transform:rotate(-45deg)}
.cityd__custom .cityd__opt{border:1px dashed var(--line);margin-top:6px}
@media(max-width:599px){
  .cityd{width:100%;max-width:none;height:92dvh;margin:auto 0 0;border-radius:24px 24px 0 0;padding-bottom:env(safe-area-inset-bottom)}
  .cityd__head{padding:16px 16px 0}.cityd__intro,.cityd__msg{margin-left:16px;margin-right:16px}
  .cityd__bar,.cityd__pop{padding-left:16px;padding-right:16px}.cityd__tabs{margin-left:16px}.cityd__list{padding:4px 8px 24px}
  .cityd__pop{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.cityd__pop::-webkit-scrollbar{display:none}.cityd__chip{flex:none}
}

/* Подсказки в поле «Город» */
.cityac{position:relative}
.cityac__list{position:absolute;left:0;right:0;top:100%;z-index:30;margin:6px 0 0;padding:6px;list-style:none;background:#fff;border-radius:14px;box-shadow:var(--cy-shadow);max-height:320px;overflow:auto}
.cityac__list li{display:grid;gap:1px;padding:9px 12px;border-radius:10px;cursor:pointer}
.cityac__list li:hover,.cityac__list li[aria-selected="true"]{background:var(--cy-soft)}
.cityac__list b{font-size:15px;line-height:20px;font-weight:600;color:var(--ink)}
.cityac__list span{font-size:13px;line-height:18px;color:var(--muted)}

/* Блок «Для вашего города» */
.cityinfo{border-radius:24px;background:var(--cy-soft);padding:20px}
@media(min-width:744px){.cityinfo{padding:28px 32px}}
.cityinfo__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 20px;margin-bottom:16px}
.cityinfo__k{margin:0;font-size:13px;line-height:18px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.cityinfo__city{margin:4px 0 0;font-size:26px;line-height:32px;font-weight:800;letter-spacing:-.01em}
.cityinfo__reg{display:block;font-size:15px;line-height:22px;font-weight:500;color:var(--muted);letter-spacing:0}
.cityinfo__reg:empty{display:none}
.cityinfo__rows{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.cityinfo__rows{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}}
.cityinfo__row{display:grid;gap:4px;align-content:start;background:#fff;border-radius:18px;padding:18px}
.cityinfo__row i{display:inline-flex;width:44px;height:44px;border-radius:14px;align-items:center;justify-content:center;background:var(--cy-soft);color:var(--ink);margin-bottom:8px}
.cityinfo__row b{font-size:17px;line-height:24px}
.cityinfo__row span{font-size:15px;line-height:22px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.cityq,.cityd[open]{animation:none}}