.stories-rolagem{--sr-fundo:#1b9e46}
.sr-palco{position:relative;display:grid;place-items:center;padding:clamp(1.5rem,7svh,4.5rem) 0;background:var(--sr-fundo);overflow:clip;isolation:isolate}

.sr-janela{position:relative;container-type:inline-size;aspect-ratio:9/16;width:min(calc(88svh * 9 / 16), 86%);
  touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;outline:none}
.sr-janela:active{cursor:grabbing}
.sr-clipe{position:absolute;inset:0;border-radius:3.7cqw;overflow:hidden;background:#0b0f10;box-shadow:0 1.2rem 2.8rem -1rem rgb(0 40 16 / .45);isolation:isolate}
.sr-janela:focus-visible .sr-clipe{outline:3px solid #fff;outline-offset:5px}
.sr-faixa{position:absolute;inset:0;overflow:hidden}
.sr-peca{position:absolute;inset:0;overflow:hidden;visibility:hidden;will-change:transform;backface-visibility:hidden}
.sr-arte{position:absolute;left:var(--sr-al);top:var(--sr-at);width:var(--sr-aw);height:var(--sr-ah);will-change:transform}
.sr-arte img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;pointer-events:none;background:transparent}
.sr-veu{position:absolute;inset:0;background:#031a0a;opacity:var(--veu,0);pointer-events:none}

.sr-ui{position:absolute;inset:0;pointer-events:none;color:#fff;font-family:var(--f-texto,"Archivo","Helvetica Neue",Arial,sans-serif);
  background:linear-gradient(to bottom,rgb(0 0 0 / .24),rgb(0 0 0 / 0) 13%),linear-gradient(to top,rgb(0 0 0 / .26),rgb(0 0 0 / 0) 11%)}
.sr-topo{position:absolute;left:4cqw;right:4cqw;top:3cqw;display:flex;align-items:center;gap:1.8cqw}
.sr-avatar{width:7.2cqw;height:7.2cqw;border-radius:50%;flex:none;object-fit:cover;background:#fff}
.sr-usuario{font-weight:500;font-size:3.6cqw;line-height:1;letter-spacing:.01em;text-shadow:0 1px 3px rgb(0 0 0 / .4)}
.sr-selo{width:3.6cqw;height:3.6cqw;flex:none;fill:#00c8ff}
.sr-visto{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sr-mais{margin-left:auto;display:flex}
.sr-mais svg{width:5cqw;height:5cqw;fill:#fff}
.sr-base{position:absolute;left:4cqw;right:4cqw;bottom:2.4cqw;display:flex;align-items:center;gap:3cqw}
.sr-msg{flex:1;height:7.4cqw;border:max(1px,.3cqw) solid rgb(255 255 255 / .9);border-radius:99px}
.sr-acoes{display:flex;gap:3.6cqw}
.sr-acoes svg{width:5.8cqw;height:5.8cqw;fill:none;stroke:#fff;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}

@media (max-width:767px){ .sr-palco{padding-block:clamp(1.25rem,5svh,2.5rem)} .sr-janela{width:min(calc(82svh * 9 / 16), 84%)} }
@media (prefers-reduced-motion:reduce){ .sr-peca,.sr-arte{will-change:auto} }