.story-viewer{width:min(460px,100%);height:min(860px,100dvh);max-width:100%;max-height:100dvh;padding:0;border:0;border-radius:14px;background:#10131b;color:white;overflow:hidden}.story-viewer::backdrop{background:#05070bf2}.story-viewer-shell{display:flex;flex-direction:column;height:100%;padding:12px}.story-viewer-top{display:flex;align-items:center;gap:10px;padding:0 3px 10px;font-size:10px;font-weight:bold;letter-spacing:.7px}.story-viewer-top>span:first-child{margin-right:auto}.story-viewer-top button{background:transparent;color:white;border:0;font-size:21px;padding:4px 7px;min-width:40px;min-height:40px}.story-viewer-progress{display:flex;gap:4px;margin:0 2px 10px}.story-viewer-progress span{height:3px;background:#ffffff42;flex:1;border-radius:3px}.story-viewer-progress span.active{background:#fff}.story-viewer-stage{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:8px;touch-action:pan-y;background:#171b24}.story-viewer-backdrop{position:absolute;inset:-20px;background-position:center;background-size:cover;filter:blur(20px);opacity:.5}.story-viewer-stage>img{position:absolute;width:100%;height:100%;object-fit:contain;user-select:none}.story-viewer-caption{position:absolute;inset:25% 0 0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:80px 24px 30px;background:linear-gradient(transparent,#000c 65%,#000e);pointer-events:none}.story-viewer-caption h2{color:white;font-size:clamp(25px,4vw,34px);line-height:1.16;margin:0 0 22px;overflow-wrap:anywhere;text-shadow:0 2px 8px #0008}.story-viewer-caption a{pointer-events:auto;min-height:46px;padding:12px 22px;font-size:14px}.story-viewer-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:12px;font-size:10px;color:#abb4c3}.story-viewer-controls button{border:1px solid #ffffff35;background:#202630;color:white;padding:10px 13px;border-radius:5px;font-size:12px;min-height:42px}@media(max-width:600px){.story-viewer{width:100vw;height:100dvh;border-radius:0}.story-viewer-shell{padding:env(safe-area-inset-top,8px) 8px max(10px,env(safe-area-inset-bottom))}.story-viewer-caption{padding:55px 20px 30px}.story-viewer-controls>span{font-size:9px}}
.story-viewer-progress{gap:2px}.story-viewer-progress span{min-width:0}.story-viewer-stage{touch-action:none}
.story-viewer-shell{touch-action:none}