*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #000;--bg2: #0f0f0f;--bg3: #1a1a1a;--border: #2f2f2f;--text: #e7e9ea;--muted: #71767b;--white: #fff;--accent: #e7e9ea;--hover: rgba(255,255,255,.03);--red: #f4212e;--green: #00ba7c}body{font-family:-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes postIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes likePop{0%{transform:scale(1)}50%{transform:scale(1.35)}to{transform:scale(1)}}.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px}.auth-card{background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:40px 36px;width:100%;max-width:380px;animation:slideUp .3s ease}.auth-logo{text-align:center;margin-bottom:28px}.auth-logo .z-mark{font-size:40px;font-weight:900;color:var(--white);letter-spacing:-2px;font-family:-apple-system,sans-serif}.auth-logo p{color:var(--muted);font-size:13px;margin-top:6px}.auth-tabs{display:flex;margin-bottom:20px;border-bottom:1px solid var(--border)}.auth-tab{flex:1;padding:10px;border:none;background:none;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s}.auth-tab.active{color:var(--white);border-bottom-color:var(--white)}.auth-form{display:flex;flex-direction:column;gap:12px}.auth-form input{padding:12px 14px;border:1px solid var(--border);border-radius:8px;font-size:15px;outline:none;background:var(--bg2);color:var(--text);transition:border-color .15s}.auth-form input:focus{border-color:var(--white)}.auth-form input::placeholder{color:var(--muted)}.auth-error{color:var(--red);font-size:13px;text-align:center;padding:8px;background:#f4212e14;border-radius:6px}.app-layout{display:flex;min-height:100vh;max-width:1265px;margin:0 auto}.sidebar{width:275px;flex-shrink:0;padding:0 12px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}.sidebar-logo{padding:12px 12px 4px;margin-bottom:4px}.sidebar-logo .z-mark{font-size:28px;font-weight:900;color:var(--white);letter-spacing:-1px;cursor:pointer;display:inline-block;padding:8px;border-radius:50%;transition:background .15s}.sidebar-logo .z-mark:hover{background:var(--hover)}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:2px;padding-bottom:8px}.nav-item{display:flex;align-items:center;gap:20px;padding:12px;border-radius:100px;cursor:pointer;font-size:20px;font-weight:400;color:var(--text);background:none;border:none;text-align:left;width:100%;transition:background .15s;position:relative;text-decoration:none}.nav-item:hover{background:var(--hover)}.nav-item.active{font-weight:700}.nav-icon{width:26px;height:26px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.nav-label{font-size:20px}.nav-badge{position:absolute;top:6px;left:28px;background:var(--white);color:var(--bg);font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px}.post-btn{background:var(--white);color:var(--bg);border:none;border-radius:100px;padding:16px;font-size:17px;font-weight:700;cursor:pointer;width:100%;margin:16px 0 8px;transition:opacity .15s}.post-btn:hover{opacity:.85}.sidebar-user-card{display:flex;align-items:center;gap:12px;padding:12px;border-radius:100px;cursor:pointer;transition:background .15s;margin-bottom:16px;margin-top:auto}.sidebar-user-card:hover{background:var(--hover)}.sidebar-user-avatar{width:40px;height:40px;border-radius:50%;background:var(--bg3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:var(--white);flex-shrink:0;overflow:hidden}.sidebar-user-avatar img{width:100%;height:100%;object-fit:cover}.sidebar-user-info{flex:1;min-width:0}.sidebar-user-name{font-size:15px;font-weight:700;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-handle{font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-more{color:var(--muted);font-size:18px}.main-col{flex:1;border-left:1px solid var(--border);border-right:1px solid var(--border);min-height:100vh;max-width:600px}.feed-header{position:sticky;top:0;background:#000000d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:14px 16px;border-bottom:1px solid var(--border);z-index:10;font-size:20px;font-weight:700;color:var(--white)}.compose-area{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border)}.compose-avatar{width:40px;height:40px;border-radius:50%;background:var(--bg3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:var(--white);flex-shrink:0;overflow:hidden}.compose-avatar img{width:100%;height:100%;object-fit:cover}.compose-right{flex:1}.compose-right textarea{width:100%;background:none;border:none;outline:none;font-size:20px;color:var(--text);resize:none;font-family:inherit;line-height:1.5;min-height:56px;padding:8px 0}.compose-right textarea::placeholder{color:var(--muted)}.compose-footer{display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--border);margin-top:8px}.char-count{font-size:14px;color:var(--muted)}.char-count.warn{color:#f5a623}.char-count.over{color:var(--red)}.btn-post{background:var(--white);color:var(--bg);border:none;border-radius:100px;padding:8px 18px;font-size:15px;font-weight:700;cursor:pointer;transition:opacity .15s}.btn-post:hover{opacity:.85}.btn-post:disabled{opacity:.4;cursor:default}.post-card{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .15s;animation:postIn .2s ease}.post-card:hover{background:var(--hover)}.post-avatar{width:40px;height:40px;border-radius:50%;background:var(--bg3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:var(--white);flex-shrink:0;overflow:hidden}.post-avatar img{width:100%;height:100%;object-fit:cover}.post-body{flex:1;min-width:0}.post-header{display:flex;align-items:center;gap:6px;margin-bottom:2px;flex-wrap:wrap}.post-name{font-size:15px;font-weight:700;color:var(--white)}.post-name:hover{text-decoration:underline;cursor:pointer}.post-handle,.post-time{font-size:14px;color:var(--muted)}.post-time:before{content:"·";margin-right:6px}.post-content{font-size:15px;line-height:1.55;color:var(--text);margin-bottom:12px;word-break:break-word;white-space:pre-wrap}.post-content .mention{color:#1d9bf0;cursor:pointer}.post-content .mention:hover{text-decoration:underline}.post-actions{display:flex;gap:4px;margin-top:4px}.action{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--muted);font-size:13px;cursor:pointer;padding:6px 8px;border-radius:100px;transition:all .15s;flex:1;max-width:80px}.action svg{width:18px;height:18px}.action:hover{color:var(--white);background:#ffffff0f}.action.liked{color:var(--red)}.action.liked:hover{background:#f4212e1a;color:var(--red)}.action.liked svg{animation:likePop .3s ease}.action.reposted{color:var(--green)}.action.reposted:hover{background:#00ba7c1a;color:var(--green)}.action.bookmarked{color:var(--white)}.action.delete-btn:hover{color:var(--red);background:#f4212e1a}.reply-area{padding:12px 16px;border-top:1px solid var(--border);display:flex;gap:12px}.reply-area textarea{flex:1;background:none;border:none;outline:none;font-size:15px;color:var(--text);resize:none;font-family:inherit;line-height:1.5;padding:6px 0}.reply-area textarea::placeholder{color:var(--muted)}.notif-item{display:flex;gap:14px;padding:14px 16px;border-bottom:1px solid var(--border);transition:background .15s;animation:postIn .2s ease}.notif-item:hover{background:var(--hover)}.notif-item.unread{background:#ffffff05}.notif-icon{width:40px;display:flex;align-items:flex-start;justify-content:center;padding-top:4px;font-size:20px;flex-shrink:0}.notif-body{flex:1}.notif-avatar{width:32px;height:32px;border-radius:50%;background:var(--bg3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:var(--white);margin-bottom:6px;overflow:hidden}.notif-avatar img{width:100%;height:100%;object-fit:cover}.notif-text{font-size:15px;color:var(--text);line-height:1.5}.notif-text strong{font-weight:700}.notif-quote{font-size:14px;color:var(--muted);margin-top:4px}.notif-time{font-size:13px;color:var(--muted);margin-top:4px}.profile-banner{height:130px;background:var(--bg3);border-bottom:1px solid var(--border)}.profile-info-section{padding:12px 16px 16px;border-bottom:1px solid var(--border)}.profile-avatar-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.profile-avatar-big{width:72px;height:72px;border-radius:50%;background:var(--bg3);border:4px solid var(--bg);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;color:var(--white);margin-top:-36px;overflow:hidden;flex-shrink:0}.profile-avatar-big img{width:100%;height:100%;object-fit:cover}.profile-name{font-size:20px;font-weight:800;color:var(--white)}.profile-handle{font-size:15px;color:var(--muted);margin-top:2px}.profile-bio{font-size:15px;color:var(--text);margin-top:10px;line-height:1.55}.profile-stats{display:flex;gap:20px;margin-top:12px}.stat-item{font-size:14px;color:var(--muted);cursor:pointer}.stat-item strong{color:var(--white);font-weight:700}.stat-item:hover{text-decoration:underline}.edit-profile-form{padding:16px;display:flex;flex-direction:column;gap:16px}.edit-field{display:flex;flex-direction:column;gap:6px}.edit-field label{font-size:13px;color:var(--muted)}.edit-field input,.edit-field textarea{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:12px;font-size:15px;color:var(--text);outline:none;font-family:inherit;transition:border-color .15s}.edit-field input:focus,.edit-field textarea:focus{border-color:#1d9bf0}.edit-field textarea{resize:none;min-height:80px}.pfp-upload-row{display:flex;align-items:center;gap:14px}.pfp-preview{width:64px;height:64px;border-radius:50%;background:var(--bg3);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;color:var(--white);flex-shrink:0}.pfp-preview img{width:100%;height:100%;object-fit:cover}.btn-outline-white{background:none;border:1px solid var(--border);color:var(--white);border-radius:100px;padding:8px 18px;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s}.btn-outline-white:hover{background:var(--hover)}.feed-loading{text-align:center;padding:48px;color:var(--muted);font-size:15px}.feed-empty{text-align:center;padding:60px 20px;color:var(--muted)}.feed-empty .big{font-size:32px;font-weight:800;color:var(--white);margin-bottom:8px}.feed-empty p{font-size:15px}@media (max-width: 1000px){.sidebar{width:88px}.nav-label,.sidebar-user-name,.sidebar-user-handle,.sidebar-user-more{display:none}.post-btn{padding:16px;width:50px;height:50px;border-radius:50%;font-size:22px}.sidebar-logo .z-mark{font-size:22px}}@media (max-width: 640px){.app-layout{flex-direction:column}.sidebar{width:100%;height:auto;position:fixed;bottom:0;top:auto;flex-direction:row;padding:8px 16px;background:var(--bg);border-top:1px solid var(--border);z-index:100}.sidebar-logo{display:none}.sidebar-nav{flex-direction:row;gap:0;padding:0}.nav-item{padding:8px;flex:1;justify-content:center;border-radius:8px}.post-btn,.sidebar-user-card{display:none}.main-col{border:none;padding-bottom:80px}}