.ds-visual-field { display: flex; flex-direction: column; gap: .35rem; margin: .75rem 0; font-weight: normal; }
.ds-filter-row { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; }
.ds-filter-row .ds-visual-field { flex: 1 1 150px; min-width: 0; }
.ds-dashboard-preview { width: 100%; height: 480px; border: 1px solid #ccd9e2; margin-top: 1rem; }
.ds-reference-dialog { width: min(760px, 94vw); max-height: 90dvh; overflow: auto; border: 1px solid #ccd9e2; border-radius: 12px; padding: 1.5rem; }
.ds-reference-dialog::backdrop { background: #0008; }
.ds-reference-dialog > button { margin: .5rem .5rem 0 0; }
.ds-link-visual { margin-bottom: .5rem; }
.storymap [hidden] { display: none !important; }
.storymap-map-pane, .storymap-dashboard-pane { position: relative; width: 100%; height: 100%; min-width: 0; min-height: 0; }
.storymap-dashboard-pane { background: white; display: flex; flex-direction: column; }
.storymap-dashboard-pane > iframe { flex: 1; width: 100%; min-height: 0; border: 0; }
.storymap-dashboard-tools { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding: .4rem; background: white; }
.storymap-map-pane > .storymap-visual-fullscreen { position: absolute; bottom: 1rem; left: 1rem; z-index: 4; }
.storymap.has-combined-visuals .storymap-media { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.storymap.has-combined-visuals[data-visual-view="both"] .storymap-media { grid-template-rows: auto minmax(0, 1fr) minmax(0, 1fr); }
.storymap[data-visual-view="map"] .storymap-dashboard-pane,
.storymap[data-visual-view="dashboard"] .storymap-map-pane { display: none; }
.storymap-visual-tabs { display: flex; gap: .4rem; padding: .5rem; background: #eaf2f8; border-bottom: 1px solid #c4d5e2; }
.storymap-visual-tabs button { min-height: 44px; padding: .4rem 1rem; border: 1px solid #0072bc; border-radius: 6px; color: #005a91; background: white; font: inherit; font-weight: 600; cursor: pointer; }
.storymap-visual-tabs button[aria-pressed="true"] { background: #0069aa; color: white; }
.storymap-visual-tabs button:focus-visible { outline: 3px solid #ffb800; outline-offset: 2px; }
.storymap.has-story-dashboards { grid-template-columns: minmax(320px, 35%) minmax(0, 1fr); }
.storymap.has-story-dashboards .storymap-progress { top: .35rem; left: auto; right: .5rem; transform: none; flex-direction: row; gap: .4rem; }
.storymap.has-story-dashboards .storymap-nav-btn { margin: 0; }
.storymap-mobile-visual-slot { display: none; }
.storymap-visual-status { position: sticky; top: 0; z-index: 12; grid-column: 1 / -1; background: #fff4de; padding: .75rem; }
.storymap-slide-controls { display: flex; align-items: center; justify-content: center; gap: .75rem; padding: .75rem; background: white; grid-column: 1 / -1; }
.storymap-slide-controls select { max-width: min(45vw, 420px); min-width: 0; }
.storymap-slide-controls [role="status"] { white-space: nowrap; }
.storymap.is-slides { display: grid; grid-template-rows: auto 1fr; scroll-margin-top: 1rem; }
.storymap.is-slides .storymap-media { grid-row: 2 !important; height: 80dvh; }
.storymap.is-slides .storymap-cards { grid-row: 2; display: block; }
.storymap.is-slides.is-full-section .storymap-cards { grid-column: 1 / -1; }
.storymap.is-slides.is-full-section .storymap-media { display: none; }
.storymap.is-slides .storymap-card { min-height: 0; grid-row: auto !important; }
.storymap.is-slides .storymap-card-body { margin: 0; opacity: 1; transform: none; }
.storymap.is-slides .storymap-progress { display: none; }
.storymap .ds-visual-expanded { position: fixed; inset: 0; z-index: 10000; width: 100vw; height: 100dvh; background: white; }
.storymap-map-pane:fullscreen, .storymap-dashboard-pane:fullscreen { height: 100dvh; background: white; }
.storymap-narrative a[href^="#story-ref-"] { text-decoration: underline; text-decoration-style: dotted; cursor: pointer; }
@media (max-width: 768px) {
  .storymap.has-stacked-media, .storymap.is-slides { display: flex; flex-direction: column; position: relative; }
  .storymap.has-stacked-media .storymap-media, .storymap.is-slides .storymap-media {
    position: relative; order: 2; width: 100%; height: 65dvh; margin: 0; grid-row: auto !important;
  }
  .storymap-mobile-visual-slot { display: block; height: 65dvh; width: 100%; }
  .storymap-mobile-visual-slot.is-combined.shows-both { height: max(700px, 110dvh); }
  .storymap.has-stacked-media > .storymap-media { display: none; }
  .storymap.has-stacked-media.has-mobile-slot > .storymap-media { display: block; position: absolute; }
  .storymap.has-combined-visuals.has-mobile-slot > .storymap-media { display: grid; }
  .storymap.has-stacked-media .storymap-cards, .storymap.is-slides .storymap-cards { order: 1; width: 100%; }
  .storymap.has-stacked-media .storymap-card { flex-direction: column; align-items: stretch; }
  .storymap-slide-controls { order: 0; position: sticky; top: 0; z-index: 10; width: 100%; }
  .storymap.is-slides .storymap-card-body { padding: 1rem; }
  .storymap-card-body { padding: 1rem; }
  .storymap-map-pane > .storymap-visual-fullscreen { left: auto; right: 1rem; width: auto; }
  .storymap.has-stacked-media .storymap-progress { display: none; }
}
@media (min-width: 769px) and (max-width: 1440px) {
  .storymap-reader .masthead-nav { flex-wrap: wrap; min-width: 0; max-width: 100%; }
  .storymap:not(.has-no-map) { grid-template-columns: minmax(340px, 36%) minmax(0, 1fr); }
  .storymap-card { padding-left: 1.25rem; padding-right: 1.25rem; }
  .storymap-card-body { padding: 1.5rem; }
}
.storymap, .storymap * { box-sizing: border-box; }