:root{color-scheme:dark;--bg:#0a101c;--panel:#111a29;--line:#253044;--muted:#a5b1c5;--lime:#cefa6a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f4f7fb}button,input,textarea,select{font:inherit}button,a,input,textarea,select{outline-offset:4px}button{background:var(--lime);color:#152009;border:0;border-radius:12px;padding:12px 18px;font-weight:650;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.secondary{background:#263348;color:#eef3fc}.plain{background:none;color:var(--muted);padding:8px}.danger{color:#ffabae}input,textarea,select{width:100%;background:#0d1522;color:inherit;border:1px solid #38465c;border-radius:10px;padding:13px}textarea{resize:vertical;min-height:70px}label{display:grid;gap:8px;margin:15px 0;color:#cbd5e1;font-size:14px}a{color:var(--lime)}h1,h2,h3,p{margin-top:0}h1{font-size:42px;letter-spacing:-2px}h1 span{color:var(--lime);font-size:20px;margin-left:3px}h2{font-size:24px}h3{font-size:16px}p{line-height:1.6;color:var(--muted)}.auth{width:min(460px,calc(100% - 32px));margin:8vh auto;padding:32px;background:var(--panel);border:1px solid var(--line);border-radius:24px}.auth form>button{width:100%;margin:10px 0}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--lime);text-transform:uppercase}.actions{display:flex;gap:8px;flex-wrap:wrap}.app-shell{height:100dvh;display:grid;grid-template-columns:350px 1fr;max-width:1600px;margin:auto}.sidebar{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;background:var(--panel)}.brand{padding:25px 24px 14px}.brand h1{font-size:30px;margin:0}.brand p{font-size:12px;margin:5px 0 0}.toolbar{display:flex;gap:4px;padding:0 16px 14px;flex-wrap:wrap}.toolbar button{font-size:12px;padding:9px}.search{padding:0 20px 16px}.people{overflow-y:auto;flex:1}.person{display:flex;gap:12px;align-items:center;width:100%;text-align:left;border-radius:0;background:none;color:inherit;padding:18px 20px;border-bottom:1px solid #202b3c}.person:hover,.person.selected{background:#202e40}.avatar{display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:15px;background:#364730;color:#d8fc9a;font-size:20px;font-weight:700}.person .details{flex:1;min-width:0}.person strong{display:block;font-size:14px}.person small{display:block;color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:210px;margin-top:5px}.badge{background:var(--lime);color:#17200b;border-radius:20px;font-size:11px;padding:4px 7px}.empty{padding:35px;text-align:center;margin:auto;max-width:500px}.empty .big{font-size:65px;color:var(--lime);margin-bottom:22px}.conversation{display:flex;flex-direction:column;min-width:0;min-height:0}.chat-head{display:flex;gap:12px;align-items:center;padding:18px 24px;border-bottom:1px solid var(--line);background:#111a29}.chat-head .details{flex:1}.chat-head strong{display:block}.chat-head small{color:var(--muted)}.chat-head button{font-size:12px;padding:9px}.back{display:none}.messages{overflow:auto;flex:1;padding:25px;display:flex;flex-direction:column;gap:12px}.bubble{max-width:min(75%,520px);padding:13px 16px;background:#1c293b;border-radius:17px 17px 17px 4px;align-self:flex-start;overflow-wrap:anywhere;white-space:pre-wrap;font-size:14px;line-height:1.5}.bubble.mine{background:#c8ed85;color:#162011;align-self:flex-end;border-radius:17px 17px 4px 17px}.bubble small{display:block;font-size:10px;opacity:.65;text-align:right;margin-top:5px}.bubble img{display:block;max-width:100%;max-height:320px;border-radius:10px;margin-bottom:7px}.compose{padding:16px 24px;padding-bottom:max(16px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}.compose form{display:flex;align-items:end;gap:10px}.compose textarea{resize:none;min-height:48px;height:48px;max-height:130px}.compose button{flex-shrink:0}.attachment{font-size:12px;color:var(--muted);margin:7px 0}.hint{font-size:12px;color:var(--muted);padding:12px 20px}.error{color:#ffb5b5}.success{color:var(--lime)}dialog{background:#111a29;color:#f5f7fb;border:1px solid #3b4960;border-radius:22px;padding:28px;width:min(570px,calc(100% - 24px));max-height:90dvh;overflow:auto}dialog::backdrop{background:#000b}dialog header{display:flex;justify-content:space-between;align-items:center;gap:15px}dialog header h2{margin:0}.notice{padding:16px;background:#263321;border:1px solid #435d2d;border-radius:12px;margin:18px 0;font-size:13px;line-height:1.7}.notice p{margin:0;color:#d2dfc4}.check{display:flex;align-items:center;gap:12px}.check input{width:19px;height:19px;accent-color:var(--lime)}.times{display:grid;grid-template-columns:1fr 1fr;gap:12px}.device{border-top:1px solid var(--line);padding:16px 0}.device strong{display:block}.device p{font-size:12px;margin:6px 0}.device button{font-size:12px;padding:8px 12px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#e5efdb;color:#13200c;padding:13px 20px;border-radius:13px;box-shadow:0 6px 30px #0008;max-width:calc(100% - 28px);z-index:100;display:none}.older{align-self:center;font-size:12px}.connection{font-size:11px;padding:8px 20px;color:#ffd2a5}.hidden{display:none!important}@media(max-width:700px){.app-shell{display:block}.sidebar{height:100dvh;border:0}.conversation{height:100dvh;display:none}.app-shell.chat-open .sidebar{display:none}.app-shell.chat-open .conversation{display:flex}.back{display:block}.chat-head{padding:14px 12px;gap:8px;flex-wrap:wrap}.chat-head .details{min-width:120px}.messages{padding:16px}.compose{padding:12px}.bubble{max-width:88%}.auth{padding:25px;margin-top:5vh}.toolbar button{padding:10px}.person small{max-width:65vw}}

.avatar{overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}#profile-avatar .avatar{width:88px;height:88px;font-size:36px}.messages{display:block;overflow-anchor:none}.message-list{display:flex;flex-direction:column;gap:12px;min-height:100%}.bubble{flex-shrink:0}.call-card{text-align:center}.call-card .avatar{width:76px;height:76px;margin:20px auto}.call-card .actions{justify-content:center}.call-end{background:#df525c;color:#fff}#voice-call{max-width:440px}.call-status{min-height:48px}.chat-head{flex-wrap:wrap}
/* Phone-style call screen */
#voice-call{padding:0;width:min(460px,100%);max-width:460px;max-height:100dvh;border:1px solid #344437;background:radial-gradient(ellipse at 50% 32%,#354b39 0%,#192a28 40%,#0d171f 85%);border-radius:30px;box-shadow:0 30px 100px #0009}#voice-call::backdrop{background:#050b13d9;backdrop-filter:blur(12px)}.call-card{min-height:640px;min-height:min(720px,95dvh);padding:32px 28px 20px;display:flex;flex-direction:column;align-items:center}.call-brand{font-weight:750;font-size:22px;letter-spacing:-1px}.call-brand span{color:var(--lime);font-size:11px;margin-left:3px}.call-kind{font-size:10px;letter-spacing:3px;margin:10px 0 36px;color:#b5c6ba}.call-portrait{border:1px solid #b8e0ab25;padding:12px;border-radius:50%;box-shadow:0 0 0 14px #c8ed8506}.call-card .avatar{width:140px;height:140px;flex-basis:140px;margin:0;border-radius:50%;font-size:56px;background:#3d5949;color:#e0fbb6}.call-card h2{font-size:30px;letter-spacing:-.7px;margin:30px 0 10px;overflow-wrap:anywhere}.call-status{font-size:15px;min-height:48px;margin:0;color:#cedbcf}.call-controls{display:flex;justify-content:center;align-items:start;gap:40px;margin-top:auto;padding:40px 0 34px}.call-control{position:relative;width:66px;height:66px;border-radius:50%;padding:20px;background:#ffffff1c;color:#fff;flex:none}.call-control svg{width:26px;height:26px;display:block;pointer-events:none}.call-control span{position:absolute;top:78px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:500;color:#dce4df;pointer-events:none}.call-control[aria-pressed=true]{background:#f0f6eb;color:#19271b}.call-answer{background:#9ce45d;color:#183210}.call-end{background:#eb5261;color:white}.call-end svg{transform:rotate(135deg)}.call-card .hint{margin:24px 0 0;padding:12px 0 0;font-size:11px}.call-control[hidden]{display:none}.call-control:focus-visible{outline:3px solid white;outline-offset:5px}
#photo-viewer{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;padding:0;background:#080e16f5;overflow:hidden}#photo-viewer::backdrop{background:#080e16}#photo-viewer header{height:72px;padding:12px 24px;border-bottom:1px solid #ffffff12}#photo-viewer header>span{font-size:14px;color:#dce5ef}#photo-viewer header>div{display:flex;gap:12px}#photo-viewer button{width:44px;height:44px;padding:0;border-radius:50%;background:#ffffff14;color:white;font-size:25px}#photo-viewer .photo-stage{height:calc(100dvh - 124px);overflow:auto;display:flex;align-items:center;justify-content:center;padding:24px}#photo-viewer img{display:block;max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 16px 70px #0006;border-radius:6px;cursor:zoom-in}#photo-viewer.zoomed .photo-stage{display:block}#photo-viewer.zoomed img{max-width:none;max-height:none;width:200%;height:auto;cursor:zoom-out}.photo-help{text-align:center;font-size:12px;height:40px;margin:8px 0 0;color:#a6b2c4}.bubble a:has(img){cursor:zoom-in}@media(max-width:700px){#voice-call{width:100%;max-width:none;height:100dvh;border:0;border-radius:0}.call-card{min-height:100dvh;padding-top:max(32px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}.call-kind{margin-bottom:42px}#photo-viewer header{padding:12px 16px}#photo-viewer .photo-stage{padding:12px}}@media(max-height:650px){.call-card{min-height:100dvh;padding-top:14px}.call-kind{margin-bottom:12px}.call-card .avatar{width:90px;height:90px;flex-basis:90px;font-size:40px}.call-card h2{margin-top:16px}.call-controls{padding-top:12px}.call-card .hint{margin-top:12px}}
/* Shared Android / web visual language */
:root{--lime:#c4ff70;--ink:#002039}body{background:var(--lime)}.app-shell{position:relative;display:grid;grid-template-columns:350px 1fr;grid-template-rows:76px minmax(0,1fr) 106px;height:100dvh;background:var(--lime);max-width:1500px;margin:auto;padding:0 20px;gap:0}.web-brand{grid-column:1/-1;color:var(--ink);font-size:36px;font-weight:850;letter-spacing:-2px;display:flex;align-items:center;padding-left:16px}.sidebar{grid-column:1;grid-row:2;background:var(--ink);border-radius:30px 0 0 30px;overflow:hidden;min-height:0}.conversation{grid-column:2;grid-row:2;background:var(--ink);border-radius:0 30px 30px 0;overflow:hidden}.brand{padding:24px 22px 10px}.brand h2{font-size:28px;letter-spacing:-1px;margin:0}.brand p{font-size:13px;margin-top:8px}.toolbar,.sidebar>.hint{display:none}.avatar{border-radius:50%;background:#293a35}.person{padding:20px;gap:16px}.person .avatar{height:56px;flex-basis:56px}.person strong{font-size:16px}.person small{line-height:1.7}.search input{border-radius:18px;background:#142b3b}.naber-dock{grid-row:3;grid-column:1/-1;align-self:center;justify-self:center;display:flex;gap:4px;background:var(--ink);border-radius:26px;padding:8px;width:min(440px,100%);box-shadow:0 8px 26px #00203930}.naber-dock button{display:flex;flex:1;flex-direction:column;align-items:center;gap:6px;color:#8ba596;background:none;padding:10px 4px;border-radius:18px;font-size:11px}.naber-dock button[aria-current=page]{color:var(--lime);background:#ffffff08}.naber-dock svg,.social-row svg{width:25px;height:25px}.app-shell.social-open .sidebar,.app-shell.social-open .conversation{display:none!important}#section-content{grid-column:1/-1;grid-row:2;background:var(--ink);border-radius:30px;overflow:auto;min-height:0}.section-heading{padding:28px 26px 18px;max-width:900px;margin:auto}.section-heading h2{font-size:28px;letter-spacing:-.7px;margin:0}.section-heading p{color:#91a0b4}.section-heading button{margin:8px 8px 0 0}.social-list{max-width:900px;margin:auto;padding:0 24px 24px}.social-row{display:flex;align-items:center;gap:16px;width:100%;background:#142b3b;color:white;text-align:left;padding:18px;margin:10px 0;border-radius:22px}.social-row .details{flex:1;min-width:0}.social-row strong,.social-row small{display:block}.social-row small{color:#91a0b4;margin-top:8px;font-size:12px}.social-row svg{color:var(--lime)}.empty .big svg{width:56px;height:56px}.settings-card{max-width:500px;margin:15px auto;padding:24px;text-align:center}.settings-card .avatar{width:90px;height:90px;margin:auto;font-size:32px}.settings-card button{display:flex;justify-content:space-between;text-align:left;background:#142b3b;color:white;width:100%;padding:22px;margin:12px 0}.settings-card button.danger{color:#ff8c99}.settings-card p{color:#91a0b4}.story-compose img{max-width:100%;max-height:280px;object-fit:contain;margin:16px auto}.story-view{text-align:center;background:#050b13}.story-view img{width:100%;max-height:65dvh;object-fit:contain}.story-view p{white-space:pre-wrap;overflow-wrap:anywhere}button:focus-visible{outline:3px solid var(--lime);outline-offset:3px}.auth{box-shadow:0 20px 70px #00203928;background:var(--ink)}.chat-head{background:var(--ink)}.bubble.mine{background:#ceeca0}.compose{background:var(--ink)}
@media(max-width:700px){.app-shell{display:grid;padding:0;grid-template-columns:minmax(0,1fr);grid-template-rows:64px minmax(0,1fr) calc(104px + env(safe-area-inset-bottom));}.web-brand{font-size:32px;padding-left:22px}.sidebar{height:auto;border-radius:30px 30px 0 0;grid-column:1}.conversation{height:auto;grid-column:1;border-radius:30px 30px 0 0}.naber-dock{width:calc(100% - 40px);margin-bottom:env(safe-area-inset-bottom)}.app-shell.chat-open:not(.social-open) .conversation{display:flex}.app-shell.chat-open:not(.social-open) .sidebar{display:none}#section-content{border-radius:30px 30px 0 0}.chat-head{padding:12px;gap:8px}.chat-head .details{min-width:80px}.chat-head button{font-size:11px;padding:8px}.compose{padding:10px}.section-heading{padding:24px 22px 16px}.social-list{padding:0 16px 20px}}
/* Desktop: persistent narrow conversation list and separate reading pane. */
@media (min-width:701px){
 .app-shell{grid-template-columns:clamp(280px,27vw,350px) minmax(0,1fr);grid-template-rows:76px minmax(0,1fr) 106px;width:100%;}
 .app-shell:not(.social-open)>.sidebar{display:flex;grid-column:1;grid-row:2;width:100%;min-width:0;border-right:1px solid #ffffff14;border-radius:26px 0 0 26px;background:#002039;}
 .app-shell:not(.social-open)>.conversation{display:flex;grid-column:2;grid-row:2;min-width:0;border-radius:0 26px 26px 0;background:radial-gradient(ellipse at 50% 40%,#123344 0%,#081c2b 75%);}
 .conversation>.empty{width:min(100%,480px);padding:48px;text-align:center;}
 .conversation>.empty .big{display:grid;place-items:center;width:96px;height:96px;margin:0 auto 28px;border:1px solid #c4ff7030;border-radius:30px;background:#c4ff700a;font-size:52px;}
 .conversation>.empty h2{font-size:32px;line-height:1.25;letter-spacing:-1px;}
 .conversation>.empty p{font-size:14px;line-height:1.8;color:#97abb9;}
 .sidebar .brand h2{font-size:24px}.sidebar .person{padding:18px 20px}.sidebar .person .details{min-width:0}.sidebar .person small{max-width:100%;}
 .sidebar .empty{padding:30px 22px;text-align:left;}.sidebar .empty p{font-size:13px;}
 .conversation .chat-head{background:#0b2536}.conversation .compose{background:#0b2536}
}
.message-options{display:block;margin:6px 0 0 auto;background:#0000000d;color:inherit;padding:0 10px;min-height:32px;font-size:22px;line-height:1;border-radius:8px}.message-options:hover{background:#00000020}

.new-group{margin:12px 20px 0}.group-sender{display:block;font-size:12px;margin-bottom:6px;color:inherit}.group-member{display:flex;align-items:center;gap:12px;padding:10px 0}.group-member>span:not(.avatar){flex:1}.group-member small{display:block;color:#98a8b9}#group-dialog{width:min(560px,94vw);max-height:90dvh;overflow:auto}#group-photo-preview .avatar{width:80px;height:80px;margin:12px auto}#group-dialog p{font-size:13px;line-height:1.5}

.typing-status{color:#cefa6a!important;font-weight:600}

.bubble audio{display:block;width:min(260px,100%);max-width:100%;margin:8px 0}#voice-message-dialog{width:min(440px,94vw)}.voice-mic{text-align:center;font-size:56px;margin:24px}#voice-record-open{padding:8px;min-width:40px}

.bubble:has(audio){width:300px;max-width:85%}#voice-record-open svg{width:20px;height:20px;display:block}

#voice-record-open{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#voice-record-open.recording{background:#d7374d;color:white}.inline-voice{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;background:#142536;border-radius:14px;padding:10px 12px;margin-bottom:8px}.voice-inline-status{font-size:13px}.inline-voice .actions{margin:0;gap:6px}.inline-voice button{padding:8px 12px}

.contact-banner{padding:12px;text-align:center}.contact-banner p{margin:0 0 8px}.contact-banner button{margin:4px}.contact-card{padding:16px 0;border-bottom:1px solid #526070}

.call-video-panel{position:relative;width:100%;height:280px;background:#071015;border-radius:20px;overflow:hidden}.call-video-panel #call-remote{width:100%;height:100%;object-fit:contain}.call-video-panel #call-local{position:absolute;right:10px;top:10px;width:90px;height:120px;object-fit:cover;border:1px solid #9edb65;border-radius:12px}#call-camera-controls button{margin:4px}

/* Native-style phone chat: only the conversation occupies the visible viewport. */
.mobile-icon{display:none}.chat-overflow{display:contents}.chat-overflow>summary{display:none}.chat-overflow-panel{display:contents}
@media(max-width:700px){
 body.mobile-chat-active{overflow:hidden;background:#002039;overscroll-behavior:none}
 .app-shell.chat-open:not(.social-open){position:fixed;top:var(--chat-top,0px);left:0;right:0;height:var(--chat-height,100dvh);max-width:none;padding:0;display:flex;overflow:hidden;background:#002039}
 .app-shell.chat-open:not(.social-open)>.web-brand,.app-shell.chat-open:not(.social-open)>.naber-dock{display:none}
 .app-shell.chat-open:not(.social-open)>.conversation{display:flex;flex:1;height:100%;border-radius:0;min-height:0;background:#002039}
 .chat-head{flex:none;flex-wrap:nowrap;gap:6px;min-height:64px;padding:8px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left));padding-top:max(8px,env(safe-area-inset-top));border-bottom:1px solid #ffffff0b}
 .chat-head>.avatar{width:36px;height:36px;flex-basis:36px;font-size:17px}.chat-head .details{min-width:0;overflow:hidden}.chat-head strong,.chat-head small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-head strong{font-size:17px}.chat-head small{font-size:12px;line-height:1.7}
 .chat-head button{flex:none;min-width:36px;height:44px;padding:8px;background:none;color:#f4f7fb}.chat-head .back{font-size:24px;min-width:28px;padding:4px}
 .mobile-icon{display:block}.mobile-icon svg{display:block;width:22px;height:22px}.desktop-label{display:none}
 .chat-overflow{display:block;position:relative;flex:none}.chat-overflow>summary{display:grid;place-items:center;list-style:none;cursor:pointer;width:28px;height:44px;font-size:26px}.chat-overflow>summary::-webkit-details-marker{display:none}
 .chat-overflow-panel{display:none}.chat-overflow[open]>.chat-overflow-panel{display:flex;position:absolute;right:0;top:48px;z-index:20;min-width:180px;flex-direction:column;background:#142b3b;border:1px solid #38465c;border-radius:16px;padding:8px;box-shadow:0 12px 32px #0006}.chat-overflow-panel button{text-align:left}.chat-overflow-panel button[hidden]{display:none}
 .messages{min-height:0;flex:1;padding:16px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.message-list{gap:10px}.bubble{font-size:15px;line-height:1.45;border-radius:22px 22px 22px 6px;background:#142b3b;padding:12px 14px}.bubble.mine{background:#c4ff70;border-radius:22px 22px 6px 22px}.bubble small{font-size:10px}
 .compose{flex:none;padding:10px 10px max(10px,env(safe-area-inset-bottom));border:0}.keyboard-visible .compose{padding-bottom:8px}.compose form{gap:6px;align-items:center}.compose textarea{font-size:16px;min-width:0;min-height:48px;height:48px;border-radius:24px;background:#142b3b;border-color:transparent;padding:13px 14px}.compose #photo,.compose #voice-record-open{width:36px;min-width:36px;padding:7px;background:none;color:#f4f7fb}.compose #photo{font-size:26px}.compose #send{width:44px;height:44px;border-radius:50%;padding:11px;background:#c4ff70;color:#002039}.attachment:empty{display:none}
}

/* Compact sidebar actions; labels remain available to assistive technology. */
.sidebar .brand{position:relative;padding-right:116px;min-height:82px}.sidebar .brand h2{font-size:24px}.sidebar .brand p{font-size:12px}.sidebar-actions{position:absolute;right:16px;top:22px;display:flex;gap:6px}.sidebar-actions button{position:relative;display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:10px;margin:0;border-radius:14px;background:#142b3b;color:var(--lime)}.sidebar-actions button:hover{background:#233d4b}.sidebar-actions svg{width:23px;height:23px}.request-count{position:absolute;right:-3px;top:-5px;min-width:19px;height:19px;padding:0 4px;display:grid;place-items:center;background:var(--lime);color:var(--ink);border:2px solid var(--ink);border-radius:12px;font-size:10px;font-weight:750;line-height:1}

/* Denser conversation picker: one name and one preview line per row. */
.sidebar .person{min-height:68px;padding:10px 16px;gap:12px}.sidebar .person .avatar{width:46px;height:46px;flex-basis:46px;font-size:18px}.sidebar .person strong{font-size:15px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar .person small{font-size:12px;line-height:1.4;margin-top:4px;max-width:100%}.sidebar .connection:empty{display:none}.sidebar .search{flex-shrink:0}.sidebar .brand{flex-shrink:0}
@media(max-width:700px){
 .app-shell{grid-template-rows:46px minmax(0,1fr) calc(76px + env(safe-area-inset-bottom))}
 .web-brand{font-size:27px;padding-left:18px}.sidebar{border-radius:22px 22px 0 0}
 .sidebar .brand{min-height:60px;padding:18px 116px 12px 18px}.sidebar .brand h2{font-size:23px;line-height:30px}.sidebar .brand p{display:none}.sidebar-actions{top:10px;right:14px}
 .sidebar .search{padding:0 14px 10px}.sidebar .search input{height:42px;padding:10px 13px;font-size:16px;border-radius:14px}
 .sidebar .person{height:66px;min-height:66px;padding:9px 16px;gap:12px}.sidebar .person .avatar{width:46px;height:46px;flex-basis:46px}.sidebar .people{min-height:0}
 .naber-dock{width:calc(100% - 28px);padding:4px;border-radius:22px}.naber-dock button{min-height:56px;padding:7px 4px;gap:4px;font-size:10px}.naber-dock svg{width:23px;height:23px}
}

/* Reference-inspired mobile dark appearance, using Naber's real actions. */
.conversation-meta{display:flex;flex:none;flex-direction:column;align-items:flex-end;align-self:stretch;justify-content:center;gap:7px}.conversation-meta time{font-size:11px;font-weight:400;color:var(--muted);white-space:nowrap}
@media(max-width:700px){
 :root{--lime:#20c466;--ink:#090909;--muted:#949494;--line:#272727;--panel:#101010;--bg:#090909}
 body,body.mobile-chat-active{background:#090909}.app-shell{background:#090909;grid-template-rows:0 minmax(0,1fr) calc(82px + env(safe-area-inset-bottom));padding-top:env(safe-area-inset-top)}.web-brand{display:none}
 .sidebar{background:#090909;border-radius:0}.sidebar .brand{min-height:112px;padding:62px 18px 8px}.sidebar .brand h2{font-size:34px;line-height:42px;font-weight:750;letter-spacing:-1.1px}.sidebar .brand p{display:none}
 .sidebar-actions{top:8px;right:18px;left:18px;justify-content:space-between;flex-direction:row-reverse}.sidebar-actions button{border:1px solid #2b2b2b;border-radius:50%;width:44px;height:44px;background:#191919;color:#ededed}.sidebar-actions .new-group{background:#20c466;border-color:#20c466;color:#07190e}.sidebar-actions button:hover{filter:brightness(1.15);background:#262626}.sidebar-actions .new-group:hover{background:#20c466}.request-count{background:#20c466;border-color:#090909;color:#07190e}
 .sidebar .search{position:relative;padding:0 18px 12px}.sidebar .search:before{content:'';position:absolute;left:33px;top:12px;width:13px;height:13px;border:2px solid #8d8d8d;border-radius:50%;pointer-events:none}.sidebar .search:after{content:'';position:absolute;left:46px;top:26px;width:7px;height:2px;background:#8d8d8d;transform:rotate(45deg);pointer-events:none}.sidebar .search input{border:0;border-radius:24px;height:44px;padding:10px 16px 10px 42px;background:#232323;color:#f4f4f4;font-size:15px}.sidebar .search input::placeholder{color:#929292}
 .sidebar .person{position:relative;height:74px;min-height:74px;padding:10px 18px;gap:12px;border:0;background:transparent}.sidebar .person:after{content:'';position:absolute;bottom:0;left:82px;right:18px;height:1px;background:#242424}.sidebar .person:hover,.sidebar .person.selected{background:#171717}.sidebar .person .avatar{width:52px;height:52px;flex-basis:52px;background:#242a28;color:#c9e4d2;font-size:20px;font-weight:600}.sidebar .person strong{font-size:17px;line-height:22px;font-weight:650;letter-spacing:-.2px}.sidebar .person small{font-size:14px;font-weight:400;line-height:20px;color:#929292;margin-top:3px}.conversation-meta{justify-content:flex-start;padding-top:5px;min-width:34px}.conversation-meta time{font-size:12px;color:#929292}.badge{background:#20c466;color:#06180c;font-weight:700;font-size:11px;min-width:20px;text-align:center}
 .naber-dock{border:1px solid #303030;background:#191919eF;width:calc(100% - 28px);border-radius:34px;padding:5px;gap:2px;box-shadow:0 4px 24px #0006}.naber-dock button{min-height:56px;border-radius:28px;font-size:10px;font-weight:500;color:#b2b2b2;gap:4px;padding:6px 4px}.naber-dock button[aria-current=page]{background:#343434;color:#fff}.naber-dock svg{width:25px;height:25px}
 .app-shell.chat-open:not(.social-open),.app-shell.chat-open:not(.social-open)>.conversation,.chat-head,.compose{background:#090909}.chat-head{border-bottom:1px solid #242424}.bubble{background:#242424}.bubble.mine{background:#164f39;color:#f4f7f5}.compose textarea{background:#242424;color:#fff}.compose #send{background:#20c466;color:#07190e}.chat-overflow[open]>.chat-overflow-panel{background:#202020;border-color:#363636}.inline-voice{background:#202020}
 #section-content{background:#090909;border-radius:0}.social-row,.settings-card button{background:#1c1c1c}.search input:focus-visible{outline:2px solid #20c466;outline-offset:2px}.auth{background:#111;border-color:#303030}
}

/* Match Android's floating glass capsule; no full-width dock backdrop. */
.naber-dock{width:min(480px,calc(100% - 36px));border:.8px solid #ffffff26;border-radius:40px;background:#1d1d1db3;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:none;padding:4px;gap:0;z-index:30}
.naber-dock button{color:#f1f1f1;border-radius:34px;min-height:56px;padding:7px 2px;gap:3px;font-size:10px;font-weight:400;transition:background-color .18s ease-out}
.naber-dock button[aria-current=page]{background:#383838;color:#f1f1f1;font-weight:600}.naber-dock svg{width:27px;height:27px}
@media(max-width:700px){
 .app-shell{grid-template-rows:0 minmax(0,1fr);isolation:isolate}
 .naber-dock{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(8px + env(safe-area-inset-bottom));margin:0;grid-area:auto}
 .sidebar .people{padding-bottom:calc(84px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(84px + env(safe-area-inset-bottom))}
 #section-content{padding-bottom:calc(84px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}

/* Frosted composer capsules, shared with Android. */
.conversation .compose{background:transparent;border-top:0}
.conversation .compose textarea,.conversation .compose #photo,.conversation .compose #voice-record-open,.conversation .compose #send{background:#2b2b2b66;border:.8px solid #ffffff26;border-radius:28px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#f4f7fb;box-shadow:none}
.conversation .compose #send{color:var(--lime)}.conversation .compose textarea{font-size:16px;min-width:0}
.conversation .compose #voice-record-open.recording{background:#c93248cc;color:white;border-color:#ff9eaa}
.conversation .compose textarea:focus-visible{outline:2px solid var(--lime);outline-offset:1px}
@media(max-width:700px){.conversation .compose #photo,.conversation .compose #voice-record-open{width:40px;min-width:40px;height:44px}.conversation .compose form{gap:6px}.conversation .compose textarea{padding-left:12px;padding-right:12px}}
/* Compact message bubbles: readable text without oversized padding or menu rows. */
.conversation .messages{padding:10px 12px}
.conversation .message-list{gap:4px}
.conversation .bubble{padding:6px 10px;font-size:15px;line-height:1.3;border-radius:14px 14px 14px 4px}
.conversation .bubble.mine{border-radius:14px 14px 4px 14px}
.conversation .bubble small{margin-top:2px;line-height:1.3}
.conversation .bubble .message-options{float:right;display:inline-flex;align-items:center;justify-content:center;margin:0 0 0 4px;padding:0;width:28px;min-height:24px;height:24px;font-size:20px;background:transparent}
.conversation .bubble .message-options+small{margin-right:32px;min-height:24px;display:flex;align-items:center;justify-content:flex-end}
.conversation .bubble img{margin-bottom:3px}
.conversation .bubble audio{margin:2px 0}

/* Shared Android / web palette. Green is an accent, never the page canvas. */
:root{--bg:#090909;--ink:#090909;--panel:#101010;--line:#272727;--muted:#949494;--lime:#20c466}
body,.app-shell{background:var(--bg);color:#f4f7fb}
.web-brand{color:#f4f7fb}
.sidebar,.conversation,.chat-head,#section-content{background:var(--bg)}
.conversation .bubble{background:#242424}.conversation .bubble.mine{background:#164f39;color:#f4f7f5}
.secondary,.social-row,.settings-card button{background:#232323;color:#f4f7fb}
.social-row,.settings-card button{border-radius:16px;padding:16px}
.social-row small,.section-heading p,.settings-card p{color:var(--muted)}
dialog,.auth{background:#111;border-color:var(--line)}
input,textarea,select{background:#232323;border-color:#363636}
.sidebar .search input{background:#232323;color:#f4f7fb;border:0;border-radius:24px}
.sidebar-actions button{background:#191919;color:#ededed;border-radius:50%;border:1px solid #2b2b2b}
.sidebar-actions button:hover{background:#262626}.sidebar-actions .new-group{background:var(--lime);color:#07190e;border-color:var(--lime)}
.sidebar .person{background:transparent;border-color:#242424}.sidebar .person:hover,.sidebar .person.selected{background:#171717}
.avatar{background:#242a28;color:#c9e4d2;border-radius:50%}
.inline-voice{background:#202020}
@media(min-width:701px){
 .app-shell{grid-template-columns:320px minmax(0,1fr);grid-template-rows:64px minmax(0,1fr) 84px;padding:0 16px}
 .web-brand{padding-left:18px;font-size:30px;letter-spacing:-1px}
 .sidebar{border-radius:16px 0 0 16px;border-right:1px solid var(--line)}
 .conversation{border-radius:0 16px 16px 0}#section-content{border-radius:16px}
 .sidebar .brand{padding:16px 116px 12px 18px;min-height:72px}.sidebar .brand p{display:none}.sidebar-actions{top:12px}
 .sidebar .search{padding:0 18px 12px}.sidebar .search input{height:44px;font-size:15px}
 .sidebar .person{height:74px;min-height:74px;padding:10px 18px;gap:12px}
 .sidebar .person .avatar{width:52px;height:52px;flex-basis:52px;font-size:20px}
 .sidebar .person strong{font-size:17px;line-height:22px}.sidebar .person small{font-size:14px;line-height:20px;margin-top:3px}
 .chat-head{min-height:64px;padding:8px 12px;gap:8px;border-color:var(--line)}
 .chat-head #voice-start,.chat-head #video-start{width:44px;height:44px;padding:11px;background:transparent;color:#f4f7fb}
 .mobile-icon{display:block}.mobile-icon svg{display:block;width:22px;height:22px}.desktop-label{display:none}
 .conversation .compose{padding:12px}.compose form{gap:6px;align-items:center}
 .compose #send,.compose #photo,.compose #voice-record-open{width:44px;height:44px;min-width:44px;padding:10px}
 .compose #photo{font-size:24px;padding:4px}.compose textarea{min-height:48px;height:48px}
}
@media(min-width:701px){
 .app-shell:not(.social-open)>.sidebar{background:var(--bg);border-radius:16px 0 0 16px;border-color:var(--line)}
 .app-shell:not(.social-open)>.conversation{background:var(--bg);border-radius:0 16px 16px 0}
 .conversation .chat-head{background:var(--bg)}
}

/* Edge-to-edge desktop workspace, with a permanent navigation rail. */
@media(min-width:701px){
 .app-shell{width:100%;max-width:none;height:100dvh;margin:0;padding:0;gap:0;overflow:hidden;grid-template-columns:64px clamp(280px,26vw,380px) minmax(0,1fr);grid-template-rows:minmax(0,1fr);background:#1c1e1d}
 .app-shell>.web-brand{display:none}
 .app-shell:not(.social-open)>.sidebar{grid-column:2;grid-row:1;border-radius:0;background:#151716;border-right:1px solid #303230}
 .app-shell:not(.social-open)>.conversation{grid-column:3;grid-row:1;height:100%;border-radius:0;background:#1c1e1d}
 .app-shell>#section-content{grid-column:2/-1;grid-row:1;border-radius:0;background:#151716}
 .app-shell>.naber-dock{position:static;transform:none;grid-column:1;grid-row:1;align-self:stretch;justify-self:stretch;width:64px;height:100%;margin:0;padding:12px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;border:0;border-right:1px solid #303230;border-radius:0;background:#1c1e1d;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
 .naber-dock button{flex:0 0 44px;width:44px;min-height:44px;height:44px;padding:10px;border-radius:50%;color:#a5a9a7}
 .naber-dock button[aria-current=page]{background:#343735;color:#fff}
 .naber-dock button:last-child{margin-top:auto}
 .naber-dock button span{display:none}.naber-dock svg{width:24px;height:24px}
 .sidebar .brand{min-height:64px;padding:18px 116px 12px 20px}.sidebar .brand h2{font-size:22px;line-height:28px;letter-spacing:-.4px;font-weight:600}
 .sidebar-actions{top:12px;right:18px}.sidebar-actions button{width:40px;height:40px;min-width:40px;padding:9px}
 .sidebar .search{padding:4px 20px 14px}.sidebar .search input{height:40px;background:#2b2e2c;font-size:14px}
 .sidebar .people{padding:0 10px 8px;scrollbar-width:thin;scrollbar-color:#3a3d3b transparent}
 .sidebar .person{height:74px;min-height:74px;padding:10px 12px;border:0;border-radius:12px;gap:14px;margin:2px 0}
 .sidebar .person:hover,.sidebar .person.selected{background:#2b2e2c}
 .sidebar .person .avatar{width:48px;height:48px;flex-basis:48px}
 .sidebar .person strong{font-size:16px;font-weight:600}.sidebar .person small{font-size:14px;color:#a5a9a7;font-weight:400}
 .conversation .chat-head{background:#202321;border-bottom:1px solid #303230}
 .conversation .compose{padding:12px 16px;background:transparent}
 .conversation>.empty{max-width:440px;padding:32px}.conversation>.empty .big{width:64px;height:64px;margin-bottom:20px;border-radius:50%;background:#303431;border:0;color:#20c466;font-size:32px}
 .conversation>.empty h2{font-size:24px;line-height:1.3;letter-spacing:-.4px}.conversation>.empty p{font-size:14px;color:#a5a9a7;line-height:1.6}
}
/* Shared glass surfaces, keyboard-accessible native dialogs and menus. */
dialog:not(#photo-viewer):not(#voice-call){background:#202522df;border:1px solid #ffffff24;border-radius:24px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 20px 70px #0007;padding:24px}
dialog::backdrop{background:#0007;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.chat-overflow{display:block;position:relative;flex:none}.chat-overflow>summary{display:grid;place-items:center;list-style:none;cursor:pointer;width:36px;height:44px;font-size:26px;border-radius:22px}.chat-overflow>summary::-webkit-details-marker{display:none}.chat-overflow>summary:hover{background:#ffffff10}
.chat-overflow>.chat-overflow-panel{display:none}.chat-overflow[open]>.chat-overflow-panel{display:flex;position:absolute;right:0;top:48px;z-index:40;min-width:230px;max-height:calc(100dvh - 120px);overflow:auto;flex-direction:column;padding:6px;background:#202522ec;border:1px solid #ffffff24;border-radius:18px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 12px 40px #0007}
.chat-overflow-panel button{padding:12px 14px;text-align:left;min-height:44px;color:#f4f7fb;border-radius:12px;background:transparent}.chat-overflow-panel button:hover{background:#ffffff10}.chat-overflow-panel button[hidden]{display:none}.chat-overflow-panel .danger{color:#ff9ca7}
.tool-choices{display:flex;flex-direction:column;gap:6px;max-height:65dvh;overflow:auto}.tool-choices button{display:flex;align-items:center;gap:12px;text-align:left;min-height:48px;background:#ffffff0a;color:#f4f7fb;border-radius:14px}.tool-choices button:hover{background:#ffffff18}.tool-choices .danger{color:#ff9ca7}
.reply-quote,#reply-preview{border-left:3px solid #20c466;background:#ffffff0a;border-radius:8px;padding:8px 10px;margin-bottom:6px;font-size:13px;white-space:normal}.reply-quote strong,.reply-quote span,#reply-preview span{display:block}.reply-quote span,#reply-preview span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:280px}.reply-quote strong{color:#71d39c}#reply-preview{display:flex;justify-content:space-between;align-items:center}#reply-preview[hidden]{display:none}.forwarded-label{font-style:italic;text-align:left!important}.search-hit{padding:12px;background:#ffffff08;border-radius:12px}.search-hit small{display:block}.contact-card{text-align:center}.contact-card .avatar{width:72px;height:72px;margin:20px auto}
#conversation-filter{margin-top:8px;padding:6px 12px;height:34px;border-radius:18px;font-size:13px;background:#ffffff08}.person[hidden]{display:none}
.chat-overflow-panel button{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500}.chat-overflow-panel button svg{width:19px;height:19px;flex:none}
/* Compact, accessible story/call actions across phone, tablet and desktop. */
.section-heading .section-icon{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:48px;height:48px;min-width:48px;padding:12px;margin:8px 8px 0 0;border-radius:50%;background:#20c466;color:#07190e}
.section-heading .section-icon.secondary{background:#232323;color:#f4f7fb}.section-heading .section-icon svg{display:block;width:24px;height:24px}.section-heading .section-icon:hover{filter:brightness(1.12)}
/* Attachment popover: photo blue, camera pink; microphone remains separate. */
.conversation .compose{position:relative}
.attachment-menu{position:absolute;left:12px;bottom:calc(100% - 4px);z-index:35;width:224px;max-width:calc(100% - 24px);padding:6px;background:#1d211ff2;border:1px solid #ffffff1f;border-radius:16px;box-shadow:0 12px 36px #0006;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.attachment-menu[hidden]{display:none}.attachment-menu button{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:10px 12px;background:transparent;color:#f4f7fb;border-radius:10px;font-size:14px;font-weight:550;text-align:left}.attachment-menu button:hover,.attachment-menu button:focus-visible{background:#ffffff0d}.attachment-menu svg{width:22px;height:22px;flex:none}.attach-gallery{color:#149bff}.attach-camera{color:#ff3282}

/* Search results navigate to the original message in the conversation. */
button.search-hit{display:block;width:100%;text-align:left;color:inherit;border:1px solid #8883;margin:8px 0;white-space:pre-wrap;overflow-wrap:anywhere;font-weight:400}button.search-hit:hover{background:#20c46618}.search-hit-hint{display:block;color:#20b866;font-size:12px;margin-top:6px}.bubble.search-target{outline:2px solid #20c466;outline-offset:3px;box-shadow:0 0 0 6px #20c46626}