.video-host { position: absolute; inset: 0; background: #000; }
.video-host .story-video { width: 100%; height: 100%; display: block; object-fit: contain; background: #000; }
.story-cover { z-index: 2; }
.cover-start:not(:disabled) { cursor: pointer; }
.cover-start:not(:disabled):hover { filter: brightness(1.1); }
.cover-start:focus-visible { outline: 3px solid #fff3dc; outline-offset: 5px; }
.cover-start:not(:disabled):active .cover-art { transform: translateY(-48%); }

.runtime-hud { position: absolute; top: 24px; left: 24px; right: 24px; display: flex; align-items: center; gap: 12px; }
.runtime-section { margin-right: auto; padding: 9px 12px; border-radius: 5px; background: rgb(20 17 15 / 70%); color: #fff0da; font-size: 25px; }
.runtime-control, .runtime-action, .branch-option { min-height: var(--stage-min-hit, 80px); padding: 12px 22px; border: 1px solid #c3a77e; border-radius: 8px; background: rgb(43 32 24 / 90%); color: #fff1dc; font: 27px/1.4 -apple-system, "PingFang SC", sans-serif; cursor: pointer; }
.runtime-control { font-size: 23px; padding: 8px 12px; }
.runtime-control:focus-visible, .runtime-action:focus-visible, .branch-option:focus-visible { outline: 3px solid #f4dcaf; outline-offset: 4px; }
.runtime-control:disabled { opacity: .55; cursor: default; }
.runtime-feedback { position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%); min-width: 320px; max-width: 90%; padding: 24px; border-radius: 10px; background: rgb(22 18 15 / 88%); color: #fff2db; text-align: center; }
.runtime-feedback-text { font-size: 29px; line-height: 1.5; margin: 0 0 14px; }
.runtime-feedback:has(.runtime-action[hidden]) .runtime-feedback-text { margin-bottom: 0; }
.branch-panel { position: absolute; left: 38px; right: 38px; bottom: 104px; padding: 26px; border: 1px solid rgb(212 183 142 / 65%); border-radius: 12px; background: rgb(22 18 15 / 90%); color: #f9e9cf; }
.branch-heading { font-size: 32px; margin: 0 0 22px; font-weight: 500; }
.branch-options { display: grid; gap: 16px; }
.branch-option { width: 100%; min-height: max(82px, var(--stage-min-hit, 82px)); font-size: 31px; }
.branch-option:disabled { cursor: default; color: #ead8bd; background: #3b3026; border-style: solid; opacity: 1; }
.branch-option:not(:disabled):hover { background: #614c36; }
.branch-note { font-size: 23px; line-height: 1.6; margin: 20px 0 0; color: #d1bea3; }
.runtime-ending { position: absolute; left: 38px; right: 38px; top: 36%; padding: 36px; text-align: center; color: #fff1d8; background: rgb(22 18 15 / 90%); border-radius: 12px; }
.runtime-ending-label { font-size: 44px; font-weight: 500; }