@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('https://fonts.gstatic.com/s/instrumentserif/v5/jizBRFtNs2ka5fXjeivQ4LroWlx-2zI.ttf') format('truetype');
}

:root {
  --bg: #f7f6f2;
  --surface: #ffffff;
  --surface2: #f9f8f5;
  --border: #e8e5dd;
  --accent: #1a6b3c;
  --accent-light: #eaf4ee;
  --accent2: #c94a0a;
  --place-link: #0078a8;
  --text: #181816;
  --muted: #7a7a70;
  --tag-bg: #f0ede5;
  --font-ui: 'Geist', system-ui, -apple-system, sans-serif;
  --font-display: var(--font-ui);
  --font-logo: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-avatar: 'Syne', 'Geist', system-ui, -apple-system, sans-serif;
  --avatar-font-size: 12px;
  --avatar-font-weight: 800;
  --card-select-tint: 22%;
  --logo-size: 25.2px;
  --logo-line-height: 28.3px;
  --logo-letter-spacing: -1.01px;
  --logo-skeleton-w: 155px;
  --header-tagline-skeleton-w: 292px;
  --header-h: 52px;
  /* Layer A — action chrome (see pages.css). Layer B — sector pastels in main.css */
  --ctrl-h-sm: 32px;
  --ctrl-h-lg: 40px;
  --ctrl-radius-md: 10px;
  --ctrl-font-sm: 12.5px;
  --ctrl-font-md: 13px;
  --ctrl-font-lg: 14px;
  --ctrl-weight: 500;
  --ctrl-weight-active: 600;
  --ctrl-border: 1.5px solid var(--border);
  --primary-grad: linear-gradient(135deg, #418f8f 0%, #2a684f 100%);
  --primary-grad-pressed: linear-gradient(135deg, #357878 0%, #1f5239 100%);
  --segment-tray-bg: var(--surface2);
  --segment-active-bg: var(--surface);
  --segment-active-color: var(--text);
  /* Legacy aliases used by layout math */
  --btn-height-sm: var(--ctrl-h-sm);
  --btn-height-md: var(--ctrl-h-sm);
  --btn-height-lg: var(--ctrl-h-lg);
  --btn-radius: var(--ctrl-radius-md);
  --btn-radius-pill: 999px;
  --pill-radius: 100px;
  --tag-height: 20px;
  --btn-font-sm: var(--ctrl-font-sm);
  --btn-font-md: var(--ctrl-font-md);
  --btn-font-lg: var(--ctrl-font-lg);
  --btn-weight: var(--ctrl-weight);
  --btn-border: var(--ctrl-border);
  --toolbar-h: 64px;
  --toolbar-h-mobile: 60px;
  --toolbar-measured: var(--toolbar-h-mobile);
  --map-top: calc(var(--header-h) + var(--toolbar-measured));
  --chrome-top: calc(var(--header-h) + var(--toolbar-h));
  --company-card-row: 94px;
  --company-card-expanded: 228px;
  --sheet-handle-block: 32px;
  --sheet-peek-title-block: 36px;
  --sheet-view-toggle-pad: 12px;
  --sheet-view-toggle-btn-h: var(--ctrl-h-sm);
  --sheet-view-toggle-block: calc(
    var(--sheet-view-toggle-pad) +
    var(--sheet-view-toggle-btn-h) +
    var(--sheet-view-toggle-pad)
  );
  --sheet-peek-footer-block: var(--sheet-view-toggle-block);
  --sheet-peek-body: calc(
    var(--sheet-handle-block) +
    var(--sheet-peek-title-block) +
    var(--sheet-peek-footer-block)
  );
  --sheet-peek: var(--sheet-peek-body);
  --sheet-slice-header-block: 52px;
  --sheet-slice-list: calc(var(--company-card-row) * 2.5);
  --sheet-slice-footer-block: var(--sheet-view-toggle-block);
  --sheet-slice-body: calc(
    var(--sheet-handle-block) +
    var(--sheet-slice-header-block) +
    var(--sheet-slice-list) +
    var(--sheet-slice-footer-block)
  );
  --sheet-slice: var(--sheet-slice-body);
  --sheet-measured: var(--sheet-peek-body);
  --sheet-full: calc(100dvh - var(--chrome-top));
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --map-inset: 12px;
  --map-chrome-pad-y: 10px;
  --map-chrome-bar-pad: 6px;
  --map-chrome-row-offset: calc(var(--map-chrome-pad-y) + var(--map-chrome-bar-pad));
  --map-chrome-gap: 4px;
  --list-column-left: calc(
    var(--content-column-gutter) +
    (
      100vw - 2 * var(--content-column-gutter) -
      min(var(--list-content-max), 100vw - 2 * var(--content-column-gutter))
    ) / 2
  );
  --view-switch-duration: 0.22s;
  --view-switch-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --view-switch-btn-duration: 0.14s;
  /* Centred content column — list view + subpages (Add, Updates, Ads) */
  --list-content-max: clamp(520px, 42vw, 640px);
  --content-column-inset: 10px;
  --content-column-gutter: 12px;
  /* Page shell — grey canvas, white centred card */
  --shell-canvas: var(--surface2);
  --shell-card-bg: var(--surface);
  --shell-card-border: 1.5px solid var(--border);
  --shell-card-shadow: none;
  --list-gutter-bg: var(--shell-canvas);
  --map-chrome-bar-max: 480px;
  --map-sidebar-w: 340px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-gutter: stable;
  overflow-x: hidden;
  overflow-y: scroll;
}
html, body { font-family: var(--font-ui); background: var(--bg); color: var(--text); height: 100%; display: flex; flex-direction: column; }
body { overflow: hidden; }

/* Accessibility — screen-reader only + skip link */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: absolute;
  left: -9999px;
  top: 8px;
  z-index: 10001;
  padding: 8px 14px;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.skip-link:focus {
  left: 16px;
  outline: 2px solid var(--text);
  outline-offset: 2px;
}

/* HEADER */
.site-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px; height: var(--header-h); min-height: var(--header-h);
  background: var(--surface); border-bottom: 1px solid var(--border);
  z-index: 1000; flex-shrink: 0;
}
.logo { display: flex; align-items: center; gap: 10px; font-family: var(--font-logo); font-weight: 400; color: var(--text); text-decoration: none; border-radius: 8px; }
.logo:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.logo-text {
  font-size: var(--logo-size);
  line-height: var(--logo-line-height);
  letter-spacing: var(--logo-letter-spacing);
  font-synthesis: none;
}
.logo:not(.logo-font-ready) .logo-text,
.logo:not(.logo--ready) .logo-badge {
  display: none;
}
.logo:not(.logo-font-ready) .logo-skeleton,
.logo:not(.logo--ready) .logo-badge-skeleton {
  display: block;
}
.logo.logo--ready .logo-badge {
  display: block;
  animation: header-text-in 0.2s ease;
}
.logo.logo-font-ready .logo-text {
  display: block;
  animation: header-text-in 0.15s ease;
}
.logo.logo-font-ready .logo-skeleton,
.logo.logo--ready .logo-badge-skeleton {
  display: none;
}
@keyframes header-text-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
.logo-skeleton {
  flex-shrink: 0;
  width: var(--logo-skeleton-w);
  height: 12px;
  border-radius: 999px;
}
.logo-badge {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  flex-shrink: 0;
  object-fit: cover;
}
.logo-badge-skeleton {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 6px;
}
.header-right { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--muted); min-height: 16px; }
.header-tagline { display: none; }
body.fonts-ready .header-tagline {
  display: inline;
  animation: header-text-in 0.2s ease;
}
.header-tagline-skeleton {
  display: block;
  flex-shrink: 0;
  width: var(--header-tagline-skeleton-w);
  height: 10px;
  border-radius: 999px;
}
body.fonts-ready .header-tagline-skeleton { display: none; }
.toolbar-tagline { display: none; margin: 0; }
body.fonts-ready .toolbar-tagline {
  display: block;
  animation: header-text-in 0.2s ease;
}
.toolbar-tagline-skeleton {
  display: none;
  width: min(var(--header-tagline-skeleton-w), 100%);
  height: 10px;
  border-radius: 999px;
}
body.fonts-ready .toolbar-tagline-skeleton { display: none; }
.header-tagline a,
.toolbar-tagline a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  border-radius: 4px;
}
.header-tagline a:focus-visible,
.toolbar-tagline a:focus-visible,
.map-attribution a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.header-tagline a:hover,
.toolbar-tagline a:hover,
.panel-footer__copy a:hover {
  color: var(--accent);
}

/* List sidebar credit footer */
.panel-footer {
  flex-shrink: 0;
  position: relative;
  z-index: 6;
  margin-top: 0;
  padding: 10px 12px 14px;
  background: var(--surface);
  pointer-events: none;
}
.panel-footer__text {
  margin: 0;
  text-align: center;
  font-size: 11px;
  line-height: 1.35;
  color: var(--muted);
}
.panel-footer__copy {
  display: none;
}
body.fonts-ready .panel-footer__copy {
  display: block;
  animation: header-text-in 0.2s ease;
}
.panel-footer__copy a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  border-radius: 4px;
  pointer-events: auto;
}
.panel-footer__copy a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.cookie-settings-link {
  display: inline;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  border-radius: 4px;
  cursor: pointer;
  pointer-events: auto;
}
.cookie-settings-link:hover {
  color: var(--text);
}
.cookie-settings-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.panel-footer__skeleton {
  display: block;
  width: min(280px, 100%);
  height: 10px;
  margin: 0 auto;
  border-radius: 999px;
  pointer-events: none;
}
body.fonts-ready .panel-footer__skeleton {
  display: none;
}
.company-list:has(~ .panel-footer) {
  padding-bottom: 0;
}

/* LAYOUT */
.main {
  display: flex;
  flex: 1;
  overflow: hidden;
  min-height: 0;
  position: relative;
}

/* MAP CHROME — over map only (desktop); full width in list view */
.map-chrome {
  position: fixed;
  top: var(--header-h);
  left: 0;
  right: 0;
  z-index: 850;
  pointer-events: none;
  padding: var(--map-chrome-pad-y) 12px;
}
.map-chrome__bar {
  position: relative;
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 920px;
  margin: 0 auto;
  padding: var(--map-chrome-bar-pad);
  background: var(--surface);
  border: 1.5px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
}
.view-float {
  display: none;
}
.view-float__btn {
  white-space: nowrap;
}
.view-float__btn svg,
.view-float__btn .phosphor-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* List view toolbar — inline above directory (desktop) */
.list-chrome {
  display: none;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  padding: 10px 16px;
}
.list-chrome:not([hidden]) {
  display: block;
}
.list-chrome__row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: var(--list-content-max);
  margin: 0 auto;
}
.list-chrome__tools {
  flex: 1;
  min-width: 0;
}
.list-chrome .map-chrome {
  position: static;
  inset: auto;
  left: auto;
  right: auto;
  top: auto;
  z-index: auto;
  padding: 0;
  pointer-events: auto;
}
.list-chrome .map-chrome__bar {
  max-width: none;
  margin: 0;
  width: 100%;
  box-shadow: none;
}
.list-chrome .view-float__btn {
  flex-shrink: 0;
  pointer-events: auto;
}

.map-chrome__search {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}
.map-chrome__search .search-wrap {
  height: var(--ctrl-h-sm);
  min-height: var(--ctrl-h-sm);
}
.map-chrome__search .search-wrap input {
  height: var(--ctrl-h-sm);
  min-height: var(--ctrl-h-sm);
  padding-top: 6px;
  padding-bottom: 6px;
  font-size: 14px;
  background: var(--surface);
}
.map-chrome__filters {
  flex-shrink: 0;
}
.panel-sort {
  flex-shrink: 0;
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--border);
}
.panel-sort .list-sort {
  width: 100%;
}
.list-sort {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  width: 100%;
  height: var(--ctrl-h-sm);
  min-height: var(--ctrl-h-sm);
  padding: 2px;
  background: var(--segment-tray-bg);
  border: var(--ctrl-border);
  border-radius: var(--ctrl-radius-md);
  box-sizing: border-box;
}
/* Locked typography — identical metrics in every toggle state */
.list-sort__btn,
.list-sort__btn:hover,
.list-sort__btn:focus,
.list-sort__btn:focus-visible,
.list-sort__btn:active,
.list-sort__btn.active {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 0;
  height: calc(var(--ctrl-h-sm) - 4px);
  min-height: calc(var(--ctrl-h-sm) - 4px);
  padding: 0 8px;
  border: none;
  border-radius: calc(var(--ctrl-radius-md) - 3px);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  font-synthesis: none;
  font-variation-settings: 'wght' 600;
  font-optical-sizing: none;
  letter-spacing: 0;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}
.list-sort__btn {
  background: transparent;
  color: var(--muted);
}
.list-sort__btn:hover {
  color: var(--text);
}
.list-sort__btn.active {
  background: var(--segment-active-bg);
  color: var(--segment-active-color);
}
.list-sort--view .list-sort__btn {
  gap: 6px;
}
.list-sort__btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.list-sort__btn svg,
.list-sort__btn .phosphor-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.map-chrome__filters .filter-sheet-btn {
  max-width: none;
  height: var(--ctrl-h-sm);
  min-height: var(--ctrl-h-sm);
}
.map-chrome-skeleton {
  display: none;
  max-width: 480px;
  margin: 0 auto;
  pointer-events: auto;
}
.map-chrome-skeleton__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: var(--map-chrome-bar-pad);
  background: var(--surface);
  border: 1.5px solid var(--border);
  border-radius: 14px;
}
.skeleton-block--chrome-search {
  flex: 1;
  min-width: 0;
  height: var(--ctrl-h-sm);
  border-radius: 10px;
}
.skeleton-block--chrome-filter {
  width: 88px;
  height: var(--ctrl-h-sm);
  border-radius: 10px;
  flex-shrink: 0;
}

.panel {
  width: 340px; flex-shrink: 0;
  background: var(--surface);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  overflow: hidden;
  z-index: 2;
}

.panel-toolbar {
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.toolbar-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px 8px;
}

.search-wrap { position: relative; flex: 1; min-width: 0; }
.search-wrap input {
  width: 100%; background: var(--surface2); border: 1.5px solid var(--border);
  color: var(--text); padding: 8px 12px 8px 32px; border-radius: 8px;
  font-size: 14px; font-family: var(--font-ui); outline: none;
  transition: border-color .15s, outline-color .15s;
  accent-color: var(--accent);
}
.search-wrap:has(.search-clear:not([hidden])) input {
  padding-right: 38px;
}
.search-wrap input:focus { border-color: var(--accent); }
.search-wrap input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.search-wrap input:focus:not(:focus-visible) {
  outline: none;
}
.search-wrap input::placeholder { color: var(--muted); }
.search-wrap input[type="search"]::-webkit-search-decoration,
.search-wrap input[type="search"]::-webkit-search-results-button,
.search-wrap input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}
.search-wrap > svg,
.search-wrap__icon {
  position: absolute;
  left: 9px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  color: var(--muted);
  pointer-events: none;
}
.search-clear[hidden] {
  display: none !important;
}

.filter-sheet-btn {
  flex-shrink: 0;
  gap: 4px;
  max-width: min(42vw, 120px);
}
.filter-sheet-btn__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.filter-sheet-btn svg,
.filter-sheet-btn .phosphor-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.filter-sheet-btn__chevron {
  display: none;
  align-items: center;
  margin-left: 2px;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.filter-sheet-btn[aria-expanded="true"] .filter-sheet-btn__chevron {
  transform: rotate(180deg);
}
.filter-anchor { flex-shrink: 0; }

.filter-popover[hidden] { display: none !important; }
.filter-popover {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  right: 0;
  z-index: 950;
  width: auto;
}
.filter-popover__panel {
  background: var(--surface);
  border: 1.5px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  padding: 12px;
  max-height: min(360px, 52vh);
  overflow-y: auto;
}

.filters { display: flex; gap: 5px; padding: 0 14px 10px; }
#filters.filters--scroll { display: none !important; }
.panel-toolbar > .filters--scroll { display: none; }
.filters--scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  mask-image: linear-gradient(90deg, #000 92%, transparent);
}
.filters--scroll::-webkit-scrollbar { display: none; }
.filters--grid { flex-wrap: wrap; padding: 0; gap: 6px; }

/* Bento sector filters — desktop popover + mobile sheet */
#filtersPopover.filters--bento,
#filtersSheet.filters--bento {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 58px;
  align-content: start;
  gap: 8px;
  padding: 0;
}
#filtersPopover .pill--bento,
#filtersSheet .pill--bento,
.form-sector-grid .pill--bento {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 58px;
  min-height: 58px;
  max-height: 58px;
  padding: 10px 6px;
  border-radius: 12px;
  border: 1.5px solid color-mix(in srgb, var(--pill-accent) 24%, transparent);
  background: color-mix(in srgb, var(--pill-accent) 12%, #fff);
  color: var(--pill-accent);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.15;
  white-space: nowrap;
  text-align: center;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
}
#filtersPopover .pill--bento .pill__icon,
#filtersSheet .pill--bento .pill__icon,
.form-sector-grid .pill--bento .pill__icon {
  color: var(--pill-accent);
  opacity: 1;
}
#filtersPopover .pill--bento .pill__icon svg,
#filtersSheet .pill--bento .pill__icon svg,
.form-sector-grid .pill--bento .pill__icon svg {
  width: 18px;
  height: 18px;
}
#filtersPopover .pill--bento .pill__label,
#filtersSheet .pill--bento .pill__label,
.form-sector-grid .pill--bento .pill__label {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
#filtersPopover .pill--bento:hover:not(.active),
#filtersSheet .pill--bento:hover:not(.active),
.form-sector-grid .pill--bento:hover:not(.active) {
  border-color: color-mix(in srgb, var(--pill-accent) 40%, transparent);
  background: color-mix(in srgb, var(--pill-accent) 18%, #fff);
  color: var(--pill-accent);
}
#filtersPopover .pill--bento:focus-visible,
#filtersSheet .pill--bento:focus-visible,
.form-sector-grid .pill--bento:focus-visible {
  outline: 2px solid var(--pill-accent);
  outline-offset: 2px;
}
#filtersPopover .pill--bento.active,
#filtersSheet .pill--bento.active,
.form-sector-grid .pill--bento.active {
  border-color: var(--pill-accent);
  background: var(--pill-accent);
  color: #fff;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--pill-accent) 38%, transparent);
}
#filtersPopover .pill--bento.active .pill__icon,
#filtersSheet .pill--bento.active .pill__icon,
.form-sector-grid .pill--bento.active .pill__icon {
  color: #fff;
}

.toolbar-meta { display: none; }

.pill {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--tag-bg); border: 1.5px solid var(--border);
  border-radius: var(--pill-radius); padding: 3px 9px;
  font-size: 14px; font-weight: 500; color: var(--muted);
  cursor: pointer;
  transition: border-color .12s, color .12s, background-color .12s;
  user-select: none;
  white-space: nowrap; flex-shrink: 0;
}
.pill:hover:not(.active) { border-color: var(--accent); color: var(--accent); }
.pill:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.pill.active {
  border-color: var(--pill-accent, var(--accent));
  background: var(--pill-accent, var(--accent));
  color: #fff;
}
.pill.active:hover,
.pill.active:focus-visible {
  color: #fff;
  border-color: var(--pill-accent, var(--accent));
}
.phosphor-icon {
  display: block;
  flex-shrink: 0;
}
.phosphor-icon--duotone path[opacity] {
  opacity: 0.2;
}
.phosphor-icon--regular path {
  opacity: 1;
}
.pill.active .phosphor-icon--duotone path[opacity],
.pill--bento.active .pill__icon--duotone path[opacity] {
  opacity: 0.32;
}
.pill__icon {
  display: inline-flex;
  flex-shrink: 0;
  opacity: 0.88;
}
.pill__icon--duotone {
  opacity: 1;
}
.pill__icon svg {
  width: 12px;
  height: 12px;
}
.pill__icon--duotone svg {
  width: 18px;
  height: 18px;
  display: block;
}
.pill.active .pill__icon {
  color: #fff;
  opacity: 1;
}

.panel-sheet {
  display: flex; flex-direction: column;
  flex: 1; min-height: 0; overflow: hidden;
}

.sheet-handle-wrap { display: none; }
.sheet-handle-hint {
  display: none !important;
}

.sheet-controls {
  display: none;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  margin-top: 1px;
}

.sheet-ctrl {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}

.sheet-ctrl svg,
.sheet-ctrl .phosphor-icon {
  width: 15px;
  height: 15px;
  pointer-events: none;
}

.sheet-ctrl:not([hidden]):hover {
  background: var(--border);
  color: var(--text);
}

.sheet-ctrl:not([hidden]):active {
  background: var(--accent-light);
  border-color: rgba(26, 107, 60, 0.28);
  color: var(--accent);
}

.sheet-ctrl[hidden] {
  display: none !important;
}

.sheet-header {
  padding: 8px 16px 0;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.sheet-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.sheet-header__text {
  flex: 1;
  min-width: 0;
}
.sheet-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.sheet-title.sheet-title--count {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  width: 100%;
  margin: 0;
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}
.sheet-title__label {
  flex: 1;
  min-width: 0;
}
.sheet-title__count {
  flex: 0 0 auto;
  text-align: right;
  font-weight: 700;
}
.sheet-sub { font-size: 11px; color: var(--muted); margin-top: 2px; }

.count-bar {
  padding: 2px 0 8px;
  font-size: 11.5px;
  color: var(--muted);
}
.count-bar strong { color: var(--accent); font-weight: 600; }

.company-list { flex: 1; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.company-list::-webkit-scrollbar { width: 4px; }
.company-list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }

/* LOADING — skeleton list + map fade until first render */
@keyframes skeleton-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.skeleton-block {
  display: block;
  border-radius: 4px;
  background: linear-gradient(
    90deg,
    var(--tag-bg) 0%,
    var(--surface2) 45%,
    var(--tag-bg) 90%
  );
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.4s ease-in-out infinite;
}
.skeleton-card {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 11px 16px;
  border-bottom: 1px solid var(--border);
}
.skeleton-lines {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 2px;
}
.skeleton-block--logo {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  flex-shrink: 0;
}
.skeleton-block--title { width: 58%; height: 11px; border-radius: 999px; }
.skeleton-block--desc { width: 88%; height: 9px; border-radius: 999px; }
.skeleton-block--tags { width: 42%; height: 9px; border-radius: 999px; }
.skeleton-block--toolbar-search {
  flex: 1;
  min-width: 0;
  height: 36px;
  border-radius: 8px;
}
.skeleton-block--toolbar-filter {
  width: 88px;
  height: 36px;
  border-radius: 8px;
  flex-shrink: 0;
}
.skeleton-block--toolbar-toggle {
  display: none;
  height: 36px;
  width: calc(100% - 28px);
  margin: 0 14px 6px;
  border-radius: 100px;
}
.skeleton-block--sheet-toggle {
  display: none;
  height: var(--sheet-view-toggle-block);
  width: calc(100% - 2 * var(--sheet-view-toggle-pad));
  margin: 0 auto;
  border-radius: 999px;
  flex-shrink: 0;
}
.toolbar-skeleton {
  display: none;
}
.toolbar-skeleton__row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px 8px;
}
.skeleton-card:nth-child(2) .skeleton-block--title { width: 72%; }
.skeleton-card:nth-child(2) .skeleton-block--desc { width: 64%; }
.skeleton-card:nth-child(3) .skeleton-block--title { width: 48%; }
.skeleton-card:nth-child(3) .skeleton-block--tags { width: 56%; }
.skeleton-card:nth-child(4) .skeleton-block--title { width: 66%; }
.skeleton-card:nth-child(4) .skeleton-block--desc { width: 76%; }
.skeleton-card:nth-child(5) .skeleton-block--title { width: 52%; }
.skeleton-card:nth-child(5) .skeleton-block--tags { width: 36%; }

body.is-loading .map-chrome-skeleton {
  display: block;
}
body.is-loading .map-chrome__bar {
  display: none;
}
body.is-loading .sheet-title__count {
  opacity: 0.4;
}
body.is-loading .view-float {
  display: none !important;
}
body.is-loading .view-toggle--mobile {
  display: none !important;
}
body.is-loading .skeleton-block--sheet-toggle {
  display: block;
}
@media (min-width: 769px) {
  body.is-loading .skeleton-block--sheet-toggle {
    display: none !important;
  }
}
body.is-loading #map {
  opacity: 0.55;
  transition: opacity 0.3s ease;
}
body:not(.is-loading) #map {
  opacity: 1;
  transition: opacity 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
  .skeleton-block { animation: none; }
  .map-splash__bar-fill { animation: none; width: 100%; }
  .map-splash { transition: none; }
  body.is-loading #map,
  body:not(.is-loading) #map {
    transition: none;
  }
  .logo.logo-font-ready .logo-badge,
  .logo.logo-font-ready .logo-text,
  body.fonts-ready .header-tagline,
  body.fonts-ready .toolbar-tagline,
  body.fonts-ready .panel-footer__copy {
    animation: none;
  }
  .panel,
  .map-area,
  .list-chrome,
  .view-toggle__btn,
  body.browse-mode .company-card.active .card-detail {
    transition: none !important;
    animation: none !important;
    filter: none !important;
    transform: none !important;
  }
}

/* SECTION DIVIDER */
.list-section { padding: 6px 16px 4px; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); background: transparent; border-bottom: 1px solid var(--border); border-radius: 0; display: flex; align-items: center; gap: 6px; }
.list-section span { flex: 1; }
.list-section span:last-child { flex: 0 0 auto; text-align: right; }
.list-section__count.is-pending .list-section__count-value {
  opacity: 0.42;
}
.list-section__count.is-hydrated {
  font-weight: 700;
}
.sheet-title__count.is-pending {
  opacity: 0.42;
}
.sheet-title__count.is-hydrated {
  opacity: 1;
}
.list-sector-lazy {
  height: 1px;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

/* CARD */
.company-card,
.hub-card {
  position: relative;
  padding: 11px 16px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background .1s;
}
.company-card:not(.active):hover,
.hub-card:not(.active):hover { background: var(--surface2); }
.company-card:focus-visible,
.hub-card:focus-visible,
.card-map-btn:focus-visible,
.place-back:focus-visible,
.sheet-ctrl:focus-visible,
.view-toggle__btn:focus-visible {
  outline: 2px solid var(--card-accent, var(--accent));
  outline-offset: 2px;
}
.company-card.active,
.hub-card.active {
  background: linear-gradient(
    90deg,
    var(--surface) 0%,
    var(--surface) 28%,
    color-mix(in srgb, var(--card-accent, var(--accent)) var(--card-select-tint), var(--surface)) 100%
  );
}
.company-card.kbd-preview:not(.active),
.hub-card.kbd-preview:not(.active) {
  background: linear-gradient(
    90deg,
    var(--surface2) 0%,
    var(--surface2) 28%,
    color-mix(in srgb, var(--card-accent, var(--accent)) 12%, var(--surface2)) 100%
  );
}
.company-card__row { display: flex; gap: 10px; align-items: flex-start; }

.card-map-btn.btn {
  display: none;
  position: absolute;
  top: 11px;
  right: 16px;
  z-index: 2;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
body.browse-mode .company-card.active .card-map-btn.btn,
body.browse-mode .hub-card.active .card-map-btn.btn {
  display: inline-flex;
}
body.browse-mode .company-card.active .company-info,
body.browse-mode .hub-card.active .company-info {
  padding-right: 148px;
}

.company-logo,
.pu-logo,
.mk,
.place-dot,
.stack-list-item__dot,
.cluster-pin__logo,
.cluster-dot {
  font-family: 'Syne', 'Geist', system-ui, -apple-system, sans-serif;
  font-size: var(--avatar-font-size);
  font-weight: var(--avatar-font-weight);
  line-height: 1;
  letter-spacing: -0.02em;
  color: #fff;
}

.company-logo {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}
.company-info { flex: 1; min-width: 0; }
.company-name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.01em;
  margin-bottom: 1px;
  color: var(--text);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}
.company-desc {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.4;
  margin-bottom: 5px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.company-tags { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.tag {
  display: inline-flex;
  align-items: center;
  height: var(--tag-height);
  min-height: var(--tag-height);
  line-height: 1;
  font-size: 9.5px;
  padding: 0 8px;
  border-radius: var(--pill-radius);
  background: var(--tag-bg);
  color: var(--muted);
  border: 1px solid var(--border);
  letter-spacing: .03em;
  text-transform: uppercase;
  font-weight: 500;
}
.tag.stage { color: var(--accent2); border-color: rgba(201,74,10,.22); background: #fff3ee; }
.tag--featured {
  color: var(--accent2);
  border-color: rgba(201, 74, 10, 0.22);
  background: #fff3ee;
}
.company-card--featured {
  background: linear-gradient(90deg, rgba(201, 74, 10, 0.04), transparent 48%);
}
.tag.sector { color: var(--accent); border-color: rgba(26,107,60,.22); background: var(--accent-light); }
.tag.hub-tag { color: #c026d3; border-color: rgba(192,38,211,.22); background: #fdf4ff; }
.tag.corp { color: #374151; border-color: rgba(55,65,81,.22); background: #f3f4f6; }
.tag.cowo { color: #92400e; border-color: rgba(146,64,14,.22); background: #fef3c7; }
.tag.park { color: #0369a1; border-color: rgba(3,105,161,.22); background: #e0f2fe; }
.company-location {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 3px;
}
.company-location__icon {
  display: inline-flex;
  flex-shrink: 0;
  color: var(--muted);
}
.company-location__icon svg,
.company-location__icon .phosphor-icon {
  width: 12px;
  height: 12px;
}

/* Expanded card detail — sidebar / list (shared) */
.card-detail {
  display: none;
}
.company-card.active .card-detail,
.hub-card.active .card-detail {
  display: block;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}
.company-card.active .company-desc,
.hub-card.active .company-desc,
.company-card.active:has(.card-detail__location) .company-info .company-location,
.hub-card.active:has(.card-detail__location) .company-info .company-location {
  display: none;
}
.card-detail__desc {
  font-size: 12px;
  color: #555;
  line-height: 1.5;
  margin-bottom: 10px;
}
.card-detail__location {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  color: var(--muted);
  margin: -4px 0 10px;
}
.card-detail__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 10px;
}
.card-detail__stat {
  background: rgb(0 0 0 / 3%);
  border-radius: 8px;
  padding: 7px 8px;
}
.card-detail__stat strong {
  display: block;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  margin-bottom: 1px;
}
.card-detail__stat span {
  display: block;
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.card-detail__features {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 10px;
}
.card-detail__feat {
  font-size: 10.5px;
  background: #fdf4ff;
  color: #c026d3;
  border: 1px solid rgba(192, 38, 211, 0.2);
  border-radius: var(--pill-radius);
  padding: 2px 8px;
}

.no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px 20px 40px;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
.no-results__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin-bottom: 14px;
  border-radius: 18px;
  background: color-mix(in srgb, var(--accent-light) 50%, transparent);
  color: var(--accent);
  flex-shrink: 0;
}
.no-results__icon svg,
.no-results__icon .phosphor-icon {
  width: 34px;
  height: 34px;
}
.no-results__text {
  margin: 0;
  max-width: 260px;
}
.no-results__reset {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  color: var(--accent);
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.no-results__reset:hover { color: #145a32; }

/* MAP */
.map-area {
  flex: 1;
  min-width: 0;
  position: relative;
  height: 100%;
  overflow: visible;
}
#map {
  width: 100%;
  height: 100%;
  z-index: 1;
}

.map-splash {
  position: absolute;
  inset: 0;
  z-index: 400;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  transition: opacity 0.42s ease, visibility 0.42s ease;
}
.map-splash[hidden] {
  display: none !important;
}
.map-splash.is-dismissed {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.map-splash__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 24px;
  text-align: center;
  max-width: 280px;
}
.map-splash__badge {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  object-fit: cover;
}
.map-splash__title {
  margin: 4px 0 0;
  font-family: var(--font-logo);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: var(--text);
}
.map-splash__sub {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}
.map-splash__bar {
  width: 120px;
  height: 3px;
  margin-top: 8px;
  border-radius: 999px;
  background: var(--surface2);
  overflow: hidden;
}
.map-splash__bar-fill {
  display: block;
  width: 40%;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
  animation: splash-bar 1.1s ease-in-out infinite;
}
@keyframes splash-bar {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}
body.map-splash-active #map {
  opacity: 0;
}

.leaflet-bottom.leaflet-left {
  bottom: 0;
  left: 0;
  top: auto;
  margin: 0 0 var(--map-inset) var(--map-inset);
}

.leaflet-bottom.leaflet-left .map-tools {
  clear: both;
}
.leaflet-bottom.leaflet-left .map-tools + .map-tools {
  margin-top: 8px;
}
.map-tools.leaflet-bar {
  border: none !important;
  border-radius: 999px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.map-tools .map-tool-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 32px;
  padding: 0;
  border: none !important;
  border-bottom: none !important;
  background: rgba(255, 255, 255, 0.96);
  color: var(--text);
  cursor: pointer;
  line-height: 1;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.leaflet-bottom.leaflet-left .leaflet-control {
  pointer-events: auto;
  margin: 0;
}
.map-tools .map-tool-btn + .map-tool-btn {
  border-top: 1px solid var(--border) !important;
}
.map-tools .map-tool-btn:hover,
.map-tools .map-tool-btn:focus {
  background: var(--surface2);
  outline: none;
}
.map-tools .map-tool-btn:focus-visible {
  box-shadow: inset 0 0 0 2px var(--accent);
}
.map-tools .map-tool-btn svg,
.map-tools .map-tool-btn .phosphor-icon {
  width: 18px;
  height: 18px;
  display: block;
}
.map-tools .map-tool-btn--loading {
  opacity: 0.55;
  cursor: wait;
}
.map-toast {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  z-index: 1000;
  max-width: min(320px, calc(100% - 32px));
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(24, 24, 22, 0.88);
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.18);
}
.map-toast[hidden] {
  display: none;
}

/* VIEW TOGGLE — mobile bottom sheet + desktop browse control */
.view-toggle {
  display: none;
  flex-shrink: 0;
  align-self: center;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  margin: 8px auto 10px;
  padding: 0;
  background: transparent;
  border: none;
}
.view-toggle--desktop {
  display: none;
  width: auto;
  min-width: 148px;
  margin: 0;
  flex-shrink: 0;
}
.view-toggle__btn {
  transition:
    background-color var(--view-switch-btn-duration) var(--view-switch-ease),
    color var(--view-switch-btn-duration) var(--view-switch-ease),
    box-shadow var(--view-switch-btn-duration) var(--view-switch-ease),
    transform var(--view-switch-btn-duration) var(--view-switch-ease);
}
.view-toggle__btn:active {
  transform: scale(0.98);
}
.view-toggle--mobile {
  margin: 0;
  width: 100%;
  padding: var(--sheet-view-toggle-pad);
  box-sizing: border-box;
}
.view-toggle--mobile .list-sort {
  width: 100%;
}
.view-toggle--mobile .view-toggle__btn {
  gap: 6px;
}

/* FILTER SHEET */
.filter-sheet[hidden] { display: none !important; }
.filter-sheet {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: flex-end; justify-content: center;
}
.filter-sheet__backdrop {
  position: absolute; inset: 0;
  background: rgba(24, 24, 22, 0.35);
}
.filter-sheet__panel {
  position: relative; width: 100%; max-width: 480px;
  max-height: 85dvh;
  background: var(--surface);
  border-radius: 16px 16px 0 0;
  padding: 16px 16px calc(16px + var(--safe-bottom));
  display: flex; flex-direction: column;
  animation: sheet-up .22s ease;
}
@keyframes sheet-up {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.filter-sheet__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
.filter-sheet__title {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 800;
}

/* Shared centered X icon — filter sheet close + Leaflet popup close */
.icon-close,
.leaflet-container a.leaflet-popup-close-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  cursor: pointer;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-decoration: none;
  overflow: hidden;
  flex-shrink: 0;
}
.icon-close::before,
.icon-close::after,
.leaflet-container a.leaflet-popup-close-button::before,
.leaflet-container a.leaflet-popup-close-button::after,
.search-clear::before,
.search-clear::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 1.5px;
  background: var(--muted);
  border-radius: 1px;
  pointer-events: none;
}
.icon-close::before,
.leaflet-container a.leaflet-popup-close-button::before,
.search-clear::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.icon-close::after,
.leaflet-container a.leaflet-popup-close-button::after,
.search-clear::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.icon-close:hover::before,
.icon-close:hover::after,
.icon-close:focus-visible::before,
.icon-close:focus-visible::after,
.leaflet-container a.leaflet-popup-close-button:hover::before,
.leaflet-container a.leaflet-popup-close-button:hover::after,
.leaflet-container a.leaflet-popup-close-button:focus-visible::before,
.leaflet-container a.leaflet-popup-close-button:focus-visible::after,
.search-clear:hover::before,
.search-clear:hover::after,
.search-clear:focus-visible::before,
.search-clear:focus-visible::after {
  background: var(--text);
}

/* Search clear — same X stroke as popup, pinned inside the input on the right */
.search-wrap > .search-clear {
  position: absolute;
  right: 5px;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: none;
  border-radius: 7px;
  background: transparent;
  color: transparent;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  cursor: pointer;
  opacity: 0.85;
  transition: opacity .15s, background-color .15s;
}
.search-wrap > .search-clear:hover,
.search-wrap > .search-clear:focus-visible {
  opacity: 1;
  background: var(--surface2);
  outline: none;
}

.filter-sheet__close {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1.5px solid var(--border);
  background: var(--surface2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.filter-sheet__close:hover,
.filter-sheet__close:focus-visible {
  background: var(--border);
  outline: none;
}
.filter-sheet__body { flex: 1; overflow-y: auto; min-height: 0; }

/* CLUSTER — lightweight dots for performance */
.leaflet-marker-icon.cluster-dot-icon,
.leaflet-marker-icon.marker-cluster {
  background: transparent !important;
  border: none !important;
}
.marker-cluster {
  background: transparent !important;
}
.marker-cluster div {
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}
.marker-cluster span {
  display: none;
}
.cluster-dot {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 13px;
  line-height: 1;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
  border: 2px solid rgba(255, 255, 255, 0.95);
}
.cluster-dot span {
  display: block;
  transform: translateY(-0.08em);
}
.leaflet-marker-icon.cluster-reveal-pending {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}
.leaflet-marker-icon.cluster-dot-icon .cluster-dot {
  transition: transform 0.12s;
}
.leaflet-marker-icon.cluster-dot-icon:hover .cluster-dot {
  transform: scale(1.06);
}

/* Legacy cluster-pin styles (unused) */
.cluster-pin {
  position: relative;
  width: 44px;
  height: 44px;
  cursor: pointer;
  isolation: isolate;
}
.cluster-pin__logo {
  position: relative;
  z-index: 1;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.15s;
}
.cluster-pin:hover .cluster-pin__logo {
  transform: scale(1.08);
}
.cluster-pin__badge {
  position: absolute;
  top: 2px;
  right: -7px;
  z-index: 10;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  border-radius: 100px;
  background: var(--accent);
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: -0.02em;
  pointer-events: none;
}

/* Shared address — stacked preview pin */
.leaflet-marker-icon.address-stack-icon {
  background: transparent !important;
  border: none !important;
}
.address-stack-pin {
  position: relative;
  width: 76px;
  height: 76px;
  cursor: pointer;
  isolation: isolate;
  opacity: 1;
  transform: scale(1);
  transition:
    opacity 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.address-stack-pin--hidden {
  opacity: 0;
  transform: scale(0.88);
  pointer-events: none;
}
.address-stack-pin__ring {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.address-stack-pin__chip {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 9px;
  line-height: 1;
  transform: rotate(var(--a)) translateY(-24px) rotate(calc(-1 * var(--a)));
  transition: transform 0.15s;
}
.address-stack-pin:hover .address-stack-pin__chip {
  transform: rotate(var(--a)) translateY(-26px) rotate(calc(-1 * var(--a)))
    scale(1.06);
}
.address-stack-pin__badge {
  position: absolute;
  top: 6px;
  right: -7px;
  z-index: 20;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 100px;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

/* Address stack — spiderfied pins animate out from center */
@keyframes spider-pin-in {
  0% {
    opacity: 0;
    transform: scale(0.42);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes spider-pin-out {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.45);
  }
}
.leaflet-marker-icon.spider-pin-enter .mk {
  animation: spider-pin-in 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.leaflet-marker-icon.spider-pin-exit .mk {
  animation: spider-pin-out 0.28s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* Big stacks use list popup instead of spiderfy */
.stack-list-popup {
  min-width: 268px;
  max-width: min(340px, calc(100vw - 56px));
}
.stack-list-popup__title {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #222;
}
.stack-list-popup__body {
  max-height: 250px;
  overflow-y: auto;
  display: grid;
  gap: 8px;
}
.stack-list-item {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  text-align: left;
}
.stack-list-item:hover { background: #f8f8f6; border-color: #d7d7d2; }
.stack-list-item__dot {
  width: 24px;
  height: 24px;
  border: 2px solid;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  flex-shrink: 0;
}
.stack-list-item__text { min-width: 0; display: grid; }
.stack-list-item__text strong {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 700;
  color: #222;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stack-list-item__text em {
  font-size: 10.5px;
  color: #777;
  font-style: normal;
}

/* Disable markercluster spiderfy legs (custom zoom handles groups instead) */
.leaflet-cluster-spider-leg,
.leaflet-cluster-spider-leg-polygon {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  stroke-opacity: 0 !important;
  pointer-events: none !important;
}

/* Marker / cluster hover label */
.leaflet-tooltip.mk-tooltip {
  background: #181816;
  border: none;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
  padding: 0;
  color: #fff;
  font-family: var(--font-ui);
  pointer-events: none;
}
.leaflet-tooltip.mk-tooltip::before {
  border-top-color: #181816;
}
.mk-tip {
  padding: 6px 10px;
  text-align: center;
  line-height: 1.25;
  white-space: nowrap;
}
.mk-tip strong {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.mk-tip span {
  display: block;
  font-size: 10px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.72);
  margin-top: 1px;
}

/* POPUP — always above the pin; arrow points down (custom ::after, not Leaflet tip) */
.leaflet-popup {
  filter: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.leaflet-popup.popup-enter {
  opacity: 0;
  transform: translateY(6px);
}
.leaflet-popup.popup-enter-active {
  opacity: 1;
  transform: translateY(0);
}
.leaflet-popup-content-wrapper {
  position: relative;
  background: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  filter: drop-shadow(0 8px 40px rgba(0, 0, 0, 0.13));
  padding: 0 !important;
  margin-bottom: 9px;
  overflow: visible !important;
}
.leaflet-popup-content-wrapper::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  background: #fff;
  border: none;
  box-sizing: border-box;
  transform: rotate(45deg);
  pointer-events: none;
}
.leaflet-popup-content {
  margin: 0 !important;
  width: 270px !important;
  max-width: calc(100vw - 48px) !important;
  border-radius: 14px;
  overflow: hidden;
}
.leaflet-popup-tip-container,
.leaflet-popup-tip {
  display: none !important;
}
.leaflet-container a.leaflet-popup-close-button {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  width: 22px !important;
  height: 22px !important;
  display: inline-flex !important;
  border-radius: 50% !important;
  background: var(--tag-bg) !important;
  z-index: 10 !important;
}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus-visible {
  background: var(--border) !important;
  outline: none;
}

.pu { padding: 16px; }
.pu-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; padding-right: 24px; }
.pu-logo {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}
.pu-name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #181816;
}
.pu-sub { font-size: 11px; color: var(--muted); margin-top: 1px; }
.pu-desc {
  font-size: 12px;
  color: #555;
  line-height: 1.5;
  margin-bottom: 11px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pu-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 12px; }
.pu-stat { background: rgb(0 0 0 / 3%); border-radius: 8px; padding: 7px 8px; }
.pu-stat strong {
  display: block;
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 500;
  color: var(--text);
  margin-bottom: 1px;
}
.pu-stat span { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.place-link,
.leaflet-container a.place-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--place-link);
  text-decoration: none;
  font-weight: 500;
}
.place-link:hover,
.leaflet-container a.place-link:hover {
  color: var(--place-link);
  text-decoration: underline;
}
.place-link:visited,
.leaflet-container a.place-link:visited {
  color: var(--place-link);
}
.place-link__icon {
  display: inline-flex;
  flex-shrink: 0;
}
.place-link .phosphor-icon {
  width: 14px;
  height: 14px;
}

.pu-hub-features { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 11px; }
.pu-hub-feat { font-size: 10.5px; background: #fdf4ff; color: #c026d3; border: 1px solid rgba(192,38,211,.2); border-radius: var(--pill-radius); padding: 2px 8px; }

.mk {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14);
  text-align: center;
  border: none;
  outline: none;
}
.mk:hover { transform: scale(1.08); }

/* Multi-place coordinate markers */
.place-dot {
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14);
  text-align: center;
  transition: transform 120ms ease, box-shadow 0.15s;
  border: none;
  outline: none;
}
.place-marker:hover .place-dot { transform: scale(1.06); }
.place-marker.approx .place-dot {
  opacity: 0.92;
}
.place-dot .count {
  display: none !important;
}

/* Selected pin — scale up + sector-color halo (z-index handled in map.js) */
.leaflet-marker-icon.map-marker--selected {
  background: transparent !important;
  border: none !important;
  opacity: 1 !important;
}
.leaflet-marker-icon.map-marker--selected .mk,
.leaflet-marker-icon.map-marker--selected .place-dot {
  opacity: 1 !important;
  filter: none !important;
  transform: scale(1.12) !important;
  border: none !important;
  outline: none !important;
  box-shadow:
    0 0 0 5px color-mix(in srgb, var(--marker-accent, var(--accent)) 28%, transparent),
    0 6px 18px rgba(0, 0, 0, 0.26) !important;
}

/* Place drill-down list header */
body.list-view-place .sheet-header__text {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
body.list-view-place .sheet-header {
  padding: 8px 16px 6px;
}
body.list-view-place .sheet-header__top {
  align-items: center;
}
body.list-view-place .count-bar {
  display: none;
}
body.list-view-place .place-head strong {
  font-size: 14px;
  line-height: 1.15;
}
body.list-view-place .place-head span {
  margin-top: 0;
  font-size: 11px;
  line-height: 1.2;
}
.count-bar {
  display: block;
}
.place-back {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
  color: var(--text);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.place-back:hover { background: var(--border); }
.place-head {
  flex: 1;
  min-width: 0;
  outline: none;
}
.place-head strong {
  display: block;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--text);
}
.place-head span {
  display: block;
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 2px;
}

.company-list {
  transition: transform 180ms ease-out;
}
.company-list.list-viewport--place {
  transform: translateX(0);
}

/* Address stack preview — dim chips except the selected company */
.leaflet-marker-icon.map-marker--stack-select {
  opacity: 1 !important;
  filter: none !important;
}
.leaflet-marker-icon.map-marker--stack-select .address-stack-pin__chip.stack-chip--dimmed {
  opacity: 0.55 !important;
  filter: grayscale(0.4) saturate(0.6);
}
.leaflet-marker-icon.map-marker--stack-select .address-stack-pin__chip.stack-chip--active {
  opacity: 1 !important;
  filter: none !important;
  transform: rotate(var(--a)) translateY(-24px) rotate(calc(-1 * var(--a))) scale(1.12) !important;
  box-shadow:
    0 0 0 5px color-mix(in srgb, var(--marker-accent, var(--accent)) 28%, transparent),
    0 6px 18px rgba(0, 0, 0, 0.26) !important;
  z-index: 5;
}

/* Map attribution — sibling of #map; keep below Leaflet popups when open */
.map-attribution {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 450;
  margin: 0;
  padding: 5px 8px;
  font-size: 10px;
  line-height: 1.35;
  color: #444;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  pointer-events: auto;
  max-width: calc(100% - 8px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.map-attribution a {
  color: #444;
  text-decoration: none;
}
.map-attribution a:hover {
  text-decoration: underline;
}
.leaflet-control-attribution {
  display: none !important;
}

/* ========== MOBILE ========== */
@media (max-width: 768px) {
  :root {
    --toolbar-h: var(--toolbar-measured);
    --chrome-top: calc(var(--header-h) + var(--toolbar-measured));
  }

  :root {
    --logo-size: 21.6px;
    --logo-line-height: 24.2px;
    --logo-letter-spacing: -0.86px;
    --logo-skeleton-w: 133px;
    --header-tagline-skeleton-w: 240px;
    --header-h: 48px;
  }

  .site-header { padding: 0 12px; }
  .logo { gap: 8px; }
  .logo-badge,
  .logo-badge-skeleton { width: 24px; height: 24px; }
  .header-tagline,
  body.fonts-ready .header-tagline { display: none; }
  .header-tagline-skeleton { display: none; }
  .toolbar-tagline-skeleton { display: block; }

  body.sheet-peek:not(.view-list) .panel-footer {
    display: none;
  }

  .panel-footer {
    margin-top: 0;
    padding: 10px 16px 12px;
    background: var(--surface);
  }
  .panel-sheet:has(.panel-footer) .company-list {
    padding-bottom: 0;
  }

  .leaflet-tooltip.mk-tooltip {
    display: none !important;
  }

  .map-toast {
    bottom: calc(var(--sheet-measured, var(--sheet-peek-body)) + 16px);
  }
  body.sheet-slice .map-toast {
    bottom: calc(var(--sheet-measured, var(--sheet-slice-body)) + 16px);
  }
  body.sheet-full .map-toast {
    bottom: calc(var(--sheet-measured, var(--sheet-full)) + 16px);
  }

  .toolbar-meta {
    display: none;
  }

  .main { flex-direction: column; padding-top: 0; }

  .panel {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    z-index: 900;
    pointer-events: none;
    background: transparent;
    border: none;
    box-shadow: none;
  }

  .panel-toolbar { display: none; }

  .map-chrome {
    padding: 8px 10px;
  }
  .map-chrome__bar {
    max-width: none;
    border-radius: 12px;
    flex-wrap: nowrap;
    align-items: center;
  }
  .map-chrome__search {
    flex: 1 1 0;
    min-width: 0;
  }
  .map-chrome__filters {
    flex: 0 0 auto;
  }
  .panel-sort {
    padding: 8px 12px 6px;
  }
  .list-sort__btn {
    font-size: 12px;
    padding: 0 8px;
  }
  .view-toggle--mobile {
    padding: var(--sheet-view-toggle-pad) 12px;
  }
  /* iOS Safari zooms focused inputs below 16px — 14px at rest, 16px on focus */
  .map-chrome__search .search-wrap input,
  .search-wrap input {
    font-size: 14px;
    height: var(--ctrl-h-sm);
    min-height: var(--ctrl-h-sm);
    padding-top: 6px;
    padding-bottom: 6px;
    touch-action: manipulation;
  }
  .map-chrome__search .search-wrap input:focus,
  .map-chrome__search .search-wrap input:focus-visible,
  .search-wrap input:focus,
  .search-wrap input:focus-visible {
    font-size: 16px;
  }
  .map-chrome__filters .filter-sheet-btn {
    max-width: none;
  }

  .panel-sheet {
    pointer-events: auto;
    background: var(--surface);
    border-radius: 16px 16px 0 0;
    border: 1px solid var(--border);
    border-bottom: none;
    box-shadow: 0 -8px 28px rgba(0,0,0,.1);
    height: auto;
    min-height: 0;
    max-height: calc(100dvh - var(--chrome-top));
    overflow: hidden;
    flex-shrink: 0;
    transition: height var(--view-switch-duration) var(--view-switch-ease),
                max-height var(--view-switch-duration) var(--view-switch-ease);
    margin-top: auto;
    padding-bottom: var(--safe-bottom);
    box-sizing: border-box;
  }

  body.sheet-peek:not(.view-list) .panel-sheet {
    height: auto;
    max-height: none;
  }

  body.sheet-slice .panel-sheet {
    height: auto;
    max-height: calc(100dvh - var(--chrome-top));
  }
  body.sheet-full:not(.view-list) .panel-sheet {
    height: var(--sheet-full);
    max-height: var(--sheet-full);
  }

  body.view-list .panel-sheet {
    position: fixed;
    top: var(--chrome-top);
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: auto !important;
    max-height: none !important;
    margin-top: 0;
    padding-bottom: var(--safe-bottom);
    box-sizing: border-box;
  }

  .sheet-handle-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 8px 0 4px;
    cursor: default;
    touch-action: auto;
  }

  .sheet-controls {
    display: flex;
  }

  body.sheet-full .sheet-handle-hint,
  body.sheet-peek:not(.view-list) .sheet-handle-hint,
  body.sheet-slice:not(.view-list) .sheet-handle-hint {
    display: none !important;
  }
  .sheet-handle {
    width: 36px; height: 4px;
    border-radius: 2px;
    background: var(--border);
    touch-action: none;
    cursor: grab;
  }
  .sheet-handle:active { cursor: grabbing; }

  .map-area {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(100dvh - var(--header-h));
    z-index: 1;
    box-sizing: border-box;
  }

  #map {
    height: 100%;
    width: 100%;
    background: var(--bg);
    position: relative;
    z-index: 1;
  }

  /* Popup pane lives inside #map — lift map above credits pill while open */
  .map-area:has(.leaflet-popup) #map {
    z-index: 560;
  }

  #map .leaflet-bottom.leaflet-left {
    bottom: auto;
    top: calc(var(--toolbar-measured, 60px) + var(--map-chrome-gap));
    left: 0;
    margin: 0 0 0 var(--map-inset);
    z-index: 840;
  }

  .map-attribution {
    top: calc(var(--toolbar-measured, 60px) + var(--map-chrome-gap));
    right: 8px;
    bottom: auto;
    font-size: 9px;
    border-radius: 999px;
  }

  body.view-list .map-attribution {
    display: none;
  }

  .view-toggle--mobile { display: flex; }

  body.view-map .company-list,
  body.view-list .company-list {
    padding-bottom: var(--sheet-view-toggle-pad);
  }

  body.view-list .map-area {
    display: none;
  }
  body.view-switching.view-list .panel-sheet {
    animation: view-list-in var(--view-switch-duration) var(--view-switch-ease) both;
  }
  body.view-switching.view-map .map-area {
    animation: view-map-in var(--view-switch-duration) var(--view-switch-ease) both;
  }
  body.view-list .panel { pointer-events: auto; }

  body.view-list .sheet-sub {
    display: none;
  }
  body.view-list .sheet-header {
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border);
  }
  body.view-list .count-bar {
    display: none;
  }
  body.view-list .company-list {
    flex: 1 1 0;
    min-height: 0;
  }

  body.is-empty .sheet-header__text {
    display: none;
  }
  body.is-empty .sheet-header {
    padding-bottom: 0;
    border-bottom: none;
    flex-shrink: 0;
  }
  body.is-empty .count-bar {
    display: block;
    padding: 10px 16px 8px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
  }
  body.is-empty .panel-sheet {
    height: auto;
    max-height: min(360px, 46dvh);
  }
  body.is-empty .company-list {
    flex: 0 1 auto;
    min-height: 0;
    overflow: visible;
  }
  body.is-empty .no-results {
    padding: 24px 16px 28px;
  }
  body.is-empty .no-results__icon {
    width: 56px;
    height: 56px;
    margin-bottom: 12px;
    border-radius: 16px;
  }
  body.is-empty .no-results__icon svg,
  body.is-empty .no-results__icon .phosphor-icon {
    width: 30px;
    height: 30px;
  }
  body.is-empty .sheet-handle-wrap,
  body.is-empty .view-toggle--mobile {
    flex-shrink: 0;
  }

  .panel-sheet {
    display: flex;
    flex-direction: column;
  }

  body.sheet-peek .sheet-handle-wrap,
  body.sheet-peek .panel-sort,
  body.sheet-peek .sheet-header,
  body.sheet-peek .view-toggle--mobile,
  body.sheet-peek .panel-footer,
  body.sheet-slice .sheet-handle-wrap,
  body.sheet-slice .panel-sort,
  body.sheet-slice .sheet-header,
  body.sheet-slice .view-toggle--mobile,
  body.sheet-slice .panel-footer,
  body.sheet-full:not(.view-list) .sheet-handle-wrap,
  body.sheet-full:not(.view-list) .panel-sort,
  body.sheet-full:not(.view-list) .sheet-header,
  body.sheet-full:not(.view-list) .view-toggle--mobile,
  body.sheet-full:not(.view-list) .panel-footer,
  body.view-list .view-toggle--mobile,
  body.view-list .panel-footer {
    flex-shrink: 0;
  }

  body.sheet-peek:not(.is-empty):not(.view-list) .sheet-sub,
  body.sheet-peek:not(.is-empty):not(.view-list) .count-bar,
  body.sheet-peek:not(.is-empty):not(.view-list) .company-list {
    display: none;
  }
  body.is-empty.sheet-peek .count-bar,
  body.is-empty.sheet-peek .company-list {
    display: block;
  }
  body.sheet-peek .sheet-header {
    padding-bottom: 6px;
    border-bottom: none;
  }
  body.sheet-peek .sheet-title {
    font-size: 15px;
  }

  body.has-results:not(.list-view-place):not(.is-empty) .count-bar {
    display: none;
  }
  body.has-results:not(.list-view-place):not(.is-empty) .sheet-header {
    padding-bottom: 8px;
  }
  body.sheet-slice.has-results:not(.list-view-place) .sheet-header,
  body.sheet-full.has-results:not(.list-view-place) .sheet-header {
    padding-bottom: 8px;
  }

  body.sheet-slice .company-list,
  body.sheet-full .company-list,
  body.view-list .company-list {
    display: block;
  }

  body.sheet-slice .sheet-sub {
    display: none;
  }
  body.sheet-slice .company-list {
    flex: 0 0 auto;
    max-height: var(--sheet-slice-list);
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.sheet-slice.sheet-detail:not(.view-list) {
    --sheet-slice-list: calc(
      var(--company-card-expanded) + var(--company-card-row) * 0.45
    );
  }

  body.sheet-full:not(.view-list) .company-list {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .filter-sheet__panel { max-height: 88dvh; }

  .filter-popover { display: none !important; }

  .filter-sheet-btn__chevron { display: block; }
  .count-bar--sheet { display: none !important; }
  body:not(.list-view-place) .sheet-header { display: none; }
  body:not(.list-view-place) .panel-sort {
    display: block !important;
  }
  /* Map peek: one control row (Map/List) — sort belongs in the list, not on the map */
  body.sheet-peek:not(.view-list):not(.browse-mode) .panel-sort {
    display: none !important;
  }
  body.sheet-peek:not(.view-list) .panel-sort {
    padding: 0;
    border: none;
  }
  body.list-view-place .panel-sort {
    display: none !important;
  }
  body.browse-mode:not(.list-view-place) .panel-sort {
    border-bottom: 1px solid var(--border);
  }
  .sheet-header__top { gap: 10px; }
  .sheet-header .sheet-title,
  .sheet-header .sheet-sub { display: none; }
  .sheet-handle-wrap { display: none !important; }
}

@media (min-width: 769px) {
  .view-toggle--mobile { display: none !important; }
  /* Desktop map sidebar: stats-only detail when active; full detail in list view */
  body:not(.browse-mode) .company-card:not(.active) .card-detail,
  body:not(.browse-mode) .hub-card:not(.active) .card-detail {
    display: none !important;
  }

  .list-chrome { display: none !important; }
  .list-chrome:not([hidden]) {
    display: block !important;
  }

  .panel {
    transition: width var(--view-switch-duration) var(--view-switch-ease),
                flex var(--view-switch-duration) var(--view-switch-ease);
  }
  .map-area {
    transition: opacity var(--view-switch-duration) var(--view-switch-ease),
                visibility var(--view-switch-duration) var(--view-switch-ease);
  }
  body.view-switching.browse-mode .panel-sheet {
    animation: view-list-in var(--view-switch-duration) var(--view-switch-ease) both;
    transform-origin: top center;
  }
  body.view-switching:not(.browse-mode) .map-area {
    animation: view-map-in var(--view-switch-duration) var(--view-switch-ease) both;
  }

  @keyframes view-list-in {
    from {
      opacity: 0.82;
      transform: translateY(10px) scale(0.985);
    }
    to {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }
  @keyframes view-map-in {
    from {
      opacity: 0;
      transform: scale(1.014);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }

  .view-float {
    display: none !important;
  }
  body.browse-mode #listViewBtn {
    display: none;
  }
  body:not(.browse-mode) #mapViewBtn {
    display: none;
  }
  body.browse-mode .map-chrome__bar #mapViewBtn,
  body:not(.browse-mode) .map-chrome__bar #listViewBtn {
    display: inline-flex;
  }
  body:not(.browse-mode) #map .leaflet-bottom.leaflet-left {
    margin: 0 0 var(--map-inset) calc(var(--map-sidebar-w) + var(--map-inset));
  }

  /* Map mode: chrome over map column, narrower search */
  .map-chrome {
    left: var(--map-sidebar-w);
  }
  body:not(.browse-mode) .map-chrome__bar,
  body:not(.browse-mode) .map-chrome-skeleton {
    max-width: var(--map-chrome-bar-max);
  }

  /* List view: popover matches map chrome width, anchored to the right */
  body.browse-mode .list-chrome__row {
    position: relative;
  }
  body.browse-mode .list-chrome__tools {
    width: 100%;
  }
  body.browse-mode .list-chrome .map-chrome__bar {
    width: 100%;
    box-sizing: border-box;
  }
  body.browse-mode .list-chrome .map-chrome__bar #mapViewBtn,
  body:not(.browse-mode) .map-chrome__bar #listViewBtn {
    flex-shrink: 0;
  }
  body.browse-mode .list-chrome .filter-popover {
    left: auto;
    right: 0;
    width: min(100%, var(--map-chrome-bar-max));
    max-width: var(--map-chrome-bar-max);
    top: calc(100% + 12px);
  }
  body.browse-mode .list-chrome .filter-popover__panel {
    border-radius: 16px;
  }

  .filter-popover__panel {
    padding: 12px;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14);
  }

  /* Sidebar always visible in map mode — transparent overlay, card floats over map */
  body:not(.browse-mode) .main {
    position: relative;
  }
  body:not(.browse-mode) .panel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: var(--map-sidebar-w);
    flex-shrink: 0;
    min-height: 0;
    z-index: 810;
    background: none;
    border: none;
    border-right: none;
    box-shadow: none;
    padding: 12px 10px 12px 12px;
    box-sizing: border-box;
    pointer-events: none;
  }
  body:not(.browse-mode) .panel-sheet {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    pointer-events: auto;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: none;
  }
  body:not(.browse-mode) .panel-sort {
    flex-shrink: 0;
    display: block;
    padding-bottom: 6px;
    border-bottom: none;
  }
  body:not(.browse-mode):not(.list-view-place) .sheet-header {
    padding: 0 12px;
    border-bottom: none;
  }
  body:not(.browse-mode):not(.list-view-place) .sheet-header__top {
    min-height: 0;
  }
  body:not(.browse-mode):not(.list-view-place) .sheet-title.sheet-title--count {
    padding: 6px 4px 4px;
    border-bottom: 1px solid var(--border);
  }
  body:not(.list-view-place) .panel-sort {
    display: block;
  }
  body.list-view-place .panel-sort {
    display: none;
  }
  body:not(.list-view-place) .count-bar,
  body:not(.list-view-place) .count-bar--sheet {
    display: none;
  }
  body:not(.browse-mode) .company-list {
    display: block !important;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
  }
  body:not(.browse-mode) .company-list:has(~ .panel-footer) {
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding-bottom: 0;
  }
  body:not(.browse-mode) .panel-footer {
    margin-top: 0;
    flex-shrink: 0;
    padding: 10px 12px 14px;
    border: none;
    border-top: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    background: var(--shell-card-bg);
  }
  body:not(.browse-mode) .map-area {
    flex: 1;
    min-width: 0;
    opacity: 1;
    visibility: visible;
  }
  /* Splash centers in map column, not under the floating sidebar */
  body:not(.browse-mode) .map-splash {
    left: var(--map-sidebar-w);
  }

  /* List view: full-width directory */
  body.browse-mode {
    height: 100%;
    min-height: 0;
    overflow: auto;
    background: var(--list-gutter-bg);
  }
  body.browse-mode .map-area {
    opacity: 0;
    flex: 0 0 0 !important;
    min-width: 0 !important;
    overflow: hidden;
    pointer-events: none;
    visibility: hidden;
  }
  body.browse-mode .panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    min-height: 0;
    height: 100%;
    border: none;
    background: var(--list-gutter-bg);
    padding-bottom: 16px;
    box-sizing: border-box;
  }
  body.browse-mode .panel-sheet {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 0;
    box-shadow: none;
    background: var(--list-gutter-bg);
    padding: 0 var(--content-column-gutter);
    box-sizing: border-box;
  }
  body.browse-mode .list-chrome {
    background: var(--list-gutter-bg);
    border-bottom: none;
    padding: 10px 0 0;
  }
  body.browse-mode .list-chrome__row,
  body.browse-mode .panel-sort,
  body.browse-mode .sheet-header,
  body.browse-mode .company-list {
    width: min(var(--list-content-max), 100%);
    max-width: var(--list-content-max);
    margin-left: auto;
    margin-right: auto;
  }
  body.browse-mode .panel-sort {
    margin-top: var(--content-column-inset);
    padding: 10px 16px 8px;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-bottom: none;
    border-radius: 14px 14px 0 0;
    box-shadow: var(--shell-card-shadow);
  }
  body.browse-mode .sheet-header {
    margin-top: 0;
    padding: 4px 16px 0;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-top: none;
    border-bottom: none;
    border-radius: 0;
    box-shadow: none;
  }
  body.browse-mode .sheet-title.sheet-title--count {
    padding: 4px 0 6px;
    border-bottom: 1px solid var(--border);
  }
  body.browse-mode:not(.list-view-place) .company-list {
    display: block !important;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    margin: 0 auto;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-top: none;
    border-radius: 0;
    box-shadow: var(--shell-card-shadow);
  }
  body.browse-mode:not(.list-view-place) .company-list:has(~ .panel-footer) {
    border-bottom: none;
    border-radius: 0;
    box-shadow: none;
  }
  body.browse-mode.list-view-place .company-list {
    display: block !important;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    margin: 0 auto;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-top: none;
    border-radius: 0;
    box-shadow: var(--shell-card-shadow);
  }
  body.browse-mode.list-view-place .company-list:has(~ .panel-footer) {
    border-bottom: none;
    border-radius: 0;
    box-shadow: none;
  }
  body.browse-mode .panel-footer {
    width: min(var(--list-content-max), 100%);
    max-width: var(--list-content-max);
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    flex-shrink: 0;
    padding: 10px 12px 14px;
    background: var(--shell-card-bg);
    border: var(--shell-card-border);
    border-top: 1px solid var(--border);
    border-radius: 0 0 14px 14px;
    box-shadow: var(--shell-card-shadow);
    overflow: hidden;
  }
  body.browse-mode .company-list:has(~ .panel-footer) {
    padding-bottom: 12px;
  }
  body.browse-mode .main {
    flex: 1 1 auto;
    min-height: 0;
    height: calc(100dvh - var(--header-h));
    overflow: hidden;
    background: var(--list-gutter-bg);
  }

  /* Expanded card detail in desktop list view */
  body.browse-mode .card-detail__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(88px, 104px));
    width: fit-content;
    max-width: 100%;
    gap: 6px;
    margin-bottom: 10px;
  }
  body.browse-mode .card-detail__stat {
    background: rgb(0 0 0 / 3%);
    border-radius: 8px;
    padding: 7px 8px;
  }
  body.browse-mode .card-detail__stat strong {
    display: block;
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 1px;
  }
  body.browse-mode .card-detail__stat span {
    font-size: 10px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  body.browse-mode .card-detail__features {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 10px;
  }
  body.browse-mode .card-detail__feat {
    font-size: 10.5px;
    background: #fdf4ff;
    color: #c026d3;
    border: 1px solid rgba(192, 38, 211, 0.2);
    border-radius: var(--pill-radius);
    padding: 2px 8px;
  }
  @keyframes card-detail-in {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

/* Cookie consent banner */
.cookie-banner {
  position: fixed;
  left: 50%;
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 1100;
  width: min(420px, calc(100vw - 24px));
  padding: 18px 18px 16px;
  border-radius: 14px;
  border: var(--ctrl-border);
  background: var(--surface);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.12);
  transform: translateX(-50%);
}
.cookie-banner[hidden] {
  display: none !important;
}
.cookie-banner__inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
.cookie-banner__title {
  margin: 0;
  font-family: var(--font-logo);
  font-size: 1.35rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--text);
}
.cookie-banner__link {
  color: var(--text);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: color-mix(in srgb, var(--text) 35%, transparent);
}
.cookie-banner__link:hover {
  color: var(--accent);
  text-decoration-color: currentColor;
}
.cookie-banner__text {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--muted);
}
.cookie-banner__actions {
  display: flex;
  gap: 8px;
}
.cookie-banner__actions .btn {
  flex: 1 1 0;
}
.cookie-toast {
  position: fixed;
  left: 50%;
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 1101;
  transform: translateX(-50%);
  max-width: min(320px, calc(100vw - 32px));
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(24, 24, 22, 0.88);
  color: #fff;
  font-family: var(--font-ui);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.18);
}
.cookie-toast[hidden] {
  display: none !important;
}

/* Dev preview bars (localhost / ?cookie-preview=) */
.dev-preview-bar {
  position: fixed;
  z-index: 1200;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: var(--ctrl-border);
  border-radius: var(--ctrl-radius-md);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  backdrop-filter: blur(8px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
.dev-preview-bar__label {
  padding: 0 8px 0 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.dev-preview-bar__btn {
  height: var(--ctrl-h-sm);
  min-height: var(--ctrl-h-sm);
  padding: 0 10px;
  border: none;
  border-radius: calc(var(--ctrl-radius-md) - 2px);
  background: transparent;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
}
.dev-preview-bar__short {
  display: none;
}
.dev-preview-bar__btn:hover,
.dev-preview-bar__btn:focus-visible {
  color: var(--text);
  background: var(--surface2);
}
.dev-preview-bar__btn.is-active {
  background: var(--surface);
  color: var(--text);
  box-shadow: inset 0 0 0 1px var(--border);
}
.dev-preview-bar__btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.cookie-preview-bar {
  right: max(8px, env(safe-area-inset-right));
  bottom: max(40px, calc(8px + env(safe-area-inset-bottom)));
  left: auto;
}
body:has(#formPreviewBar) .cookie-preview-bar {
  bottom: max(52px, calc(12px + env(safe-area-inset-bottom)));
}
body:has(.map-attribution) .cookie-preview-bar {
  bottom: max(40px, calc(8px + env(safe-area-inset-bottom)));
}
body.cookie-banner-open.page-doc .page-shell,
body.cookie-banner-open.page-doc.page-plain .page-shell {
  padding-bottom: calc(var(--content-column-inset) + env(safe-area-inset-bottom, 0px) + 120px);
}
@media (max-width: 768px) {
  body:has(.map-attribution) .cookie-preview-bar {
    top: calc(var(--toolbar-measured, 60px) + var(--map-chrome-gap) - 30px);
    bottom: auto;
    right: max(8px, env(safe-area-inset-right));
    left: auto;
    flex-direction: row;
    flex-wrap: nowrap;
    max-width: none;
    padding: 2px;
    gap: 1px;
  }
  body:has(.map-attribution) .cookie-preview-bar .dev-preview-bar__label {
    display: none;
  }
  body:has(.map-attribution) .cookie-preview-bar .dev-preview-bar__full {
    display: none;
  }
  body:has(.map-attribution) .cookie-preview-bar .dev-preview-bar__short {
    display: inline;
  }
  body:has(.map-attribution) .cookie-preview-bar .dev-preview-bar__btn {
    height: 24px;
    min-height: 24px;
    padding: 0 4px;
    font-size: 10px;
  }
}
@media (max-width: 720px) {
  .cookie-banner {
    width: min(380px, calc(100vw - 20px));
    padding: 16px;
  }
  .cookie-banner__title {
    font-size: 1.2rem;
  }
  body.page-doc .cookie-preview-bar,
  body.page-doc.page-plain .cookie-preview-bar {
    top: calc(var(--header-h, 48px) + 8px);
    bottom: auto;
    right: max(8px, env(safe-area-inset-right));
    flex-direction: column;
    align-items: stretch;
    padding: 2px;
    gap: 1px;
    max-width: 34px;
  }
  body:has(#formPreviewBar) .cookie-preview-bar {
    top: calc(var(--header-h, 48px) + 8px);
    bottom: auto;
  }
  .cookie-preview-bar .dev-preview-bar__label {
    display: none;
  }
  .cookie-preview-bar .dev-preview-bar__full {
    display: none;
  }
  .cookie-preview-bar .dev-preview-bar__short {
    display: inline;
  }
  .cookie-preview-bar .dev-preview-bar__btn {
    height: 24px;
    min-height: 24px;
    padding: 0 4px;
    font-size: 10px;
    line-height: 1;
  }
}