/* Owns sheet entry and exit presentation. Existing owners close immediately and
   release simulation/focus; discrete display keeps the last view only through the 180 ms exit.
   No copied DOM, delayed cleanup, observer, or animation loop. */
/* One duration also reaches native dialogs inside the feedback shadow root. */
:root { --ui-panel-duration: 500ms; --ui-panel-exit-duration: 180ms; }
@media (prefers-reduced-motion: reduce) {
  :root { --ui-panel-duration: 0ms; --ui-panel-exit-duration: 0ms; }
}
@supports (transition-behavior: allow-discrete) {
:is(#ctrl-center-overlay,
  #station-detail-overlay,
  #line-config-overlay,
  #settings-overlay,
  #nav-overlay,
  #new-line-dialog-overlay,
  #cityrail-ats-overlay,
  .cityrail-depot-modal,
  .cityrail-depot-connection-modal,
  #living-city-overlay,
  #cc-express-modal,
  #cityrail-system-dialog,
  #station-arrivals-board,
  #playback-popover,
  #cityrail-contact,
  #offline-maps-dialog,
  #cityrail-feedback-modal,
  #cityrail-feedback-image-viewer,
  #cityrail-tutorial-overlay,
  #cr-rni-panel,
  #cr-eps-panel,
  #cr-rni-import-progress,
  .city-loading-panel,
  #line-edit-toolbar,
  #cityrail-line-depot-guide-popover,
  #map-analysis-panel,
  #cityrail-info-modal,
  #cityrail-pay-modal,
  #cityrail-depot-update-guide-overlay,
  #cityrail-station-rename-overlay,
  #loop-choice-overlay,
  #workshop-my-modal,
  #workshop-login-modal,
  #city-atlas-panel) {
  transition: opacity min(80ms, var(--ui-panel-duration, 500ms)) var(--ui-ease-out,cubic-bezier(.23,1,.32,1)),
    scale var(--ui-panel-duration, 500ms) var(--ui-ease-out,cubic-bezier(.23,1,.32,1)),
    display var(--ui-panel-duration, 500ms) allow-discrete, visibility var(--ui-panel-duration, 500ms) allow-discrete,
    overlay var(--ui-panel-duration, 500ms) allow-discrete;
  opacity: 1;
  scale: 1;
  transform-origin: center;
  @starting-style {
    opacity: 1;
    scale: .96;
  }
}
:is(#ctrl-center-overlay.hidden,
  #station-detail-overlay.hidden,
  #line-config-overlay.hidden,
  #settings-overlay.hidden,
  #nav-overlay.hidden,
  #new-line-dialog-overlay.hidden,
  #cityrail-ats-overlay.hidden,
  #living-city-overlay.hidden,
  #cc-express-modal.hidden,
  #cr-rni-panel.hidden,
  #cr-eps-panel.hidden,
  #cr-rni-import-progress.hidden,
  #city-select-screen:not(.loading) .city-loading-panel,
  #line-edit-toolbar.hidden,
  #cityrail-line-depot-guide-popover:not(.visible),
  #map-analysis-panel[hidden],
  #cityrail-info-modal[style*="display: none"],
  #cityrail-info-modal[style*="display:none"],
  #cityrail-pay-modal:not(.visible),
  #cityrail-depot-update-guide-overlay:not(.visible),
  #loop-choice-overlay.hidden,
  #workshop-my-modal:not(.visible),
  #workshop-login-modal:not(.visible),
  #city-atlas-panel:not([open]),
  #cityrail-tutorial-overlay:not([open]),
  .cityrail-depot-modal:not(.visible),
  .cityrail-depot-connection-modal:not(.visible),
  #cityrail-system-dialog:not(.visible),
  #station-arrivals-board[hidden],
  #playback-popover[hidden],
  #cityrail-contact:not([open]),
  #offline-maps-dialog:not([open]),
  #cityrail-feedback-modal:not([open]),
  #cityrail-feedback-image-viewer:not([open])) {
  opacity: 0;
  transition-duration: var(--ui-panel-exit-duration, 180ms);
  transition-timing-function: ease-out, linear, linear, linear, linear;
  scale: .96;
  pointer-events: none;
}
#playback-popover { transform-origin: bottom center; }
.cityrail-depot-modal, .cityrail-depot-connection-modal { transform-origin: left center; }
}


/* Native disclosure retains its box for symmetric entry and exit fades. */
@media (max-width:760px) and (prefers-reduced-motion:no-preference) {
  #ctrl-more-stats::details-content {
    scale: 1;
    transform-origin: top right;
    transition: scale var(--ui-panel-duration, 500ms) var(--ui-ease-out),
      content-visibility var(--ui-panel-duration, 500ms) allow-discrete;
    @starting-style { scale: .96; }
  }
  #ctrl-more-stats:not([open])::details-content {
    scale: .96;
    transition-duration: var(--ui-panel-exit-duration, 180ms);
    transition-timing-function: linear;
  }
}

/* One status follows a committed build, including the depot guide handoff. */
.cityrail-build-confirmation {
  position: fixed;
  z-index: 9200;
  bottom: 24px;
  left: 50%;
  translate: -50% 0;
  width: max-content;
  max-width: calc(100% - 48px);
  box-sizing: border-box;
  margin: 0;
  padding: 12px 18px;
  border: 1px solid var(--ui-line);
  border-radius: 16px;
  background: var(--material-popover, var(--ui-surface));
  box-shadow: var(--ui-shadow);
  color: var(--ui-text);
  font-size: 14px;
  pointer-events: none;
}

@supports (transition-behavior: allow-discrete) {
  #workshop-modal {
    transition: opacity min(80ms,var(--ui-panel-duration)) ease-out,
      display var(--ui-panel-duration) allow-discrete;
    opacity: 1;
    @starting-style { opacity: 0; }
  }
  #workshop-modal:not(.visible) {
    opacity: 0;
    pointer-events: none;
    transition-duration: var(--ui-panel-exit-duration);
  }
  #workshop-modal .workshop-detail-panel {
    scale: 1;
    transform-origin: bottom right;
    transition: scale var(--ui-panel-duration) var(--ui-ease-out);
    @starting-style { scale: .96; }
  }
  #workshop-modal:not(.visible) .workshop-detail-panel {
    scale: .96;
    transition-duration: var(--ui-panel-exit-duration);
  }
  .line-config-disclosure::details-content {
    opacity: 1;
    transition: opacity min(120ms,var(--ui-panel-duration)) ease-out,
      content-visibility min(120ms,var(--ui-panel-duration)) allow-discrete;
    @starting-style { opacity: 0; }
  }
  .line-config-disclosure:not([open])::details-content { opacity: 0; }
}

/* Leaflet owns popup fade/removal; only its card enters, preserving map positioning. */
@supports (transition-behavior: allow-discrete) {
  :is(.train-info-popup,.cityrail-node-action-popup) .leaflet-popup-content-wrapper {
    scale: 1;
    transform-origin: bottom center;
    transition: scale var(--ui-panel-duration) var(--ui-ease-out);
    @starting-style { scale: .96; }
  }
}