html:has(#story-entrance[open]){overflow:hidden;scrollbar-gutter:auto}
body.story-pending{overflow:hidden;scrollbar-gutter:auto}
body.story-pending>:not(#story-entrance):not(script):not(noscript){visibility:hidden}
dialog.story-entrance{position:fixed;inset:0;margin:0;padding:0;border:0;border-radius:0;width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;background:#14201a;color:#fff;overflow:hidden;opacity:1;transition:opacity .4s ease;z-index:2147483647;box-shadow:none}
dialog.story-entrance::backdrop{background:transparent}
.story-entrance .story-entrance-surface{position:relative;display:grid;place-items:center;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;box-shadow:none;transform:none;overflow:hidden}
.story-entrance .story-entrance-surface:hover,.story-entrance .story-entrance-surface:active{background:transparent;transform:none;box-shadow:none}
.story-entrance .story-entrance-surface:focus{outline:none}
.story-entrance[data-keyboard] .story-entrance-surface:focus-visible{outline:3px solid #fff;outline-offset:-7px}
.story-entrance .story-entrance-image{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:1440px;max-height:none;margin:auto;border:0;border-radius:0;object-fit:contain;object-position:center;pointer-events:none}
.story-entrance .story-entrance-copy,.story-entrance .story-entrance-failure{position:relative;max-width:calc(100% - 28px);padding:18px 14px;color:#fff;font-size:clamp(16px,2.2vw,29px);font-weight:650;line-height:1.65;text-align:center;text-shadow:0 1px 4px #000;background:radial-gradient(ellipse at center,rgba(12,23,17,.76) 25%,rgba(12,23,17,.5) 70%,transparent 100%);border-radius:40%;pointer-events:none;animation:story-caption-in .25s ease both}
.story-entrance .story-entrance-copy span{display:block}
.story-entrance [hidden]{display:none}
.story-entrance[data-phase="fading"]{opacity:0}

.story-entrance .story-entrance-start{position:absolute;inset-inline:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));width:fit-content;max-width:calc(100% - 32px);margin:0 auto;padding:4px 12px;color:#fff;font-size:clamp(14px,1.5vw,18px);font-weight:650;line-height:1.5;text-align:center;text-shadow:0 1px 3px #000,0 0 8px #000;background:radial-gradient(ellipse,rgba(12,23,17,.5),transparent 75%);pointer-events:none}
.story-entrance:not([data-phase="picture"]) .story-entrance-start{display:none}
@keyframes story-caption-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){dialog.story-entrance{transition:none}.story-entrance .story-entrance-copy{animation:none}}