/* Story controls and shoppable cards, scoped to the full-screen viewer. */
.stories-wrapper { background:rgba(12,17,23,.94); }
.stories-wrapper .large-stories-swiper { width:min(420px,calc(100vw - 40px)); height:min(747px,calc(100vh - 48px)) !important; height:min(747px,calc(100dvh - 48px)) !important; }
.stories-wrapper .story-item-lg { border-radius:18px; background:#151a22; }
.stories-wrapper .story-item-lg-content { display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; }
.stories-wrapper .story-item-lg-overly { position:relative; top:auto; right:auto; display:flex; flex-wrap:nowrap; align-items:center; gap:10px; padding:30px 18px 50px; background:linear-gradient(180deg,rgba(0,0,0,.7),transparent); pointer-events:auto; }
.stories-wrapper .story-item-lg-title { order:1; flex:1; min-width:0; width:auto; margin:0; gap:10px; }
.stories-wrapper .story-item-lg-title .avatar { width:36px; height:36px; flex-shrink:0; border:1px solid rgba(255,255,255,.7); border-radius:50%; overflow:hidden; }
.stories-wrapper .story-item-lg-title .avatar img { width:100%; height:100%; object-fit:cover; }
.stories-wrapper .story-item-lg-title .title { margin:0 !important; min-width:0; color:#fff; font-size:13px; font-weight:600; line-height:1.8; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
.stories-wrapper .story-video-controls { order:2; flex-shrink:0; width:auto; margin:0; gap:6px; }
.stories-wrapper .story-item-lg-back,.stories-wrapper .story-video-controls-btn { display:grid; place-items:center; flex-shrink:0; width:40px; height:44px; padding:0; border:1px solid rgba(255,255,255,.16); border-radius:12px; background:rgba(17,22,29,.45); color:#fff; font-size:19px; cursor:pointer; transition:background 140ms ease; }
.stories-wrapper .story-item-lg-back { order:3; }
.stories-wrapper .story-item-lg-back:hover,.stories-wrapper .story-video-controls-btn:hover { background:rgba(17,22,29,.75); }
.stories-wrapper button:focus-visible,.stories-wrapper a:focus-visible,.stories-wrapper .story-item-lg-products:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.stories-wrapper .story-item-lg-overly-bottom { flex-direction:column; align-items:stretch; gap:12px; bottom:auto; padding:50px 18px 20px; padding-bottom:max(20px,env(safe-area-inset-bottom)); background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,.55) 65%,transparent); }
.stories-wrapper .story-item-lg-description { font-size:13px; line-height:1.9; color:#fff; max-height:96px; overflow-y:auto; overflow-wrap:anywhere; }
.stories-wrapper .story-item-lg-btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:44px; margin:0; padding:10px 16px; font-size:12px; font-weight:600; border-radius:10px; background:#fff; color:#18212e; }
.stories-wrapper .story-item-lg-btn:hover { background:#edf0f4; color:#18212e; }
.story-products-heading { font-size:10px; font-weight:500; color:rgba(255,255,255,.75); margin:0; }
.stories-wrapper .story-item-lg-products { width:100% !important; margin:0; gap:10px; padding:2px 0 8px; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.45) transparent; }
.stories-wrapper .story-item-lg-products::-webkit-scrollbar { height:4px; }
.stories-wrapper .story-product-card { display:flex; flex-direction:column; width:100%; min-width:0; gap:0; padding:14px; border-radius:16px; background:#fff; border:1px solid #e8edf0; scroll-snap-align:start; color:#163b4c; box-shadow:0 8px 24px rgba(0,0,0,.12); }
.stories-wrapper .story-product-summary { display:flex; align-items:center; gap:12px; width:100%; }
.stories-wrapper .story-product-image { width:66px; height:66px; flex-shrink:0; display:grid; place-items:center; background:#f4f7f8; border:1px solid #edf1f3; border-radius:12px; padding:6px; }
.stories-wrapper .story-product-image img { width:100% !important; height:100% !important; margin:0; object-fit:contain; border-radius:6px; }
.stories-wrapper .product-item-h-content { flex:1; min-width:0; width:auto; }
.stories-wrapper .story-product-eyebrow { display:block; margin-bottom:4px; font-size:9px; font-weight:400; color:#74838c; }
.stories-wrapper .story-product-card .product-title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; font-size:13px; line-height:1.85; color:#163b4c; margin:0; font-weight:600; overflow-wrap:anywhere; }
.stories-wrapper .story-product-footer { width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; padding-top:12px; border-top:1px solid #edf1f3; }
.stories-wrapper .story-product-price { flex:1; min-width:0; }
.stories-wrapper .story-product-price .product-price-container { width:100%; min-height:0; gap:3px; padding:0; margin:0 !important; align-items:stretch !important; }
.stories-wrapper .story-product-price .product-price-container .price { font-size:14px; font-weight:700; line-height:1.7; color:#163b4c !important; white-space:normal; overflow-wrap:anywhere; }
.stories-wrapper .story-product-price .product-price-container > .price.dash-on { align-self:start; order:-1; font-size:10px; font-weight:400; color:#87909d !important; }
.stories-wrapper .story-product-price .product-price-container .bg-danger { font-size:10px; border-radius:6px !important; margin:0 !important; padding:3px 6px !important; background:#df1450 !important; }
.stories-wrapper .story-product-price .product-price-container > .d-flex { flex-wrap:wrap; gap:6px; }
.stories-wrapper .story-product-price .text-danger { display:block !important; font-size:12px; }
.stories-wrapper .story-product-action { flex-shrink:0; display:flex; align-items:center; gap:6px; min-height:38px; padding:8px 10px; border-radius:9px; color:#fff; background:#163b4c; font-size:10px; font-weight:600; }
.stories-wrapper .story-product-card:hover .story-product-action { background:#24556b; }
.stories-wrapper .large-stories-swiper .swiper-pagination { top:10px; bottom:auto !important; height:4px; padding:0 18px; }
.stories-wrapper .large-stories-swiper .swiper-pagination-bullet { height:3px; border-radius:3px !important; }
@media(max-width:575px) {
 .stories-wrapper .large-stories-swiper { width:100%; height:100vh !important; height:100dvh !important; }
 .stories-wrapper .story-item-lg { border-radius:0; }
 .stories-wrapper .story-item-lg-overly { padding-top:calc(26px + env(safe-area-inset-top)); padding-inline:14px; gap:8px; }
 .stories-wrapper .story-item-lg-overly-bottom { padding-top:42px; }
 .stories-wrapper .story-item-lg-title { gap:8px; }
 .stories-wrapper .story-item-lg-title .avatar { width:30px; height:30px; }
 .stories-wrapper .story-item-lg-title .title { font-size:12px; }
 .stories-wrapper .large-stories-swiper .swiper-pagination { top:calc(10px + env(safe-area-inset-top)); padding-inline:14px; }
 .stories-wrapper .story-product-card { padding:12px; }
}
@media(max-height:520px) { .stories-wrapper .story-item-lg-description { max-height:44px; } .stories-wrapper .story-item-lg-overly { padding-bottom:20px; } .stories-wrapper .story-item-lg-overly-bottom { gap:6px; padding-top:20px; } .story-products-heading { display:none; } }
@media(prefers-reduced-motion:reduce) { .stories-wrapper,.stories-wrapper .story-item-lg-back,.stories-wrapper .story-video-controls-btn { transition:none; } }

/* Homepage story shelf */
.front-widget--stories { padding-block: 24px !important; background: transparent; border-bottom: 0; }
.front-widget--stories .story-strip-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.front-widget--stories .story-strip-heading h2 { margin:0 0 4px; font-size:17px; font-weight:700; color:#163b4c; }
.front-widget--stories .story-strip-heading p { margin:0; font-size:11px; color:#74838c; }
.front-widget--stories .story-strip-navigation { display:flex; gap:8px; }
.front-widget--stories .story-strip-navigation button { position:static; transform:none; margin:0; width:36px; height:36px; border:1px solid #e0e8ed; border-radius:50%; background:#fff; color:#163b4c; display:grid; place-items:center; box-shadow:none; cursor:pointer; opacity:1; visibility:visible; }
.front-widget--stories .story-strip-navigation button::after { display:none; }
.front-widget--stories .story-strip-navigation button:hover { background:#f0f5f7; }
.front-widget--stories .story-strip-navigation button.swiper-button-disabled { opacity:.3; cursor:default; }
.front-widget--stories .small-stories-swiper { padding:3px 0 0 !important; }
.front-widget--stories .small-stories-swiper .swiper-slide { width:100px !important; }
.front-widget--stories .story-item { width:100px; padding:4px 0; border-radius:12px; }
.front-widget--stories .story-item-circle { width:90px; height:90px; }
.front-widget--stories .story-item-circle img { width:68px !important; height:68px; border:3px solid #fff; box-shadow:0 0 0 1px #e6ecef; }
.front-widget--stories .story-item-circle svg { width:90px; height:90px; stroke-width:1.6; }
.front-widget--stories .story-item-title { margin-top:8px; padding:0 4px; min-height:38px; font-size:11px; font-weight:500; line-height:19px; color:#274653; overflow-wrap:anywhere; }
.front-widget--stories .story-item:hover { background:#f6f8fa; }
.front-widget--stories .story-item:focus-visible, .front-widget--stories button:focus-visible { outline:2px solid #df1450; outline-offset:2px; }
@media(max-width:575px) {
    .front-widget--stories { padding-block:18px !important; }
    .front-widget--stories .story-strip-heading { margin-bottom:12px; }
    .front-widget--stories .story-strip-heading h2 { font-size:15px; }
    .front-widget--stories .small-stories-swiper .swiper-slide, .front-widget--stories .story-item { width:80px !important; }
    .front-widget--stories .story-item-circle, .front-widget--stories .story-item-circle svg { width:76px; height:76px; }
    .front-widget--stories .story-item-circle img { width:56px !important; height:56px; }
    .front-widget--stories .story-item-title { font-size:10px; line-height:18px; min-height:36px; margin-top:6px; }
}
@media(prefers-reduced-motion:reduce) { .front-widget--stories .story-item-circle.animated svg { animation:none !important; } }