@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;height:100vh;overflow:hidden;background:#000;color:#fff;-webkit-font-smoothing:antialiased}.app{height:100vh;display:flex;flex-direction:column;background:#000;position:relative;max-width:480px;margin:0 auto;overflow:hidden}.top-bar{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:12px 16px;gap:20px;background:linear-gradient(to bottom,rgba(0,0,0,.6) 0%,transparent 100%);pointer-events:none}.top-bar>*{pointer-events:auto}.top-bar .tab-btn{background:none;border:none;color:#fff9;font-size:17px;font-weight:600;cursor:pointer;padding:4px 0;position:relative;font-family:inherit;transition:color .2s}.top-bar .tab-btn.active{color:#fff}.top-bar .tab-btn.active:after{content:"";position:absolute;bottom:-2px;left:25%;right:25%;height:3px;background:#fff;border-radius:2px}.video-feed{flex:1;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}.video-feed::-webkit-scrollbar{display:none}.video-slide{scroll-snap-align:start;height:100vh;position:relative;overflow:hidden}.video-container{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center}.video-bg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.video-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 30%,transparent 70%,rgba(0,0,0,.3) 100%);pointer-events:none}.play-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);opacity:0;transition:all .3s ease;pointer-events:none;z-index:5}.play-indicator.show{transform:translate(-50%,-50%) scale(1);opacity:.8}.play-indicator svg{width:64px;height:64px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}.video-info{position:absolute;bottom:80px;left:12px;right:80px;z-index:10}.video-info .username{font-weight:700;font-size:16px;margin-bottom:6px}.video-info .description{font-size:14px;line-height:1.4;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-info .music-tag{display:inline-flex;align-items:center;gap:6px;font-size:13px}.music-tag svg{width:14px;height:14px;flex-shrink:0}.music-marquee{overflow:hidden;max-width:180px}.music-marquee span{display:inline-block;white-space:nowrap;animation:marquee 8s linear infinite}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.music-disc{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#333,#111);border:2px solid rgba(255,255,255,.2);position:absolute;bottom:80px;right:12px;z-index:10;display:flex;align-items:center;justify-content:center;animation:spin 4s linear infinite}.music-disc.paused{animation-play-state:paused}.music-disc:after{content:"";width:12px;height:12px;border-radius:50%;background:#333;border:2px solid rgba(255,255,255,.3)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.action-buttons{position:absolute;right:8px;bottom:100px;z-index:10;display:flex;flex-direction:column;align-items:center;gap:16px}.action-btn{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:#fff;cursor:pointer;font-family:inherit;transition:transform .15s}.action-btn:active{transform:scale(.9)}.action-btn .icon-circle{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}.action-btn .icon-circle img{width:44px;height:44px;border-radius:50%;border:2px solid #fff}.action-btn svg{width:28px;height:28px}.action-btn .count{font-size:12px;font-weight:600}.action-btn.liked svg{fill:#fe2c55;color:#fe2c55}.action-btn.bookmarked svg{fill:#ffc107;color:#ffc107}.like-burst{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.like-burst.animate{animation:burst .5s ease-out forwards}@keyframes burst{0%{transform:scale(.5);opacity:1}50%{transform:scale(1.5);opacity:.8}to{transform:scale(2);opacity:0}}.double-tap-heart{position:absolute;z-index:15;pointer-events:none;animation:doubleTapHeart .8s ease-out forwards}.double-tap-heart svg{width:80px;height:80px;fill:#fe2c55;filter:drop-shadow(0 2px 12px rgba(254,44,85,.6))}@keyframes doubleTapHeart{0%{transform:scale(0) rotate(-15deg);opacity:1}30%{transform:scale(1.2) rotate(5deg);opacity:1}60%{transform:scale(1) rotate(0);opacity:1}to{transform:scale(1) rotate(0) translateY(-60px);opacity:0}}.bottom-nav{position:absolute;bottom:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-around;padding:8px 0 20px;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.7) 60%,transparent 100%)}.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:#fff9;cursor:pointer;font-family:inherit;font-size:10px;padding:4px 12px;transition:color .2s}.nav-item.active{color:#fff}.nav-item svg{width:24px;height:24px}.create-btn{width:44px;height:28px;border-radius:8px;background:linear-gradient(to right,#25f4ee,#fe2c55);border:none;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center}.create-btn:after{content:"";width:36px;height:22px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center}.create-btn-inner{position:absolute;z-index:1;font-size:22px;font-weight:300;color:#000;line-height:1}.comments-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:50;display:flex;align-items:flex-end;justify-content:center}.comments-panel{width:100%;max-width:480px;height:65vh;background:#1e1e1e;border-radius:16px 16px 0 0;display:flex;flex-direction:column;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.comments-header{display:flex;align-items:center;justify-content:center;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.1);position:relative}.comments-header h3{font-size:15px;font-weight:600}.comments-close{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:none;border:none;color:#fff9;cursor:pointer;font-size:20px;padding:4px}.comments-list{flex:1;overflow-y:auto;padding:12px 16px}.comment-item{display:flex;gap:10px;margin-bottom:16px}.comment-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.comment-body{flex:1}.comment-user{font-size:13px;font-weight:600;color:#ffffff80;margin-bottom:2px}.comment-text{font-size:14px;line-height:1.4;margin-bottom:4px}.comment-meta{display:flex;gap:16px;font-size:12px;color:#fff6}.comment-like{background:none;border:none;color:#fff6;cursor:pointer;display:flex;align-items:center;gap:4px;font-size:12px;font-family:inherit;padding:0}.comment-like svg{width:16px;height:16px}.comment-input-area{display:flex;align-items:center;gap:10px;padding:12px 16px 24px;border-top:1px solid rgba(255,255,255,.1)}.comment-input{flex:1;background:#ffffff1a;border:none;border-radius:20px;padding:10px 16px;color:#fff;font-size:14px;font-family:inherit;outline:none}.comment-input::placeholder{color:#fff6}.comment-send{background:#fe2c55;border:none;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .2s}.comment-send:disabled{opacity:.4;cursor:default}.comment-send svg{width:18px;height:18px;fill:#fff}.share-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:50;display:flex;align-items:flex-end;justify-content:center}.share-panel{width:100%;max-width:480px;background:#1e1e1e;border-radius:16px 16px 0 0;padding:20px 16px 32px;animation:slideUp .3s ease-out}.share-panel h3{font-size:15px;font-weight:600;text-align:center;margin-bottom:16px}.share-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.share-item{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:none;color:#fff;cursor:pointer;font-family:inherit;font-size:11px}.share-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px}.share-cancel{display:block;width:100%;margin-top:12px;padding:14px;background:#ffffff1a;border:none;border-radius:8px;color:#fff;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit}.video-progress{position:absolute;bottom:60px;left:0;right:0;height:3px;background:#fff3;z-index:10}.video-progress-bar{height:100%;background:#fff;transition:width .1s linear}.profile-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:60;overflow-y:auto;animation:fadeIn .2s ease;max-width:480px;margin:0 auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.profile-header{padding:16px;display:flex;align-items:center;gap:12px}.profile-back{background:none;border:none;color:#fff;cursor:pointer;padding:4px}.profile-back svg{width:24px;height:24px}.profile-header-name{font-weight:700;font-size:18px}.profile-info{text-align:center;padding:0 16px 16px}.profile-avatar-large{width:88px;height:88px;border-radius:50%;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:800}.profile-name{font-size:18px;font-weight:700;margin-bottom:4px}.profile-handle{font-size:14px;color:#ffffff80;margin-bottom:16px}.profile-stats{display:flex;justify-content:center;gap:24px;margin-bottom:16px}.profile-stat{text-align:center}.profile-stat-num{font-size:18px;font-weight:700}.profile-stat-label{font-size:12px;color:#ffffff80}.profile-bio{font-size:14px;color:#fffc;margin-bottom:16px;line-height:1.4}.profile-actions{display:flex;gap:8px;justify-content:center;margin-bottom:20px}.profile-follow-btn{padding:10px 48px;background:#fe2c55;border:none;border-radius:4px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;font-family:inherit}.profile-message-btn{padding:10px 16px;background:#ffffff1a;border:none;border-radius:4px;color:#fff;font-size:16px;cursor:pointer}.profile-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.1)}.profile-tab{flex:1;padding:12px;background:none;border:none;color:#ffffff80;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;border-bottom:2px solid transparent}.profile-tab.active{color:#fff;border-bottom-color:#fff}.profile-videos{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:2px}.profile-video-thumb{aspect-ratio:9/12;position:relative;overflow:hidden;cursor:pointer}.profile-video-thumb .views{position:absolute;bottom:6px;left:6px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:4px}.profile-video-thumb .views svg{width:14px;height:14px}