:root{--ink:#18332f;--muted:#74847f;--green:#087e70;--green-dark:#064e45}
body,input,button,textarea{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
button,input,textarea{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:3px solid #51bca4;outline-offset:3px}
.auth-brand{background:radial-gradient(ellipse at 90% 85%,#228e75,transparent 60%),#073d35}
.brand-copy h1{font-size:clamp(38px,4vw,62px);line-height:1.12;letter-spacing:-2px}
.brand-copy p{font-size:16px;line-height:1.85;max-width:410px}.eyebrow{font-size:10px;letter-spacing:2px}
.auth-card{border-radius:20px;box-shadow:0 18px 60px #123b2910;padding:38px}
.auth-heading h2{font-size:29px;letter-spacing:-1px}.auth-heading p{font-size:13px;line-height:1.6;margin-top:10px}
.field label{font-size:12px}.field-hint{font-size:10px;line-height:1.6}.switch-copy{font-size:12px;line-height:1.6}.privacy-note{font-size:10px;line-height:1.6}
.auth-tab,.primary-button{font-size:13px}.float-bubble{font-size:13px}.float-avatar{right:1%}
.chat-page{background:#eaf0ed}.chat-shell{border:1px solid #dbe5df;border-radius:16px;box-shadow:0 12px 48px #173f2910;grid-template-columns:350px minmax(0,1fr)}
.sidebar-head{background:#fff;height:78px;min-height:78px;border-bottom:0}.brand.compact{font-size:20px}.brand.compact .brand-mark{background:#087e70;border-radius:12px;width:38px;height:38px}
.my-avatar{cursor:pointer;border:3px solid #edf5f0;box-shadow:0 0 0 1px #dbe6df}
.search-area{padding:8px 18px 14px}.search-box{background:#f3f6f4;border-radius:12px;height:46px}.search-box input{font-size:12px}
.list-label{padding:14px 22px;letter-spacing:1.4px;font-size:10px;color:#81948b;border-top:1px solid #f0f4f1}
.contact{padding:15px 18px;gap:12px;border-bottom:1px solid #f4f6f4}.contact.active{background:#eaf6ef;box-shadow:inset 3px 0 #168e72}.contact-name{font-size:13px}.contact-preview{font-size:11px;line-height:1.7;display:block}.contact-time{font-size:10px}.contact .avatar{width:44px;height:44px;font-size:15px}.contact{grid-template-columns:44px minmax(0,1fr) auto}
.empty-list{padding:64px 24px}.empty-list strong{font-size:14px}.empty-list p{font-size:12px;line-height:1.8}
.welcome-state{background:radial-gradient(ellipse at center,#e8f3eb 0,transparent 65%),#f6f9f6;border-bottom:4px solid #13866e}.welcome-state h2{font-size:26px;letter-spacing:-.9px}.welcome-state p{font-size:13px;line-height:1.9;margin-top:8px}.secure-line{font-size:10px}
.conversation-head{height:76px;min-height:76px;background:#fff;padding:0 20px}.back-button{display:grid;place-items:center;border:0;border-radius:10px;height:40px;min-width:36px;background:#f1f6f3;color:#496359}.back-button svg{width:22px;height:22px}.peer-meta strong{font-size:14px}.peer-meta span{font-size:11px;margin-top:4px}
.messages{background-color:#f0f5ef;background-image:radial-gradient(#42694a0b 1px,transparent 1px);background-size:22px 22px}
.message-row{margin:7px 0}.bubble{padding:11px 12px 8px;border-radius:14px;min-width:85px;line-height:1.55;font-size:13px}.bubble-time{position:static;display:block;text-align:right;margin-top:5px;font-size:9px}.message-row.mine .bubble{background:#d9efdf;border-bottom-right-radius:4px}.message-row:not(.mine) .bubble{border-bottom-left-radius:4px}
.composer{background:#fff;padding:14px 20px;border-top:1px solid #e8eee8}.composer textarea{background:#f6f8f5;border-color:#e8eee6;font-size:14px;border-radius:12px}.composer button{box-shadow:none;border-radius:12px}.profile-card{max-height:calc(100dvh - 32px);overflow:auto}.profile-main h2{overflow-wrap:anywhere}.profile-row strong{overflow-wrap:anywhere}.profile-details{text-align:left}
@media(max-width:900px){.chat-shell{border-radius:0;border:0;grid-template-columns:310px minmax(0,1fr)}.auth-card{padding:30px}.auth-heading{text-align:center}}
@media(max-width:680px){.chat-shell{display:block;height:100dvh}.sidebar-head,.conversation-head{height:70px;min-height:70px;padding-top:env(safe-area-inset-top)}.search-box input{font-size:16px}.auth-card{padding:28px 22px}.auth-heading h2{font-size:26px}.messages{padding:16px 12px}.composer{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.composer textarea{font-size:16px}.welcome-state h2{font-size:23px}.contact{min-height:77px}.sidebar-head{padding-inline:18px}.chat-shell.chat-open .sidebar{display:none}.chat-shell:not(.chat-open) .sidebar{display:flex}.chat-shell:not(.chat-open) .conversation{display:none}}