/* Wide records stay local; the extra control does not depend on OS scrollbar settings. */
.table-wrap, [data-horizontal-scroll], pre {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-color: #9a9a9a #e5e5e5;
  scrollbar-width: auto;
}
.table-wrap::-webkit-scrollbar, [data-horizontal-scroll]::-webkit-scrollbar, pre::-webkit-scrollbar { height: 12px; }
.table-wrap::-webkit-scrollbar-track, [data-horizontal-scroll]::-webkit-scrollbar-track, pre::-webkit-scrollbar-track { background: #e5e5e5; border-radius: 6px; }
.table-wrap::-webkit-scrollbar-thumb, [data-horizontal-scroll]::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb { background: #9a9a9a; border: 2px solid #e5e5e5; border-radius: 6px; }
.has-horizontal-overflow { padding-bottom: 20px; }
.table-wrap:focus-visible, [data-horizontal-scroll]:focus-visible, pre:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.horizontal-scroll-dock[hidden] { display: none; }
.horizontal-scroll-dock {
  position: fixed;
  z-index: 45;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  height: 12px;
  min-height: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: none;
}
.horizontal-scroll-dock :focus-visible { outline: 2px solid #666; outline-offset: -1px; }
.horizontal-scroll-range {
  flex: 1;
  min-width: 0;
  width: 100%;
  height: 12px;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  cursor: ew-resize;
}
.horizontal-scroll-range::-webkit-slider-runnable-track { height: 12px; background: #e5e5e5; border: 0; border-radius: 6px; }
.horizontal-scroll-range::-moz-range-track { height: 12px; background: #e5e5e5; border: 0; border-radius: 6px; }
.horizontal-scroll-range::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 26px; height: 10px; margin-top: 1px; background: #9a9a9a; border: 0; border-radius: 5px; box-shadow: none; }
.horizontal-scroll-range::-moz-range-thumb { width: 26px; height: 10px; background: #9a9a9a; border: 0; border-radius: 5px; box-shadow: none; }

/* Reflow rather than hiding overflow or shrinking the approved artwork. */
main, footer { overflow-wrap: anywhere; }
.grid > *, .field, fieldset, .route-facts > *, .collection-originals > * { min-width: 0; }
fieldset { max-width: 100%; }
.content-split { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.collection-originals { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.collection-cards .collection-table tbody { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.collection-cards .collection-title { min-width: 0; }
.route-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.route-map-toolbar, .section-head.compact { flex-wrap: wrap; }
.route-map { max-width: 100%; }
.steps b { flex: 0 0 2ch; white-space: nowrap; }
dialog { margin: auto; padding: 1rem; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); color: var(--text); }
dialog img { max-height: 75dvh; object-fit: contain; }
dialog .dialog-close { margin-bottom: .75rem; background: var(--emerald); color: white; }
.vendor-directory-bar { top: 12px; }
.vendor-filter-content { width: min(650px, calc(100vw - var(--sidebar-width, 0px) - 48px)); }
.vendor-bar-footer { flex-wrap: wrap; }
.admin-notification-content { max-width: calc(100vw - var(--sidebar-width, 0px) - 48px); }
.vendor-filter-panel > summary, .vendor-view-toggle a { min-height: 44px; }
@media (max-width: 900px) {
  .content-split, .route-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .vendor-directory-bar { margin-right: 0; }
}
@media (max-width: 700px) {
  .sidebar-scroll { padding-inline: .25rem; scrollbar-width: thin; }
  .sidebar-group, .sidebar-group nav, .sidebar-group a { min-width: 0; max-width: 100%; }
  .sidebar-group a { padding-inline: 0; overflow-wrap: normal; }
  .sidebar-group a.active::before { left: -.25rem; }
  .sidebar-group .eyebrow { font-size: .52rem; }
  .workspace .card, .workspace .collection-detail > td { padding: 1.1rem; }
  .workspace .px-8 { padding-left: 1.1rem; padding-right: 1.1rem; }
  .workspace .page-head h1 { font-size: clamp(1.85rem, 7vw, 2.5rem); }
  .workspace .page-head { margin-bottom: 1.5rem; }
  .workspace .actions { gap: .65rem; }
  .workspace .btn { max-width: 100%; white-space: normal; }
  .collection-toolbar { padding: .75rem; }
  .collection-views { flex-wrap: wrap; min-width: 0; }
  .collection-views button { padding-left: .5rem; padding-right: .5rem; white-space: normal; }
  .collection-direction { max-width: 100%; }
  .collection-cards .collection-table td { white-space: normal; }
  .vendor-directory-form { grid-template-columns: minmax(0, 1fr); }
  .vendor-directory-bar { padding: 8px; }
  .vendor-bar-footer { justify-content: space-between; }
  .vendor-filter-content { padding: 12px; max-height: 48dvh; }
  .vendor-filter-fields, .vendor-filter-checks { grid-template-columns: minmax(0, 1fr); }
  .workspace .admin-stats { gap: .65rem; }
  .workspace .admin-stats .eyebrow { overflow-wrap: normal; letter-spacing: .04em; }
  .workspace-shell footer { padding: 1.5rem 12px; }
  .admin-notification-list, .admin-notification-head { padding: .75rem; }
  .admin-notification-list li { flex-wrap: wrap; }
}
@media (max-width: 480px) {
  .workspace .admin-stats { grid-template-columns: minmax(0, 1fr); }
  .workspace .admin-stats .admin-stat { flex-direction: row; align-items: center; min-height: 104px; }
}
/* Keep native page scrolling and scrollbar controls available. */
html{overflow-x:auto;overflow-y:scroll;scroll-behavior:auto;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:#888 #ededed}
html::-webkit-scrollbar{width:12px;height:12px}
html::-webkit-scrollbar-track{background:#ededed}
html::-webkit-scrollbar-thumb{background:#888;border:2px solid #ededed;border-radius:6px}
.sidebar-scroll{overflow-y:auto;scrollbar-width:auto;scrollbar-color:#888 #ededed}
.sidebar-scroll::-webkit-scrollbar{width:12px;height:12px}
.sidebar-scroll::-webkit-scrollbar-track{background:#ededed}
.sidebar-scroll::-webkit-scrollbar-thumb{background:#888;border:2px solid #ededed;border-radius:6px}