.loading-screen{align-items:center;background:#000;bottom:0;display:flex;flex-direction:column;height:100vh;justify-content:center;left:0;position:fixed;right:0;top:0;width:100%;z-index:9999}.loading-screen.hidden{opacity:0;transition:opacity .5s ease,visibility .5s ease;visibility:hidden}.loading-spinner{animation:spin 1s ease-in-out infinite;border:3px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#4ecdc4;height:50px;margin-bottom:20px;width:50px}@keyframes spin{to{transform:rotate(1turn)}}.loading-screen p{animation:pulse 2s ease-in-out infinite;color:#fff;font-size:16px;font-weight:500;opacity:.8}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}*{box-sizing:border-box;margin:0;padding:0}body,html{background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;height:100vh;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100vw;-webkit-tap-highlight-color:transparent}.desktop-frame{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;padding:0 20px}.app-container{background:#000;border-radius:0;box-shadow:0 0 50px rgba(0,0,0,.5);height:100vh;max-height:844px;max-width:390px;overflow:hidden;position:relative;width:100%}.header{justify-content:space-between;left:0;padding:10px 15px;position:fixed;right:0;top:0;z-index:100}.header,.header-left{align-items:center;display:flex}.menu-btn{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;height:30px;justify-content:space-around;padding:4px;width:30px}.menu-btn span{background:#fff;border-radius:1px;height:2px;transition:all .3s ease;width:100%}.menu-btn.active span:first-child{transform:rotate(45deg) translate(6px,6px)}.menu-btn.active span:nth-child(2){opacity:0}.menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.logo{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700;margin-left:15px;-webkit-text-fill-color:transparent}.filter-indicator{align-items:center;animation:filterSlideIn .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(255,255,255,.15);border-radius:20px;display:flex;gap:8px;margin-left:auto;padding:6px 12px}.filter-text{color:#fff;font-size:12px;font-weight:600}.filter-remove{align-items:center;background:rgba(255,255,255,.2);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;height:20px;justify-content:center;transition:all .2s ease;width:20px}.filter-remove:hover{background:rgba(255,255,255,.3);transform:scale(1.1)}.filter-remove i{height:12px;stroke-width:2.5;width:12px}@keyframes filterSlideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.side-menu{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:rgba(20,20,20,.95);height:100vh;left:-280px;padding:60px 0 0;position:fixed;top:0;transition:left .3s ease;width:280px;z-index:200}.side-menu.open{left:0}.menu-header{border-bottom:1px solid hsla(0,0%,100%,.1);padding:20px;text-align:center}.menu-avatar{border:3px solid #fff;border-radius:50%;height:60px;margin-bottom:10px;width:60px}.menu-items{list-style:none;padding:20px 0}.menu-items li{margin:0}.menu-items a{align-items:center;color:#fff;display:flex;padding:15px 20px;text-decoration:none;transition:background .2s ease}.menu-items a:hover{background:rgba(255,255,255,.1)}.menu-items span{font-size:20px;margin-right:15px}.menu-items i{height:20px;margin-right:15px;stroke-width:2;width:20px}.menu-overlay{background:rgba(0,0,0,.5);bottom:0;left:0;opacity:0;position:fixed;right:0;top:0;transition:all .3s ease;visibility:hidden;z-index:150}.menu-overlay.active{opacity:1;visibility:visible}.video-container{height:100vh;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-ms-overflow-style:none;position:relative}.video-container::-webkit-scrollbar{display:none}.video-item{align-items:center;background:#000;display:flex;height:100vh;justify-content:center;position:relative;scroll-snap-align:start;width:100%}.video-player{cursor:pointer;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.video-overlay{bottom:0;display:flex;flex-direction:column;justify-content:space-between;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:10}.video-overlay>*{pointer-events:auto}.video-controls{bottom:90px;flex-direction:column;gap:15px;position:absolute;right:15px}.control-btn,.video-controls{align-items:center;display:flex}.control-btn{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(255,255,255,.2);border:none;border-radius:50%;color:#fff;cursor:pointer;height:48px;justify-content:center;transition:all .2s ease;width:48px}.control-btn i{height:20px;stroke-width:2;width:20px}.control-btn.liked i.filled{fill:#ff3b5c;stroke:#ff3b5c}.control-btn:hover{background:rgba(255,255,255,.3);transform:scale(1.1)}.control-btn.liked{background:rgba(255,59,92,.8)}.user-avatar{border:2px solid #fff;border-radius:50%;cursor:pointer;height:50px;transition:transform .2s ease;width:50px}.user-avatar:hover{transform:scale(1.1)}.video-info{bottom:90px;left:15px;padding:20px 0 0;position:absolute;right:80px}.video-description{color:#fff;font-size:14px;line-height:1.4;margin-bottom:8px}.video-user{color:#fff;font-size:16px;font-weight:600;margin-bottom:5px}.video-hashtags{color:#4ecdc4;font-size:13px}.clickable-hashtag,.clickable-user{cursor:pointer;transition:color .2s ease}.clickable-hashtag:hover{color:#4ecdc4;text-decoration:underline}.clickable-user:hover{color:#ff6b6b;text-decoration:underline}.comment-count,.like-count,.share-count{color:#fff;font-size:12px;font-weight:600;margin-bottom:5px;margin-top:-10px;text-align:center}.bottom-nav{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:rgba(0,0,0,.9);border-top:1px solid hsla(0,0%,100%,.1);bottom:0;display:flex;justify-content:space-around;left:0;padding:8px 0 15px;position:fixed;right:0;z-index:50}.nav-btn{align-items:center;background:none;border:none;color:rgba(255,255,255,.6);cursor:pointer;display:flex;justify-content:center;min-width:50px;padding:8px;transition:color .2s ease}.nav-btn.active{color:#fff}.nav-icon{height:24px;stroke-width:2;width:24px}.play-pause-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(255,255,255,.2);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;height:80px;justify-content:center;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .3s ease;width:80px}.play-pause-btn i{height:32px;stroke-width:2;width:32px}.video-item.paused .play-pause-btn{opacity:1}.volume-indicator{animation:volumeIndicatorFadeIn .3s ease-out,volumeIndicatorFadeOut .3s ease-in 1.2s forwards;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:rgba(0,0,0,.8);border-radius:20px;color:#fff;flex-direction:column;gap:10px;left:50%;padding:20px 30px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:1000}.volume-icon,.volume-indicator{align-items:center;display:flex}.volume-icon{justify-content:center}.volume-icon i{height:40px;stroke-width:2;width:40px}.volume-text{font-size:14px;font-weight:600;text-align:center}@keyframes volumeIndicatorFadeIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes volumeIndicatorFadeOut{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.8)}}.no-results{align-items:center;background:#000;display:flex;height:100vh;justify-content:center;width:100%}.no-results-content{max-width:300px;padding:40px 20px;text-align:center}.no-results-icon{height:60px;margin:0 auto 20px;opacity:.5;stroke-width:1.5;width:60px}.no-results h2{color:#fff;font-size:24px;margin-bottom:15px}.no-results p{color:rgba(255,255,255,.7);font-size:16px;line-height:1.4;margin-bottom:30px}.back-btn{align-items:center;background:linear-gradient(45deg,#ff6b6b,#4ecdc4);border:none;border-radius:25px;color:#fff;cursor:pointer;display:inline-flex;font-size:14px;font-weight:600;gap:8px;padding:12px 24px;text-decoration:none;transition:all .2s ease}.back-btn:hover{box-shadow:0 5px 15px rgba(0,0,0,.3);transform:translateY(-2px)}.back-btn i{height:16px;stroke-width:2;width:16px}.error-screen{align-items:center;background:#000;display:flex;height:100vh;justify-content:center;width:100%}.error-content{max-width:320px;padding:40px 20px;text-align:center}.error-icon{height:60px;margin:0 auto 20px;opacity:.5;stroke-width:1.5;width:60px}.error-screen h2{color:#fff;font-size:24px;margin-bottom:15px}.error-screen p{color:rgba(255,255,255,.7);font-size:16px;line-height:1.4;margin-bottom:30px}.error-actions{display:flex;flex-direction:column;gap:12px}.local-btn,.retry-btn{align-items:center;border:none;border-radius:25px;color:#fff;cursor:pointer;display:inline-flex;font-size:14px;font-weight:600;gap:8px;justify-content:center;padding:12px 24px;text-decoration:none;transition:all .2s ease}.retry-btn{background:linear-gradient(45deg,#ff6b6b,#4ecdc4)}.local-btn{background:rgba(255,255,255,.1);border:1px solid hsla(0,0%,100%,.2)}.local-btn:hover,.retry-btn:hover{box-shadow:0 5px 15px rgba(0,0,0,.3);transform:translateY(-2px)}.local-btn:hover{background:rgba(255,255,255,.15)}.local-btn i,.retry-btn i{height:16px;stroke-width:2;width:16px}@media (min-width:768px){.desktop-frame{background:linear-gradient(135deg,#667eea,#764ba2);padding:0 20px}.app-container{border:3px solid hsla(0,0%,100%,.1);border-radius:25px;height:100vh;max-height:100vh;position:relative}.header{border-radius:25px 25px 0 0;top:0}.bottom-nav,.header{left:0;position:absolute;right:0;width:auto}.bottom-nav{border-radius:0 0 25px 25px;bottom:0}.side-menu{border-radius:0 0 0 25px;height:100%;max-width:280px;position:absolute}.menu-overlay{border-radius:25px;position:absolute}.video-container{border-radius:25px;height:100vh}.video-item{height:100vh}}@media (max-width:767px){.desktop-frame{background:#000;padding:0}.app-container{border-radius:0;max-height:100%;max-width:100%}.bottom-nav,.header{border-radius:0;position:fixed}}.video-player{will-change:transform}.video-controls,.video-info{will-change:opacity}.video-container{overscroll-behavior:none;scroll-behavior:smooth}