:root{color-scheme:dark;--bg:#090b12;--panel:#121622;--panel2:#191f2d;--text:#f5f6fb;--muted:#9ba4b7;--line:#252c3b;--pink:#ff477e;--purple:#8b5cf6;--cyan:#47d7e8}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.feed-first{height:100dvh;overflow:hidden}.topbar{height:62px;position:relative;z-index:10;display:flex;align-items:center;gap:12px;padding:0 14px;background:rgba(9,11,18,.96);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;color:var(--text);font-weight:900;letter-spacing:1.3px;text-decoration:none;font-size:16px}.brand-mark{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(140deg,var(--pink),var(--purple));font-size:18px}.feed-tabs{display:flex;gap:3px;margin:auto}.tab{border:0;background:transparent;color:var(--muted);font-size:14px;font-weight:800;padding:10px 14px;border-radius:20px}.tab.active{color:white;background:var(--panel2)}.icon-button,.avatar{border:1px solid var(--line);background:var(--panel);color:white;width:36px;height:36px;border-radius:50%;font-size:21px}.avatar{font-size:13px;font-weight:800;background:linear-gradient(135deg,#343e58,#171c2a)}.feed-main{height:calc(100dvh - 140px);max-width:680px;margin:0 auto}.video-feed{height:100%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#1b2031 0,#0c101a 48%,#080a10 100%);display:flex;align-items:center;justify-content:center}.feed-empty{width:min(88%,390px);text-align:center;display:flex;align-items:center;flex-direction:column;z-index:1}.play-symbol{width:60px;height:60px;border-radius:19px;display:grid;place-items:center;padding-left:4px;background:linear-gradient(140deg,#ff477e,#8057ef);font-size:23px;box-shadow:0 12px 45px #8b5cf644;margin-bottom:20px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:850;color:#c2a7ff}.feed-empty h1{font-size:clamp(25px,6vw,34px);line-height:1.1;margin:12px 0}.feed-empty p{font-size:13px;line-height:1.65;color:#a5aec0;margin:0 0 13px}.primary-button,.outline-button,.social-button{border:0;border-radius:13px;padding:13px 18px;font-weight:800;font-size:14px;cursor:pointer}.primary-button{background:linear-gradient(110deg,var(--pink),#9b5cff);color:white;margin-top:12px}.feed-actions{position:absolute;right:13px;bottom:82px;display:flex;flex-direction:column;gap:17px;z-index:2}.video-action{border:0;background:transparent;color:white;font-size:28px;text-shadow:0 2px 8px #000;display:flex;flex-direction:column;align-items:center;gap:3px}.video-action small{font-size:10px;font-weight:700}.feed-caption{position:absolute;left:17px;right:85px;bottom:20px;display:flex;flex-direction:column;gap:5px;text-shadow:0 2px 8px #000;font-size:12px}.feed-caption strong{font-size:14px}.floating-upload{position:fixed;right:16px;bottom:91px;z-index:8;width:48px;height:48px;border:0;border-radius:16px;background:linear-gradient(135deg,var(--pink),var(--purple));color:white;font-size:30px;box-shadow:0 8px 28px #0008}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:78px;padding:7px max(10px,calc((100vw - 650px)/2)) max(7px,env(safe-area-inset-bottom));z-index:12;display:flex;justify-content:space-around;align-items:center;background:rgba(13,16,25,.98);border-top:1px solid var(--line)}.nav-item{min-width:52px;display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:transparent;color:#818ba0;font-size:10px;font-weight:650}.nav-item span{font-size:22px;line-height:24px}.nav-item.selected{color:white}.nav-create span{width:37px;height:32px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,var(--pink),var(--purple));font-size:24px;color:white}.modal-backdrop{position:fixed;inset:0;z-index:30;background:#000b;display:none;align-items:flex-end;justify-content:center;padding:14px}.modal-backdrop.open{display:flex}.modal{position:relative;width:min(100%,480px);max-height:90vh;overflow:auto;background:#151a27;border:1px solid #30384b;border-radius:24px;padding:26px 22px 24px;box-shadow:0 25px 80px #0009}.modal h2{font-size:25px;margin:9px 0}.modal p{color:var(--muted);line-height:1.6;font-size:14px}.modal-close{position:absolute;right:17px;top:13px;border:0;background:transparent;color:white;font-size:28px}.field-label{display:block;margin:17px 0 7px;font-size:12px;font-weight:750;color:#dce1ed}input,select{width:100%;padding:13px 14px;border-radius:12px;border:1px solid #343d51;background:#0c1019;color:white;font:inherit}.full-width{width:100%;margin-top:18px}.small-note{font-size:11px!important;color:#7f8aa0!important}.social-button{width:100%;margin-top:10px;background:#222a3a;color:white;border:1px solid #374157}.divider{display:flex;align-items:center;gap:12px;color:#7f899e;font-size:11px;margin:18px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}@media(min-width:700px){.feed-main{height:calc(100dvh - 140px)}.video-feed{border-left:1px solid #171c29;border-right:1px solid #171c29}}@media(max-width:420px){.topbar{gap:7px;padding:0 10px}.brand{font-size:14px}.tab{padding:9px 11px;font-size:13px}.feed-empty{width:84%}.feed-empty h1{font-size:27px}}
/* REELS native-style video player */
.video-feed{isolation:isolate}.feed-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#05070b;z-index:0}.video-shade{position:absolute;inset:35% 0 0;z-index:1;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.64))}.feed-empty{position:absolute;z-index:4}.feed-empty.hidden{display:none}.feed-actions,.feed-caption,.sound-toggle,.feed-hint{z-index:5}.sound-toggle{position:absolute;right:16px;top:16px;width:42px;height:42px;border:1px solid #ffffff38;border-radius:50%;background:#090b1280;color:white;font-size:18px;backdrop-filter:blur(8px)}.feed-hint{position:absolute;left:17px;bottom:4px;color:#ffffffa8;font-size:10px;text-shadow:0 1px 4px #000}.outline-button{background:transparent;color:white;border:1px solid #414b61}
