/* Сторінка /sitemap — карта сайту для людини (packages/ui/sitemap.js). Спільна для
   всіх зон, тож лежить у ядрі й підключається лише на цій сторінці. Таблиця фіксованої
   розкладки: довгі адреси переносяться, горизонтальної прокрутки немає навіть на 390 px. */
.sm { max-width: 1000px; margin: 0 auto; padding: 8px 0 40px; }
.sm h1 { margin: 0 0 6px; color: var(--green); }
.sm-lead { margin: 0 0 16px; color: var(--hint); }
.sm-stats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding: 0; list-style: none; }
.sm-stats li { background: var(--surface); border: 1px solid var(--border-gold); border-radius: var(--radius-pill);
  padding: 4px 12px; font-size: .85rem; }
.sm-stats b { color: var(--green); font-variant-numeric: tabular-nums; }

.sm-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0;
  background: var(--surface); border: 1px solid var(--border-gold); border-radius: var(--radius); overflow: hidden; }
.sm-table th, .sm-table td { padding: 7px 12px; text-align: left; vertical-align: top;
  border-top: 1px solid var(--border-gold); }
.sm-table thead th { border-top: 0; font-size: var(--fs-caption); font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: var(--hint); }
.sm-c-lang { width: 5.2em; }
.sm-c-mod { width: 7em; }
.sm-grp { background: rgba(var(--green-rgb), .06); color: var(--green); font-size: .9rem; }
.sm-grp span { color: var(--hint); font-weight: 400; }
.sm-loc { overflow-wrap: anywhere; }   /* запасне: роздільники вже дають <wbr> */
.sm-loc a { color: var(--green); text-decoration: none; }
.sm-loc a:hover { text-decoration: underline; text-decoration-color: var(--gold); }
.sm-lang, .sm-mod { white-space: nowrap; color: var(--hint); font-size: .85rem; font-variant-numeric: tabular-nums; }
.sm-pair { color: var(--green); }
.sm-xml { margin: 16px 0 0; font-size: .85rem; color: var(--hint); }

/* «Карти зон» — лише на головній: посилання на /sitemap інших хостів. */
.sm-zones-title { margin: 28px 0 10px; font-size: 1.2rem; color: var(--green); }
.sm-zonelinks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px;
  margin: 0; padding: 0; list-style: none; }
.sm-zonelinks li { min-width: 0; padding: 8px 12px; background: var(--surface); border: 1px solid var(--border-gold);
  border-radius: var(--radius-sm); overflow-wrap: anywhere; }
.sm-zonelinks a { color: var(--green); font-weight: 600; text-decoration: none; }
.sm-zonelinks a:hover { text-decoration: underline; text-decoration-color: var(--gold); }
.sm-zonelinks span { display: block; font-size: .78rem; color: var(--hint); }

@media (max-width: 560px) {
  .sm-table th, .sm-table td { padding: 6px 8px; }
  .sm-loc { font-size: .9rem; }
  .sm-c-lang { width: 3.8em; }
  .sm-c-mod { width: 6.1em; }
  .sm-lang, .sm-mod { font-size: .75rem; }
}