/* Presentation only. Native colors, typography, layout and form states remain authoritative. */
.dn-motion-stage-trigger {
 /* The shared button layer uses important declarations driven by these tokens. */
 --dn-button-start: transparent;
 --dn-button-end: transparent;
 --dn-button-hover: transparent;
 --dn-button-hover-border: transparent;
 --dn-button-selected: transparent;
 --dn-button-border: transparent;
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 min-height: 44px;
 margin: 0;
 padding: 0;
 border: 0;
 border-radius: 0;
 background: transparent;
 color: inherit;
 cursor: pointer;
}
.dn-motion-stage-trigger:focus-visible {
 outline: 2px solid currentColor;
 outline-offset: 4px;
}
.dn-motion-stage-dialog {
 position: fixed;
 inset: 0;
 margin: auto;
 height: fit-content;
 width: min(620px, calc(100vw - 32px));
 max-height: calc(100dvh - 48px);
 padding: 0;
 overflow: auto;
 border: 1px solid var(--dn-line, #36383c);
 border-radius: 12px;
 background: var(--dn-panel, var(--panel, #1a1b1e));
 color: var(--dn-text, var(--text, #f4f1ea));
 font: inherit;
}
.dn-motion-stage-dialog::backdrop { background: #111214b3; }
.dn-motion-stage-dialog .dn-info-modal__surface { padding: clamp(24px, 5vw, 36px); }
.dn-motion-stage-dialog h2 { margin: 12px 0; font: inherit; font-size: 26px; font-weight: 800; }
.dn-motion-stage-dialog p { line-height: 1.65; }
.dn-motion-stage-dialog .dn-info-modal__head { display: flex; justify-content: space-between; gap: 20px; }
.dn-motion-stage-dialog .dn-info-modal__head button { flex: 0 0 44px; height: 44px; }
.dn-motion-stage-dialog .dn-info-modal__foot { margin-top: 24px; }
.dn-wipe-live-status {
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip-path: inset(50%);
 white-space: nowrap;
 border: 0;
}
.dn-wipe-stage-state { display: block; margin-top: 8px; color: var(--dn-muted, #b1b2b6); font: 600 11px/1.7 ui-monospace, Consolas, monospace; }
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li h3 { color: var(--dn-text); }
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li::before { background: var(--dn-muted); }
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li[data-dn-wipe-state="open"]::before,
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li[data-dn-wipe-state="current"]::before { background: var(--dn-orange); }
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li[data-dn-wipe-state="current"] h3,
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li[data-dn-wipe-state="current"] .dn-wipe-stage-state { color: var(--dn-orange); }
.dn-wipe-progression[data-dn-wipe-live] .dn-wipe-timeline li::before { z-index: 1; }
.dn-wipe-progression[data-dn-wipe-status="ok"] .dn-wipe-timeline > li[data-dn-wipe-state="open"]:not(:last-child)::after {
 content: '';
 position: absolute;
 top: -2px;
 left: 5px;
 width: 100%;
 height: 3px;
 background: var(--dn-orange);
 pointer-events: none;
}
@media (min-width: 561px) and (max-width: 960px) {
 .dn-wipe-progression[data-dn-wipe-status="ok"] .dn-wipe-timeline > li[data-dn-wipe-state="open"]:nth-child(3n):not(:last-child)::after { content: none; }
}
@media (max-width: 560px) {
 .dn-wipe-progression[data-dn-wipe-status="ok"] .dn-wipe-timeline > li[data-dn-wipe-state="open"]:not(:last-child)::after {
  top: 9px;
  left: -2px;
  width: 3px;
  height: 100%;
 }
}
.dn-motion-stage-dialog [data-dn-stage-live] { margin-top: 12px; color: var(--dn-orange, #ff6847); }
