/* Shared by the desktop screen's route and full-study views. */
#stormwater-case-study .storm-view-navigation { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 20px; background: #edf3e7; border-bottom: 1px solid #c4d1c1; scroll-margin-top: 92px; }
#stormwater-case-study .storm-view-navigation button, #stormwater-case-study .storm-case-retry { min-height: 44px; padding: 9px 15px; border: 1px solid #b6c9b0; border-radius: 6px; color: #214b38; background: #fffefb; font: 500 13px/1.4 var(--f-display, system-ui); cursor: pointer; }
#stormwater-case-study .storm-view-navigation button[aria-pressed="true"] { color: #fffefb; background: #214b38; border-color: #214b38; }
#stormwater-case-study .storm-view-navigation button:focus-visible, #stormwater-case-study .storm-case-retry:focus-visible { outline: 3px solid #2478bc; outline-offset: 2px; }
#stormwater-case-study :is(.storm-tour, #stormwater-study, #storm-case-frame, #storm-case-status, #storm-case-retry)[hidden] { display: none !important; }
#stormwater-study { min-width: 0; background: #fffefb; color: #193d31; scroll-margin-top: 144px; }
#storm-case-frame { display: block; width: 100%; min-width: 0; border: 0; background: #fffefb; color-scheme: light; }
#stormwater-case-study .storm-case-status { margin: 0; padding: 32px 24px 16px; color: #315440; font-size: 15px; line-height: 1.6; }
#stormwater-case-study .storm-case-retry { margin: 0 24px 32px; }
@media (hover: hover) {
  #stormwater-case-study .storm-view-navigation button:hover, #stormwater-case-study .storm-case-retry:hover { border-color: #ff7a1a; box-shadow: 0 2px 4px #29452c20; }
}
@media (max-width: 560px) {
  #stormwater-case-study .storm-view-navigation { padding: 10px 12px; gap: 6px; }
  #stormwater-case-study .storm-view-navigation button { flex: 1; padding-inline: 9px; }
  #stormwater-case-study .storm-case-status { padding: 24px 16px 16px; }
  #stormwater-case-study .storm-case-retry { margin-inline: 16px; }
}
