:root{color:#162033;background:#eef2f6;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,Segoe UI,system-ui,sans-serif;font-size:15px;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow:hidden;overflow-x:hidden;font-size:15px;line-height:1.45;-webkit-text-size-adjust:100%}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}label{display:grid;gap:7px;color:#48576d;font-size:14px;font-weight:700}input,textarea{width:100%;border:1px solid #d5deea;border-radius:14px;background:#fff;color:#111827;outline:none;transition:border-color .18s ease,box-shadow .18s ease}input{height:44px;padding:0 13px}textarea{padding:12px 14px;resize:none}input:focus,textarea:focus{border-color:#2563eb;box-shadow:0 0 0 4px #2563eb1f}.page-view{min-height:0;padding:10px 10px 0;overflow-y:auto;align-content:start}.section-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 2px 12px}.section-header h2{margin:0;color:#111827;font-size:20px;letter-spacing:0}.section-header span{color:#64748b;font-size:13px}.icon-button,.send-button,.primary-button,.ghost-button,.text-button,.mini-icon{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;text-decoration:none}.icon-button,.send-button,.mini-icon{width:40px;height:40px;border-radius:50%}.icon-button,.mini-icon{background:#fff;color:#334155;box-shadow:0 8px 20px #0f172a12}.icon-button.small{width:34px;height:34px}.icon-button.flat{background:transparent;box-shadow:none}.icon-button.success{color:#0f766e}.icon-button.danger{color:#e11d48}.send-button,.primary-button{background:#2563eb;color:#fff;font-weight:800}.primary-button{margin-top:10px;min-height:32px;padding:0 16px;border-radius:14px}.primary-button.wide{width:100%}.ghost-button{min-height:40px;padding:0 12px;border-radius:13px;background:#edf2f7;color:#334155;font-weight:800}.text-button{margin-top:14px;padding:0;background:transparent;color:#2563eb;font-weight:800}.text-button.left{justify-content:flex-start;margin-top:0}.text-action{border:0;background:transparent;color:#111827;font-size:15px;font-weight:800;white-space:nowrap}.file-trigger{position:relative;overflow:hidden}.file-trigger input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.error-message,.success-message,.empty-state{border-radius:14px;font-size:14px}.error-message{margin:0 0 10px;padding:10px 12px;background:#fff1f2;color:#be123c}.success-message{margin:0 0 10px;padding:10px 12px;background:#ecfdf5;color:#047857}.empty-state{padding:18px 12px;color:#64748b;text-align:center}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 18% 12%,rgba(37,99,235,.16),transparent 26%),radial-gradient(circle at 82% 6%,rgba(20,184,166,.14),transparent 24%),#eef2f6}.login-card{width:min(390px,100%);padding:28px 22px;border:1px solid rgba(203,213,225,.9);border-radius:22px;background:#ffffffeb;box-shadow:0 24px 70px #0f172a1f}.login-card h1{margin:18px 0 6px;font-size:32px;letter-spacing:0}.login-card p{margin:0;color:#64748b}.brand-mark{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#1f63d6;color:#fff}.auth-form{display:grid;gap:14px;margin-top:24px}.avatar{display:inline-grid;place-items:center;flex:0 0 auto;overflow:hidden;border-radius:5px;color:#fff;font-weight:800}.avatar img{width:100%;height:100%;object-fit:cover}.list-panel{display:grid}.conversation-item{width:100%;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;padding:8px 9px;border:0;border-bottom:1px solid #E4E4E6;background:#fff;color:inherit;text-align:left}.conversation-item.compact-item{height:72px;border-radius:6px}.conversation-item p{margin:4px 0 0;overflow:hidden;color:#64748b;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.avatar-wrap{position:relative;display:inline-flex}.avatar-badge{position:absolute;top:-5px;right:-7px}.conversation-main{min-width:0}.conversation-main p{font-size:14px}.conversation-title{display:flex;justify-content:space-between;gap:10px}.conversation-title strong{display:block;color:#111827;font-size:17px}.conversation-title time{color:#64748b;font-size:12px}.contacts-view{grid-template-rows:none;grid-auto-rows:max-content;align-content:start;gap:0;padding:0 0 12px;background:#f2f3f5}.contact-topbar,.contact-subbar{min-height:64px;display:grid;align-items:center;padding:10px 12px;background:#f2f3f5}.contact-topbar h2,.contact-subbar h2{margin:0;color:#111827;font-size:22px;font-weight:900;text-align:center;letter-spacing:0}.contact-topbar{grid-template-columns:40px 1fr 40px}.contact-subbar{grid-template-columns:40px 1fr auto}.contact-section{gap:0}.contact-section h3{margin-bottom:6px}.contact-section .contact-item.compact-item{border-bottom:1px solid #edf2f7}.contact-section .contact-item.compact-item:first-of-type{border-top-left-radius:8px;border-top-right-radius:8px}.contact-section .contact-item.compact-item:last-of-type{border-bottom:0;border-bottom-right-radius:8px;border-bottom-left-radius:8px}.contact-menu{margin-top:0}.friend-list-section,.request-list-section{align-content:start}.friend-list-section h3,.request-list-section h3{padding:0 14px}.section-block{display:grid;margin-top:10px}.section-block h3{margin:0 4px 2px;color:#64748b;font-size:13px;letter-spacing:0}.contact-item{width:100%;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;padding:8px 9px;border:0;border-radius:18px;background:#fff;color:inherit;text-align:left;box-shadow:0 10px 28px #0f172a12}.contact-item.compact-item{grid-template-columns:auto minmax(0,1fr) auto auto;height:56px;min-height:56px;padding:7px 10px;border-radius:0;box-shadow:none}.contact-item.as-button{cursor:pointer}.contact-item>div{min-width:0}.contact-item strong,.contact-item span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.contact-item strong{color:#111827;font-size:17px}.contact-item span{color:#64748b;font-size:14px}.contacts-view .contact-item.compact-item{grid-template-columns:auto minmax(0,1fr) auto auto;min-height:62px;height:62px;padding:9px 14px;border-radius:0}.contacts-view .contact-menu-item{grid-template-columns:42px minmax(0,1fr) 20px 18px}.contact-menu-item{margin-bottom:12px}.contact-entry-icon{width:42px;height:42px;display:inline-grid;place-items:center;flex:0 0 auto;border-radius:8px;color:#fff}.contact-entry-icon svg{display:block;color:#fff;stroke:currentColor}.contact-entry-icon.orange{display:flex;justify-content:center;align-items:center;background:#ff9f2f}.chevron-icon{color:#94a3b8}.add-friend-search{margin:0 10px 14px}.muted-message{margin:2px 14px 12px;color:#64748b;font-size:13px}.request-item{min-height:70px;grid-template-columns:auto minmax(0,1fr) auto auto;padding:10px 14px;border-bottom:1px solid #edf2f7;border-radius:0;box-shadow:none}.search-form{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:10px 12px;border-radius:18px;background:#fff;box-shadow:0 10px 28px #0f172a12}.search-form.compact{padding:8px 10px;border-radius:15px}.search-form input{height:36px;border:0;padding:0;box-shadow:none}.search-form button,.chip-button{height:34px;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:0;border-radius:999px;padding:0 12px;background:#e8f0ff;color:#1d4ed8;font-weight:800}.chip-button.muted{background:#f1f5f9;color:#64748b}.toast{position:fixed;top:18px;left:50%;z-index:20;transform:translate(-50%);padding:9px 14px;border-radius:999px;background:#0f172ae0;color:#fff;font-size:13px;font-weight:800}.menu-badge{min-width:18px;height:19px;padding:3px 6px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#ef4444;color:#fff!important;font-size:11px;font-weight:900;line-height:1}.file-card{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;width:min(260px,100%);max-width:100%;min-width:0;padding:10px;border-radius:14px;background:#ffffffd1;color:#162033}.file-meta{min-width:0}.file-meta strong{display:block;overflow:hidden;color:#111827;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.file-meta span{color:#64748b;font-size:12px}.emoji-picker{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;padding:7px 6px;margin-bottom:0;border-radius:14px 14px 0 0;background:#fff;box-shadow:0 16px 36px #0f172a14}.emoji-picker button{height:30px;border:0;border-radius:8px;background:#f8fafc;font-size:18px}.chat-view{position:relative;height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:0 10px;overflow:hidden;overflow-x:hidden;background:#f7f9fc}.chat-view>.error-message{position:absolute;top:62px;left:10px;right:10px;z-index:5;box-shadow:0 12px 30px #be123c24}.chat-titlebar{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:10px;min-height:56px;padding:calc(8px + env(safe-area-inset-top)) 2px 8px;border-bottom:1px solid #e5e7eb;background:#f7f9fc}.chat-titlebar strong{display:block;color:#111827;font-size:20px}.chat-titlebar span{color:#64748b;font-size:12px}.avatar-placeholder{width:34px;height:34px;border-radius:50%;background:#e2e8f0}.message-list{min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:10px;padding:12px 0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.time-divider{align-self:center;max-width:80%;margin:6px 0;padding:3px 8px;border-radius:999px;color:#94a3b8;font-size:12px;line-height:1.4}.message-row{width:100%;min-width:0;display:flex;align-items:flex-end;gap:8px}.message-row.mine{justify-content:flex-end}.message-row.mine .message-bubble{background:#95ec69;color:#111827}.message-row.mine .message-bubble:before{display:none}.message-row.mine .message-bubble:after{right:-11px;border-left-color:#95ec69}.message-row.mine .message-bubble.image-bubble:after{display:none}.message-row.mine .message-meta{color:#ffffffbd}.message-bubble{position:relative;max-width:calc(74% - 22px);min-width:0;padding:9px 12px;border-radius:5px;background:#fff;box-shadow:none}.message-bubble:before,.message-bubble:after{content:"";position:absolute;top:13px;border:6px solid transparent}.message-bubble:before{left:-11px;border-right-color:#fff}.message-bubble:after{display:none}.message-bubble.image-bubble{max-width:min(240px,74% - 22px);padding:0;overflow:visible;background:transparent}.message-bubble.image-bubble:before{display:none}.message-bubble p{margin:0;color:inherit;font-size:18px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.message-meta{display:flex;gap:8px;margin-bottom:5px;color:#64748b;font-size:12px}.emoji-message{font-size:34px;line-height:1.1}.chat-image-button{max-width:min(240px,100%);display:block;padding:0;border:0;border-radius:6px;overflow:hidden;background:transparent}.chat-image-button img{display:block;width:auto;max-width:100%;max-height:240px;object-fit:contain}.chat-video-button{position:relative;width:min(240px,100%);max-height:240px;display:block;padding:0;border:0;border-radius:6px;overflow:hidden;background:#111827}.chat-video-button video{width:100%;max-height:240px;display:block;object-fit:contain;background:#111827}.chat-video-play{position:absolute;top:50%;left:50%;width:44px;height:44px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;background:#0f172a9e;color:#fff;font-size:18px;line-height:1}.preview-nav{position:absolute;top:50%;width:44px;height:60px;display:grid;place-items:center;transform:translateY(-50%);border:0;border-radius:999px;background:#ffffff24;color:#fff;font-size:44px;line-height:1}.preview-slide-next-enter-active,.preview-slide-next-leave-active,.preview-slide-previous-enter-active,.preview-slide-previous-leave-active{transition:opacity .18s ease,transform .22s ease}.preview-slide-next-enter-from{opacity:0;transform:translate(44px) scale(.98)}.preview-slide-next-leave-to,.preview-slide-previous-enter-from{opacity:0;transform:translate(-44px) scale(.98)}.preview-slide-previous-leave-to{opacity:0;transform:translate(44px) scale(.98)}.composer-stack{min-height:0;background:#f7f9fc}.composer{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:8px;min-height:58px;padding:8px 2px calc(10px + env(safe-area-inset-bottom));border-top:1px solid #e2e8f0;background:#f7f9fc}.composer input{height:42px;border-radius:999px}.moments-view{min-height:0;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);padding:0;background:#f7f7f7}.moments-topbar,.moments-composebar{min-height:62px;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;padding:8px 12px}.moments-topbar h2,.moments-composebar h2{grid-column:2;margin:0;color:#111827;font-size:22px;font-weight:900;text-align:center}.moments-composebar{grid-template-columns:40px 1fr auto}.moments-topbar .icon-button{grid-column:3}.publish-action{padding:0 4px 0 12px;color:#16a34a}.moment-editor{display:grid;gap:10px;padding:12px;margin:0 0 8px;border-bottom:1px solid #e5e7eb;background:#fff}.moment-editor.compose-page{min-height:0;align-content:start;margin:0;border-bottom:0}.moment-editor.compose-page .ghost-button{width:max-content}.moment-editor textarea{min-height:92px;border:0;border-radius:0;box-shadow:none;line-height:1.55}.moment-attachment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.moment-attachment-tile{position:relative;aspect-ratio:1;overflow:hidden;background:#e5e7eb}.moment-attachment-tile img,.moment-attachment-tile video{width:100%;height:100%;display:block;object-fit:cover}.moment-attachment-tile img{width:50px;height:50px}.moment-attachment-tile .icon-button{position:absolute;top:4px;right:4px;width:26px;height:26px;background:#0f172ab8;color:#fff;box-shadow:none}.moment-list{min-height:0;overflow-y:auto;overflow-x:hidden;display:grid;align-content:start;gap:0;background:#fff}.moment-card{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;padding:14px 12px;border-bottom:1px solid #eef2f7;background:#fff}.moment-body{min-width:0}.moment-body p{margin:4px 0 9px;color:#111827;font-size:16px;line-height:1.55;white-space:pre-wrap;word-break:break-word}.moment-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.moment-head strong{display:block;color:#48658d;font-size:16px;font-weight:900}.moment-media-grid{width:min(252px,100%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:6px 0 8px}.moment-media-grid.single{width:min(250px,100%);grid-template-columns:minmax(0,1fr)}.moment-media-grid.single .moment-media-button{aspect-ratio:auto;max-height:320px}.moment-media-grid.single .moment-media{max-height:320px;object-fit:contain}.moment-media-grid.video{width:min(250px,100%);grid-template-columns:minmax(0,1fr)}.moment-media{width:100%;height:100%;display:block;object-fit:cover;background:#e5e7eb}.moment-media-button{position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:0;overflow:hidden;background:transparent;text-align:left}video.moment-media,.moment-preview video{object-fit:contain}.video-play-mark{position:absolute;top:50%;left:50%;width:44px;height:44px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:50%;background:#0f172a9e;color:#fff;font-size:18px;line-height:1}.moment-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}.moment-foot time{color:#94a3b8;font-size:13px;font-weight:700}.moment-actions{display:inline-flex;gap:6px}.mini-action{height:28px;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:0;border-radius:6px;padding:0 8px;background:#f1f5f9;color:#475569;font-size:12px;font-weight:800}.mini-action.active{background:#fee2e2;color:#e11d48}.mini-action.danger{background:#fff1f2;color:#be123c}.moment-social{position:relative;display:grid;gap:4px;margin-top:8px;padding:7px 9px;background:#f1f5f9;color:#334155;font-size:13px}.moment-social:before{content:"";position:absolute;top:-6px;left:16px;border-right:6px solid transparent;border-bottom:6px solid #f1f5f9;border-left:6px solid transparent}.moment-likes{display:flex;align-items:center;gap:5px;color:#48658d;font-weight:800}.moment-comment{display:block;width:100%;border:0;padding:0;background:transparent;color:inherit;font-size:inherit;text-align:left}.moment-comment strong{color:#48658d}.reply-label{color:#48658d;font-weight:800}.comment-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:8px}.comment-form input{height:34px;border-radius:6px}.comment-form button{border:0;border-radius:6px;padding:0 11px;background:#16a34a;color:#fff;font-weight:800}.replying-row{grid-column:1/-1;min-height:28px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px;color:#64748b;font-size:12px}.replying-row button{height:24px;padding:0 8px;background:#f1f5f9;color:#64748b}.image-preview{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;padding:22px;background:#000000e6;cursor:zoom-out;touch-action:pan-y}.preview-image{display:block;max-width:100%;max-height:100%;object-fit:contain}.preview-video{width:min(100%,430px);height:min(76vh,760px);background:#000}.preview-nav{position:absolute;top:50%;z-index:2;width:44px;height:60px;display:grid;place-items:center;transform:translateY(-50%);border:0;border-radius:999px;background:#ffffff24;color:#fff;font-size:44px;line-height:1}.preview-nav.previous{left:14px}.preview-nav.next{right:14px}.preview-nav:disabled{opacity:0;pointer-events:none}.moment-preview-slide-next-enter-active,.moment-preview-slide-next-leave-active,.moment-preview-slide-previous-enter-active,.moment-preview-slide-previous-leave-active{transition:opacity .18s ease,transform .22s ease}.moment-preview-slide-next-enter-from{opacity:0;transform:translate(44px) scale(.98)}.moment-preview-slide-next-leave-to,.moment-preview-slide-previous-enter-from{opacity:0;transform:translate(-44px) scale(.98)}.moment-preview-slide-previous-leave-to{opacity:0;transform:translate(44px) scale(.98)}.section-header-action{align-items:center}.profile-card,.settings-card{border:0;border-radius:18px;background:#fff;box-shadow:0 10px 28px #0f172a12}.profile-card{display:flex;align-items:center;gap:14px;padding:16px;margin-bottom:12px}.profile-card strong{display:block;color:#111827;font-size:15px}.profile-card span{color:#64748b;font-size:12px}.profile-summary-card{padding:18px 16px}.profile-summary-main{min-width:0;display:grid;gap:4px}.profile-summary-main strong{font-size:18px}.profile-info-card{gap:0;padding:0 14px}.profile-info-row{height:56px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #eef2f7}.profile-info-row:last-child{border-bottom:0}.profile-info-row span{color:#64748b;font-size:14px}.profile-info-row strong{color:#111827;font-size:14px;font-weight:700}.profile-settings-card{padding:16px}.profile-settings-form{gap:14px}.settings-topbar{align-items:center}.settings-topbar-spacer{width:40px;flex:0 0 40px}.avatar-editor{position:relative;display:inline-flex;color:inherit}.avatar-editor input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.camera-mark{position:absolute;right:-2px;bottom:-2px;width:25px;height:25px;display:grid;place-items:center;border:2px solid #ffffff;border-radius:50%;background:#2563eb;color:#fff}.settings-card{text-align:center;gap:12px;padding:14px;margin-bottom:12px}.password-form{display:grid;gap:10px;transition:all .3s}.logout-button{width:100%;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:16px;background:#fff1f2;color:#be123c;font-weight:800}.loading-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:#eef2f6;color:#475569;font-size:15px}.phone-shell{position:relative;width:min(430px,100%);height:var(--app-viewport-height, 100vh);margin:0 auto;display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0;overflow:hidden;background:#f7f9fc;box-shadow:0 0 0 1px #cbd5e1cc}.bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:7px 10px calc(8px + env(safe-area-inset-bottom));border-top:1px solid #e2e8f0;background:#fffffff5}.bottom-nav button{height:48px;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;border-radius:10px;background:transparent;color:#64748b;font-size:11px;font-weight:700}.bottom-nav button.active{color:#1d4ed8}.nav-icon{position:relative;display:inline-flex}.badge{min-width:18px;height:18px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#ef4444;color:#fff;font-size:11px;font-weight:800;line-height:1}.route-forward-enter-active,.route-forward-leave-active,.route-back-enter-active,.route-back-leave-active{transition:opacity .18s ease,transform .2s ease}.route-forward-enter-from{opacity:0;transform:translate(26px)}.route-forward-leave-to{opacity:0;transform:translate(-18px)}.route-back-enter-from{opacity:0;transform:translate(-26px)}.route-back-leave-to{opacity:0;transform:translate(18px)}.tab-name{font-size:13px}@media (prefers-reduced-motion: reduce){.route-forward-enter-active,.route-forward-leave-active,.route-back-enter-active,.route-back-leave-active{transition:none}}@media (min-width: 700px){body{background:#dfe7f1}.phone-shell{height:min(860px,100dvh);margin-top:max(0px,(100dvh - 860px) / 2);border-radius:24px}}