*{-webkit-tap-highlight-color:transparent !important;-webkit-touch-callout:none !important}a,button,input,textarea,select{outline:none !important;box-shadow:none !important}a{color:inherit;text-decoration:none}a:focus,a:active,button:focus,button:active,input:focus,input:active,textarea:focus,textarea:active{outline:none !important;box-shadow:none !important;-webkit-tap-highlight-color:transparent !important}.stories-sidebar-container{height:100%;display:flex;flex-direction:column;background:var(--sx-bg-primary);overflow:hidden}.sx-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--sx-bg-primary);border-bottom:1px solid var(--sx-divider);flex-shrink:0}.stories-add-btn{width:38px;height:38px;border-radius:50%;border:none;background:var(--sx-bg-pill);color:var(--sx-text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--sx-transition)}.stories-add-btn:hover{background:var(--sx-bg-card);transform:scale(1.05)}.stories-feed-scroll{flex:1;overflow-y:auto;padding:0 0 100px 0;scrollbar-width:none}.stories-feed-scroll::-webkit-scrollbar{display:none}.stories-grid{display:grid;grid-template-columns:repeat(3,1fr) !important;gap:3px !important;padding:3px !important}@media (min-width:500px){.stories-grid{grid-template-columns:repeat(3,1fr) !important}}.story-card{position:relative;aspect-ratio:9 / 16 !important;background:var(--sx-bg-card);border-radius:4px !important;overflow:hidden;cursor:pointer;transition:transform 0.2s ease,box-shadow 0.2s ease}.story-card:hover{transform:scale(1.02);box-shadow:0 4px 12px rgba(0,0,0,0.4)}.story-card-cover{position:absolute;inset:0;background-size:cover;background-position:center}.story-card-pin{position:absolute;top:8px;right:8px;color:#fff;font-size:0.8rem;transform:rotate(45deg);filter:drop-shadow(0 1px 3px rgba(0,0,0,0.6));z-index:5}.story-card-views{position:absolute;bottom:8px;left:8px;color:#fff;font-size:0.7rem;font-weight:600;display:flex;align-items:center;gap:4px;background:rgba(0,0,0,0.4);padding:2px 6px;border-radius:4px;backdrop-filter:blur(2px);z-index:5;text-shadow:0 1px 2px rgba(0,0,0,0.5)}.video-badge{position:absolute;top:8px;left:8px;color:rgba(255,255,255,0.8);font-size:0.7rem;z-index:5}.just-watched-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.65);backdrop-filter:blur(1.5px);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.9);font-size:0.8rem;font-weight:600;text-align:center;z-index:8;pointer-events:none;letter-spacing:0.5px;text-shadow:0 1px 3px rgba(0,0,0,0.5)}.my-story-card{position:relative;aspect-ratio:9 / 16;background:#252525;border-radius:4px;overflow:hidden;cursor:pointer;transition:transform 0.2s ease}.my-story-card:hover{transform:scale(1.02)}.my-story-bg{position:absolute;inset:0;background-size:cover;background-position:center}.my-story-add-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.5);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff}.add-icon-circle{width:32px;height:32px;border-radius:50%;background:var(--sx-mint);display:flex;align-items:center;justify-content:center;font-size:0.9rem;box-shadow:0 2px 8px rgba(82,183,136,0.4)}.my-story-add-overlay span{font-size:0.72rem;font-weight:600}.reels-viewer-overlay{position:fixed;inset:0;z-index:99999;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.reels-desktop-blur{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(45px) brightness(0.3);transform:scale(1.12);z-index:1;display:none}.reels-player-container{position:relative;width:100%;height:100%;background:#000;display:flex;flex-direction:column;z-index:10}@media (min-width:769px){.reels-desktop-blur{display:block}.reels-player-container{width:420px;height:95vh;max-height:840px;border-radius:16px;box-shadow:0 16px 48px rgba(0,0,0,0.7);border:1px solid rgba(255,255,255,0.15);overflow:hidden}}.reels-media-viewport{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;background:#000}.reels-media-viewport video{width:100%;height:100%;object-fit:cover}.reels-media-viewport img{width:100%;height:100%;object-fit:contain !important;position:relative;z-index:2}.reel-blur-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(30px) brightness(0.3);transform:scale(1.2);z-index:1}.reel-play-pause-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.1);width:72px;height:72px;border-radius:50%;background:rgba(0,0,0,0.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.8rem;z-index:18;pointer-events:none;opacity:0;transition:opacity 0.25s ease,transform 0.25s cubic-bezier(0.34,1.56,0.64,1)}.reel-play-pause-overlay.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.reel-play-pause-overlay i{text-shadow:0 2px 10px rgba(0,0,0,0.5)}.reels-speed-indicator{position:absolute;top:60px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1.5px solid rgba(255,255,255,0.15);padding:6px 16px;border-radius:20px;color:#fff;font-size:0.8rem;font-weight:600;z-index:28;pointer-events:none;box-shadow:0 4px 15px rgba(0,0,0,0.4);animation:speedBadgePulse 1s infinite alternate}@keyframes speedBadgePulse{from{transform:translateX(-50%) scale(1)}to{transform:translateX(-50%) scale(1.05)}}.reel-scroll-nudge{animation:nudgeBounceUp 1.2s cubic-bezier(0.25,0.46,0.45,0.94) both}@keyframes nudgeBounceUp{0%,100%{transform:translateY(0)}40%{transform:translateY(-90px)}70%{transform:translateY(-30px)}}.reel-tap-zone{position:absolute;top:0;bottom:0;width:25%;z-index:15;cursor:pointer}.reel-tap-zone.left{left:0}.reel-tap-zone.right{right:0}.reels-header-overlay{position:absolute;top:0;left:0;right:0;z-index:25;padding:16px 16px 15px;background:linear-gradient(to bottom,rgba(0,0,0,0.4) 0%,transparent 100%);pointer-events:none !important}.reels-top-bar,.story-progress-container{pointer-events:auto !important}.story-progress-container{display:flex;gap:4px;width:100%;margin-bottom:12px}.story-progress-bar{flex:1;height:3px;background:rgba(255,255,255,0.35);border-radius:2px;overflow:hidden}.story-progress-fill{height:100%;width:0%;background:#fff;transition:width 0.1s linear}.story-progress-bar.completed .story-progress-fill{width:100%}.reels-top-bar{display:flex;align-items:center;justify-content:space-between}.reels-top-tabs{display:flex;align-items:center;gap:4px;margin:0 auto;transform:translateX(18px)}.reels-top-tab{background:transparent;border:none;color:rgba(255,255,255,0.55);font-family:var(--sx-font);font-size:0.95rem;font-weight:600;cursor:pointer;padding:4px 8px;transition:color 0.2s,text-shadow 0.2s}.reels-top-tab.active{color:#fff;text-shadow:0 1px 4px rgba(0,0,0,0.8)}.reels-tab-divider{color:rgba(255,255,255,0.3);font-size:0.9rem;font-weight:300}.reels-top-profile{position:relative;width:36px;height:36px;border-radius:50%;cursor:pointer;transition:transform 0.2s ease;flex-shrink:0}.reels-top-profile:hover{transform:scale(1.08)}.reels-top-avatar{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #fff}.reels-add-badge{position:absolute;bottom:-2px;right:-2px;width:15px;height:15px;background:#ff3b30;color:#fff;border-radius:50%;font-size:0.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;border:1.5px solid #000}.reels-action-sidebar{position:absolute;right:12px;bottom:125px;display:flex;flex-direction:column;align-items:center;gap:16px;z-index:30;pointer-events:auto !important}.reels-action-btn{background:transparent;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;color:#fff;padding:0;transition:transform 0.2s ease}.reels-action-btn:hover{transform:scale(1.1)}.reels-action-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin-bottom:4px;transition:color 0.2s,transform 0.2s;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.85))}.reels-action-btn:hover .reels-action-icon{transform:scale(1.15)}.reels-action-label{font-size:0.72rem;font-weight:600;color:rgba(255,255,255,0.9);text-shadow:0 1px 3px rgba(0,0,0,0.8)}.reels-action-btn.liked .reels-action-icon{color:#ff3b30}.reels-bottom-details{position:absolute;bottom:95px;left:12px;right:76px;z-index:30;padding:10px 14px;background:rgba(0,0,0,0.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.05);border-radius:16px;display:flex;flex-direction:column;gap:6px;pointer-events:none;box-shadow:0 4px 16px rgba(0,0,0,0.15)}.reels-bottom-details *{pointer-events:auto}.reel-creator-row{display:flex;align-items:center;gap:10px}.reel-creator-avatar-wrap{position:relative;width:38px;height:38px;flex-shrink:0}.reel-creator-avatar{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,0.8)}.reel-follow-badge{position:absolute;bottom:-2px;right:-2px;width:15px;height:15px;background:#ff3b30;color:#fff;border-radius:50%;font-size:0.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;border:1.5px solid #000;cursor:pointer;transition:transform 0.15s ease}.reel-follow-badge:hover{transform:scale(1.15)}.reel-creator-name{font-size:0.9rem;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,0.8)}.reel-time-ago{font-size:0.7rem;color:rgba(255,255,255,0.7);margin-left:6px}.reel-caption-container{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.reel-caption{font-size:0.85rem;color:#fff;line-height:1.4;text-shadow:0 1px 3px rgba(0,0,0,0.8);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.reel-caption-container.expanded{align-items:flex-start}.reel-caption-container.expanded .reel-caption{white-space:normal;text-overflow:clip;max-height:120px;overflow-y:auto}.reel-caption-toggle-btn{background:transparent;border:none;color:rgba(255,255,255,0.8);cursor:pointer;font-size:0.8rem;padding:4px;display:flex;align-items:center;justify-content:center;transition:transform 0.2s ease;flex-shrink:0}.reel-caption-container.expanded .reel-caption-toggle-btn i{transform:rotate(180deg)}.reels-bottom-nav{position:absolute !important;bottom:20px !important;left:50% !important;transform:translateX(-50%) !important;width:85% !important;max-width:320px !important;background:rgba(220,220,220,0.85) !important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:50px !important;padding:8px 16px !important;box-shadow:0 4px 20px rgba(0,0,0,0.3) !important;z-index:40 !important;border:none !important;display:flex !important;justify-content:space-around !important}.reels-bottom-nav .sx-nav-item img,.reels-bottom-nav .sx-nav-center img{filter:brightness(0) !important;opacity:0.85 !important}.reels-bottom-nav .sx-nav-item.active img,.reels-bottom-nav .sx-nav-center.active img{opacity:1 !important;transform:scale(1.08) !important}.reels-bottom-details .story-product-tag{background:rgba(255,255,255,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.2);border-radius:12px;padding:8px 12px;display:flex;align-items:center;gap:8px;margin-top:4px}.reels-bottom-details .story-product-img{width:40px;height:40px;border-radius:8px;object-fit:cover}.reels-bottom-details .story-product-name{font-size:0.78rem;font-weight:600;color:#fff}.reels-bottom-details .story-product-price{font-size:0.78rem;color:var(--sx-mint);font-weight:700}.reels-bottom-details .story-product-btn{margin-left:auto;background:var(--sx-mint);color:#fff;padding:4px 10px;border-radius:6px;font-size:0.72rem;font-weight:600;text-decoration:none;display:flex;align-items:center;gap:4px}.reel-comments-sheet{position:fixed;bottom:0;left:0;right:0;z-index:999999;background:var(--sx-bg-primary,#0F2F24);border-radius:20px 20px 0 0;max-height:65vh;display:flex;flex-direction:column;transform:translateY(100%);transition:transform 0.3s ease}.reel-comments-sheet.open{transform:translateY(0)}.reel-comments-handle{width:40px;height:4px;border-radius:4px;background:rgba(255,255,255,0.25);margin:10px auto 6px}.reel-comments-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-bottom:1px solid var(--sx-divider)}.reel-comments-title{font-size:1rem;font-weight:600;color:var(--sx-text-primary)}.reel-comments-close{background:transparent;border:none;color:var(--sx-text-muted);font-size:1.5rem;cursor:pointer}.reel-comments-list{flex:1;overflow-y:auto;padding:16px 20px}.reel-comment-item{display:flex;gap:12px;margin-bottom:16px}.reel-comment-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover}.reel-comment-body{flex:1}.reel-comment-username{font-size:0.8rem;font-weight:600;color:var(--sx-text-primary)}.reel-comment-text{font-size:0.85rem;color:var(--sx-text-secondary);line-height:1.4;margin-top:2px}.reel-comment-time{font-size:0.68rem;color:var(--sx-text-muted);margin-top:4px}.reel-comments-input-wrap{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--sx-bg-primary);border-top:1px solid var(--sx-divider)}.reel-comments-input{flex:1;background:var(--sx-bg-input);border:1px solid transparent;border-radius:20px;padding:8px 16px;color:var(--sx-text-primary);font-family:inherit;font-size:0.88rem;outline:none}.reel-comments-input:focus{border-color:var(--sx-mint)}.reel-comments-send{width:36px;height:36px;border-radius:50%;border:none;background:var(--sx-emerald);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}.reel-comments-backdrop{position:fixed;inset:0;z-index:999998;background:rgba(0,0,0,0.5);display:none}.reel-comments-backdrop.visible{display:block}@media (min-width:769px){.reel-comments-sheet{max-width:420px;left:50%;transform:translateX(-50%) translateY(100%)}.reel-comments-sheet.open{transform:translateX(-50%) translateY(0)}}.reels-scroll-container{width:100%;height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;position:relative;z-index:5}.reels-scroll-container::-webkit-scrollbar{display:none}.reels-player-container{scroll-snap-align:start;scroll-snap-stop:always;width:100%;height:100%;position:relative;overflow:hidden;display:flex;flex-direction:column;background:#000}@media (min-width:769px){.reels-scroll-container{width:420px;height:95vh;max-height:840px;border-radius:16px;border:1px solid rgba(255,255,255,0.15);box-shadow:0 16px 48px rgba(0,0,0,0.7);margin:0 auto;position:relative;z-index:10}.reels-player-container{border-radius:0;border:none}}.card-add-reel-pill{margin-top:6px;background:var(--sx-mint,#52b788);color:#fff;padding:3px 10px;border-radius:12px;font-size:0.68rem;font-weight:700;display:flex;align-items:center;gap:4px;box-shadow:0 2px 6px rgba(0,0,0,0.3);cursor:pointer;transition:transform 0.15s ease,background 0.15s ease}.card-add-reel-pill:hover{transform:scale(1.06);background:var(--sx-emerald,#2d6a4f)}


/* ===== REEL BUFFERING / LOADING INDICATOR (Small, Thin, Circular, Transparent) ===== */
.reel-loading-indicator {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    border: 2.5px solid rgba(255, 255, 255, 0.22) !important;
    border-top-color: #ffffff !important;
    border-right-color: rgba(82, 183, 136, 0.85) !important;
    background: transparent !important;
    animation: reelSpin 0.7s linear infinite !important;
    z-index: 22 !important;
    pointer-events: none !important;
    display: none;
}

.reel-loading-indicator.visible {
    display: block !important;
}

@keyframes reelSpin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* ===== PHOTO REEL ASPECT RATIO & CONTAINMENT ===== */
.reel-image,
.reels-media-viewport img {
    object-fit: contain !important;
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    position: relative !important;
    z-index: 2 !important;
    margin: auto !important;
    display: block;
}

/* ===== STORY CARD CLICK RELIABILITY ===== */
.story-card * {
    pointer-events: none;
}