@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#17202f;background:#f5f6fa;font-synthesis:none;text-rendering:optimizeLegibility;--ink:#17202f;--muted:#7d8797;--line:#e8eaf0;--paper:#fff;--canvas:#f5f6fa;--brand:#655ce8;--brand-dark:#5148d2;--brand-soft:#f0efff;--green:#278d70;--shadow:0 10px 32px rgba(22,31,55,.045)}*{box-sizing:border-box}body{margin:0;min-width:350px;background:var(--canvas)}button,input,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.site-header{height:72px;background:#fff;display:flex;align-items:center;padding:0 max(calc((100vw - 1440px)/2),38px);border-bottom:1px solid #eceef3;position:sticky;top:0;z-index:10;gap:42px}.wordmark{display:flex;align-items:center;gap:10px;min-width:213px;font:800 20px Manrope,sans-serif;letter-spacing:-.8px}.logo-mark{width:34px;height:34px;background:var(--brand);color:#fff;border-radius:11px;display:grid;place-items:center;font:800 20px Manrope;box-shadow:0 5px 13px #655ce833}.header-search{height:40px;width:250px;display:flex;align-items:center;gap:9px;padding:0 13px;border-radius:10px;background:#f5f6f9;color:#929aaa}.header-search span{font-size:19px}.header-search input{width:100%;border:0;outline:0;background:transparent;font-size:12px;color:var(--ink)}.top-navigation{height:100%;display:flex;align-items:center;gap:32px;margin-left:12px}.top-navigation a{height:100%;display:flex;align-items:center;gap:8px;position:relative;color:#7b8494;font-size:12px;font-weight:600}.top-navigation a .nav-glyph{font-size:18px;color:#8790a0}.top-navigation a.active{color:var(--brand)}.top-navigation a.active .nav-glyph{color:var(--brand)}.top-navigation a.active:after{content:'';height:2px;position:absolute;bottom:0;left:0;right:0;border-radius:3px;background:var(--brand)}.header-actions{margin-left:auto;display:flex;align-items:center;gap:17px}.header-icon{position:relative;border:0;background:transparent;color:#727c8d;font-size:19px;padding:5px}.header-icon .ping{position:absolute;width:6px;height:6px;border:1px solid #fff;border-radius:50%;background:#eb6b80;right:3px;top:3px}.user-control{display:flex;align-items:center;gap:9px;border:0;background:transparent;font-weight:600;font-size:11px}.avatar{height:38px;width:38px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;font-size:11px;font-weight:700;color:#455078;background:#e7e9f7;object-fit:cover}.avatar-you,.avatar-blue{background:#e5e6ff;color:#625be0}.avatar-peach{background:#fbe5dc;color:#b66c53}.avatar-lavender{background:#ece6f7;color:#8467aa}.avatar-mint{background:#def0e9;color:#438d75}.avatar-white{background:#fff;color:#273244}.avatar-large{width:88px;height:88px;border:4px solid #fff;font-size:21px}.login-link{border:1px solid #dfe1e9;border-radius:9px;background:#fff;padding:9px 14px;font-weight:600;font-size:11px}.page-layout{max-width:1440px;margin:0 auto;padding:29px 38px 70px;display:grid;grid-template-columns:218px minmax(460px,660px) 280px;gap:34px;justify-content:center}.left-sidebar,.right-sidebar{align-self:start;position:sticky;top:94px}.left-sidebar{display:flex;flex-direction:column;gap:20px}.mini-profile{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}.mini-cover{height:67px;background:linear-gradient(120deg,#dbe3ff,#efdef9 55%,#f7e6dc);position:relative}.mini-profile-body{padding:0 14px 14px;margin-top:-20px;position:relative}.mini-profile-body .avatar{border:3px solid #fff}.mini-profile-body strong{display:block;margin-top:9px;font:700 12px Manrope}.mini-profile-body span{display:block;color:var(--muted);font-size:9px;margin-top:4px}.side-menu{display:flex;flex-direction:column;gap:4px}.side-label{font-size:9px;font-weight:700;color:#a1a8b4;letter-spacing:1.1px;margin:0 0 5px 11px}.side-menu a{height:40px;display:flex;align-items:center;gap:12px;padding:0 11px;border-radius:9px;color:#687385;font-size:11px;font-weight:500}.side-menu a:hover{background:#eceef5}.side-menu a.active{color:var(--brand);background:var(--brand-soft);font-weight:700}.side-menu a .side-glyph{width:20px;text-align:center;font-size:16px}.side-count{margin-left:auto;color:#8b93a0;font-size:10px}.side-footer{color:#a5abb6;font-size:9px;line-height:1.9;padding:8px 11px}.main-column{min-width:0}.right-sidebar{padding-top:2px}.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.welcome-row{display:flex;align-items:flex-end;justify-content:space-between;margin:3px 1px 20px}.overline{font-size:9px;letter-spacing:1.25px;color:#9ba3af;font-weight:700;margin:0 0 7px}.welcome-row h1,.page-intro h1{font:750 25px Manrope,sans-serif;letter-spacing:-.9px;margin:0;color:var(--ink)}.title-period{color:var(--brand)}.muted{color:var(--muted);font-size:11px;margin:6px 0 0}.button{border:0;border-radius:9px;padding:10px 14px;font-size:10px;font-weight:700;white-space:nowrap;transition:background .15s,transform .15s}.button:active{transform:scale(.98)}.button-primary{background:var(--brand);color:#fff;box-shadow:0 5px 13px #655ce829}.button-primary:hover{background:var(--brand-dark)}.button-soft{background:#fff;color:#5751c9;border:1px solid #e6e4ff}.button-soft:hover,.button-outline:hover{background:#f7f6ff}.button-outline{background:#fff;border:1px solid #e3e5ec;color:#566173;padding:8px 12px}.button-glass{color:#fff;border:1px solid #ffffff7d;background:#ffffff24;padding:7px 12px}.composer{padding:16px 17px 12px;margin-bottom:23px}.composer-start{display:flex;align-items:center;gap:10px}.composer-input{height:39px;flex:1;text-align:left;padding:0 14px;border:0;border-radius:10px;background:#f5f6f9;color:#8d96a4;font-size:11px}.composer-tools{display:flex;align-items:center;gap:20px;border-top:1px solid #eef0f3;margin-top:14px;padding-top:11px}.composer-tools>button:not(.button){border:0;background:transparent;color:#7c8594;font-size:10px}.tool-icon{margin-right:5px;font-size:14px}.green{color:#3eaa84}.amber{color:#e3a754}.composer-tools .button{margin-left:auto;padding:8px 12px}.section-heading,.feed-head{display:flex;align-items:center;justify-content:space-between}.section-heading h2,.feed-head h2,.page-section h2{font:700 14px Manrope;margin:0;letter-spacing:-.2px}.section-heading .muted,.feed-head .muted{font-size:10px;margin-top:4px}.text-link{color:var(--brand);font-size:10px;font-weight:600}.text-link span{margin-left:4px}.stories-section{margin:0 1px 24px}.stories-row{display:flex;gap:13px;margin-top:13px;overflow:auto;padding:2px 2px 4px}.story{display:flex;flex:0 0 69px;flex-direction:column;align-items:center;gap:7px;color:#687282;font-size:9px}.story-art{height:63px;width:63px;display:grid;place-items:center;border-radius:15px;position:relative;overflow:hidden;color:#fff;outline:1px solid #e0e3eb;border:3px solid #fff}.story-art:after{content:'';position:absolute;inset:5px;border:1px solid #ffffff70;border-radius:10px}.story-art b{z-index:1;font-size:22px;text-shadow:0 2px 6px #0003}.story-add .story-art{background:#f0efff;color:var(--brand);outline:1px dashed #ada8f4}.story-add .story-art b{font-size:24px}.story-forest{background:linear-gradient(145deg,#abc4aa,#466d57)}.story-sun{background:linear-gradient(145deg,#eccb91,#bd795f)}.story-violet{background:linear-gradient(145deg,#b5acd9,#71648e)}.story-rose{background:linear-gradient(145deg,#e8aeba,#a06277)}.feed-head{margin:0 1px 12px}.select-button{padding:8px 10px;border:1px solid #e4e6ed;border-radius:8px;background:#fff;color:#6c7584;font-size:10px}.select-button span{margin-left:10px}.feed-list{display:flex;flex-direction:column;gap:13px}.post{padding:16px 17px}.post-top{display:flex;align-items:center;gap:10px}.post-user{display:flex;flex-direction:column;gap:4px}.post-user strong{font-size:11px}.post-user small{font-size:9px;color:#9aa1ad}.post-user small span{margin:0 4px}.more-button,.icon-more{margin-left:auto;border:0;background:transparent;color:#8c95a3;font-size:18px;letter-spacing:1px}.post-text{font-size:11px;line-height:1.7;color:#424c5c;margin:13px 0}.post-photo{width:100%;max-height:330px;border-radius:10px;object-fit:cover;display:block}.post-meta{display:flex;justify-content:space-between;color:#8b94a1;font-size:9px;padding:11px 2px 10px;border-bottom:1px solid #eef0f4}.post-actions{display:flex;justify-content:space-around;padding-top:9px}.post-actions button{border:0;background:transparent;color:#7e8794;font-size:12px}.post-actions button span{font-size:10px;margin-left:4px}.post-actions button.liked{color:#e36b7d}.right-card{padding:16px;margin-bottom:15px}.right-title{display:flex;align-items:center;justify-content:space-between}.right-title h3{font:700 12px Manrope;margin:0}.right-title button{background:transparent;border:0;color:var(--brand);font-size:9px}.right-subtitle{color:#9aa1ac;font-size:9px;margin:5px 0 14px}.suggested-person{display:flex;align-items:center;gap:9px;margin:12px 0}.suggested-info{display:flex;min-width:0;flex-direction:column;gap:4px}.suggested-info strong{font-size:9px}.suggested-info small{font-size:8px;color:#9ba2ad}.add-person{margin-left:auto;width:27px;height:27px;border-radius:8px;background:var(--brand-soft);color:var(--brand);border:0;font-size:17px}.event-line{display:flex;gap:10px;margin:14px 0}.event-date{height:39px;width:38px;border-radius:8px;background:#f2f0ff;color:var(--brand);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}.event-date strong{font:700 14px Manrope;line-height:1}.event-date small{font-size:7px;margin-top:2px}.event-info strong{font-size:9px}.event-info small{display:block;color:#9199a6;font-size:8px;margin-top:4px}.right-prompt{background:linear-gradient(130deg,#f1f0ff,#faf1f4);border:1px solid #ebe9f6;border-radius:12px;padding:15px}.right-prompt span{color:#827ab5;font-size:8px;font-weight:700;letter-spacing:1px}.right-prompt p{font:600 11px/1.55 Manrope;margin:10px 0}.right-prompt button{border:0;background:transparent;color:var(--brand);padding:0;font-size:9px;font-weight:700}.page-intro{margin:3px 1px 21px}.page-intro h1{font-size:25px}.page-section{margin:22px 1px}.page-section .section-heading{margin-bottom:12px}.page-section>.card{padding:17px}.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;margin-left:5px;padding:0 6px;border-radius:10px;background:var(--brand-soft);color:var(--brand);font:700 9px 'DM Sans'}.request-list{margin-top:13px}.empty-inline{padding:22px;border:1px dashed #e5e7ed;border-radius:10px;text-align:center;color:#969eaa;font-size:10px}.friend-request-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid #eff0f4}.friend-request-row:first-child{border-top:0}.request-user{display:flex;flex-direction:column;gap:4px;flex:1}.request-user strong{font-size:10px}.request-user small{font-size:9px;color:#949ca8}.request-actions{display:flex;gap:6px}.request-actions .button{padding:8px 10px}.quiet-button{border:0;background:transparent;color:#9299a5;font-size:9px}.people-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.person-card{overflow:hidden}.person-cover{height:68px}.cover-mint{background:linear-gradient(130deg,#d8eee6,#edf2f4)}.cover-peach{background:linear-gradient(130deg,#f5e0d6,#f6edf0)}.cover-violet{background:linear-gradient(130deg,#dfdef7,#f0e7f7)}.person-content{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 10px 13px;margin-top:-20px}.person-avatar{border:3px solid #fff;width:44px;height:44px;margin-bottom:8px}.person-content strong{font-size:10px}.person-content small{color:#969eaa;font-size:8px;margin:4px 0 10px}.person-content .button{width:100%;padding:8px 5px}.friend-list{padding:0 15px}.friend-list-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #eef0f4}.friend-list-row:last-child{border-bottom:0}.friend-list-row div:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1}.friend-list-row strong{font-size:10px}.friend-list-row small{font-size:9px;color:#969eaa}.reels-intro{display:flex;align-items:flex-end;justify-content:space-between}.reels-feed{height:calc(100vh - 230px);min-height:520px;max-height:760px;display:flex;gap:15px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 1px 14px}.reel-card{height:100%;min-width:calc(50% - 8px);position:relative;overflow:hidden;border-radius:14px;background:#212733;scroll-snap-align:center;color:#fff;box-shadow:var(--shadow)}.reel-card:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#131622c9);pointer-events:none}.reel-image{position:absolute;inset:0;background-position:center;background-size:cover;transition:transform .5s}.reel-card:hover .reel-image{transform:scale(1.025)}.reel-play{position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);z-index:2;border:1px solid #ffffff91;background:#ffffffdc;color:#5d57d7;width:45px;height:45px;border-radius:50%;font-size:13px;padding-left:16px}.reel-overlay{position:absolute;z-index:2;top:14px;left:14px;right:14px;display:flex;align-items:center;gap:8px}.reel-overlay .avatar{height:32px;width:32px}.reel-overlay>div:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1}.reel-overlay strong{font-size:9px}.reel-overlay small{font-size:8px;color:#ffffffb0}.reel-caption{position:absolute;z-index:2;bottom:17px;left:15px;right:52px;display:flex;flex-direction:column;gap:6px}.reel-caption strong{font-size:12px}.reel-caption span{font-size:9px;color:#ffffffd0}.reel-actions{position:absolute;z-index:2;right:13px;bottom:18px;display:flex;flex-direction:column;gap:16px}.reel-actions button{background:transparent;color:#fff;border:0;font-size:17px}.reel-actions small{display:block;font-size:8px;margin-top:2px}.main-chat{min-width:0}.chat-intro{display:flex;align-items:flex-end;justify-content:space-between}.chat-layout{height:570px;display:grid;grid-template-columns:230px minmax(0,1fr);overflow:hidden}.chat-inbox{border-right:1px solid #eceef3;padding:12px 8px}.inbox-search{display:flex;align-items:center;gap:7px;background:#f5f6f9;border-radius:8px;padding:0 10px;height:36px;margin-bottom:8px;color:#9099a7}.inbox-search input{background:transparent;border:0;outline:0;width:100%;font-size:9px}.conversation{width:100%;display:flex;align-items:center;gap:8px;padding:10px 7px;border:0;background:transparent;text-align:left;border-radius:9px;position:relative}.conversation.active{background:#f1f0ff}.conversation .avatar{width:35px;height:35px}.conversation-text{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}.conversation-text strong{font-size:9px}.conversation-text small{font-size:8px;color:#9199a6;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.conversation time{font-size:7px;color:#a0a7b2;align-self:flex-start}.unread{height:6px;width:6px;border-radius:50%;background:var(--brand);position:absolute;right:9px;bottom:10px}.chat-room{display:flex;flex-direction:column;min-width:0}.chat-room-head{height:60px;border-bottom:1px solid #eff0f4;display:flex;align-items:center;gap:9px;padding:0 14px}.chat-room-head .avatar{width:34px;height:34px}.chat-room-head div{display:flex;flex-direction:column;gap:4px}.chat-room-head strong{font-size:10px}.chat-room-head small{font-size:8px;color:#929aa7}.status-dot{display:inline-block;width:6px;height:6px;background:#41b889;border-radius:50%;margin-right:3px}.chat-history{padding:15px;flex:1;overflow:auto;display:flex;flex-direction:column;gap:11px}.chat-divider{text-align:center;font-size:8px;color:#a4aab4;letter-spacing:1px;margin:0 0 5px}.message{max-width:75%;padding:10px 12px;border-radius:12px;font-size:9px;line-height:1.55;background:#f1f2f7;align-self:flex-start;color:#434c5b}.message.sent{align-self:flex-end;background:#eeedff;color:#393b68;border-bottom-right-radius:3px}.message.received{border-bottom-left-radius:3px}.message small{display:block;text-align:right;color:#9ba2ad;font-size:7px;margin-top:5px}.message-composer{display:flex;align-items:center;gap:9px;padding:10px;border-top:1px solid #eff0f4}.message-composer>button:first-child{width:32px;height:32px;border-radius:50%;background:#f2f1ff;color:var(--brand);font-size:18px;border:0}.message-composer input{flex:1;min-width:0;border:1px solid #e8eaf0;border-radius:20px;padding:10px 12px;outline-color:#aaa5f5;font-size:9px}.send-button{width:33px;height:33px;border:0;border-radius:50%;background:var(--brand);color:#fff;font-size:15px}.privacy-hint{text-align:center;font-size:8px;color:#9ca4af;margin:10px}.notifications-card{overflow:hidden}.notification-tabs{display:flex;align-items:center;gap:20px;padding:0 16px;border-bottom:1px solid #eef0f4}.notification-tabs button{padding:14px 2px;background:transparent;border:0;color:#818a99;font-size:9px;white-space:nowrap}.notification-tabs button.active{border-bottom:2px solid var(--brand);color:var(--brand);font-weight:700}.notification-tabs .count-badge{font-size:8px}.notification-list{padding:3px 16px}.notification-item{display:flex;align-items:center;gap:10px;padding:14px 2px;border-bottom:1px solid #f0f1f5;position:relative}.notification-item:last-child{border-bottom:0}.notification-item>p{font-size:9px;line-height:1.5;margin:0;flex:1}.notification-item p strong{font-weight:700}.notification-item p small{display:block;font-size:8px;color:#9da4ae;margin-top:4px}.notification-quick{display:flex;align-items:center;gap:5px}.notification-quick .button{padding:7px 10px;font-size:8px}.activity-icon{width:28px;height:28px;display:grid;place-items:center;background:#f4f3ff;color:var(--brand);border-radius:8px}.unread-dot{width:6px;height:6px;background:var(--brand);border-radius:50%;position:absolute;right:-7px;top:18px}.settings-layout{display:grid;grid-template-columns:145px minmax(0,1fr);gap:13px}.settings-menu{padding:8px;height:max-content;display:flex;flex-direction:column}.settings-menu a{padding:10px;border-radius:8px;font-size:9px;color:#798393}.settings-menu a.active{background:var(--brand-soft);color:var(--brand);font-weight:700}.settings-content{display:flex;flex-direction:column;gap:12px;min-width:0}.settings-panel{padding:16px}.settings-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.settings-panel-head h2{font:700 12px Manrope;margin:0}.settings-panel-head .muted{font-size:9px}.profile-edit-avatar{display:flex;align-items:center;gap:10px;padding:13px 0;border-top:1px solid #eff0f4;border-bottom:1px solid #eff0f4;margin-bottom:12px}.profile-edit-avatar div:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1}.profile-edit-avatar strong{font-size:9px}.profile-edit-avatar small{font-size:8px;color:#989fac}.profile-edit-avatar .button{font-size:8px;padding:8px}.form-label{display:block;font-size:9px;font-weight:600;color:#667183;margin:12px 0}.form-label>input,.form-label textarea,.input-with-prefix{width:100%;margin-top:6px;padding:10px 11px;border:1px solid #e5e7ed;border-radius:8px;outline-color:#b3aff5;background:#fff;color:#222c3c;font-size:9px}.form-label textarea{min-height:70px;resize:vertical}.form-label>small{display:block;font-size:8px;color:#999fab;font-weight:400;margin-top:5px}.input-with-prefix{display:flex;align-items:center;gap:6px}.input-with-prefix span{color:#939baa}.input-with-prefix input{flex:1;min-width:0;border:0;outline:0;font-size:9px}.profile-url{font-size:8px;color:#939ba8}.profile-url strong{color:#605ad5}.switch-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-top:1px solid #eff0f4}.switch-row>span{display:flex;flex-direction:column;gap:4px}.switch-row strong{font-size:9px}.switch-row small{font-size:8px;color:#969eaa}.switch-row input{position:absolute;opacity:0}.switch-row i{width:31px;height:18px;border-radius:20px;background:#d9dce4;position:relative;transition:background .15s}.switch-row i:after{content:'';position:absolute;top:2px;left:2px;width:14px;height:14px;background:white;border-radius:50%;transition:transform .15s}.switch-row input:checked+i{background:var(--brand)}.switch-row input:checked+i:after{transform:translateX(13px)}.search-eligibility{display:flex;align-items:center;gap:9px;background:#f8f8fb;border-radius:9px;padding:11px;margin-top:8px}.verified-mark{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e8e7ff;color:var(--brand);font-size:11px;font-weight:700}.search-eligibility p{display:flex;flex:1;flex-direction:column;gap:4px;margin:0}.search-eligibility strong{font-size:8px}.search-eligibility small{font-size:7px;color:#959daa;line-height:1.5}.pending-pill{font-size:7px;color:#8379a9;background:#f0edf9;border-radius:8px;padding:4px 6px;white-space:nowrap}.membership-preview{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(120deg,#f3f1ff,#fbf5fb);border-radius:10px;padding:15px}.plan-tag{font-size:7px;letter-spacing:1px;font-weight:700;color:var(--brand)}.membership-preview h3{font:700 13px Manrope;margin:8px 0 4px}.membership-preview p{font-size:8px;color:#828b99;margin:0}.profile-banner{height:180px;border-radius:14px 14px 0 0;background:linear-gradient(120deg,#dce3ff,#efdef9 55%,#f7e6dc);position:relative}.profile-summary{display:flex;align-items:center;gap:14px;padding:0 20px 17px;margin-top:-33px;position:relative;border-radius:0 0 14px 14px}.profile-summary .avatar{width:82px;height:82px}.profile-summary-text{padding-top:37px;flex:1;min-width:0}.profile-summary-text .overline{margin:0 0 4px;font-size:7px}.profile-summary-text h1{font:700 18px Manrope;margin:0}.profile-summary-text .muted{font-size:9px;margin:3px 0}.profile-bio{font-size:9px;color:#5e6878;margin:7px 0 0}.profile-summary .button{margin-top:36px}.profile-tabs{display:flex;gap:22px;border-bottom:1px solid #eceef2;margin:2px 0 14px;padding:0 12px}.profile-tabs a{padding:11px 3px;color:#7d8794;font-size:9px}.profile-tabs a.active{color:var(--brand);border-bottom:2px solid var(--brand);font-weight:700}.profile-page .feed-list{margin-top:13px}.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;background:#171e2a70;padding:18px;z-index:30}.auth-modal{width:min(100%,390px);background:#fff;border-radius:16px;padding:26px;position:relative;box-shadow:0 25px 70px #11182744}.auth-close{position:absolute;right:16px;top:13px;border:0;background:transparent;font-size:22px;color:#87909c}.auth-modal .logo-mark{margin-bottom:14px}.auth-modal .overline{margin:10px 0 5px}.auth-modal h2{font:700 20px Manrope;margin:0}.auth-modal>p{font-size:9px;color:#87909a;line-height:1.6}.auth-modal form{display:flex;flex-direction:column;gap:10px;margin-top:16px}.auth-modal label{font-size:9px;color:#596475;font-weight:600}.auth-modal input{display:block;width:100%;padding:10px;border:1px solid #e4e7ed;border-radius:8px;margin-top:5px;font-size:9px;outline-color:#a8a3f3}.auth-switch{display:block;margin:13px auto 0;color:var(--brand);border:0;background:transparent;font-size:9px}.field-status{font-size:8px;font-weight:500}.toast{position:fixed;z-index:40;bottom:22px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;transition:.2s;background:#202b3b;color:#fff;border-radius:9px;padding:11px 15px;font-size:10px;box-shadow:0 10px 30px #131c2b30}.toast.show{opacity:1;transform:translate(-50%,0)}.mobile-nav{display:none}
@media(max-width:1180px){.site-header{padding:0 24px;gap:24px}.wordmark{min-width:185px}.top-navigation{gap:18px;margin-left:0}.page-layout{grid-template-columns:190px minmax(430px,680px);gap:24px;padding:24px}.right-sidebar{display:none}.people-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){body{padding-bottom:68px}.site-header{height:62px;padding:0 15px;gap:13px}.wordmark{min-width:auto;font-size:17px}.logo-mark{width:30px;height:30px}.header-search{flex:1;width:auto;height:35px}.top-navigation{display:none}.header-actions{gap:8px}.user-control>span:not(.avatar){display:none}.page-layout{display:block;padding:20px 14px 30px}.left-sidebar,.right-sidebar{display:none}.main-column{max-width:660px;margin:0 auto}.mobile-nav{height:64px;position:fixed;z-index:15;display:flex;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #e8eaf0;justify-content:space-around;padding-bottom:env(safe-area-inset-bottom)}.mobile-nav a{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;color:#818b99}.mobile-nav a span{font-size:18px}.mobile-nav a small{font-size:7px}.mobile-nav a.active{color:var(--brand)}.welcome-row h1,.page-intro h1{font-size:22px}.stories-row{gap:10px}.story{flex-basis:61px}.story-art{height:57px;width:57px}.people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reels-feed{height:calc(100vh - 220px);min-height:480px}.reel-card{min-width:73%;max-width:340px}.chat-layout{height:calc(100vh - 200px);min-height:420px;grid-template-columns:100px minmax(0,1fr)}.chat-inbox{padding:8px 4px}.conversation{flex-direction:column;text-align:center;gap:4px;padding:8px 2px}.conversation .avatar{width:32px;height:32px}.conversation-text{width:100%;flex:none}.conversation-text strong{font-size:7px}.conversation-text small,.conversation time{display:none}.unread{right:11px;bottom:10px}.chat-room-head{padding:0 9px}.chat-history{padding:10px}.message{font-size:8px}.privacy-hint{font-size:7px}.settings-layout{display:block}.settings-menu{flex-direction:row;overflow:auto;margin-bottom:10px}.settings-menu a{white-space:nowrap}.settings-content{gap:10px}.profile-banner{height:125px}.profile-summary{padding:0 12px 12px;gap:10px}.profile-summary .avatar{height:64px;width:64px}.profile-summary-text{padding-top:34px}.profile-summary-text h1{font-size:14px}.profile-summary .button{font-size:8px;padding:8px;margin-top:34px}.profile-summary-text .overline{font-size:6px}}
@media(max-width:460px){.page-layout{padding:17px 10px}.welcome-row{margin-bottom:16px}.welcome-row .button{font-size:8px;padding:9px}.composer{padding:13px}.composer-tools{gap:10px}.composer-tools>button:not(.button){font-size:8px}.composer-tools .button{font-size:8px}.post{padding:14px}.people-grid{gap:8px}.person-content{padding-left:7px;padding-right:7px}.friend-request-row{flex-wrap:wrap}.request-actions{margin-left:auto}.reels-feed{height:calc(100vh - 205px);min-height:430px}.reel-card{min-width:83%}.notification-tabs{gap:12px;padding:0 10px}.notification-tabs button{font-size:8px}.notification-quick .button{padding:7px}.settings-panel{padding:12px}.settings-panel-head h2{font-size:11px}.profile-summary .avatar{height:54px;width:54px}.profile-summary-text{padding-top:31px}.profile-summary .button{padding:7px 8px}.profile-summary-text h1{font-size:12px}}

/* Readable type scale and responsive refinements */
:root{--shadow:0 10px 32px rgba(22,31,55,.06)}
html{font-size:16px;scroll-behavior:smooth}
body{min-width:320px;font-size:15px;line-height:1.5}
.site-header{gap:30px}
.header-search input,.top-navigation a,.user-control,.login-link,.button,.select-button,.side-menu a,.text-link{font-size:13px}
.header-search{width:270px}
.wordmark{font-size:21px}
.user-control .avatar{width:36px;height:36px}
.mini-profile-body strong{font-size:14px}
.mini-profile-body span,.side-footer{font-size:12px}
.side-label,.side-count{font-size:11px}
.side-menu a{height:44px}
.welcome-row h1,.page-intro h1{font-size:30px;line-height:1.2;letter-spacing:-1px}
.overline{font-size:11px;letter-spacing:1.35px}
.muted,.section-heading .muted,.feed-head .muted{font-size:14px;line-height:1.5}
.button{padding:11px 15px}
.composer-input{font-size:14px;height:44px}
.composer-tools>button:not(.button){font-size:13px}
.section-heading h2,.feed-head h2,.page-section h2{font-size:17px}
.story{font-size:12px;flex-basis:76px}
.story-art{width:68px;height:68px}
.post{padding:19px 20px}
.post-user strong{font-size:14px}
.post-user small,.post-meta{font-size:12px}
.post-text{font-size:15px;line-height:1.7}
.post-actions button{font-size:13px}
.right-title h3{font-size:16px}
.right-title a,.right-title button,.right-subtitle,.suggested-info small,.event-info small,.right-prompt button{font-size:12px}
.suggested-info strong,.event-info strong{font-size:13px}
.page-intro{margin-bottom:24px}
.page-intro .muted{margin-top:8px}
.friend-request-row,.friend-list-row,.person-card,.notification-row,.conversation-text strong{font-size:14px}
.friend-request-row small,.friend-list-row small,.person-content small,.notification-row small,.conversation-text small,.conversation time{font-size:12px}
.chat-room-head strong{font-size:14px}
.chat-room-head small,.privacy-hint,.message small{font-size:12px}
.message{font-size:14px;line-height:1.55}
.message-composer input,.inbox-search input{font-size:14px}
.settings-menu a,.form-label,.form-label input,.form-label textarea{font-size:14px}
.form-label small,.profile-url,.switch-row small,.search-eligibility small,.pending-pill{font-size:12px;line-height:1.5}
.switch-row strong,.search-eligibility strong{font-size:13px}
.membership-preview h3{font-size:18px}
.membership-preview p{font-size:13px}
.plan-tag{font-size:11px}
.profile-summary-text h1{font-size:24px}
.profile-summary-text .overline{font-size:10px}
.profile-summary-text .muted,.profile-bio{font-size:14px}
.profile-tabs a{font-size:13px}
.auth-modal h2{font-size:23px}
.auth-modal>p,.auth-modal label,.auth-modal input,.auth-switch{font-size:14px}
.auth-modal .overline{font-size:11px}
.toast{font-size:13px}
@media(min-width:761px) and (max-width:1180px){
  .site-header{padding:0 28px;gap:20px}
  .wordmark{min-width:170px}
  .header-search{width:220px}
  .top-navigation{gap:16px}
  .top-navigation a{font-size:12px}
  .page-layout{grid-template-columns:200px minmax(0,700px);gap:28px;padding:28px}
}
@media(max-width:760px){
  body{font-size:14px}
  .site-header{height:64px;padding:0 16px;gap:12px}
  .wordmark{font-size:18px}
  .header-search{height:38px;min-width:0}
  .header-search input{font-size:13px}
  .header-actions{gap:7px}
  .page-layout{padding:22px 16px 32px}
  .welcome-row h1,.page-intro h1{font-size:25px}
  .welcome-row .button{font-size:12px;padding:10px 12px}
  .muted,.section-heading .muted,.feed-head .muted{font-size:13px}
  .story{font-size:11px;flex-basis:68px}
  .story-art{width:60px;height:60px}
  .post{padding:16px}
  .post-text{font-size:14px}
  .post-user strong{font-size:13px}
  .post-user small,.post-meta{font-size:11px}
  .composer-tools>button:not(.button){font-size:11px}
  .composer-tools .button{font-size:11px}
  .mobile-nav a small{font-size:10px}
  .settings-menu a{font-size:12px}
  .profile-summary-text h1{font-size:19px}
  .profile-summary-text .muted,.profile-bio{font-size:12px}
  .profile-summary .button{font-size:11px}
  .conversation-text strong{font-size:11px}
  .conversation-text small,.conversation time{font-size:10px}
  .message{font-size:12px}
  .privacy-hint,.message small{font-size:10px}
}
@media(max-width:460px){
  .page-layout{padding:18px 12px 30px}
  .welcome-row h1,.page-intro h1{font-size:23px}
  .welcome-row .button{font-size:11px}
  .post{padding:14px}
  .composer-tools{gap:8px}
  .composer-tools>button:not(.button),.composer-tools .button{font-size:10px}
  .people-grid{gap:10px}
  .settings-panel{padding:14px}
  .notification-tabs button{font-size:11px}
  .profile-summary .avatar{width:56px;height:56px}
  .profile-summary-text h1{font-size:17px}
}

.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}
.composer-input{display:flex;align-items:center;text-decoration:none}
.composer-tool-link{border:0;background:transparent;color:#7c8594;font-size:13px;text-decoration:none}
.create-page{max-width:760px}
.create-post-card{padding:24px}
.create-post-author{display:flex;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:18px}
.create-post-author-info{display:flex;flex-direction:column;gap:4px}
.create-post-author-info strong{font-size:15px}
.create-post-author-info small{font-size:12px;color:var(--muted)}
.create-post-card textarea{display:block;width:100%;min-height:220px;padding:16px;border:1px solid var(--line);border-radius:12px;outline-color:#aaa5f5;resize:vertical;font:400 16px/1.65 'DM Sans',sans-serif;color:var(--ink)}
.create-post-card textarea::placeholder{color:#9aa2af}
.create-post-footer{display:flex;justify-content:space-between;gap:12px;padding:12px 2px 18px;color:var(--muted);font-size:12px}
.create-post-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.create-post-note{padding:0 4px;color:var(--muted);font-size:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:760px){
  .create-post-card{padding:17px}
  .create-post-card textarea{min-height:190px;font-size:15px}
  .create-post-footer{font-size:11px}
  .composer-tool-link{font-size:11px}
}
.auth-page{max-width:560px;margin:24px auto}
.auth-page-card{padding:30px}
.auth-page-card h1{font:750 28px/1.2 Manrope,sans-serif;letter-spacing:-.8px;margin:0;color:var(--ink)}
.auth-page-card>.muted{margin-top:8px}
.auth-page-form{display:flex;flex-direction:column;gap:15px;margin-top:24px}
.auth-page-form>label{display:flex;flex-direction:column;gap:7px;color:#596475;font-size:13px;font-weight:600}
.auth-page-form>label>input{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font-size:14px;outline-color:#aaa5f5}
.auth-page-form .input-with-prefix{margin-top:0;padding:10px 12px;font-size:14px}
.auth-page-form .input-with-prefix input{font-size:14px}
.auth-page-form>label>small{color:var(--muted);font-size:12px;font-weight:400}
.auth-page-form>.button{width:100%;margin-top:3px}
.auth-page-switch{margin:20px 0 0;text-align:center;color:var(--muted);font-size:13px}
.auth-page-switch a{color:var(--brand);font-weight:700}
.auth-success{display:none;margin:0;padding:11px 13px;border-radius:9px;background:#eef8f3;color:#247a5e;font-size:13px;line-height:1.5}
.auth-success:not(:empty){display:block}
@media(max-width:760px){
  .auth-page{margin:8px auto 24px}
  .auth-page-card{padding:22px 18px}
  .auth-page-card h1{font-size:24px}
}

/* Settings hub, section pages, and product guides */
.side-footer nav{display:flex;flex-wrap:wrap;gap:5px 10px}
.side-footer nav a{color:inherit;text-decoration:none}
.side-footer nav a:hover{color:var(--brand)}
.settings-intro{margin-bottom:24px}
.settings-hub{display:flex;flex-direction:column;gap:16px}
.settings-group{padding:19px 20px 7px}
.settings-group-heading{display:flex;align-items:center;gap:13px;padding:2px 0 14px}
.settings-group-icon,.settings-feature-icon{display:grid;flex:none;width:42px;height:42px;place-items:center;border:1px solid #e9e7ff;border-radius:13px;background:#f5f4ff;color:var(--brand)}
.settings-group-icon svg,.settings-feature-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.settings-group-heading h2{margin:0;color:var(--ink);font:750 16px Manrope,sans-serif;letter-spacing:-.25px}
.settings-group-heading p{margin:4px 0 0;color:var(--muted);font-size:12px}
.settings-item{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;padding:12px 2px;border-top:1px solid #eff0f4;text-decoration:none}
.settings-item>span:first-child{display:flex;min-width:0;flex-direction:column;gap:5px}
.settings-item strong{color:#333e50;font-size:13px;font-weight:700}
.settings-item small{color:#8993a2;font-size:11px;line-height:1.4}
.settings-chevron{color:#929bab;font-size:24px;line-height:1}
.settings-item:hover strong{color:var(--brand)}
.settings-help-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 21px;border:1px solid #e8e6fa;border-radius:15px;background:linear-gradient(125deg,#f5f4ff,#fff8f7)}
.settings-help-card strong{color:#313b4d;font:750 14px Manrope,sans-serif}
.settings-help-card p{max-width:350px;margin:5px 0 0;color:#828c9a;font-size:11px;line-height:1.55}
.settings-help-card>div:last-child{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.settings-section-heading{margin:3px 1px 21px}
.settings-section-heading h1{margin:0;color:var(--ink);font:750 27px/1.2 Manrope,sans-serif;letter-spacing:-.8px}
.settings-section-heading .muted{font-size:13px}
.settings-back-link{display:inline-flex;align-items:center;gap:7px;margin:0 0 15px;color:#747f90;font-size:12px;font-weight:650}
.settings-back-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.settings-page>.settings-content{display:flex;flex-direction:column;gap:14px}
.settings-page .settings-panel{padding:21px 23px;border-radius:16px}
.settings-panel-head{margin-bottom:10px}
.settings-panel-head h2{color:#303b4d;font:750 16px Manrope,sans-serif;letter-spacing:-.25px}
.settings-panel-head .muted{font-size:12px;line-height:1.5}
.settings-form{max-width:570px}
.settings-form .form-label{margin:17px 0;color:#596477;font-size:13px}
.settings-form .form-label>input,.settings-form .form-label textarea,.settings-form .input-with-prefix{padding:11px 12px;border-color:#e1e5ed;border-radius:10px;background:var(--paper);color:var(--ink);font-size:14px}
.settings-form .form-label textarea{min-height:108px}
.settings-form .input-with-prefix input{background:transparent;color:var(--ink);font-size:14px}
.settings-form .form-label>small{font-size:11px}
.settings-form .profile-url{font-size:12px}
.settings-form-actions{display:flex;justify-content:flex-end;margin-top:18px;padding-top:16px;border-top:1px solid #eff0f4}
.settings-form-actions .button,.settings-panel .button{font-size:12px}
.setting-switch{position:relative;display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:70px;padding:12px 0;border-top:1px solid #eff0f4;cursor:pointer}
.settings-panel-head+.setting-switch{border-top:0}
.setting-switch>span{display:flex;flex-direction:column;gap:5px}
.setting-switch strong{color:#354052;font-size:13px}
.setting-switch small{max-width:520px;color:#8993a1;font-size:11px;line-height:1.5}
.setting-switch input{position:absolute;width:1px;height:1px;opacity:0}
.setting-switch i{position:relative;display:block;flex:none;width:42px;height:24px;border-radius:999px;background:#d9dde5;transition:background .2s}
.setting-switch i:after{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:white;box-shadow:0 1px 3px #17202f22;transition:transform .2s;content:''}
.setting-switch input:checked+i{background:var(--brand)}
.setting-switch input:checked+i:after{transform:translateX(18px)}
.setting-switch input:focus-visible+i{outline:3px solid #9993f366;outline-offset:3px}
.setting-switch input:disabled+i{opacity:.55;cursor:not-allowed}
.settings-divider{height:1px;margin:3px 0;background:#eff0f4}
.settings-note{position:relative;margin-top:15px;padding:15px 16px;border:1px solid #e9eaf0;border-radius:12px;background:#fafafd}
.settings-note strong{color:#3b4556;font-size:12px}
.settings-note p{max-width:590px;margin:6px 0 0;color:#7f8998;font-size:11px;line-height:1.6}
.settings-note .text-link{display:inline-flex;align-items:center;gap:5px;margin-top:10px}
.settings-note .text-link svg,.settings-item svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.settings-note-soft{background:#f6f5ff;border-color:#e8e6ff}
.settings-note-warning{background:#fff9f2;border-color:#f2e3cf}
.settings-footnote{margin:15px 0 0;color:#929baa;font-size:11px;line-height:1.55}
.settings-empty{padding:27px 16px;text-align:center}
.settings-empty strong{color:#465164;font-size:13px}
.settings-empty p{margin:6px auto 0;color:#8993a1;font-size:11px;line-height:1.55}
.blocked-account-list{display:flex;flex-direction:column}
.blocked-account{display:flex;align-items:center;gap:12px;padding:13px 0;border-top:1px solid #eff0f4}
.blocked-account:first-child{border-top:0}
.blocked-account>span:not(.avatar){display:flex;min-width:0;flex:1;flex-direction:column;gap:4px}
.blocked-account strong{color:#354052;font-size:12px}
.blocked-account small{color:#929aa7;font-size:10px}
.settings-detail-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 0;border-bottom:1px solid #eff0f4}
.settings-detail-row>span:first-child{display:flex;min-width:0;flex-direction:column;gap:5px}
.settings-detail-row small{color:#8e97a5;font-size:11px}
.settings-detail-row strong{overflow-wrap:anywhere;color:#364153;font-size:13px}
.status-pill{padding:5px 9px;border-radius:999px;background:#fff4e7;color:#9a6925;font-size:10px;font-weight:700}
.status-good{background:#eaf7f1;color:#27866a}
.coming-soon-card{margin:12px 0 16px;padding:22px;border:1px solid #e8e5fb;border-radius:13px;background:linear-gradient(120deg,#f3f1ff,#fff8f6)}
.coming-soon-card h3{margin:7px 0;color:#343d4f;font:750 19px Manrope,sans-serif}
.coming-soon-card p{max-width:480px;margin:0;color:#7e8997;font-size:12px;line-height:1.6}
.settings-benefit-list{display:grid;gap:10px;margin:0 0 17px;padding-left:20px;color:#647082;font-size:12px}
.theme-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-top:15px}
.theme-option{display:flex;flex-direction:column;gap:12px;padding:11px;border:1px solid #e6e8ee;border-radius:12px;cursor:pointer}
.theme-option.selected{border-color:#a8a3f3;box-shadow:0 0 0 3px #655ce814}
.theme-option input{position:absolute;opacity:0}
.theme-preview{height:78px;border:1px solid #e5e7ed;border-radius:8px;background:#f5f6fa;position:relative}
.theme-preview:before{position:absolute;top:9px;right:8px;left:8px;height:12px;border-radius:4px;background:#fff;box-shadow:0 20px 0 #fff,0 38px 0 #fff;content:''}
.theme-dark{border-color:#30384a;background:#202736}
.theme-dark:before{background:#374155;box-shadow:0 20px 0 #374155,0 38px 0 #374155}
.theme-system{background:linear-gradient(90deg,#f5f6fa 50%,#242b39 50%)}
.theme-system:before{background:linear-gradient(90deg,#fff 50%,#414b60 50%);box-shadow:0 20px 0 #fff,0 38px 0 #fff}
.theme-option>span:last-child{display:flex;flex-direction:column;gap:4px}
.theme-option strong{color:#394455;font-size:11px}
.theme-option small{color:#8993a1;font-size:10px;line-height:1.45}
.settings-select{display:block;width:100%;max-width:340px;margin-top:7px;padding:11px 12px;border:1px solid #e1e5ed;border-radius:10px;background:var(--paper);color:var(--ink);font-size:13px}
.info-page{max-width:760px}
.info-article{padding:clamp(21px,4vw,36px);border-radius:18px}
.info-article>.overline,.info-hero .overline{color:#7770df}
.info-article h1,.info-hero h1{margin:0;color:var(--ink);font:800 clamp(26px,4vw,36px)/1.15 Manrope,sans-serif;letter-spacing:-1.2px}
.info-updated{margin:10px 0 18px;color:#929ba9;font-size:11px}
.draft-banner{display:flex;flex-direction:column;gap:4px;margin:0 0 22px;padding:12px 14px;border:1px solid #f1dfc5;border-radius:10px;background:#fff9f0;color:#815d2c;font-size:11px;line-height:1.5}
.draft-banner strong{font-size:12px}
.info-body{color:#626e7f;font-size:13px;line-height:1.8}
.info-body h2,.guide-related h2{margin:25px 0 7px;color:#313b4d;font:750 17px Manrope,sans-serif;letter-spacing:-.3px}
.info-body p{margin:10px 0}
.info-body ul{display:grid;gap:8px;padding-left:21px}
.info-body a{color:#5650cb;font-weight:700}
.info-body+.settings-back-link{margin-top:22px}
.info-hero{padding:22px 3px 20px}
.info-hero h1{max-width:660px}
.info-hero>p:last-child{max-width:560px;margin:11px 0 0;color:#7d8796;font-size:14px;line-height:1.65}
.info-card-grid{display:grid;gap:12px}
.info-step{display:grid;grid-template-columns:42px minmax(0,1fr) 19px;align-items:center;gap:14px;padding:17px 19px;text-decoration:none;transition:transform .16s,border-color .16s}
.info-step:hover{transform:translateY(-2px);border-color:#d6d3fb}
.info-step>span:first-child{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;background:#f0efff;color:#645ce1;font:800 12px Manrope}
.info-step h2{margin:0;color:#354052;font:750 14px Manrope}
.info-step p{margin:5px 0 0;color:#85909e;font-size:11px;line-height:1.55}
.info-step>svg{width:17px;height:17px;fill:none;stroke:#9aa2af;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.info-footnote{margin:16px 2px;color:#8b95a2;font-size:11px;line-height:1.6}
.help-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.help-guide-card{display:grid;grid-template-columns:38px minmax(0,1fr) 16px;align-items:center;gap:11px;min-height:103px;padding:14px;text-decoration:none}
.guide-icon{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#f0efff;color:var(--brand)}
.guide-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.help-guide-card>span:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:5px}
.help-guide-card strong{color:#374254;font-size:12px}
.help-guide-card small{display:-webkit-box;overflow:hidden;color:#8993a1;font-size:10px;line-height:1.5;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.help-guide-card>svg{width:16px;height:16px;fill:none;stroke:#9ba3b0;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.help-contact{margin-top:14px;padding:17px 19px}
.help-contact strong{color:#3c4658;font:750 13px Manrope}
.help-contact p{margin:5px 0 0;color:#8a94a1;font-size:11px;line-height:1.55}
.info-lede{margin:10px 0 0;color:#7d8796;font-size:13px;line-height:1.65}
.guide-steps{display:grid;gap:11px;margin:23px 0;padding-left:23px;color:#5f6b7b;font-size:13px;line-height:1.7}
.guide-steps li{padding-left:4px}
.guide-related{margin-top:25px;padding-top:12px;border-top:1px solid #eceef3}
.guide-related h2{margin-top:12px}
.guide-related .settings-item{min-height:48px}
html[data-text-size="large"]{font-size:112.5%}
html[data-text-size="larger"]{font-size:125%}
html.reduce-motion *,html.reduce-motion *:before,html.reduce-motion *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:760px){
  .settings-group{padding:15px 15px 5px}
  .settings-group-heading h2{font-size:15px}
  .settings-item{min-height:60px}
  .settings-help-card{align-items:flex-start;flex-direction:column}
  .settings-help-card>div:last-child{width:100%;align-items:flex-start}
  .settings-section-heading h1{font-size:24px}
  .settings-page .settings-panel{padding:17px}
  .theme-options{grid-template-columns:1fr}
  .theme-option{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center}
  .theme-preview{height:58px}
  .info-page{max-width:660px}
  .help-guide-grid{grid-template-columns:1fr}
}
@media(max-width:460px){
  .settings-group-heading{gap:10px}
  .settings-group-icon{width:37px;height:37px}
  .settings-group-heading p{font-size:11px}
  .settings-item strong{font-size:12px}
  .settings-item small{font-size:10px}
  .settings-panel-head h2{font-size:15px}
  .setting-switch{gap:12px}
  .setting-switch strong{font-size:12px}
  .setting-switch small{font-size:10px}
  .info-article{padding:21px 18px}
  .info-body{font-size:12px}
  .info-step{grid-template-columns:35px minmax(0,1fr) 16px;gap:10px;padding:14px}
  .info-step>span:first-child{width:33px;height:33px}
}

@media(prefers-color-scheme:dark){html:not([data-theme="light"]):not([data-theme="dark"]){color-scheme:dark;--ink:#edf0f6;--muted:#a4adbb;--line:#353d4e;--paper:#252d3b;--canvas:#1d2430;--brand-soft:#34334f;--shadow:0 10px 32px #080b1060}}
html[data-theme="dark"]{color-scheme:dark;--ink:#edf0f6;--muted:#a4adbb;--line:#353d4e;--paper:#252d3b;--canvas:#1d2430;--brand-soft:#34334f;--shadow:0 10px 32px #080b1060}
html[data-theme="dark"] body,html[data-theme="dark"] .site-header,html[data-theme="dark"] .mobile-nav,html[data-theme="dark"] .side-menu{background-color:var(--canvas)}
html[data-theme="dark"] .site-header,html[data-theme="dark"] .mobile-nav,html[data-theme="dark"] .card,html[data-theme="dark"] .side-menu{border-color:var(--line)}
html[data-theme="dark"] .settings-group-heading h2,html[data-theme="dark"] .settings-item strong,html[data-theme="dark"] .settings-section-heading h1,html[data-theme="dark"] .settings-panel-head h2,html[data-theme="dark"] .setting-switch strong,html[data-theme="dark"] .settings-note strong,html[data-theme="dark"] .info-article h1,html[data-theme="dark"] .info-hero h1,html[data-theme="dark"] .info-body h2,html[data-theme="dark"] .info-step h2,html[data-theme="dark"] .help-guide-card strong{color:var(--ink)}
html[data-theme="dark"] .settings-item,html[data-theme="dark"] .setting-switch,html[data-theme="dark"] .settings-detail-row,html[data-theme="dark"] .guide-related{border-color:var(--line)}
html[data-theme="dark"] .settings-note,html[data-theme="dark"] .settings-note-soft,html[data-theme="dark"] .settings-note-warning,html[data-theme="dark"] .coming-soon-card,html[data-theme="dark"] .settings-help-card{background:#2c3444;border-color:var(--line)}
html[data-theme="dark"] .settings-form .form-label>input,html[data-theme="dark"] .settings-form .form-label textarea,html[data-theme="dark"] .settings-form .input-with-prefix,html[data-theme="dark"] .settings-select{background:#202735;border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .settings-form .input-with-prefix input{color:var(--ink)}
html[data-theme="dark"] .button-soft,html[data-theme="dark"] .button-outline,html[data-theme="dark"] .login-link{background:#2b3342;border-color:var(--line);color:#c8c5ff}
html[data-theme="dark"] .info-body,html[data-theme="dark"] .guide-steps{color:#c0c7d2}
html[data-theme="dark"] .theme-option{border-color:var(--line)}
html[data-theme="dark"] .theme-option strong,html[data-theme="dark"] .blocked-account strong,html[data-theme="dark"] .settings-detail-row strong,html[data-theme="dark"] .coming-soon-card h3{color:var(--ink)}
body.standalone-auth-page .page-layout{display:block;max-width:760px;padding:28px 20px 60px}
body.standalone-auth-page #left-sidebar,body.standalone-auth-page #right-sidebar,body.standalone-auth-page #mobile-nav{display:none!important}
body.standalone-auth-page .main-column.auth-page{max-width:560px;margin:8px auto 24px}
.profile-completion-card h1{margin:0;color:var(--ink);font:800 29px/1.18 Manrope,sans-serif;letter-spacing:-.9px}
.profile-completion-card>.muted{margin-top:8px;line-height:1.6}
.profile-completion-card .auth-page-form{gap:14px;margin-top:22px}
.profile-completion-card .auth-page-form>label>textarea{width:100%;min-height:90px;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);font:400 14px/1.5 'DM Sans',sans-serif;resize:vertical;outline-color:#aaa5f5}
.profile-completion-card .auth-page-form>label>small{line-height:1.5}
.optional-label{display:inline-flex;align-self:flex-start;padding:2px 7px;border-radius:999px;background:#f1f0ff;color:#635bd8;font-size:10px;font-weight:700}
.profile-completion-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:5px}
.profile-completion-actions .button{min-height:43px;padding:10px 16px;font-size:12px}
.profile-completion-card .auth-page-switch{margin-top:17px;font-size:12px}
html[data-theme="dark"] .profile-completion-card .auth-page-form>label>textarea{background:#202735;border-color:var(--line);color:var(--ink)}
@media(max-width:760px){body.standalone-auth-page .page-layout{padding:19px 14px 34px}.profile-completion-card h1{font-size:25px}}
@media(max-width:460px){body.standalone-auth-page .page-layout{padding:15px 10px 25px}.profile-completion-card{padding:20px 17px}.profile-completion-card h1{font-size:23px}.profile-completion-actions{align-items:stretch;flex-direction:column-reverse}.profile-completion-actions .button{width:100%}}
@media(max-width:760px){.page-layout>#left-sidebar,.page-layout>#right-sidebar{display:none!important}}
@media(max-width:760px){
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  #mobile-nav.mobile-nav{position:fixed;z-index:1100;right:0;bottom:0;left:0;display:flex!important;align-items:stretch;justify-content:space-around;height:calc(64px + env(safe-area-inset-bottom));padding:6px 5px env(safe-area-inset-bottom);border-top:1px solid #e8eaf0;background:rgba(255,255,255,.98);box-shadow:0 -8px 24px rgba(29,39,57,.06)}
  #mobile-nav.mobile-nav>a{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#818b99}
  #mobile-nav.mobile-nav>a.active{color:var(--brand)}
  #mobile-nav.mobile-nav .mobile-nav-icon{display:grid;width:24px;height:23px;place-items:center}
  #mobile-nav.mobile-nav .mobile-nav-icon svg{width:20px;height:20px}
  #mobile-nav.mobile-nav a small{font-size:9px;font-weight:500;line-height:1.1}
  #mobile-nav.mobile-nav a.active small{font-weight:750}
}

/* Left navigation: profile identity, clear destinations, and a calmer active state */
.left-sidebar{gap:16px}
.mini-profile{border:1px solid #e7e9f0;border-radius:18px;box-shadow:0 12px 30px rgba(25,34,55,.06)}
.mini-profile-link{display:block;color:inherit;text-decoration:none}
.mini-cover{height:86px;overflow:hidden;background:linear-gradient(125deg,#d9ddff 0%,#e9def8 52%,#f5e4dc 100%);position:relative}
.mini-cover:before,.mini-cover:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.55);border-radius:50%}
.mini-cover:before{width:118px;height:118px;right:17px;top:-61px}
.mini-cover:after{width:78px;height:78px;right:37px;top:-42px}
.mini-profile-body{display:flex;align-items:flex-end;gap:11px;padding:0 15px;margin-top:-28px;position:relative}
.mini-profile-body .avatar{width:56px;height:56px;border:4px solid #fff;box-shadow:0 3px 10px rgba(23,32,47,.12);font-size:15px}
.mini-profile-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;padding-bottom:5px}
.mini-profile-copy strong{display:block;overflow:hidden;margin:0;color:var(--ink);font:700 14px/1.25 Manrope,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.mini-profile-copy small{display:block;overflow:hidden;margin:0;color:#8791a1;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.mini-profile-action{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 15px 0;padding:11px 0 14px;border-top:1px solid #edf0f4;color:#5d56d5;font-size:12px;font-weight:700}
.mini-profile-action svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.side-menu{gap:4px;padding:8px;border:1px solid #e7e9f0;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(25,34,55,.045)}
.side-label{margin:0;padding:10px 11px 7px;color:#929bab;font-size:10px;font-weight:800;letter-spacing:1.25px}
.side-menu a{display:flex;align-items:center;gap:11px;height:46px;padding:0 10px;border-radius:12px;color:#5e6878;font-size:14px;font-weight:600;transition:background .16s ease,color .16s ease,transform .16s ease}
.side-menu a:hover{background:#f6f6fb;color:#433da8;transform:translateX(2px)}
.side-menu a.active{background:#efeeff;color:#5149cc;box-shadow:inset 3px 0 #655ce8;font-weight:700}
.side-glyph{display:grid;width:34px;height:34px;flex:none;place-items:center;border-radius:10px;background:#f6f7fa;color:#687487}
.side-glyph svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.side-menu a.active .side-glyph{background:#fff;color:#655ce8;box-shadow:0 2px 7px rgba(34,40,73,.08)}
.side-link-label{min-width:0;flex:1}
.side-count{display:inline-flex;align-items:center;justify-content:center;min-width:23px;height:23px;margin-left:auto;padding:0 7px;border-radius:999px;background:#f1f2f5;color:#738093;font-size:11px;font-weight:700}
.side-footer{display:flex;flex-direction:column;gap:6px;padding:2px 12px;color:#8791a1;font-size:11px;line-height:1.5}
.side-footer small{color:#a0a8b4;font-size:11px}
@media(min-width:761px) and (max-width:980px){
  .side-menu{padding:6px}
  .side-menu a{gap:8px;padding:0 7px;font-size:13px}
  .side-glyph{width:31px;height:31px}
  .mini-profile-body{gap:8px;padding:0 11px}
  .mini-profile-body .avatar{width:48px;height:48px}
  .mini-profile-copy strong{font-size:12px}
  .mini-profile-copy small{font-size:10px}
  .mini-profile-action{margin-right:11px;margin-left:11px;font-size:11px}
}

.app-loader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(247,248,252,.97);opacity:1;transition:opacity .24s ease}
.app-loader.is-hidden{opacity:0;pointer-events:none}
.app-loader-content{display:flex;flex-direction:column;align-items:center;gap:17px}
.app-loader-symbol{position:relative;display:grid;width:82px;height:82px;place-items:center}
.app-loader-symbol:before{position:absolute;inset:0;border:3px solid #e7e5ff;border-top-color:#655ce8;border-right-color:#9a94fa;border-radius:50%;content:"";animation:flexoverse-loader-spin .9s linear infinite}
.app-loader-symbol:after{position:absolute;inset:8px;border:1px dashed #655ce85c;border-radius:50%;content:"";animation:flexoverse-loader-spin 5s linear infinite reverse}
.app-loader-symbol .logo-mark{z-index:1;width:50px;height:50px;border-radius:16px;font-size:30px;box-shadow:0 8px 22px #655ce83d}
.app-loader-label{color:#707a8b;font-size:13px;font-weight:600;letter-spacing:.15px}
@keyframes flexoverse-loader-spin{to{transform:rotate(1turn)}}
@media(prefers-reduced-motion:reduce){.app-loader-symbol:before,.app-loader-symbol:after{animation-duration:4s}.app-loader{transition:none}}

.feed-sort-label{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#697487;font-size:12px;font-weight:600}
.button-icon{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.composer-hint{color:#7d8797;font-size:13px}
.feed-state{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:24px;color:var(--muted);font-size:14px}
.feed-state strong{color:var(--ink);font:700 16px Manrope,sans-serif}
.empty-feed{display:flex;flex-direction:column;align-items:center;gap:10px;padding:42px 24px;text-align:center}
.empty-feed-icon{display:grid;width:48px;height:48px;place-items:center;border-radius:15px;background:var(--brand-soft);color:var(--brand);font-size:24px}
.empty-feed h3{margin:5px 0 0;color:var(--ink);font:700 19px Manrope,sans-serif}
.empty-feed p{max-width:360px;margin:0 0 7px;color:var(--muted);font-size:14px;line-height:1.55}
.community-rail-card h3{margin:7px 0;color:var(--ink);font:700 17px Manrope,sans-serif}
.community-rail-card p{margin:0 0 15px;color:var(--muted);font-size:13px;line-height:1.55}
.community-rail-card .button{font-size:12px}
.rail-kicker{color:#8b86c8;font-size:10px;font-weight:800;letter-spacing:1.2px}
.post-comments{margin-top:14px;padding-top:14px;border-top:1px solid #eef0f4}
.comment-list{display:flex;flex-direction:column;gap:11px}
.comment-item{position:relative;padding:11px 13px;border-radius:11px;background:#f7f8fb}
.comment-item strong{color:#344052;font-size:13px}
.comment-item p{margin:5px 0;color:#566173;font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-item small,.comment-state{color:#8993a2;font-size:12px}
.comment-state{margin:0;padding:8px 2px}
.comment-form{display:flex;gap:9px;margin-top:12px}
.comment-form input{flex:1;min-width:0;padding:10px 13px;border:1px solid var(--line);border-radius:999px;outline-color:#aaa5f5;font-size:13px}
.comment-form .button{padding:9px 14px}
.comment-signin{margin:12px 0 0;color:var(--muted);font-size:13px}
.comment-signin a{color:var(--brand);font-weight:700}
@media(max-width:760px){
  .feed-sort-label{font-size:11px;padding:7px 9px}
  .empty-feed{padding:34px 18px}
  .community-rail-card h3{font-size:16px}
  .comment-form input{font-size:12px}
  #toast{bottom:calc(78px + env(safe-area-inset-bottom))}
}
#toast{position:fixed;z-index:1200;left:50%;bottom:24px;display:flex;align-items:center;gap:12px;width:min(440px,calc(100vw - 32px));padding:13px 15px;border:1px solid #e3e7ee;border-radius:14px;background:#fff;color:#374255;box-shadow:0 16px 42px rgba(20,28,45,.16);opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,14px);transition:opacity .2s ease,transform .2s ease,visibility .2s ease}
#toast.show{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
#toast[data-type="success"]{border-color:#cdebdc;background:#f4fcf7;color:#246b4c}
#toast[data-type="error"]{border-color:#f2d0cc;background:#fff7f6;color:#a13f36}
#toast[data-type="info"]{border-color:#dce3f2;background:#f7f9ff;color:#465474}
.toast-icon{display:grid;width:34px;height:34px;flex:none;place-items:center;border-radius:11px;background:#e9f7ef;color:#2d8a60}
#toast[data-type="error"] .toast-icon{background:#fde9e7;color:#b34a40}
#toast[data-type="info"] .toast-icon{background:#eaf0ff;color:#5968b4}
.toast-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.toast-message{font-size:13px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){#toast{transition:none}}

/* Shared header refresh */
.site-header{height:72px;gap:clamp(16px,2.3vw,32px);padding:0 max(calc((100vw - 1440px)/2),clamp(20px,3vw,44px));background:rgba(255,255,255,.96);backdrop-filter:blur(16px)}
.wordmark{min-width:180px;gap:11px;color:#1c2433;font-size:20px;letter-spacing:-.65px}
.logo-mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#7369f2,#5a51db);box-shadow:0 5px 13px #655ce833}
.logo-mark svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.header-search{position:relative;flex:0 1 280px;width:min(25vw,280px);height:42px;gap:10px;padding:0 12px;border:1px solid transparent;border-radius:12px;background:#f5f6fa;color:#8791a2;transition:border-color .18s,background .18s,box-shadow .18s}
.header-search:focus-within{border-color:#d8d5ff;background:#fff;box-shadow:0 0 0 3px #655ce814}
.search-icon{display:grid;place-items:center;flex:none;color:#8b95a5}
.search-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.header-search input{min-width:0;font-size:13px}
.header-search input::placeholder{color:#929bab}
.search-shortcut{display:grid;place-items:center;flex:none;width:20px;height:20px;border:1px solid #e6e8ee;border-radius:6px;background:#fff;color:#929bab;font:500 11px 'DM Sans',sans-serif}
.top-navigation{height:100%;gap:5px;margin-left:0}
.top-navigation a{height:40px;padding:0 12px;gap:8px;border-radius:11px;color:#667184;font-size:13px;transition:background .16s,color .16s}
.top-navigation a:hover{background:#f6f6fb;color:#30394a}
.top-navigation a.active{background:var(--brand-soft);color:var(--brand);font-weight:700}
.top-navigation a.active:after{display:none}
.top-navigation a .nav-glyph{display:grid;width:18px;height:18px;place-items:center;color:#8490a2}
.top-navigation a .nav-glyph svg,.mobile-nav-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.top-navigation a.active .nav-glyph{color:var(--brand)}
.header-actions{gap:9px}
.header-icon{display:grid;width:38px;height:38px;place-items:center;border:1px solid transparent;border-radius:11px;padding:0;color:#687486;transition:background .16s,border-color .16s,color .16s}
.header-icon:hover{border-color:#ececf3;background:#f7f7fb;color:var(--brand)}
.header-icon>svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.header-icon .ping{right:7px;top:7px}
.user-control{gap:9px;font-size:12px;color:#384255}
.user-control .avatar{width:34px;height:34px}
.login-link{border-color:#e3e5ed;border-radius:10px;padding:10px 15px;font-size:12px;color:#394357;transition:border-color .16s,background .16s,color .16s}
.login-link:hover{border-color:#d7d3ff;background:#f8f7ff;color:var(--brand)}
.mobile-nav a{transition:color .16s}
.mobile-nav-icon{display:grid;width:22px;height:22px;place-items:center}
.mobile-nav-icon svg{width:20px;height:20px}
.mobile-nav a small{font-size:10px;font-weight:500}
.mobile-nav a.active small{font-weight:700}
.top-navigation a:focus-visible,.header-icon:focus-visible,.wordmark:focus-visible,.login-link:focus-visible,.mobile-nav a:focus-visible{outline:3px solid #aaa5f5;outline-offset:2px}
@media(min-width:761px) and (max-width:1080px){
  .site-header{gap:14px;padding:0 22px}
  .wordmark{min-width:auto}
  .header-search{flex:1 1 220px;width:auto;max-width:260px}
  .search-shortcut{display:none}
  .top-navigation{gap:3px}
  .top-navigation a{width:40px;padding:0;justify-content:center}
  .top-navigation a .nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .header-actions{gap:4px}
}
@media(min-width:761px) and (max-width:860px){
  .wordmark>span:not(.logo-mark){display:none}
  .site-header{gap:12px;padding:0 18px}
}
@media(max-width:760px){
  .site-header{height:64px;padding:0 14px;gap:11px}
  .wordmark{gap:8px;font-size:17px}
  .logo-mark{width:32px;height:32px;border-radius:11px}
  .logo-mark svg{width:20px;height:20px}
  .header-search{height:38px;flex:1 1 auto;width:auto;padding:0 10px;gap:8px}
  .header-search input{font-size:12px}
  .search-shortcut{display:none}
  .header-actions{gap:4px}
  .header-icon{width:34px;height:36px}
  .login-link{padding:9px 11px;font-size:11px;white-space:nowrap}
  .top-navigation{display:none}
  .mobile-nav{padding-left:6px;padding-right:6px}
  .mobile-nav a{gap:4px}
  .mobile-nav-icon{width:23px;height:23px}
  .mobile-nav-icon svg{width:19px;height:19px}
  .mobile-nav a small{font-size:9px}
}

/* Keep every sidebar destination reachable on shorter desktop windows. */
@media(min-width:761px){
  .left-sidebar{position:sticky;top:88px;max-height:calc(100vh - 104px);max-height:calc(100dvh - 104px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d9dce6 transparent}
  .left-sidebar::-webkit-scrollbar{width:5px}
  .left-sidebar::-webkit-scrollbar-thumb{border-radius:999px;background:#d9dce6}
  .left-sidebar::-webkit-scrollbar-track{background:transparent}
}

/* Friends page */
.friends-page{display:flex;flex-direction:column;gap:22px}
.friends-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:4px 1px 2px}
.friends-hero-copy{display:flex;align-items:center;gap:15px;min-width:0}
.friends-hero-icon{display:grid;width:54px;height:54px;flex:none;place-items:center;border:1px solid #e3e0ff;border-radius:17px;background:linear-gradient(145deg,#f0efff,#e8e6ff);color:#635be0}
.friends-hero-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.friends-hero .overline{margin-bottom:5px}
.friends-hero h1{margin:0;color:var(--ink);font:750 29px/1.15 Manrope,sans-serif;letter-spacing:-.8px}
.friends-hero .muted{margin-top:6px;font-size:13px}
.friends-hero-cta{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;font-size:12px}
.friends-hero-cta svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.friends-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.friends-stat-card{display:flex;align-items:center;gap:13px;min-width:0;padding:15px 16px;border:1px solid #e7e9f0;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(25,34,55,.035);transition:border-color .16s,transform .16s,box-shadow .16s}
.friends-stat-card:hover{transform:translateY(-2px);border-color:#d9d5ff;box-shadow:0 12px 26px rgba(48,42,110,.08)}
.friends-stat-icon{display:grid;width:42px;height:42px;flex:none;place-items:center;border-radius:13px}
.friends-stat-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.friends-stat-icon-violet{background:#f0efff;color:#625add}
.friends-stat-icon-peach{background:#fff1ea;color:#c77c5e}
.friends-stat-copy{display:flex;min-width:0;flex-direction:column;gap:3px}
.friends-stat-copy strong{color:#20293a;font:750 22px/1 Manrope,sans-serif}
.friends-stat-copy small{color:#7d8797;font-size:11px}
.friends-stat-arrow{width:17px;height:17px;flex:none;margin-left:auto;fill:none;stroke:#9aa2b0;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.friends-tabs{display:flex;align-items:center;gap:8px;padding-bottom:13px;border-bottom:1px solid #e6e8ee}
.friends-tabs a{padding:8px 12px;border-radius:9px;color:#657084;font-size:12px;font-weight:650;transition:background .16s,color .16s}
.friends-tabs a:hover{background:#fff;color:var(--brand)}
.friends-panel{padding:19px 20px 8px;border-radius:16px}
.friends-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.friends-section-heading h2{margin:0;color:#222b3b;font:700 19px/1.25 Manrope,sans-serif;letter-spacing:-.35px}
.friends-section-heading p:not(.friends-eyebrow){margin:5px 0 0;color:#838c9b;font-size:12px;line-height:1.5}
.friends-eyebrow{margin:0 0 5px;color:#8d86d5;font-size:9px;font-weight:800;letter-spacing:1.2px}
.friends-count-pill{display:grid;min-width:31px;height:31px;flex:none;place-items:center;padding:0 9px;border-radius:999px;background:#f0efff;color:#5d55d4;font-size:12px;font-weight:750}
.friends-request-list,.friends-list{display:flex;flex-direction:column}
.friend-request-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-top:1px solid #eef0f4}
.friend-request-person{display:flex;align-items:center;gap:11px;min-width:0}
.friend-request-person .avatar,.friend-contact>.avatar{width:44px;height:44px;font-size:13px}
.friend-contact-copy{display:flex;min-width:0;flex-direction:column;gap:4px}
.friend-contact-copy strong{overflow:hidden;color:#2b3444;font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.friend-contact-copy small{overflow:hidden;color:#8c95a3;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.friend-contact-copy small span{padding:0 3px;color:#b3bac4}
.friend-request-actions{display:flex;flex:none;align-items:center;gap:8px}
.friend-request-actions .button{min-height:36px;padding:8px 12px;border-radius:9px;font-size:11px}
.friend-request-actions svg,.friend-contact .button svg,.friend-person-content .button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.button-muted{border:1px solid #e7e9ef;background:#fff;color:#657084}
.button-muted:hover{background:#f7f8fa}
.friends-discover{display:flex;flex-direction:column;gap:13px}
.friends-section-heading-outside{margin:0 1px 1px}
.friends-search{display:flex;align-items:center;gap:9px;width:210px;max-width:42%;height:39px;flex:none;padding:0 11px;border:1px solid #e6e8ee;border-radius:10px;background:#fff;color:#8a94a4}
.friends-search:focus-within{border-color:#c7c2ff;box-shadow:0 0 0 3px #655ce814}
.friends-search svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.friends-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:12px}
.friends-search input::placeholder{color:#9aa2af}
.friends-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.friend-person-card{min-width:0;overflow:hidden;border-radius:15px;transition:transform .18s,border-color .18s,box-shadow .18s}
.friend-person-card:hover{transform:translateY(-3px);border-color:#ddd9ff;box-shadow:0 14px 28px rgba(35,36,76,.09)}
.friend-person-cover{height:76px;position:relative;overflow:hidden;background:#e9edff}
.friend-person-cover:before,.friend-person-cover:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.55);border-radius:50%}
.friend-person-cover:before{width:105px;height:105px;right:14px;top:-56px}
.friend-person-cover:after{width:66px;height:66px;right:34px;top:-36px}
.friend-cover-1{background:linear-gradient(125deg,#f7e5dc,#efdfed 58%,#e4e8ff)}
.friend-cover-2{background:linear-gradient(125deg,#dff1ea,#e2e8fb 58%,#f7e8dc)}
.friend-person-content{display:flex;align-items:center;flex-direction:column;min-width:0;padding:0 13px 14px;margin-top:-27px;position:relative;text-align:center}
.friend-person-content>.avatar{width:54px;height:54px;margin-bottom:8px;border:4px solid #fff;box-shadow:0 2px 8px #202c4517;font-size:14px}
.friend-person-content>strong{width:100%;overflow:hidden;color:#293243;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.friend-person-content>small{max-width:100%;overflow:hidden;margin-top:4px;color:#8791a1;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.friend-person-content .button{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:36px;margin-top:13px;padding:8px 10px;border-radius:9px;font-size:11px}
.button-request-sent{border:1px solid #e4e2f6;background:#f5f4fb;color:#7e78a5;cursor:default}
.button-request-sent:disabled{opacity:1}
.friend-contact{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 0;border-top:1px solid #eef0f4}
.friend-contact-copy{flex:1}
.friend-contact .button{display:inline-flex;align-items:center;gap:6px;min-height:35px;padding:8px 11px;border-radius:9px;font-size:11px}
.friends-empty-state{display:flex;align-items:center;flex-direction:column;gap:9px;padding:26px 16px 28px;text-align:center}
.friends-empty-icon{display:grid;width:43px;height:43px;place-items:center;border-radius:14px;background:#f2f1ff;color:#6a62df}
.friends-empty-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.friends-empty-state strong{color:#30394a;font:700 14px Manrope,sans-serif}
.friends-empty-state p{max-width:340px;margin:0;color:#838d9c;font-size:12px;line-height:1.5}
.friends-empty-state .button{margin-top:4px;padding:9px 13px;font-size:11px}
.friends-loading{display:flex;align-items:center;justify-content:center;gap:9px;min-height:78px;color:#858e9c;font-size:12px}
.friends-loading-card{grid-column:1/-1;min-height:178px;border:1px dashed #dfe2ea;border-radius:15px;background:#fff}
.friends-loading-dot{width:8px;height:8px;border-radius:50%;background:#837bf0;box-shadow:0 0 0 4px #efeeff;animation:friends-pulse 1.2s ease-in-out infinite}
.friends-filter-empty{padding:14px 0;color:#8a93a2;font-size:12px;text-align:center}
.friends-page [hidden]{display:none!important}
@keyframes friends-pulse{50%{opacity:.35;transform:scale(.78)}}
@media(max-width:760px){
  .friends-page{gap:18px}
  .friends-hero{align-items:flex-start;flex-direction:column;gap:14px}
  .friends-hero-icon{width:48px;height:48px;border-radius:15px}
  .friends-hero h1{font-size:26px}
  .friends-hero .muted{font-size:12px}
  .friends-hero-cta{align-self:flex-start}
  .friends-overview{gap:9px}
  .friends-stat-card{gap:9px;padding:12px 10px;border-radius:13px}
  .friends-stat-icon{width:36px;height:36px;border-radius:11px}
  .friends-stat-icon svg{width:18px;height:18px}
  .friends-stat-copy strong{font-size:19px}
  .friends-stat-copy small{font-size:9px;line-height:1.3}
  .friends-stat-arrow{width:14px;height:14px}
  .friends-tabs{gap:3px;overflow:auto}
  .friends-tabs a{padding:8px 10px;white-space:nowrap;font-size:11px}
  .friends-panel{padding:15px 14px 6px;border-radius:14px}
  .friends-section-heading{align-items:flex-start;gap:10px}
  .friends-section-heading h2{font-size:17px}
  .friends-section-heading p:not(.friends-eyebrow){font-size:11px}
  .friends-search{width:100%;max-width:none;height:38px}
  .friends-section-heading-outside{flex-direction:column}
  .friends-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .friend-person-cover{height:65px}
  .friend-person-content{padding:0 9px 11px}
  .friend-person-content>.avatar{width:48px;height:48px}
  .friend-person-content>strong{font-size:11px}
  .friend-person-content .button{font-size:10px}
  .friend-request-item{align-items:flex-start;flex-direction:column;gap:11px}
  .friend-request-actions{width:100%;padding-left:55px}
  .friend-request-actions .button{flex:1}
  .friend-contact{gap:9px}
  .friend-contact>.avatar{width:39px;height:39px}
  .friend-contact-copy strong{font-size:12px}
  .friend-contact .button{padding:8px;font-size:10px}
  .friends-empty-state{padding:22px 12px}
}
@media(max-width:390px){
  .friends-overview{grid-template-columns:1fr}
  .friends-stat-card{padding:10px 12px}
  .friends-stat-copy small{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.friends-loading-dot{animation:none}.friends-stat-card,.friend-person-card{transition:none}}

/* Reels feed, uploader and immersive playback */
.app-loader-symbol .logo-mark svg{width:30px;height:30px}
.reels-page{display:flex;flex-direction:column;gap:21px}
.reels-page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 1px 2px}
.reels-page-heading h1,.reel-create-heading h1{margin:0;color:var(--ink);font:750 30px/1.15 Manrope,sans-serif;letter-spacing:-.9px}
.reels-page-heading .muted,.reel-create-heading .muted{margin-top:7px;font-size:13px}
.reels-create-link{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;font-size:12px}
.reels-create-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.reels-feed{height:auto;min-height:0;max-height:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:14px;overflow:visible;scroll-snap-type:none;padding:0 1px 12px}
.reel-card{height:auto;min-width:0;max-width:none;aspect-ratio:9/16;position:relative;overflow:hidden;border:1px solid #ffffff18;border-radius:17px;background:#181b25;color:#fff;box-shadow:0 12px 28px rgba(21,28,44,.11);scroll-snap-align:none}
.reel-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:linear-gradient(145deg,#25293a,#11151e)}
.reel-card-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,12,19,.27),transparent 32%,transparent 46%,rgba(10,12,19,.78));pointer-events:none}
.reel-open{position:absolute;z-index:2;left:50%;top:50%;display:flex;align-items:center;justify-content:center;gap:7px;min-width:54px;min-height:54px;padding:0 15px;border:1px solid #ffffffad;border-radius:999px;background:#1518277d;color:#fff;font-size:11px;font-weight:700;opacity:.92;transform:translate(-50%,-50%);transition:background .16s,transform .16s}
.reel-open:hover{background:#655ce8e8;transform:translate(-50%,-50%) scale(1.04)}
.reel-open svg{width:16px;height:16px;fill:currentColor;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.reel-card-details{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:10px;padding:14px 13px 13px}
.reel-author{display:flex;align-items:center;gap:9px;min-width:0;color:#fff}
.reel-author>.avatar{width:35px;height:35px;border:1.5px solid #ffffffbf;font-size:11px}
.reel-author>span:last-child{display:flex;min-width:0;flex-direction:column;gap:3px}
.reel-author strong{overflow:hidden;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.reel-author small{overflow:hidden;color:#ffffffc7;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.reel-card-details p{display:-webkit-box;overflow:hidden;margin:0;color:#fff;font-size:12px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.reel-share{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;padding:7px 9px;border:1px solid #ffffff38;border-radius:8px;background:#15182766;color:#fff;font-size:10px;font-weight:650}
.reel-share:hover{background:#ffffff26}
.reel-share svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.reels-loading,.reels-empty-state{grid-column:1/-1;display:flex;align-items:center;flex-direction:column;gap:10px;min-height:240px;padding:32px 22px;border:1px solid #e7e9f0;border-radius:17px;background:#fff;text-align:center;box-shadow:0 10px 28px rgba(25,34,55,.04)}
.reels-loading{justify-content:center;flex-direction:row;min-height:120px;color:#858e9c;font-size:13px}
.reels-empty-icon{display:grid;width:48px;height:48px;place-items:center;border-radius:15px;background:#f0efff;color:#655ce8}
.reels-empty-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.reels-empty-state strong{color:#2a3344;font:700 16px Manrope,sans-serif}
.reels-empty-state p{max-width:390px;margin:0 0 5px;color:#828b9a;font-size:13px;line-height:1.55}
.reels-empty-state .button{font-size:12px}
.reel-viewer-open{overflow:hidden}
.reel-viewer{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:24px;background:#07080deF}
.reel-viewer-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;cursor:default}
.reel-viewer-shell{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:22px;width:min(100%,720px);height:min(100%,860px)}
.reel-viewer-frame{position:relative;width:min(100%,460px);height:100%;overflow:hidden;border:1px solid #ffffff1e;border-radius:18px;background:#090a0f;box-shadow:0 22px 80px #0008}
.reel-viewer-frame>video{display:block;width:100%;height:100%;object-fit:contain;background:#050609}
.reel-viewer-info{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:10px;padding:56px 16px 18px;background:linear-gradient(transparent,#080a10d9);pointer-events:none}
.reel-viewer-info .reel-author,.reel-viewer-info .reel-share{pointer-events:auto}
.reel-viewer-info p{max-width:360px;margin:0;color:#fff;font-size:13px;line-height:1.5;text-shadow:0 1px 4px #0009}
.reel-viewer-close,.reel-viewer-step{display:grid;width:42px;height:42px;flex:none;place-items:center;border:1px solid #ffffff40;border-radius:50%;background:#ffffff18;color:#fff;backdrop-filter:blur(8px);transition:background .16s,transform .16s}
.reel-viewer-close:hover,.reel-viewer-step:hover{background:#ffffff32;transform:scale(1.04)}
.reel-viewer-close{position:absolute;z-index:3;top:12px;right:12px}
.reel-viewer-close svg,.reel-viewer-step svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reel-viewer-position{position:absolute;z-index:2;top:16px;left:50%;color:#ffffffb8;font-size:11px;font-weight:700;transform:translateX(-50%)}
.reel-viewer-step:disabled{opacity:.35}
/* Reel upload page */
.reel-create-page{max-width:760px}
.reel-back-link{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;color:#727d8e;font-size:12px;font-weight:650}
.reel-back-link:hover{color:var(--brand)}
.reel-back-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reel-create-heading{margin:6px 0 2px}
.reel-create-heading .overline{margin-bottom:7px}
.reel-create-card{display:flex;flex-direction:column;padding:21px;border-radius:17px}
.reel-upload-zone{position:relative;display:grid;min-height:350px;place-items:center;overflow:hidden;border:1.5px dashed #d7d9e4;border-radius:13px;background:#f9f9fc;color:#616b7b;cursor:pointer;transition:border-color .16s,background .16s}
.reel-upload-zone:hover{border-color:#aaa5f5;background:#f7f6ff}
.reel-upload-zone:focus-within{outline:3px solid #aaa5f5;outline-offset:2px}
.reel-upload-zone input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.reel-upload-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#10131b}
.reel-upload-preview[hidden]{display:none}
.reel-upload-prompt{display:flex;align-items:center;flex-direction:column;gap:9px;text-align:center}
.reel-upload-icon{display:grid;width:54px;height:54px;place-items:center;border-radius:17px;background:#efeeff;color:#655ce8}
.reel-upload-icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.reel-upload-prompt strong{color:#333c4c;font-size:14px}
.reel-upload-prompt small,.reel-field-help{color:#8992a0;font-size:12px}
.reel-field-help{margin:9px 0 20px}
.reel-caption-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;color:#3c4554;font-size:13px;font-weight:700}
.reel-caption-label span{color:#969eab;font-size:11px;font-weight:500}
.reel-create-card textarea{width:100%;min-height:105px;padding:12px 13px;border:1px solid #e4e7ed;border-radius:10px;outline-color:#aaa5f5;resize:vertical;color:var(--ink);font:400 13px/1.55 'DM Sans',sans-serif}
.reel-caption-meta{display:flex;justify-content:space-between;gap:10px;margin-top:7px;color:#929aa7;font-size:10px}
.reel-upload-progress{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.reel-upload-progress[hidden]{display:none}
.reel-progress-track{height:7px;overflow:hidden;border-radius:999px;background:#efeff5}
.reel-progress-track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#655ce8,#a49cf7);transition:width .18s}
.reel-upload-progress small{color:#737e8f;font-size:11px}
.reel-create-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px;padding-top:16px;border-top:1px solid #eef0f4}
.reel-create-actions .button{display:inline-flex;align-items:center;gap:7px;min-height:40px;font-size:12px}
.reel-create-actions svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reel-create-actions .button:disabled{opacity:.5;cursor:not-allowed}
.reel-create-note{margin:13px 3px 0;color:#8b94a2;font-size:11px;line-height:1.55}
.reel-auth-state{display:flex;align-items:center;flex-direction:column;gap:11px;min-height:290px;justify-content:center;text-align:center}
.reel-auth-state strong{color:#30394a;font:700 17px Manrope,sans-serif}
.reel-auth-state p{max-width:350px;margin:0 0 3px;color:#828b9a;font-size:13px;line-height:1.55}
/* Public profile viewer */
.profile-view-page{max-width:760px}
.profile-page{position:relative}
.profile-banner{height:215px;overflow:hidden;border-radius:18px 18px 0 0;background:linear-gradient(118deg,#dadfff 0%,#e8def7 52%,#f7e5d9 100%)}
.profile-banner-orbit{position:absolute;border:1px solid #ffffff91;border-radius:50%;pointer-events:none}
.profile-banner-orbit-one{width:310px;height:310px;right:7%;top:-178px}
.profile-banner-orbit-two{width:205px;height:205px;right:17%;top:-115px}
.profile-summary{display:flex;align-items:flex-end;gap:16px;padding:0 24px 18px;margin-top:-40px;position:relative;border-radius:0 0 16px 16px}
.profile-summary .avatar-large{width:92px;height:92px;flex:none;border:5px solid #fff;box-shadow:0 6px 18px #222b451c;font-size:23px}
.profile-summary-text{flex:1;min-width:0;padding:0 0 3px}
.profile-summary-text .overline{margin:0 0 6px;font-size:10px}
.profile-summary-text h1{margin:0;color:#1c2535;font:750 24px/1.15 Manrope,sans-serif;letter-spacing:-.6px}
.profile-summary-text .muted{margin:5px 0 0;font-size:13px}
.profile-bio{max-width:430px;margin:8px 0 0;color:#596476;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.profile-actions{display:flex;align-items:center;gap:8px;flex:none;margin-bottom:4px}
.profile-actions .button{min-height:39px;font-size:12px}
.profile-share-button{display:grid;width:39px;place-items:center;padding:8px;border:1px solid #e3e5ec;background:#fff;color:#697487}
.profile-share-button:hover{border-color:#d8d4ff;background:#f8f7ff;color:var(--brand)}
.profile-share-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.profile-stats{display:flex;align-items:center;gap:23px;padding:14px 20px;margin:14px 0 0;border-radius:13px}
.profile-stats>div{display:flex;align-items:baseline;gap:7px}
.profile-stats strong{color:#30394a;font:750 16px Manrope,sans-serif}
.profile-stats span:not(.profile-stat-divider){color:#7f8998;font-size:11px}
.profile-stat-divider{width:1px;height:25px;background:#e9ebf0}
.profile-tabs{display:flex;gap:20px;margin:16px 0 14px;padding:0 13px;border-bottom:1px solid #e7e9ef}
.profile-tabs button{padding:11px 3px;border:0;border-bottom:2px solid transparent;background:transparent;color:#7a8595;font-size:12px;font-weight:650;cursor:pointer}
.profile-tabs button.active{border-bottom-color:var(--brand);color:var(--brand)}
.profile-panel[hidden],#profile-content[hidden],#profile-state[hidden],.reel-upload-prompt[hidden]{display:none!important}
.profile-about-card{display:flex;align-items:flex-start;gap:15px;padding:21px;border-radius:15px}
.profile-about-icon{display:grid;width:42px;height:42px;flex:none;place-items:center;border-radius:13px;background:#f0efff;color:#655ce8}
.profile-about-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.profile-about-card h2{margin:0;color:#293243;font:700 17px Manrope,sans-serif}
.profile-about-card>div:last-child>p:not(.overline){max-width:520px;margin:8px 0 14px;color:#626d7d;font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.profile-about-meta{display:flex;align-items:center;gap:8px;color:#858e9d;font-size:11px}
.profile-about-meta-icon{display:grid;width:25px;height:25px;place-items:center;border-radius:8px;background:#f5f6f9;color:#737e8e}
.profile-about-meta-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.profile-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.profile-photo{display:block;aspect-ratio:1;overflow:hidden;border:1px solid #e5e7ed;border-radius:12px;background:#f4f5f9}
.profile-photo img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.profile-photo:hover img{transform:scale(1.04)}
.profile-state{display:flex;align-items:center;flex-direction:column;gap:10px;padding:34px 20px;text-align:center;border-radius:16px}
.profile-state strong{color:#293243;font:700 16px Manrope,sans-serif}
.profile-state p{max-width:380px;margin:0 0 4px;color:#818b9a;font-size:13px;line-height:1.5}
.profile-state .button{font-size:12px}
.profile-request-sent{background:#f5f4fb;color:#7e78a5}
@media(max-width:980px){.reels-feed{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .reels-page{gap:16px}
  .reels-page-heading{align-items:flex-start;flex-direction:column;gap:13px}
  .reels-page-heading h1,.reel-create-heading h1{font-size:26px}
  .reels-page-heading .muted,.reel-create-heading .muted{font-size:12px}
  .reels-create-link{padding:10px 12px}
  .reels-feed{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .reel-card{border-radius:14px}
  .reel-card-details{gap:8px;padding:10px 9px}
  .reel-author{gap:7px}
  .reel-author>.avatar{width:30px;height:30px}
  .reel-author strong{font-size:10px}
  .reel-author small{font-size:8px}
  .reel-card-details p{font-size:10px}
  .reel-share{font-size:9px;padding:6px 7px}
  .reel-open{min-width:44px;min-height:44px;padding:0 12px;font-size:10px}
  .reel-viewer{padding:0}
  .reel-viewer-shell{width:100%;height:100%;gap:0}
  .reel-viewer-frame{width:100%;height:100%;border:0;border-radius:0}
  .reel-viewer-close{top:calc(12px + env(safe-area-inset-top));right:13px}
  .reel-viewer-position{top:calc(24px + env(safe-area-inset-top))}
  .reel-viewer-step{position:absolute;z-index:3;bottom:calc(120px + env(safe-area-inset-bottom));width:38px;height:38px}
  .reel-viewer-previous{left:12px}
  .reel-viewer-next{right:12px}
  .reel-create-page{gap:15px}
  .reel-create-card{padding:14px}
  .reel-upload-zone{min-height:285px}
  .reel-caption-meta{font-size:9px}
  .profile-banner{height:160px}
  .profile-summary{align-items:flex-start;gap:11px;padding:0 13px 15px;margin-top:-32px;flex-wrap:wrap}
  .profile-summary .avatar-large{width:72px;height:72px;border-width:4px;font-size:18px}
  .profile-summary-text{padding-top:31px}
  .profile-summary-text .overline{font-size:8px}
  .profile-summary-text h1{font-size:18px}
  .profile-summary-text .muted{font-size:11px}
  .profile-bio{font-size:11px}
  .profile-actions{margin:0 0 0 auto}
  .profile-actions .button{min-height:35px;font-size:10px}
  .profile-share-button{width:35px}
  .profile-stats{padding:12px 14px}
  .profile-tabs{gap:17px}
  .profile-tabs button{font-size:11px}
  .profile-about-card{gap:11px;padding:16px}
  .profile-about-card h2{font-size:15px}
  .profile-about-card>div:last-child>p:not(.overline){font-size:12px}
  .profile-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
}
@media(max-width:420px){
  .reels-feed{grid-template-columns:1fr;max-width:360px;width:100%;margin:0 auto}
  .reel-card{max-height:620px}
  .reel-viewer-step{bottom:calc(112px + env(safe-area-inset-bottom))}
  .profile-summary{gap:8px}
  .profile-summary .avatar-large{width:62px;height:62px}
  .profile-summary-text{padding-top:27px}
  .profile-summary-text h1{font-size:16px}
  .profile-actions{width:100%;margin-top:2px}
  .profile-actions .button-primary,.profile-actions .button-request-sent{flex:1}
}
@media(prefers-reduced-motion:reduce){.reel-open,.profile-photo img{transition:none}.friends-loading-dot{animation:none}}

/* Live inbox and activity center */
.chats-page{display:flex;flex-direction:column;gap:13px}
.chat-page-heading,.notifications-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:1px 1px 3px}
.chat-page-heading h1,.notifications-heading h1{margin:0;color:var(--ink);font:750 29px/1.15 Manrope,sans-serif;letter-spacing:-.9px}
.chat-page-heading .muted,.notifications-heading .muted{margin-top:7px;font-size:13px}
.chat-page-heading .button{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;font-size:12px}
.chat-page-heading .button svg,.text-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.chat-layout{display:grid;grid-template-columns:255px minmax(0,1fr);height:min(690px,calc(100vh - 240px));min-height:540px;overflow:hidden;border-radius:17px}
.chat-inbox{display:flex;min-width:0;flex-direction:column;border-right:1px solid #eceef3;background:#fff}
.chat-inbox-heading{display:flex;align-items:center;justify-content:space-between;padding:20px 17px 13px}
.chat-section-kicker{display:block;margin-bottom:5px;color:#a0a7b2;font-size:9px;font-weight:750;letter-spacing:1px}
.chat-inbox-heading h2{margin:0;color:#263043;font:750 17px Manrope,sans-serif;letter-spacing:-.35px}
.chat-total{display:grid;min-width:25px;height:25px;place-items:center;padding:0 6px;border:1px solid #e9e8ff;border-radius:9px;background:#f4f3ff;color:#665de4;font-size:11px;font-weight:700}
.inbox-search{display:flex;align-items:center;gap:8px;height:38px;margin:0 13px 11px;padding:0 11px;border:1px solid #eceef3;border-radius:10px;background:#f8f9fb;color:#9aa2b0}
.inbox-search svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.inbox-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#344052;font-size:11px}
.inbox-search input::placeholder{color:#a4abb6}
.conversation-list{display:flex;min-height:0;flex:1;flex-direction:column;gap:3px;overflow-y:auto;padding:0 8px 12px}
.conversation{display:flex;align-items:center;gap:10px;min-height:68px;width:100%;padding:9px 10px;border:0;border-radius:11px;background:transparent;text-align:left;position:relative;transition:background .15s}
.conversation:hover{background:#f8f8fc}
.conversation.active{background:#f1f0ff}
.conversation .avatar{width:41px;height:41px}
.conversation-text{display:flex;min-width:0;flex:1;flex-direction:column;gap:5px}
.conversation-text strong{overflow:hidden;color:#303a4b;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.conversation-text small{overflow:hidden;color:#8c95a3;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.conversation time{align-self:flex-start;padding-top:2px;color:#a0a7b3;font-size:9px;white-space:nowrap}
.conversation .unread{right:10px;bottom:11px;width:7px;height:7px;border:1px solid #fff}
.conversation.unread-conversation .conversation-text small{color:#4d5667;font-weight:650}
.conversation-empty{display:flex;align-items:center;flex:1;flex-direction:column;justify-content:center;gap:9px;padding:20px 14px;text-align:center}
.conversation-empty strong{color:#374153;font:700 13px Manrope,sans-serif}
.conversation-empty p{max-width:210px;margin:0;color:#929aa8;font-size:11px;line-height:1.55}
.conversation-empty .button{font-size:10px}
.chat-loading,.notification-loading{display:flex;align-items:center;justify-content:center;gap:9px;min-height:120px;color:#929aa8;font-size:12px}
.chat-room{display:flex;min-width:0;min-height:0;flex-direction:column;background:linear-gradient(180deg,#fff,#fcfcfe)}
.chat-welcome{display:flex;align-items:center;flex:1;flex-direction:column;justify-content:center;gap:11px;padding:28px;text-align:center}
.chat-welcome-icon{display:grid;width:62px;height:62px;place-items:center;border:1px solid #e8e6ff;border-radius:20px;background:#f3f2ff;color:#665de4}
.chat-welcome-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.chat-welcome strong{color:#283246;font:750 16px Manrope,sans-serif}
.chat-welcome p{max-width:330px;margin:0 0 4px;color:#8791a0;font-size:12px;line-height:1.6}
.chat-welcome .button{font-size:11px}
.chat-room-head{display:flex;align-items:center;gap:11px;min-height:70px;padding:0 19px;border-bottom:1px solid #eff0f4;background:#fff}
.chat-room-back{display:none;place-items:center;width:34px;height:34px;border:1px solid #e7e9ef;border-radius:10px;background:#fff;color:#687386}
.chat-room-back svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-room-head .avatar{width:42px;height:42px}
.chat-room-person{display:flex;min-width:0;flex-direction:column;gap:4px}
.chat-room-person strong{overflow:hidden;color:#2b3547;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.chat-room-person small{color:#929aa8;font-size:10px}
.chat-room-person small .status-dot{width:7px;height:7px;margin-right:5px;background:#42aa84}
.chat-room-profile{display:grid;width:35px;height:35px;margin-left:auto;place-items:center;border:1px solid #e9eaf0;border-radius:10px;background:#fff;color:#798393}
.chat-room-profile svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.chat-history{display:flex;min-height:0;flex:1;flex-direction:column;gap:13px;overflow:auto;padding:22px clamp(14px,4vw,38px)}
.chat-day-divider{display:flex;align-items:center;gap:12px;margin:3px 0 6px;color:#9aa2af;font-size:9px;font-weight:700;letter-spacing:.7px}
.chat-day-divider:before,.chat-day-divider:after{height:1px;flex:1;background:#eceef2;content:''}
.chat-history-empty{margin:auto;color:#9ba3af;font-size:11px}
.message{max-width:min(76%,420px);padding:10px 13px;border:1px solid #e8eaf0;border-radius:14px;background:#fff;color:#495365;font-size:12px;line-height:1.55;overflow-wrap:anywhere;box-shadow:0 3px 10px #202b3908}
.message.sent{align-self:flex-end;border-color:#e8e6ff;border-bottom-right-radius:4px;background:#f0efff;color:#373765}
.message.received{align-self:flex-start;border-bottom-left-radius:4px}
.message small{display:block;margin-top:5px;color:#9ba2ad;font-size:9px;text-align:right}
.message-composer{display:flex;align-items:center;gap:9px;padding:12px 14px;border-top:1px solid #eff0f4;background:#fff}
.message-composer input{height:42px;min-width:0;flex:1;padding:0 15px;border:1px solid #e7e9ef;border-radius:999px;outline-color:#aaa5f5;background:#f9f9fb;color:#293448;font-size:12px}
.message-composer input::placeholder{color:#a0a7b2}
.message-composer .send-button{display:grid;width:41px;height:41px;place-items:center;border:0;border-radius:50%;background:var(--brand);color:#fff;box-shadow:0 5px 12px #655ce833}
.message-composer .send-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.message-composer .send-button:disabled{opacity:.55;cursor:wait}
.privacy-hint{display:flex;align-items:center;justify-content:center;gap:6px;color:#969eaa;font-size:10px;margin:0}
.privacy-hint svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.chat-new-modal{width:min(100%,430px);max-height:min(640px,86vh);overflow:hidden;display:flex;flex-direction:column;border:1px solid #eceef3;border-radius:18px;background:#fff;box-shadow:0 25px 70px #11182730}
.chat-new-modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 21px 15px;border-bottom:1px solid #eff0f4}
.chat-new-modal-head h2{margin:0;color:#263144;font:750 19px Manrope,sans-serif;letter-spacing:-.45px}
.chat-new-modal-head p{margin:5px 0 0;color:#8c95a2;font-size:11px}
.chat-modal-close{display:grid;width:34px;height:34px;place-items:center;border:1px solid #ebedf2;border-radius:10px;background:#fff;color:#737e8d}
.chat-modal-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.chat-friend-list{display:flex;flex-direction:column;gap:3px;overflow:auto;padding:9px}
.chat-friend-choice{display:flex;align-items:center;gap:11px;width:100%;padding:10px;border:0;border-radius:11px;background:#fff;text-align:left}
.chat-friend-choice:hover{background:#f6f6fc}
.chat-friend-choice .avatar{width:40px;height:40px}
.chat-friend-choice span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:4px}
.chat-friend-choice strong{color:#313b4c;font-size:12px}
.chat-friend-choice small{color:#939ba8;font-size:10px}
.chat-friend-choice>svg{width:17px;height:17px;fill:none;stroke:#857ded;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-modal-empty{display:flex;align-items:center;flex-direction:column;gap:9px;padding:32px 20px;text-align:center}
.chat-modal-empty strong{color:#374153;font:700 13px Manrope,sans-serif}
.chat-modal-empty p{max-width:280px;margin:0 0 4px;color:#8f98a6;font-size:11px;line-height:1.55}
.header-icon .notification-count{position:absolute;top:-3px;right:-5px;display:grid;min-width:17px;height:17px;place-items:center;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#e95d79;color:#fff;font-size:8px;font-weight:800;line-height:1}
.header-icon .notification-count[hidden]{display:none}

.notifications-page{display:flex;flex-direction:column;gap:14px}
.notifications-heading{align-items:flex-end;margin-bottom:2px}
.text-button{display:inline-flex;align-items:center;gap:7px;padding:8px 2px;border:0;background:transparent;color:#665de4;font-size:11px;font-weight:700;white-space:nowrap}
.text-button:disabled{color:#aeb4bf;cursor:not-allowed}
.text-button svg{width:15px;height:15px}
.notifications-card{overflow:hidden;border-radius:16px}
.notification-tabs{display:flex;align-items:center;gap:24px;min-height:53px;padding:0 19px;border-bottom:1px solid #eceef3}
.notification-tabs button{position:relative;display:inline-flex;align-items:center;gap:7px;height:53px;padding:0 2px;border:0;background:transparent;color:#7e8897;font-size:11px;font-weight:600;white-space:nowrap}
.notification-tabs button.active{color:var(--brand);font-weight:750}
.notification-tabs button.active:after{position:absolute;right:0;bottom:-1px;left:0;height:2px;border-radius:2px;background:var(--brand);content:''}
.count-badge{display:grid;min-width:19px;height:19px;place-items:center;padding:0 5px;border-radius:7px;background:#f1f0ff;color:#655ce8;font-size:9px;font-weight:750}
.notification-list{padding:3px 18px}
.notification-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto 8px;align-items:center;gap:12px;min-height:83px;padding:12px 2px;border-bottom:1px solid #f0f1f5;position:relative}
.notification-item:last-child{border-bottom:0}
.notification-item .avatar{width:41px;height:41px}
.notification-copy{min-width:0;color:#606b7a;font-size:12px;line-height:1.55}
.notification-copy strong{color:#303a4b;font-weight:750}
.notification-copy small{display:block;margin-top:4px;color:#9aa2ae;font-size:10px}
.notification-kind{display:inline-flex;align-items:center;gap:6px;margin-top:7px;color:#8370aa;font-size:9px;font-weight:650}
.notification-kind svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.notification-preview{display:block;margin-top:5px;color:#758092;font-size:11px;overflow-wrap:anywhere}
.notification-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.notification-actions .button{padding:8px 10px;font-size:10px}
.notification-actions .button:disabled{opacity:.55;cursor:wait}
.notification-dismiss{display:grid;width:30px;height:30px;place-items:center;border:1px solid #eaecf1;border-radius:9px;background:#fff;color:#8c95a3}
.notification-dismiss:hover{background:#f6f6fb;color:#596477}
.notification-dismiss svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.notification-item.unread-item{margin:0 -10px;padding-right:12px;padding-left:12px;border-radius:10px;background:#f8f7ff}
.notification-item.unread-item:before{position:absolute;top:0;bottom:0;left:0;width:3px;border-radius:3px;background:#7168ed;content:''}
.notification-item .unread-dot{position:static;width:7px;height:7px;border-radius:50%;background:#6f66e9}
.notification-empty{display:flex;align-items:center;flex-direction:column;gap:10px;min-height:255px;justify-content:center;padding:28px;text-align:center}
.notification-empty-icon{display:grid;width:48px;height:48px;place-items:center;border:1px solid #e9e7ff;border-radius:16px;background:#f3f2ff;color:#655ce8}
.notification-empty-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.notification-empty strong{color:#323d4f;font:700 14px Manrope,sans-serif}
.notification-empty p{max-width:330px;margin:0;color:#929aa7;font-size:11px;line-height:1.55}
.notification-empty .button{margin-top:2px;font-size:10px}
.notifications-footnote{margin:0;color:#9ba3ae;font-size:10px;text-align:center}

@media(max-width:760px){
  .chat-page-heading h1,.notifications-heading h1{font-size:24px}
  .chat-layout{height:calc(100dvh - 177px);min-height:420px;grid-template-columns:minmax(0,1fr)}
  .chat-layout:not(.has-active-conversation) .chat-inbox{display:flex}
  .chat-layout:not(.has-active-conversation) .chat-room{display:none}
  .chat-layout.has-active-conversation .chat-inbox{display:none}
  .chat-layout.has-active-conversation .chat-room{display:flex}
  .chat-inbox-heading{padding:16px 14px 12px}
  .conversation-list{padding-right:9px;padding-left:9px}
  .conversation{min-height:70px;padding:9px 10px}
  .conversation .avatar{width:43px;height:43px}
  .conversation-text strong{font-size:12px}
  .conversation-text small{font-size:11px}
  .conversation time{font-size:9px}
  .chat-room-back{display:grid}
  .chat-room-head{min-height:64px;padding:0 11px}
  .chat-room-head .avatar{width:39px;height:39px}
  .chat-history{padding:17px 14px}
  .message{max-width:84%;font-size:12px}
  .message-composer{padding:10px}
  .chat-welcome strong{font-size:15px}
  .privacy-hint{font-size:9px}
  .notifications-heading{align-items:flex-start}
  .notification-tabs{gap:17px;padding:0 13px}
  .notification-tabs button{font-size:10px}
  .notification-list{padding:2px 12px}
  .notification-item{grid-template-columns:39px minmax(0,1fr) auto 7px;gap:9px;min-height:78px}
  .notification-item .avatar{width:38px;height:38px}
  .notification-copy{font-size:11px}
  .notification-actions .button{padding:7px 8px;font-size:9px}
}
@media(max-width:460px){
  .chat-page-heading,.notifications-heading{gap:8px}
  .chat-page-heading h1,.notifications-heading h1{font-size:21px}
  .chat-page-heading .muted,.notifications-heading .muted{font-size:11px}
  .chat-page-heading .button{padding:10px;font-size:10px}
  .chat-page-heading .button svg{width:14px;height:14px}
  .chat-layout{height:calc(100dvh - 160px);min-height:390px}
  .chat-room-profile{width:32px;height:32px}
  .message-composer input{height:40px;padding:0 12px;font-size:11px}
  .message-composer .send-button{width:38px;height:38px}
  .notification-tabs{justify-content:space-between;gap:7px;padding:0 10px}
  .notification-tabs button{gap:5px;font-size:9px}
  .notification-list{padding-right:9px;padding-left:9px}
  .notification-item{grid-template-columns:35px minmax(0,1fr) 7px;gap:8px;padding-top:11px;padding-bottom:11px}
  .notification-item .avatar{width:34px;height:34px}
  .notification-actions{grid-column:2;grid-row:2;justify-content:flex-start;margin-top:2px}
  .notification-item .unread-dot{grid-column:3;grid-row:1}
  .notification-copy{font-size:10px}
  .notification-copy small{font-size:9px}
  .notification-preview{font-size:10px}
  .text-button{gap:4px;font-size:9px}
  .text-button svg{width:13px;height:13px}
}

/* Keep the shared shell inside the real mobile viewport at normal zoom. */
@media(max-width:760px){
  html,body{width:100%;min-width:0;max-width:100%;overflow-x:clip}
  #site-header,.site-header,.page-layout,.main-column{min-width:0;max-width:100%}
  .site-header{width:100%;gap:clamp(7px,2.6vw,12px);padding-inline:clamp(10px,3.5vw,14px)}
  .wordmark{flex:0 1 auto;min-width:0;gap:7px;white-space:nowrap}
  .header-search{flex:1 1 0;width:auto;min-width:0;max-width:none}
  .header-search input{width:100%;min-width:0}
  .header-actions{flex:0 0 auto;min-width:0;gap:4px}
  .user-control{flex:0 0 auto;min-width:0}
  .page-layout{width:100%;margin:0;padding-right:14px;padding-left:14px}
  .main-column{width:100%;margin-right:auto;margin-left:auto}
  #mobile-nav.mobile-nav{width:100%;max-width:100%;box-sizing:border-box}
}
@media(max-width:390px){
  .wordmark>span:not(.logo-mark){display:none}
}

/* Profile photo controls in Settings → Profile information. */
.profile-photo-settings{display:flex;align-items:center;gap:16px;padding:16px;margin:0 0 19px;border:1px solid #e7e9f0;border-radius:14px;background:linear-gradient(120deg,#fbfbff,#f7f7fb)}
.profile-photo-settings-preview{display:grid;width:78px;height:78px;flex:none;place-items:center;overflow:hidden;border:3px solid #fff;border-radius:50%;background:#e8e9ff;box-shadow:0 3px 12px rgba(27,36,55,.1)}
.profile-photo-settings-preview .avatar{width:72px;height:72px;border:0;font-size:18px}
.profile-photo-settings-copy{display:flex;min-width:0;flex:1;align-items:flex-start;flex-direction:column;gap:5px}
.profile-photo-settings-copy>strong{color:#303b4d;font-size:14px}
.profile-photo-settings-copy>p{margin:0 0 3px;color:#7f8999;font-size:12px;line-height:1.5}
.profile-photo-settings-copy>small{color:#939baa;font-size:10px;line-height:1.4}
.profile-photo-settings-copy>#profile-photo-status{color:#5f58d9;font-size:11px;line-height:1.45}
.profile-photo-settings-copy .button:disabled{opacity:.65;cursor:wait}

/* Keep the inbox list and active conversation readable on phones. */
@media(max-width:760px){
  body[data-page="chats"] .page-layout{padding-top:15px;padding-bottom:8px}
  body[data-page="chats"] .chats-page{gap:11px}
  .chat-page-heading{align-items:center}
  .chat-layout{display:block;width:100%;height:calc(100dvh - 235px);min-height:280px;max-height:680px}
  .chat-layout .chat-inbox{height:100%;padding:7px 0 9px;border-right:0}
  .chat-layout .conversation{display:flex;align-items:center;flex-direction:row;gap:10px;min-height:68px;padding:10px 13px;text-align:left}
  .chat-layout .conversation>.avatar{width:43px;height:43px;flex:0 0 43px}
  .chat-layout .conversation-text{width:auto;min-width:0;flex:1}
  .chat-layout .conversation-text strong{max-width:100%;font-size:12px}
  .chat-layout .conversation-text small{display:block;max-width:100%;font-size:10px}
  .chat-layout .conversation time{display:block;align-self:center;flex:none;padding:0 1px 0 0;font-size:9px}
  .chat-layout .conversation .unread{position:static;flex:0 0 7px;margin:0}
  .chat-layout.has-active-conversation .chat-room{height:100%;min-height:0}
  .chat-layout .chat-room-head{flex:0 0 auto;min-height:64px;padding:0 12px}
  .chat-layout .chat-room-person{min-width:0;flex:1}
  .chat-layout .chat-room-profile{flex:none}
  .chat-layout .chat-history{min-height:0;flex:1;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:16px 12px}
  .chat-layout .message-composer{flex:0 0 auto;padding:9px 10px calc(9px + env(safe-area-inset-bottom))}
  .chat-layout .message-composer input{min-width:0;font-size:16px}
  body[data-page="chats"] .privacy-hint{margin:5px 0}
}
@media(max-width:390px){
  .chat-layout .conversation time{display:none}
  .chat-layout .conversation{gap:9px;padding-right:12px;padding-left:12px}
  .chat-page-heading .button{padding:9px 10px}
}
@media(max-width:760px) and (max-height:560px){
  body[data-page="chats"] .page-layout{padding-top:8px}
  .chat-page-heading .muted{display:none}
  .chat-layout{height:calc(100dvh - 210px);min-height:180px}
  .chat-layout .chat-room-head{min-height:54px}
}


/* Unified text and video composer */
.create-format-label{display:block;margin:14px 0 7px;color:#667183;font-size:12px;font-weight:700}
.create-format-select{width:100%;padding:11px 12px;border:1px solid #e5e7ed;border-radius:9px;background:#fff;color:var(--ink);font:500 13px 'DM Sans',sans-serif;outline-color:#aaa5f5}
#text-post-fields textarea,#video-post-fields textarea{width:100%;min-height:125px;margin-top:12px;padding:13px;border:1px solid #e5e7ed;border-radius:10px;outline-color:#aaa5f5;resize:vertical;font:400 13px/1.6 'DM Sans',sans-serif}
.create-video-upload{margin-top:12px;min-height:210px}
.create-video-upload input{position:absolute;width:1px;height:1px;opacity:0}
.create-signin-hint{padding:10px 12px;background:#f5f4ff;border-radius:9px;font-size:12px;color:#5c56c8}
.create-signin-hint a{font-weight:700;text-decoration:underline}

/* Personal content library */
.my-content-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:16px;margin:0 0 18px}
.my-content-stats>div{display:flex;flex-direction:column;align-items:center;gap:5px;border-right:1px solid var(--line)}
.my-content-stats>div:last-child{border-right:0}
.my-content-stats strong{font:800 20px Manrope;color:var(--ink)}
.my-content-stats span{font-size:9px;color:var(--muted)}
.my-content-filters{display:flex;gap:7px;border-bottom:1px solid var(--line);margin:0 0 20px}
.my-content-filters button{padding:11px 13px;border:0;border-bottom:2px solid transparent;background:transparent;color:#7d8794;font-size:10px}
.my-content-filters button.active{border-bottom-color:var(--brand);color:var(--brand);font-weight:700}
.my-content-section{margin:0 0 27px}
.my-content-section[hidden]{display:none}
.my-content-section>.section-heading{margin:0 1px 12px}
.my-content-video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.my-content-video{position:relative;overflow:hidden;min-width:0;aspect-ratio:3/4;background:#202533}
.my-content-video video{width:100%;height:100%;object-fit:cover;display:block}
.my-content-watch{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);width:42px;height:42px;border:1px solid #ffffff80;border-radius:50%;background:#171e2a88;color:white;font-size:17px}
.my-content-video-copy{position:absolute;left:0;right:0;bottom:0;padding:28px 10px 10px;background:linear-gradient(transparent,#111a);color:#fff;display:flex;flex-direction:column;gap:5px}
.my-content-video-copy strong{font-size:9px;line-height:1.4;overflow-wrap:anywhere}
.my-content-video-copy small{font-size:8px;color:#ffffffb8}
@media(max-width:760px){.my-content-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.my-content-stats{padding:13px 7px}.my-content-stats strong{font-size:17px}.my-content-stats span{font-size:8px}.my-content-filters{gap:2px}.my-content-filters button{padding:10px 9px;font-size:9px}}


/* Sidebar navigation: keep every destination on its own clean row. */
#left-sidebar{min-width:0;width:100%}
#left-sidebar .side-menu{display:flex;flex-direction:column;align-items:stretch;gap:5px;width:100%;box-sizing:border-box}
#left-sidebar .side-menu>a{position:relative;display:flex;flex:0 0 auto;align-items:center;justify-content:flex-start;gap:11px;width:100%;min-width:0;height:46px;min-height:46px;box-sizing:border-box;padding:0 10px;line-height:1.2;white-space:nowrap;overflow:hidden}
#left-sidebar .side-menu>a::before,#left-sidebar .side-menu>a::after{content:none!important;display:none!important}
#left-sidebar .side-menu>a .side-glyph{display:grid;flex:0 0 34px;width:34px;height:34px;place-items:center}
#left-sidebar .side-menu>a .side-link-label{display:block;flex:1 1 auto;min-width:0;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#left-sidebar .side-menu>a .side-count{flex:0 0 auto;margin-left:auto}


/* Homepage community reels and comment dialog */
.action-svg{width:17px;height:17px;display:inline-block;vertical-align:middle;flex:none}
.post-actions button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.post-actions button.liked{color:#e36b7d}
.post-meta [data-like-count]{display:inline-flex;align-items:center;gap:5px}
.post-comment-total{border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;padding:0}
.home-reels-section{margin:18px 0 20px}
.home-reels-section[hidden]{display:none}
.home-reels-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}
.home-reels-heading h2{font:700 15px Manrope,sans-serif;margin:0;color:var(--ink)}
.home-reels-heading p{margin:4px 0 0;font-size:11px}
.home-reels-heading>a{font-size:11px;color:var(--brand);font-weight:700;text-decoration:none}
.home-reels-list{display:flex;gap:12px;overflow-x:auto;padding:2px 1px 9px;scroll-snap-type:x mandatory}
.home-reel-card{position:relative;display:flex;flex:0 0 150px;flex-direction:column;justify-content:flex-end;height:210px;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#171c2b;scroll-snap-align:start;color:white}
.home-reel-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78}
.home-reel-card:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.8));pointer-events:none}
.home-reel-card>button{position:absolute;z-index:2;top:10px;right:10px;width:32px;height:32px;display:grid;place-items:center;border:1px solid #ffffff75;border-radius:50%;background:#11182788;color:white}
.home-reel-card>button svg{width:16px;height:16px;fill:currentColor}
.home-reel-card>div{position:relative;z-index:2;padding:12px}
.home-reel-card strong,.home-reel-card small{display:block;color:white}
.home-reel-card strong{font-size:11px}
.home-reel-card small{font-size:9px;opacity:.8;margin-top:3px}
.home-reel-card p{margin:5px 0 0;font-size:10px;line-height:1.35;color:white;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.comments-modal-backdrop{position:fixed;inset:0;z-index:1300;display:grid;place-items:center;padding:16px;background:rgba(13,20,34,.58);backdrop-filter:blur(4px)}
.comments-modal{width:min(100%,560px);height:min(760px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:0 24px 80px rgba(10,18,35,.28)}
.comments-modal>header{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid var(--line)}
.comments-modal>header h2{margin:0;font:750 20px Manrope,sans-serif;color:var(--ink)}
.comments-modal>header p{margin:4px 0 0;color:var(--muted);font-size:11px}
.comments-modal>header>button{width:34px;height:34px;border:0;border-radius:50%;background:#f0f2f6;color:#4b5563;font-size:23px}
.modal-comment-list{flex:1;overflow:auto;padding:16px}
.comment-thread{margin:0 0 13px;padding-left:12px;border-left:2px solid #eceef5}
.comment-item{display:flex;align-items:flex-start;gap:9px}
.comment-avatar .avatar{width:32px;height:32px;font-size:10px}
.comment-body{min-width:0;flex:1;padding:9px 11px;border-radius:11px;background:#f6f7fa}
.comment-body>strong{font-size:12px;color:#344052}
.comment-body>p{margin:5px 0;color:#566173;font-size:12px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-meta{display:flex;align-items:center;gap:12px}
.comment-meta small{color:#8993a2;font-size:10px}
.comment-meta button{border:0;background:none;padding:0;color:var(--brand);font-size:11px;font-weight:700}
.reply-form{display:flex;gap:7px;margin-top:8px}
.reply-form input,.modal-comment-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:999px;padding:10px 12px;background:var(--paper);color:var(--ink);font-size:12px}
.reply-form button{border:0;border-radius:999px;padding:0 13px;background:var(--brand);color:white;font-size:11px;font-weight:700}
.modal-comment-form{display:flex;align-items:center;gap:9px;padding:13px 16px;border-top:1px solid var(--line)}
.modal-comment-form button{display:grid;place-items:center;width:40px;height:40px;flex:none;border:0;border-radius:50%;background:var(--brand);color:white}
.modal-comment-form svg{width:18px;height:18px}
@media(max-width:560px){.comments-modal-backdrop{padding:0}.comments-modal{width:100%;height:100dvh;max-height:100dvh;border-radius:0}.home-reel-card{flex-basis:132px;height:190px}}


/* TikTok-style comment threads */
.comment-thread{margin:0 0 18px;padding:0;border:0}
.comment-item{display:flex;align-items:flex-start;gap:10px;padding:0}
.comment-avatar .avatar{width:38px;height:38px;font-size:11px}
.comment-content{min-width:0;flex:1}
.comment-bubble{padding:0;background:transparent;border-radius:0}
.comment-bubble>strong{display:block;color:var(--ink);font-size:13px;font-weight:750;line-height:1.4}
.comment-bubble>p{margin:4px 0 6px;color:var(--ink);font-size:13px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-actions{display:flex;align-items:center;gap:16px;margin:0 0 2px}
.comment-actions small{color:#8b93a2;font-size:11px}
.comment-actions button{padding:0;border:0;background:none;color:#777f8d;font-size:11px;font-weight:700}
.comment-actions button:hover{color:var(--brand)}
.comment-like{display:flex;flex-direction:column;align-items:center;gap:3px;flex:none;min-width:28px;margin:5px 1px 0;padding:3px 2px;border:0;background:transparent;color:#8b93a2;font-size:10px}
.comment-like svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.comment-like.is-liked{color:#f04468}
.comment-like.is-liked svg{fill:#f04468;stroke:#f04468}
.comment-like:disabled{opacity:.55}
.comment-replies{margin:11px 0 0 47px;padding-left:13px;border-left:1px solid #e7e9ef}
.comment-replies .comment-thread{margin-bottom:13px}
.comment-replies .comment-avatar .avatar{width:30px;height:30px}
.reply-form{display:flex;align-items:center;gap:8px;margin:10px 0 4px;padding:8px;border:1px solid #e8eaf0;border-radius:14px;background:#fff}
.reply-form[hidden]{display:none}
.reply-form input{padding:9px 11px;border:0!important;background:transparent!important;outline:none;font-size:12px}
.reply-form button{min-height:34px;padding:0 14px;border-radius:999px;background:var(--brand);font-size:11px}
.modal-comment-list{padding:20px 22px}
.modal-comment-form{padding:14px 18px;background:var(--paper)}
.modal-comment-form input{padding:12px 15px;background:#f7f8fb;border-color:#e9ebf1}
@media(max-width:560px){
  .modal-comment-list{padding:17px 15px}
  .comment-avatar .avatar{width:34px;height:34px}
  .comment-replies{margin-left:38px;padding-left:10px}
}

/* Post options and reporting */
.post-menu-wrap{position:relative;margin-left:auto;flex:none}
.post-menu-wrap .more-button{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--muted,#737b8c);font-size:24px;line-height:1;cursor:pointer}
.post-menu-wrap .more-button:hover,.post-menu-wrap .more-button[aria-expanded="true"]{background:var(--paper,#f3f5f9);color:var(--ink)}
.post-options-menu{position:absolute;z-index:30;right:0;top:calc(100% + 5px);width:190px;padding:6px;border:1px solid var(--line,#e8eaf0);border-radius:13px;background:#fff;box-shadow:0 12px 34px rgba(22,30,55,.16)}
.post-options-menu[hidden]{display:none}
.post-options-menu button{display:block;width:100%;padding:11px 12px;border:0;border-radius:8px;background:transparent;color:var(--ink,#202637);text-align:left;font-size:13px;cursor:pointer}
.post-options-menu button:hover{background:#f4f5f9}
.post-options-menu .post-option-report{color:#c47720}
.post-options-menu .post-option-danger{color:#d64545}
.report-modal-backdrop{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:18px;background:rgba(15,20,35,.58)}
.report-modal{position:relative;width:min(100%,440px);padding:26px;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(0,0,0,.22);display:flex;flex-direction:column;gap:11px}
.report-modal h2{margin:0;color:#202637;font-size:21px}
.report-modal p{margin:0 0 6px;color:#737b8c;font-size:13px;line-height:1.5}
.report-modal label{margin-top:5px;color:#30384a;font-size:12px;font-weight:700}
.report-modal select,.report-modal textarea{width:100%;padding:12px;border:1px solid #e1e5ed;border-radius:10px;background:#fff;color:#202637;font:inherit;font-size:13px}
.report-modal textarea{min-height:92px;resize:vertical}
.report-modal .button{margin-top:8px;justify-content:center}
.report-close{position:absolute;right:14px;top:10px;width:34px;height:34px;border:0;border-radius:50%;background:#f3f5f9;color:#596174;font-size:22px;cursor:pointer}


/* TikTok-style Reels experience */
body[data-page="reels"]{background:#0d0e12}
body[data-page="reels"] .site-header{background:#111217;border-color:#262832;color:#fff}
body[data-page="reels"] .site-header .wordmark,body[data-page="reels"] .site-header .top-navigation a,body[data-page="reels"] .site-header .header-icon,body[data-page="reels"] .site-header .user-control{color:#f5f5f7}
body[data-page="reels"] .page-layout{max-width:none;display:block;padding:0}
body[data-page="reels"] #left-sidebar,body[data-page="reels"] #right-sidebar{display:none}
body[data-page="reels"] .reels-page{max-width:none;width:100%;margin:0}
body[data-page="reels"] .reels-page-heading{position:absolute;z-index:4;top:84px;left:50%;transform:translateX(-50%);width:min(100% - 32px,520px);display:flex;align-items:center;justify-content:space-between;pointer-events:none}
body[data-page="reels"] .reels-page-heading>div{display:none}
body[data-page="reels"] .reels-create-link{pointer-events:auto;background:#ffffff20;border:1px solid #ffffff55;color:#fff;box-shadow:none}
body[data-page="reels"] #mobile-nav{display:none}
body[data-page="reels"] .reels-feed{height:calc(100dvh - 72px);min-height:520px;max-height:none;width:100%;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;gap:0;padding:0;scroll-snap-type:y mandatory;scrollbar-width:none;background:#0d0e12}
body[data-page="reels"] .reels-feed::-webkit-scrollbar{display:none}
body[data-page="reels"] .tiktok-reel-card{position:relative;flex:0 0 min(100%,850px);width:min(100%,480px);height:calc(100dvh - 72px);min-height:520px;min-width:0;max-height:850px;border-radius:0;overflow:hidden;background:#090a0d;box-shadow:none;scroll-snap-align:start;scroll-snap-stop:always}
.tiktok-reel-card .reel-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#090a0d}
.tiktok-reel-card .reel-card-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0005 0%,transparent 25%,transparent 55%,#000b 100%);pointer-events:none}
.tiktok-reel-card .reel-open{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color:transparent;z-index:1}
.tiktok-reel-card .reel-open span{display:none}
.tiktok-reel-card .reel-card-details{position:absolute;z-index:2;left:18px;right:86px;bottom:28px;color:#fff;display:flex;flex-direction:column;gap:11px}
.tiktok-reel-card .reel-card-details .reel-author{display:flex;align-items:center;gap:9px;color:#fff}
.tiktok-reel-card .reel-author .avatar{width:40px;height:40px;border:1px solid #ffffff88}
.tiktok-reel-card .reel-author span{display:flex;flex-direction:column;gap:4px}
.tiktok-reel-card .reel-author strong{font-size:13px}
.tiktok-reel-card .reel-author small{font-size:10px;color:#ffffffbd}
.tiktok-reel-card .reel-card-details p{font-size:13px;line-height:1.5;margin:0;color:#fff;overflow-wrap:anywhere}
.reel-feed-actions{position:absolute;z-index:3;right:15px;bottom:30px;display:flex;flex-direction:column;align-items:center;gap:22px}
.reel-feed-actions button,.reel-viewer-actions button{display:flex;flex-direction:column;align-items:center;gap:5px;border:0;background:transparent;color:#fff;text-shadow:0 1px 5px #0009;padding:4px}
.reel-feed-actions b,.reel-feed-actions button:first-child{font-size:30px}
.reel-feed-actions small{font-size:11px;font-weight:700}
.reel-feed-actions button.is-liked,.reel-viewer-actions button.is-liked{color:#ff4776}
.reel-viewer.tiktok-viewer{z-index:50}
.tiktok-viewer .reel-viewer-shell{width:min(100vw,560px);height:min(92dvh,900px);max-height:900px}
.tiktok-viewer .reel-viewer-frame{height:100%;width:100%;position:relative;background:#050505}
.tiktok-viewer .reel-viewer-frame>video{width:100%;height:100%;object-fit:contain;background:#050505}
.tiktok-viewer .reel-viewer-info{position:absolute;left:18px;right:85px;bottom:24px;z-index:3;color:#fff}
.tiktok-viewer .reel-viewer-info p{font-size:13px;line-height:1.5}
.reel-viewer-actions{position:absolute;right:14px;bottom:28px;z-index:5;display:flex;flex-direction:column;gap:18px}
.reel-viewer-actions button b{font-size:29px;line-height:1}
.reel-viewer-actions button small{font-size:11px;font-weight:700}
.tiktok-viewer .reel-viewer-close,.tiktok-viewer .reel-viewer-step{z-index:8}
.reel-comments-panel{position:absolute;z-index:7;right:0;top:0;bottom:0;width:min(360px,88vw);background:#fff;color:#202433;display:flex;flex-direction:column;box-shadow:-10px 0 35px #0004}
.reel-comments-panel[hidden]{display:none}
.reel-comments-panel>header{height:58px;flex:none;border-bottom:1px solid #eceef2;display:flex;align-items:center;justify-content:space-between;padding:0 16px}
.reel-comments-panel>header strong{font-size:14px}
.reel-comments-panel>header button{border:0;background:transparent;font-size:24px;color:#737b89}
.reel-comments-list{flex:1;overflow:auto;padding:14px}
.reel-comment{padding:10px 0;border-bottom:1px solid #f0f1f4;font-size:12px}
.reel-comment strong{font-size:11px}
.reel-comment p{margin:5px 0;color:#394253;line-height:1.5;overflow-wrap:anywhere}
.reel-comment small{font-size:9px;color:#9299a5}
.reel-comment>button{border:0;background:transparent;color:#665ce3;font-size:10px;margin-left:10px}
.reel-comment form{display:flex;gap:6px;margin-top:8px}
.reel-comment form input,.reel-comment-form input{min-width:0;flex:1;border:1px solid #e4e6ec;border-radius:18px;padding:9px 12px;font-size:11px}
.reel-comment form button,.reel-comment-form button{border:0;background:#655ce8;color:#fff;border-radius:18px;padding:0 13px;font-size:10px;font-weight:700}
.reel-comment article{margin:8px 0 0 14px;padding-left:10px;border-left:2px solid #ecebff}
.reel-comment-form{display:flex;gap:8px;padding:12px;border-top:1px solid #eceef2}
.reel-comment-form button{padding:0 17px}
.reel-comment-signin{padding:14px;font-size:11px;color:#6e7787}
.reel-comment-signin a{color:#655ce8;font-weight:700}
@media(max-width:700px){
 body[data-page="reels"] .site-header{height:58px;padding:0 14px;gap:10px}
 body[data-page="reels"] .site-header .wordmark{min-width:0;font-size:17px}
 body[data-page="reels"] .site-header .header-search,body[data-page="reels"] .site-header .top-navigation,body[data-page="reels"] .site-header .user-control{display:none}
 body[data-page="reels"] .reels-feed{height:calc(100dvh - 58px);min-height:450px}
 body[data-page="reels"] .reels-page-heading{top:66px}
 body[data-page="reels"] .tiktok-reel-card{height:calc(100dvh - 58px);min-height:450px}
 .tiktok-viewer .reel-viewer-shell{height:100dvh;width:100vw;max-height:none}
 .tiktok-viewer .reel-viewer-frame>video{object-fit:cover}
 .reel-comments-panel{width:min(100%,390px)}
}


/* Voice and video calls */
.chat-call-actions{display:flex;align-items:center;gap:7px;margin-left:auto}
.chat-call-actions button{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface,#fff);color:var(--ink);cursor:pointer}
.chat-call-actions button:hover{background:var(--surface-soft,#f3f5fa);color:var(--brand)}
.chat-call-actions svg,.call-controls svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.call-backdrop{position:fixed;inset:0;z-index:1000;background:#080b13d9;display:grid;place-items:center;padding:18px}
.call-window{width:min(100%,520px);min-height:300px;background:#171923;color:#fff;border:1px solid #ffffff20;border-radius:22px;overflow:hidden;box-shadow:0 24px 80px #0008;display:flex;flex-direction:column}
.call-window>header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 20px;border-bottom:1px solid #ffffff1c}
.call-window>header strong{font-size:15px}.call-window>header span{font-size:12px;color:#c9ccda}
.call-video-stage{position:relative;flex:1;min-height:300px;background:#090b10;display:grid;place-items:center;overflow:hidden}
.call-video-stage video[data-remote-video]{width:100%;height:100%;min-height:300px;max-height:65vh;object-fit:contain}
.call-video-stage video[data-local-video]{position:absolute;right:14px;bottom:14px;width:112px;height:150px;object-fit:cover;border:2px solid #fff;border-radius:12px;background:#242631}
.call-video-stage video[hidden]{display:none}
.call-video-stage[data-audio-call] video{display:none}
.call-audio-avatar{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.call-audio-avatar .avatar{width:86px;height:86px;font-size:25px}
.call-controls{display:flex;align-items:center;justify-content:center;gap:18px;padding:18px}
.call-controls button{min-width:48px;height:48px;padding:0 16px;border:0;border-radius:28px;background:#353947;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-weight:700}
.call-controls button[hidden]{display:none}
.call-controls .call-end-button{background:#e34255}
.call-controls .call-accept-button{background:#16a36a}
.call-controls button.is-muted{background:#a83b48}
.call-incoming{min-height:0;padding:30px;align-items:center;justify-content:center;text-align:center;gap:12px}
.call-incoming h2{margin:0;font-size:22px}.call-incoming p{color:#c9ccda;margin:0}
@media(max-width:560px){.chat-call-actions{gap:4px}.chat-call-actions button{width:32px;height:32px}.call-backdrop{padding:0}.call-window{width:100%;min-height:100dvh;border-radius:0}.call-video-stage{min-height:55vh}.call-video-stage video[data-remote-video]{max-height:75vh}}


/* Responsive chat call controls: paired on wider screens, chooser on phones */
.chat-call-actions{flex:0 0 auto;position:relative;margin-left:auto;display:flex;align-items:center;justify-content:center;min-width:0}
.chat-call-desktop{display:flex;flex-direction:row!important;align-items:center;gap:8px}
.chat-call-desktop button,.chat-call-menu-toggle{width:36px;height:36px;flex:0 0 36px;border:1px solid #e8eaf0;border-radius:50%;background:#fff;color:#354052;display:grid;place-items:center;padding:0}
.chat-call-mobile{display:none;position:relative}
.chat-call-mobile svg,.chat-call-desktop svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-call-menu[hidden]{display:none!important}
.chat-call-menu{position:absolute;z-index:30;top:calc(100% + 9px);right:0;width:158px;padding:6px;background:#fff;border:1px solid #e8eaf0;border-radius:12px;box-shadow:0 12px 30px #17202f20;display:flex;flex-direction:column!important;gap:3px!important}
.chat-call-menu button{display:flex;flex-direction:row!important;align-items:center;justify-content:flex-start;gap:9px;width:100%;height:40px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:#273246;font-size:12px;font-weight:600;text-align:left}
.chat-call-menu button:hover{background:#f3f4fa}
.chat-call-menu svg{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-room-head{min-width:0;gap:clamp(6px,1.2vw,12px)}
.chat-room-person{flex:1 1 auto;min-width:0}
.chat-room-profile{flex:0 0 35px;margin-left:0}
@media(max-width:760px){
 .chat-call-desktop{display:none!important}
 .chat-call-mobile{display:block}
 .chat-call-menu{right:-4px}
 .chat-room-head{padding:0 9px;gap:7px}
 .chat-room-head .avatar{width:34px;height:34px;flex:0 0 34px}
 .chat-room-person strong{font-size:11px}
 .chat-room-person small{font-size:8px}
 .chat-call-menu-toggle{width:34px;height:34px;flex-basis:34px}
 .chat-room-profile{width:34px;height:34px;flex-basis:34px}
}


/* WhatsApp-inspired conversation overflow menu */
.chat-header-menu-wrap{position:relative;display:flex;align-items:center;flex:0 0 auto;margin-left:auto}
.chat-header-menu-toggle{width:38px;height:38px;display:grid;place-items:center;border:1px solid #e8eaf0;border-radius:50%;background:#fff;color:#344054;padding:0;cursor:pointer}
.chat-header-menu-toggle svg{width:19px;height:19px;fill:currentColor}
.chat-header-menu[hidden]{display:none!important}
.chat-header-menu{position:absolute;z-index:50;top:calc(100% + 8px);right:0;width:224px;max-height:min(76vh,560px);overflow:auto;padding:6px;background:#fff;border:1px solid #e8eaf0;border-radius:12px;box-shadow:0 14px 38px #17202f24;display:flex;flex-direction:column;gap:2px}
.chat-header-menu button{width:100%;min-height:38px;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;padding:0 10px;border:0;border-radius:7px;background:transparent;color:#263244;text-align:left;font-size:12px;font-weight:500;cursor:pointer}
.chat-header-menu button:hover{background:#f2f4f7}
.chat-header-menu .menu-symbol{width:18px;flex:0 0 18px;text-align:center;font-size:17px;color:#586579}
.chat-menu-divider{height:1px;background:#e9ecf1;margin:5px 2px}
.chat-message-search{width:calc(100% - 24px);margin:10px 12px 0;padding:10px 12px;border:1px solid #e4e8ef;border-radius:9px;outline-color:var(--brand);font-size:13px}
.chat-room.chat-room-soft-theme .chat-history{background:#f1f4ed}
.chat-room.chat-room-soft-theme .message.received{background:#fff}
.chat-room.chat-room-soft-theme .message.sent{background:#d9fdd3;border-color:#c8f0c1}
@media(max-width:760px){.chat-header-menu-toggle{width:34px;height:34px}.chat-header-menu{right:0;width:min(224px,calc(100vw - 28px))}}

.chat-header-menu .chat-menu-icon{width:18px;height:18px;flex:0 0 18px;display:block;color:#586579}
.chat-header-menu button:hover .chat-menu-icon{color:#263244}

.chat-inbox-tabs{display:flex;gap:8px;padding:0 14px 12px}.chat-inbox-tab{flex:1;padding:9px 12px;border:1px solid #e8eaf0;border-radius:9px;background:#fff;color:#647084;font-size:12px;font-weight:650;cursor:pointer}.chat-inbox-tab.active{background:#eef0ff;border-color:#d9dcff;color:#4546a5}
.call-history-row{width:100%;display:flex;align-items:center;gap:11px;padding:12px 14px;border:0;border-bottom:1px solid #f0f1f4;background:#fff;text-align:left;cursor:pointer}.call-history-row:hover{background:#f8f9fc}.call-history-row .avatar{width:40px;height:40px}.call-history-details{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}.call-history-details strong{font-size:12px;color:#273246}.call-history-details small,.call-history-details time{font-size:10px;color:#8993a2}.call-history-details small.is-missed,.call-history-type.is-missed{color:#d34d55}.call-history-type svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.call-history-type{color:#5e9b78}

.chat-selection-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:0 14px 10px}.chat-selection-controls button{border:1px solid #e5e8ef;background:#fff;color:#4b5565;border-radius:8px;padding:6px 10px;font-size:11px;font-weight:650}.chat-selection-controls button:disabled{opacity:.4}.conversation-row-wrap{position:relative}.conversation-row-wrap.is-selected .conversation{background:#eef1ff}.chat-select-check{width:18px;height:18px;flex:0 0 18px;border:1.5px solid #aab3c2;border-radius:50%;display:grid;place-items:center;font-size:11px;color:#fff}.chat-select-check.checked{background:#4e57c8;border-color:#4e57c8}
.message-wrap{position:relative;display:flex;align-items:flex-end;gap:4px;max-width:88%;margin:4px 10px}.message-wrap.own-message{margin-left:auto;justify-content:flex-end}.message-wrap.other-message{margin-right:auto}.message-wrap .message{max-width:100%;margin:0}.message-more{width:25px;height:25px;flex:0 0 25px;border:0;border-radius:50%;background:transparent;color:#718096;display:grid;place-items:center;opacity:.65}.message-more svg{width:16px;height:16px;fill:currentColor}.message-more:hover{background:#e9edf3}.message-action-backdrop{position:fixed;inset:0;z-index:1200;background:#10182830;display:flex;align-items:center;justify-content:center}.message-action-sheet,.chat-edit-modal{width:min(92vw,390px);padding:18px;background:#fff;border-radius:14px;box-shadow:0 20px 55px #10182835}.message-action-sheet{display:flex;flex-direction:column;gap:6px}.message-action-sheet button{padding:12px;border:0;border-radius:8px;background:#f6f7fa;text-align:left;color:#263244}.chat-edit-modal h2{margin:0 0 12px;font-size:18px}.chat-edit-modal p{color:#667085;font-size:13px;line-height:1.5}.chat-edit-modal textarea{width:100%;min-height:105px;resize:vertical;border:1px solid #d8deea;border-radius:9px;padding:11px;font:inherit;font-size:13px}.chat-edit-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.chat-edit-actions button{padding:9px 14px;border:1px solid #e2e6ee;border-radius:8px;background:#fff;color:#344054}.chat-edit-actions button[type=submit],.chat-edit-actions button.danger{background:#d94747;color:white;border-color:#d94747}
@media(max-width:650px){.message-wrap{max-width:95%}.message-more{opacity:1}}

/* WhatsApp-style message action affordance */
.message-wrap{position:relative}
.message-more{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease}
.message-wrap:hover .message-more,.message-more:focus-visible{opacity:1;visibility:visible;pointer-events:auto}
.wa-message-menu-backdrop{position:fixed;inset:0;z-index:1400;background:transparent}
.wa-message-menu{position:fixed;z-index:1401;width:210px;max-width:calc(100vw - 24px);padding:7px 0;background:#202020;color:#f3f3f3;border:1px solid #363636;border-radius:12px;box-shadow:0 10px 28px #0006;display:flex;flex-direction:column;max-height:calc(100vh - 24px);overflow:auto}
.wa-message-menu button{height:37px;padding:0 14px;border:0;background:transparent;color:#f4f4f4;display:flex;align-items:center;gap:13px;text-align:left;font-size:13px;font-weight:500;cursor:pointer}
.wa-message-menu button:hover{background:#333}
.wa-menu-icon{width:17px;flex:0 0 17px;font-size:17px;color:#e5e5e5;text-align:center}
.wa-menu-separator{height:1px;background:#3a3a3a;margin:6px 10px}
.wa-reaction-backdrop{position:fixed;inset:0;z-index:1402;background:#0003;display:flex;align-items:center;justify-content:center}
.wa-reaction-picker{display:flex;gap:8px;padding:12px;background:#202020;border-radius:28px}
.wa-reaction-picker button{border:0;background:transparent;font-size:25px;cursor:pointer}
@media(hover:none),(max-width:760px){.message-more{display:none!important}.message-wrap{touch-action:pan-y}.wa-message-menu{width:190px}}

/* Refined conversation bubbles and compact WhatsApp-like message actions */
.chat-history{padding:22px clamp(12px,3vw,30px) 28px;background-color:#f5f6f7;background-image:radial-gradient(#dfe3e8 0.65px,transparent .65px);background-size:17px 17px}
.message-wrap{width:fit-content;max-width:min(78%,620px);margin:7px 0;gap:5px;align-items:center}
.message-wrap.own-message{margin-left:auto}.message-wrap.other-message{margin-right:auto}
.message{padding:10px 13px 7px;border-radius:12px;box-shadow:0 1px 1px #17203312;line-height:1.45;font-size:13px;overflow-wrap:anywhere}
.message.sent{background:#d9fdd3;color:#1f3324;border-top-right-radius:4px}
.message.received{background:#fff;color:#273244;border-top-left-radius:4px}
.message>small{display:block;text-align:right;margin-top:4px;font-size:9px;color:#748078}
.message-more{width:27px;height:27px;border:0;border-radius:50%;background:#fff;color:#697586;box-shadow:0 1px 5px #17203320;display:grid;place-items:center}
.message-more svg{width:16px;height:16px;fill:currentColor}
.message-wrap:hover .message-more,.message-more:focus-visible{opacity:1;visibility:visible;pointer-events:auto}
.message-reply-quote{display:flex;flex-direction:column;gap:3px;padding:7px 9px;margin:-3px -5px 7px;border-left:3px solid #6478ca;background:#00000008;border-radius:5px;font-size:11px;max-width:320px}
.message-reply-quote strong{color:#5367b4;font-size:10px}.message-reply-quote span{color:#4d5968;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reply-composer-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;grid-column:1/-1;padding:8px 12px;margin:0 0 7px;border-left:3px solid #6478ca;border-radius:7px;background:#eef1ff}
.reply-composer-bar span{display:flex;flex-direction:column;gap:3px;min-width:0}.reply-composer-bar strong{font-size:11px;color:#5264b2}.reply-composer-bar small{font-size:11px;color:#667085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reply-composer-bar button{border:0;background:transparent;color:#667085;font-size:22px;cursor:pointer}
.message-composer{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;background:#fff;border-top:1px solid #e9edf2}
.message-composer>input{flex:1;min-width:0}
.message-reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.message-reaction{border:1px solid #dce2e8;border-radius:14px;padding:2px 7px;background:#fff;font-size:12px;cursor:pointer}
.message-reaction.mine{border-color:#8094e9;background:#eef1ff}.message-reaction small{font-size:10px;color:#647084}
.wa-message-menu{width:190px;padding:5px 0;background:#fff;color:#253044;border:1px solid #e7eaf0;border-radius:12px;box-shadow:0 12px 32px #17203325}
.wa-message-menu button{height:39px;padding:0 13px;color:#303b4d;font-size:13px;gap:12px}
.wa-message-menu button:hover{background:#f2f4f8}
.wa-menu-icon{width:17px;height:17px;flex:0 0 17px;color:#667085}
.wa-reaction-picker{background:#fff;box-shadow:0 12px 32px #17203325}
@media(max-width:760px){.message-wrap{max-width:92%}.message-more{display:none!important}.wa-message-menu{width:185px}}

/* Tight, grouped chat bubbles */
.message-wrap{width:fit-content;max-width:min(78%,620px);margin:2px 0;gap:4px;align-items:flex-end}
.message-wrap.group-start{margin-top:8px}.message-wrap.group-middle,.message-wrap.group-end{margin-top:1px}
.message-wrap.own-message{margin-left:auto;justify-content:flex-end}.message-wrap.other-message{margin-right:auto;justify-content:flex-start}
.message{width:fit-content;max-width:100%;padding:7px 10px 5px;border-radius:10px;box-shadow:0 1px 1px #17203310;line-height:1.35;font-size:13px;overflow-wrap:anywhere}
.message.sent{background:#075e46;color:#f7fff9;border-top-right-radius:5px}
.message.received{background:#fff;color:#273244;border-top-left-radius:5px}
.message-wrap.own-message.group-middle .message,.message-wrap.own-message.group-end .message{border-top-right-radius:10px}
.message-wrap.own-message.group-middle .message,.message-wrap.own-message.group-start .message{border-bottom-right-radius:4px}
.message-wrap.other-message.group-middle .message,.message-wrap.other-message.group-end .message{border-top-left-radius:10px}
.message-wrap.other-message.group-middle .message,.message-wrap.other-message.group-start .message{border-bottom-left-radius:4px}
.message>small{display:inline-flex;align-items:center;gap:4px;margin:0 0 0 10px;font-size:9px;line-height:1;color:#a9c9bc;white-space:nowrap;vertical-align:bottom}
.message.received>small{color:#8a929c}
.message-more{align-self:center;flex:0 0 24px;width:24px;height:24px}
.message-wrap.own-message .message-more{order:2;margin-left:1px}
.message-wrap.own-message .message{order:1}
.message-wrap.other-message .message{order:1}
.message-reply-quote{max-width:100%;margin:0 0 5px;padding:5px 8px}
.reply-composer-bar{width:100%;box-sizing:border-box}
.wa-message-menu{min-width:190px}
@media(max-width:760px){.message-wrap{max-width:92%}}

/* Final WhatsApp-style compact message grouping: override older chat layout rules */
.chat-history{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;padding:18px 20px 24px!important}
.chat-history>.chat-day-divider{flex:0 0 auto;margin:14px auto 10px!important}
.chat-history>.message-wrap{display:flex!important;flex:0 0 auto!important;width:fit-content!important;max-width:min(78%,620px)!important;margin:0!important;gap:5px!important;align-items:flex-end!important}
.chat-history>.message-wrap.own-message{align-self:flex-end!important;margin-left:auto!important;margin-right:0!important}
.chat-history>.message-wrap.other-message{align-self:flex-start!important;margin-left:0!important;margin-right:auto!important}
.chat-history>.message-wrap.group-start{margin-top:7px!important}
.chat-history>.message-wrap.group-middle,.chat-history>.message-wrap.group-end{margin-top:0!important}
.chat-history>.message-wrap>.message{display:block!important;width:fit-content!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:7px 10px 6px!important;border-radius:9px!important;font-size:13px!important;line-height:1.35!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;box-shadow:0 1px 1px rgba(0,0,0,.08)!important}
.chat-history>.message-wrap.own-message>.message{background:#d9fdd3!important;color:#183b2d!important}
.chat-history>.message-wrap.other-message>.message{background:#fff!important;color:#253142!important}
.chat-history>.message-wrap.own-message.group-start>.message{border-top-right-radius:9px!important;border-bottom-right-radius:3px!important}
.chat-history>.message-wrap.own-message.group-middle>.message{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}
.chat-history>.message-wrap.own-message.group-end>.message{border-top-right-radius:3px!important;border-bottom-right-radius:9px!important}
.chat-history>.message-wrap.own-message.group-start.group-end>.message{border-top-right-radius:9px!important;border-bottom-right-radius:9px!important}
.chat-history>.message-wrap.other-message.group-start>.message{border-top-left-radius:9px!important;border-bottom-left-radius:3px!important}
.chat-history>.message-wrap.other-message.group-middle>.message{border-top-left-radius:3px!important;border-bottom-left-radius:3px!important}
.chat-history>.message-wrap.other-message.group-end>.message{border-top-left-radius:3px!important;border-bottom-left-radius:9px!important}
.chat-history>.message-wrap.other-message.group-start.group-end>.message{border-top-left-radius:9px!important;border-bottom-left-radius:9px!important}
.chat-history>.message-wrap>.message>small{display:inline-flex!important;align-items:center!important;gap:3px!important;margin:0 0 0 9px!important;font-size:9px!important;line-height:1!important;white-space:nowrap!important;vertical-align:baseline!important;color:#668477!important}
.chat-history>.message-wrap.other-message>.message>small{color:#8a929c!important}
.chat-history>.message-wrap>.message-more{position:relative!important;align-self:center!important;flex:0 0 22px!important;width:22px!important;height:22px!important;margin:0!important;box-shadow:none!important}
.chat-history>.message-wrap.own-message>.message-more{order:2!important}
.chat-history>.message-wrap.own-message>.message{order:1!important}
@media(max-width:760px){.chat-history{padding:14px 10px 20px!important;gap:2px!important}.chat-history>.message-wrap{max-width:92%!important}.chat-history>.message-wrap>.message{font-size:13px!important}}

/* Consistent quoted replies for messages from either participant */
.chat-history .message-reply-quote{display:flex!important;align-items:stretch!important;gap:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-width:0!important;margin:0 0 7px!important;padding:0!important;border:0!important;border-radius:7px!important;overflow:hidden!important;background:rgba(0,0,0,.075)!important}
.chat-history .message-reply-quote .reply-quote-accent{display:block!important;flex:0 0 3px!important;width:3px!important;background:#2687f5!important}
.chat-history .message-reply-quote .reply-quote-content{display:flex!important;flex:1 1 auto!important;min-width:0!important;flex-direction:column!important;gap:3px!important;padding:6px 9px!important}
.chat-history .message-reply-quote strong{display:block!important;color:#2387ed!important;font-size:11px!important;font-weight:650!important;line-height:1.2!important}
.chat-history .message-reply-quote span:not(.reply-quote-accent){display:block!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:inherit!important;opacity:.88!important;font-size:11px!important;line-height:1.3!important}
.chat-history .message-reply-quote.missing-reply{opacity:.7!important}
.chat-history .message.sent .message-reply-quote{background:rgba(0,0,0,.09)!important}
.chat-history .message.received .message-reply-quote{background:#f0f2f5!important}

/* Group conversations and realtime typing indicator */
.group-create-shortcut{margin-top:8px!important}
.group-create-modal form{display:flex;flex-direction:column;gap:14px}
.group-name-label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:650}
.group-name-label input{width:100%;box-sizing:border-box;border:1px solid #dce2e9;border-radius:10px;padding:11px 12px;font:inherit}
.group-friend-list{max-height:48vh;overflow:auto;display:flex;flex-direction:column;gap:5px}
.group-friend-choice{display:flex;align-items:center;gap:10px;padding:9px;border-radius:10px;cursor:pointer}
.group-friend-choice:hover{background:#f3f5f8}
.group-friend-choice input{width:17px;height:17px;accent-color:#3278d4}
.group-friend-choice>span{display:flex;flex-direction:column;gap:2px}
.group-friend-choice small{color:#788394;font-size:11px}
.group-create-modal footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:10px;border-top:1px solid #e8ebf0}
.group-create-modal footer span{font-size:12px;color:#6b7280}
.chat-typing-indicator{display:flex;align-items:center;gap:8px;min-height:28px;padding:2px 16px 6px;color:#667085;font-size:12px;background:#fff}
.chat-typing-indicator[hidden]{display:none!important}
.typing-dots{display:inline-flex;align-items:center;gap:3px}
.typing-dots i{width:5px;height:5px;border-radius:50%;background:#2584e8;animation:chatTypingPulse 1s infinite ease-in-out}
.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}
@keyframes chatTypingPulse{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.group-message-sender{display:block;margin:0 0 4px;color:#2584e8;font-size:10px;font-weight:700}

/* Full-height independently scrollable desktop chat panes */
@media(min-width:761px){
 body[data-page="chats"] .chats-page{min-height:0}
 body[data-page="chats"] .chat-layout{height:calc(100dvh - 230px)!important;min-height:420px;max-height:820px;overflow:hidden!important;grid-template-columns:minmax(250px,32%) minmax(0,1fr)!important}
 body[data-page="chats"] .chat-inbox{display:flex!important;flex-direction:column!important;min-height:0!important;height:100%!important;overflow:hidden!important;padding:14px 10px!important}
 body[data-page="chats"] .chat-inbox-heading,body[data-page="chats"] .chat-selection-controls,body[data-page="chats"] .chat-inbox-tabs,body[data-page="chats"] .inbox-search{flex:0 0 auto}
 body[data-page="chats"] .conversation-list{min-height:0!important;flex:1 1 auto!important;overflow-y:auto!important;overscroll-behavior:contain!important;padding-bottom:14px!important}
 body[data-page="chats"] .chat-room{display:flex!important;flex-direction:column!important;min-width:0!important;min-height:0!important;height:100%!important;overflow:hidden!important}
 body[data-page="chats"] .chat-room-head{flex:0 0 64px!important;min-width:0}
 body[data-page="chats"] .chat-history{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important}
 body[data-page="chats"] .chat-typing-indicator{flex:0 0 auto!important}
 body[data-page="chats"] .message-composer{position:sticky!important;bottom:0!important;z-index:4!important;flex:0 0 auto!important;background:#fff!important;padding:10px 14px!important;padding-bottom:calc(10px + env(safe-area-inset-bottom))!important}
}
.chat-voice-player{display:block;width:min(260px,100%);height:38px;max-width:100%;margin:3px 0}
.voice-message-unavailable{font-size:12px;opacity:.75}
.voice-record-button{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid #e2e6ee;border-radius:50%;background:#f7f8fb;color:#46536a;cursor:pointer}
.voice-record-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.voice-record-button.recording{background:#fff0f0;border-color:#efb5b5;color:#cf3434;animation:voiceRecordPulse 1s infinite}
.voice-record-button:disabled{opacity:.6;cursor:wait}
@keyframes voiceRecordPulse{50%{box-shadow:0 0 0 5px #e84b4b20}}
@media(max-width:760px){.voice-record-button{width:36px;height:36px;flex-basis:36px}.chat-voice-player{width:min(230px,70vw)}}

/* LiveKit group call layout */
.flexoverse-group-call{width:min(760px,calc(100vw - 28px))}
.group-call-participants{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;max-height:min(62vh,560px);overflow:auto;padding:12px}
.group-call-video{display:block;width:100%;min-height:150px;max-height:280px;object-fit:cover;border-radius:12px;background:#172033}
.flexoverse-group-call .call-controls{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:12px}

/* Immersive mobile call interface inspired by the supplied reference */
.call-screen-backdrop{padding:0!important;background:radial-gradient(ellipse at 50% 35%,#5b606b 0%,#272c35 54%,#10141b 100%)!important;display:flex!important;align-items:stretch!important;justify-content:center!important}
.call-screen{position:relative!important;width:100%!important;max-width:none!important;height:100dvh!important;min-height:100dvh!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:hidden!important;padding:0!important}
.call-screen-top{position:absolute!important;z-index:5!important;top:calc(18px + env(safe-area-inset-top))!important;left:18px!important;right:18px!important;display:grid!important;grid-template-columns:56px 1fr 56px!important;align-items:center!important;gap:12px!important;padding:0!important;border:0!important}
.call-screen-top>button{width:52px!important;height:52px!important;border:0!important;border-radius:50%!important;background:#111a20!important;color:#fff!important;display:grid!important;place-items:center!important}
.call-screen-top>button svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.call-screen-top>button[hidden]{display:none!important}
.call-screen-title{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;min-width:0}
.call-screen-title strong{font-size:16px!important;color:#fff!important}
.call-screen-title span{font-size:13px!important;color:#f0f1f4!important}
.call-screen-stage{position:absolute!important;inset:0!important;min-height:100%!important;height:100%!important;background:transparent!important;display:grid!important;place-items:center!important;padding:100px 18px 150px!important;box-sizing:border-box!important}
.call-screen-stage video[data-remote-video]{width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;border-radius:0!important}
.call-screen-stage video[data-local-video]{right:18px!important;top:100px!important;bottom:auto!important;width:94px!important;height:132px!important;border-radius:16px!important;z-index:3!important}
.call-screen-stage[data-audio-call] video{display:none!important}
.call-screen .call-audio-avatar{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:14px!important;color:#fff!important}
.call-screen .call-audio-avatar .avatar{width:112px!important;height:112px!important;border-radius:50%!important;font-size:32px!important;box-shadow:0 10px 40px #0005}
.call-screen .call-audio-avatar strong{font-size:17px!important;text-shadow:0 2px 8px #0008}
.call-screen-controls{position:absolute!important;z-index:6!important;left:22px!important;right:22px!important;bottom:calc(24px + env(safe-area-inset-bottom))!important;min-height:104px!important;padding:12px!important;border-radius:60px!important;background:#10171beF!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;box-shadow:0 12px 36px #0005!important}
.call-screen-controls button{width:clamp(52px,14vw,76px)!important;height:clamp(52px,14vw,76px)!important;min-width:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:#202a30!important;color:#fff!important;display:grid!important;place-items:center!important}
.call-screen-controls button svg{width:28px!important;height:28px!important;fill:none!important;stroke:currentColor!important;stroke-width:2.2!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.call-screen-controls button.is-muted{background:#39434a!important}
.call-screen-controls button.call-end-button{background:#ed0645!important}
.call-screen-controls button[hidden]{display:none!important}
.call-screen-controls button[data-call-speaker]{background:#fff!important;color:#111!important}
.call-screen-controls button[data-call-more]{font-size:24px!important}
.flexoverse-group-call .group-call-participants{inset:0!important;position:absolute!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(145px,1fr))!important;align-content:center!important;gap:8px!important;padding:100px 12px 150px!important;max-height:none!important;overflow:auto!important}
.flexoverse-group-call .group-call-video{width:100%!important;height:100%!important;min-height:150px!important;max-height:42vh!important;object-fit:cover!important;border-radius:16px!important;background:#111820!important}
.flexoverse-group-call .call-screen-controls button{font-size:20px!important}
@media(min-width:760px){.call-screen{max-width:100%!important}.call-screen-controls{left:calc(50% - 330px)!important;right:calc(50% - 330px)!important;bottom:30px!important}.call-screen-stage{padding-bottom:160px!important}}
@media(max-width:420px){.call-screen-controls{left:14px!important;right:14px!important;min-height:90px!important;padding:9px!important;gap:5px!important}.call-screen-controls button{width:56px!important;height:56px!important}.call-screen-top{left:14px!important;right:14px!important}}

/* Consistent icon system for group-call controls */
.flexoverse-group-call .call-screen-controls button{font-size:0!important;line-height:0!important}
.flexoverse-group-call .call-screen-controls button svg{display:block!important;width:28px!important;height:28px!important;fill:none!important;stroke:currentColor!important;stroke-width:2.1!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.flexoverse-group-call .call-screen-controls button[data-group-speaker]{background:#fff!important;color:#12191d!important}
.flexoverse-group-call .call-screen-controls button.is-muted{background:#3b454d!important;color:#fff!important}
.flexoverse-group-call .call-screen-controls button.call-end-button{background:#ed0645!important;color:#fff!important}
.flexoverse-group-call .call-screen-controls button:focus-visible,.call-screen-controls button:focus-visible{outline:3px solid #7bb8ff!important;outline-offset:3px!important}
@media(max-width:420px){.flexoverse-group-call .call-screen-controls button svg{width:25px!important;height:25px!important}}


/* WhatsApp-style inbox filters and message selection */
.chat-filter-tabs{display:flex;align-items:center;gap:4px;padding:10px 8px 12px;overflow:visible;position:relative}
.chat-filter-tab{flex:1 1 auto;min-width:0;padding:8px 5px;border:1px solid transparent;border-radius:18px;background:#f3f4f8;color:#687385;font-size:9px;font-weight:700;white-space:nowrap}
.chat-filter-tab.active{background:#eae9ff;border-color:#d8d5ff;color:#5148d2}
.chat-plus-wrap{position:relative;flex:0 0 30px}
.chat-plus-button{width:29px;height:29px;border:0;border-radius:50%;background:var(--brand);color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;box-shadow:0 4px 10px #655ce833}
.chat-plus-menu{position:absolute;z-index:20;right:0;top:36px;width:145px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px #1b234022}
.chat-plus-menu[hidden]{display:none}
.chat-plus-menu button{display:block;width:100%;padding:10px;border:0;border-radius:7px;background:#fff;text-align:left;color:var(--ink);font-size:11px}
.chat-plus-menu button:hover{background:#f4f3ff;color:var(--brand)}
.conversation-favourite{color:#e6a83c;font-size:12px;line-height:1;margin-right:3px}
.message,.message *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none}
.message{position:relative;cursor:default}
.message-wrap.is-message-selected .message{outline:2px solid #655ce8;outline-offset:2px;box-shadow:0 0 0 5px #655ce81c}
.message-select-check{display:inline-grid;place-items:center;width:17px;height:17px;margin:0 6px 5px 0;border-radius:50%;background:var(--brand);color:#fff;font-size:11px;font-weight:800;vertical-align:middle}
.message-selection-bar{display:flex;align-items:center;gap:8px;padding:9px 14px;border-bottom:1px solid #e8eaf0;background:#f7f6ff;color:#4546a5}
.message-selection-bar strong{margin-right:auto;font-size:11px}
.message-selection-bar button{border:1px solid #dedcff;border-radius:7px;background:#fff;color:#5148d2;padding:6px 10px;font-size:10px;font-weight:700}
.message-selection-bar button:disabled{opacity:.4;cursor:not-allowed}
.chat-room.chat-room-soft-theme .message-wrap.is-message-selected .message{outline-color:#5148d2}

/* Polished incoming and outgoing voice-call presentation */
.call-screen-stage[data-audio-call] .call-audio-avatar:before,.call-screen-stage[data-audio-call] .call-audio-avatar:after{content:"";position:absolute;width:180px;height:180px;border:1px solid #ffffff32;border-radius:50%;animation:callAvatarPulse 2.6s ease-out infinite}
.call-screen-stage[data-audio-call] .call-audio-avatar:after{animation-delay:1.3s}
.call-screen-stage[data-audio-call] .call-audio-avatar .avatar{width:112px;height:112px;font-size:32px;border:4px solid #ffffff2b;box-shadow:0 0 0 12px #ffffff0d,0 18px 60px #0005}
.call-screen-stage[data-audio-call] .call-audio-avatar strong{position:absolute;top:calc(50% + 82px);font-size:18px;color:#fff;text-shadow:0 2px 12px #0008}
@keyframes callAvatarPulse{0%{transform:scale(.72);opacity:.8}100%{transform:scale(1.55);opacity:0}}
.incoming-call-screen{display:flex!important;align-items:center!important;justify-content:center!important;background:radial-gradient(ellipse at 50% 36%,#48565b 0%,#202b31 52%,#10171b 100%)!important}
.incoming-call-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:min(440px,100%);padding:28px 22px}
.incoming-call-label{color:#a9c5b7;font-size:10px;font-weight:800;letter-spacing:2px;margin-bottom:34px}
.incoming-call-avatar-wrap{position:relative;width:150px;height:150px;display:grid;place-items:center;margin-bottom:28px}
.incoming-call-avatar-wrap .avatar{position:relative;z-index:2;width:116px;height:116px;border:4px solid #ffffff35;font-size:32px;box-shadow:0 14px 45px #0006}
.call-avatar-pulse{position:absolute;inset:0;border:1px solid #8bd6b066;border-radius:50%;animation:callAvatarPulse 2.5s ease-out infinite}
.incoming-call-content h2{margin:0;color:#fff;font:750 27px Manrope,sans-serif;letter-spacing:-.5px}
.incoming-call-content p{margin:10px 0 0;color:#c0cbc8;font-size:13px}
.incoming-call-actions{display:flex;align-items:center;justify-content:center;gap:74px;margin-top:78px}
.incoming-call-actions button{display:flex;flex-direction:column;align-items:center;gap:9px;border:0;background:transparent;color:#fff}
.incoming-call-actions button span{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-size:25px;font-weight:700;box-shadow:0 8px 24px #0004}
.incoming-call-actions button small{font-size:11px;color:#e5ece9}
.incoming-call-actions .incoming-decline span{background:#ed3654}
.incoming-call-actions .incoming-answer span{background:#20b879}
@media(max-width:760px){.chat-filter-tabs{padding-left:5px;padding-right:5px;gap:3px}.chat-filter-tab{font-size:8px;padding:8px 3px}.chat-plus-wrap{flex-basis:28px}.chat-plus-button{width:28px;height:28px}.incoming-call-actions{margin-top:58px;gap:58px}}

.homepage-call-alert{position:sticky;top:0;z-index:1000;padding:0 18px}
.home-incoming-call-card{max-width:920px;margin:12px auto;display:flex;align-items:center;gap:13px;padding:14px 18px;border:1px solid #d9e9e1;border-radius:16px;background:linear-gradient(110deg,#f1fbf5,#fff);box-shadow:0 12px 35px #172c2315}
.home-incoming-call-card .avatar{width:48px;height:48px;flex:0 0 48px}
.home-incoming-call-copy{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.home-incoming-call-copy strong{font-size:14px;color:#1d2b25}
.home-incoming-call-copy span{font-size:11px;color:#63736b}
.home-incoming-call-card button{border:0;border-radius:22px;padding:10px 16px;font-size:11px;font-weight:750}
.home-incoming-call-card [data-home-call-decline]{background:#fce9ec;color:#c72e4d}
.home-incoming-call-card [data-home-call-answer]{background:#18a86e;color:#fff}
@media(max-width:560px){.homepage-call-alert{padding:0 8px}.home-incoming-call-card{gap:8px;padding:11px;border-radius:12px}.home-incoming-call-card button{padding:9px 11px;font-size:10px}}

.header-notification-wrap{position:relative;display:flex;align-items:center}
.header-notification-dropdown{position:absolute;z-index:1500;right:0;top:calc(100% + 12px);width:min(360px,calc(100vw - 28px));max-height:440px;overflow:auto;padding:8px;background:#fff;border:1px solid #e8eaf0;border-radius:15px;box-shadow:0 18px 50px #19233a22}
.header-notification-dropdown[hidden]{display:none}
.header-notification-row{display:flex;align-items:center;gap:10px;padding:11px 9px;border-bottom:1px solid #f0f1f4}
.header-notification-row>div{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.header-notification-row strong{font-size:11px;color:#273044}
.header-notification-row span,.header-notification-row small{font-size:10px;color:#7b8494;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-notification-row>a{padding:7px 10px;border-radius:8px;background:#f0efff;color:#5d54d7;font-size:10px;font-weight:750;white-space:nowrap}
.header-notification-footer{display:block;padding:12px 8px 7px;text-align:center;color:var(--brand);font-size:10px;font-weight:750}
.header-notification-loading{padding:22px 12px;text-align:center;color:#7b8494;font-size:11px}

.header-quick-reply{display:flex;gap:5px;margin-top:7px;max-width:245px}
.header-quick-reply input{min-width:0;flex:1;border:1px solid #e5e7ef;border-radius:8px;padding:7px 8px;font:inherit;font-size:10px;outline:none}
.header-quick-reply input:focus{border-color:#8b83ee;box-shadow:0 0 0 2px #6b62e91a}
.header-quick-reply button{border:0;border-radius:8px;padding:0 10px;background:#655ce8;color:#fff;font-size:10px;font-weight:750}
.header-quick-reply button:disabled{opacity:.55}