.zippy-player {
    position: relative;
    width: 100%;
    height: min(70vh, 720px);
    min-height: 280px;
    overflow: hidden;
    background: #000;
}

.zippy-player:fullscreen {
    height: 100vh;
}

.zippy-player [hidden] {
    display: none;
}

.zippy-run { overflow: hidden; border-radius: 16px; background: #111923; color: #fff; }
.zippy-run__controls, .zippy-run .zippy-player #controls { position: absolute; top: 64px; left: 12px; z-index: 35; display: flex; flex-direction: column; gap: 6px; }
.zippy-run__controls:empty { display: none; }
.zippy-run .zippy-player #controls > * { margin: 0; width: 44px; height: 44px; box-sizing: border-box; }
.zippy-run__icon, .zippy-run .zippy-player #controls .zippy-run__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid #647384; border-radius: 50%; background: rgba(17, 25, 35, .85); color: #fff; cursor: pointer; pointer-events: auto; }
.zippy-run__icon:hover { background: #354152; }
.zippy-run__icon:focus-visible { outline: 2px solid #8ee2b4; outline-offset: 2px; }
.zippy-run__icon:disabled { opacity: .45; cursor: default; }
.zippy-run__icon--stop, .zippy-run .zippy-player #controls .zippy-run__icon--stop { background: #a92336; border-color: #e75b6d; }
.zippy-run__stop, .zippy-run .zippy-player #controls > .zippy-run__stop { margin: 0; padding: 0; border: 0; border-radius: 0; line-height: normal; }
/* Epic owns the statistics content and interactions; only its placement is adapted. */
.zippy-run .zippy-player #stats-panel { left: 68px; right: auto; top: 12px; bottom: auto; width: min(600px, calc(100% - 80px)); height: auto; max-height: calc(100% - 24px); z-index: 40; }
.zippy-run .zippy-player #stats-panel:not(.panel-wrap-visible) { display: none; }
.zippy-run .zippy-player #stats-panel .panel { width: 100%; height: auto; max-height: calc(min(70vh, 720px) - 24px); overflow-y: auto; padding: 12px 16px; border: 1px solid #354152; border-radius: 10px; background: rgba(17, 25, 35, .96); font-size: .85rem; }
.zippy-run .zippy-player #stats-panel .StatsResult { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.zippy-run .zippy-player #stats-panel #statsHeading { padding: 0; margin: 8px 0; font-size: 1rem; }
.zippy-run .zippy-player #stats-panel #streamToolsStats { padding: 0; }
.zippy-run .zippy-player #stats-panel #ControlStats { margin: 0; }
.zippy-run .zippy-player #stats-panel #ControlStats > section { padding: 8px 0; }
.zippy-run .zippy-player #stats-panel .StatsResult { font-weight: 400; line-height: 1.45; }
.zippy-run .zippy-player #stats-panel .settingsHeader { flex-wrap: wrap; gap: 6px; font-style: normal; }
.zippy-run .zippy-player #stats-panel #statsClose:focus-visible { outline: 2px solid #8ee2b4; }
.zippy-run:fullscreen .zippy-player #stats-panel .panel { max-height: calc(100vh - 24px); }
.zippy-run__stage { position: relative; height: min(70vh, 720px); min-height: 400px; background: #080d14; }
.zippy-run .zippy-player { position: absolute; inset: 0; height: 100%; min-height: 0; }
.zippy-run__overlay { position: absolute; inset: 0; z-index: 10; display: flex; align-items: center; justify-content: center; padding: 24px 24px 24px 76px; overflow: auto; background: rgba(8, 13, 20, .94); }
.zippy-run [hidden] { display: none !important; }
.zippy-run__panel { width: min(100%, 600px); text-align: center; margin: auto; }
.zippy-run__headline { font-size: clamp(1.3rem, 3vw, 2rem); font-weight: 600; color: #fff; }
.zippy-run__hint { color: #b4c4d5; font-size: .95rem; }
.zippy-run__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
.zippy-run__progress { margin-top: 24px; padding: 14px 18px; border: 1px solid #354152; border-radius: 10px; text-align: left; }
.zippy-run__progress summary { cursor: pointer; color: #b4c4d5; font-size: .85rem; }
.zippy-run__progress ul { list-style: none; padding: 0; margin-top: 10px; }
.zippy-run__progress li { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; color: #b4c4d5; font-size: .8rem; }
.zippy-run__progress li[data-status="success"] { color: #8ee2b4; }
.zippy-run__progress li[data-status="running"], .zippy-run__progress li[data-status="queued"] { color: #fff; }
.zippy-run__progress li[data-status="failed"], .zippy-run__progress li[data-status="failed_cleaned"] { color: #ffb4a9; }
.zippy-run__step-status { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.zippy-run__dots { display: inline-flex; gap: 3px; }
.zippy-run__dots i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; animation: zippy-run-dot 1.2s infinite ease-in-out; }
.zippy-run__dots i:nth-child(2) { animation-delay: .2s; }
.zippy-run__dots i:nth-child(3) { animation-delay: .4s; }
@keyframes zippy-run-dot { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .zippy-run__dots i { animation: none; } }
.zippy-run .zippy-player #fullscreen-btn { display: none; }
.zippy-run:fullscreen { display: flex; flex-direction: column; width: 100%; height: 100%; border-radius: 0; }
.zippy-run:fullscreen .zippy-run__stage { flex: 1; height: auto; min-height: 0; }
@media (max-width: 575px) {
    .zippy-run__overlay { padding: 16px 16px 16px 68px; }
    .zippy-run__stage { min-height: 430px; }
}