/* A compact story rail, deliberately separate from the slider and mascot. */
.story-strip{position:relative;margin-block:30px 38px;color:var(--look-dark2,#17465c)}
.story-strip-head{display:flex;align-items:end;justify-content:space-between;gap:14px;padding:0 3px 14px}
.story-strip-head h2{font-size:1.3rem;font-weight:900;line-height:1.55;margin:0;color:var(--look-dark2,#17465c)}
.story-strip-head p{font-size:.82rem;line-height:1.9;color:#6e858d;margin:3px 0 0}
.story-strip-kicker{font:800 .65rem/1.2 system-ui,sans-serif;letter-spacing:.16em;color:var(--look-mid,#318bad);opacity:.72}
.story-rail{display:flex;gap:19px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;padding:5px 3px 13px;scrollbar-width:thin;scrollbar-color:#c4d9df transparent}
.story-bubble{flex:0 0 106px;display:flex;flex-direction:column;align-items:center;gap:9px;min-width:0;text-align:center;text-decoration:none;color:inherit;scroll-snap-align:start}
.story-bubble-ring{display:block;width:98px;height:98px;padding:4px;border-radius:50%;background:linear-gradient(145deg,var(--look-mid,#429db9),#d5bba0 85%);box-shadow:0 7px 16px #25495b18;transition:transform .18s ease}
.story-bubble-ring img{display:block;width:100%;height:100%;object-fit:cover;border:4px solid var(--look-paper-bg,#fff8ef);border-radius:50%;background:#fff}
.story-bubble:hover .story-bubble-ring{transform:translateY(-3px)}.story-bubble:focus-visible{outline:3px solid var(--look-mid,#338baa);outline-offset:4px;border-radius:14px}
.story-bubble-label{max-width:100%;font-size:.77rem;font-weight:800;line-height:1.6;overflow-wrap:anywhere}
body[data-store-theme=playful] .story-bubble-ring{background:linear-gradient(145deg,var(--look-mid,#c0474e),#efb683 90%)}
.story-dialog{border:0;padding:0;max-width:none;max-height:none;margin:auto;background:transparent;overflow:visible;box-shadow:none}
.story-dialog[open]{display:block}.story-dialog::backdrop{background:rgba(18,26,31,.82);backdrop-filter:blur(5px)}
.story-frame{position:relative;overflow:hidden;width:min(420px,calc(100vw - 24px));height:min(730px,calc(100vh - 24px));height:min(730px,calc(100dvh - 24px));border-radius:26px;background:#1b2327;box-shadow:0 24px 70px #0007;color:#fff;isolation:isolate}
.story-frame-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;background:#273035}
.story-frame-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(8,15,20,.74),transparent 25%,transparent 51%,rgba(8,15,20,.88) 100%)}
.story-progress{position:absolute;z-index:1;top:13px;left:15px;right:15px;display:flex;gap:4px;direction:rtl}.story-progress span{height:3px;flex:1;min-width:1px;overflow:hidden;border-radius:99px;background:#ffffff5c}.story-progress i{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:right center}
.story-frame-top{position:absolute;z-index:1;top:25px;left:16px;right:19px;display:flex;align-items:center;justify-content:space-between;gap:10px}.story-frame-brand{font:800 .88rem/1.5 system-ui,sans-serif;letter-spacing:.01em;text-shadow:0 1px 4px #0009}.story-controls{display:flex;gap:7px}.story-icon-button,.story-arrows button{display:grid;place-items:center;border:1px solid #ffffff88;border-radius:50%;background:#1b242870;color:#fff;cursor:pointer}.story-icon-button{width:39px;height:39px;font-size:1rem;font-weight:800}.story-icon-button[hidden]{display:none}.story-icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.story-frame-bottom{position:absolute;z-index:1;bottom:0;left:0;right:0;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:22px 20px 24px}.story-frame-copy{min-width:0;max-width:80%}.story-frame-copy strong{display:block;font-size:1.1rem;font-weight:900;line-height:1.7;overflow-wrap:anywhere}.story-frame-copy p{margin:5px 0 0;line-height:1.8;font-size:.84rem;white-space:pre-wrap;overflow-wrap:anywhere}.story-action{display:inline-flex;align-items:center;justify-content:center;margin-top:12px;padding:8px 15px;border-radius:99px;background:#fff;color:#213c44;font-size:.77rem;font-weight:900;text-decoration:none}.story-action[hidden]{display:none}
.story-arrows{display:flex;gap:7px;direction:rtl}.story-arrows button{width:39px;height:39px;font:400 28px/1 system-ui,sans-serif}.story-arrows button:disabled{opacity:.4;cursor:default}.story-icon-button:focus-visible,.story-arrows button:focus-visible,.story-action:focus-visible{outline:3px solid white;outline-offset:3px}
html.story-modal-open{overflow:hidden}
.story-single{padding-block:32px 46px}.story-single-card{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:28px;align-items:center;max-width:900px;margin:auto;padding:22px;border-radius:24px;background:var(--look-card-bg,#fffaf3);box-shadow:0 12px 35px #24425214}.story-single-card>img{width:100%;max-height:620px;object-fit:contain;border-radius:17px;background:#edf3f2}.story-single-card h1{font-size:1.35rem;font-weight:900;color:var(--look-dark2,#17465c)}.story-single-card p{margin:12px 0;color:#546e79;line-height:2;white-space:pre-wrap}.story-single-action,.story-single-back{display:inline-flex;margin:10px 0 0 10px;padding:10px 16px;border-radius:99px;font-size:.85rem;font-weight:800;text-decoration:none}.story-single-action{background:var(--look-mid,#2582a2);color:#fff}.story-single-back{background:#edf4f5;color:#244c5b}
@media(max-width:640px){.story-strip{margin-block:22px 28px}.story-strip-head{padding-bottom:10px}.story-strip-head h2{font-size:1.07rem}.story-strip-head p{font-size:.75rem}.story-rail{gap:12px}.story-bubble{flex-basis:84px}.story-bubble-ring{width:78px;height:78px;padding:3px}.story-bubble-ring img{border-width:3px}.story-bubble-label{font-size:.71rem}.story-frame{border-radius:20px}.story-single-card{grid-template-columns:1fr;gap:15px;padding:15px}.story-single-card>img{max-height:55vh}}
@media(prefers-reduced-motion:reduce){.story-bubble-ring{transition:none}}
