:root{--ink:#202421;--muted:#8b928c;--green:#c7f06f;--line:#e8ebe6}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#dfe4dd;color:var(--ink)}body{font-family:Arial,Helvetica,sans-serif}button,input,textarea{font:inherit}button{color:inherit}.app-shell{width:min(1440px,calc(100vw - 36px));height:min(900px,calc(100vh - 36px));min-height:650px;margin:18px auto;display:grid;grid-template-columns:350px 1fr;overflow:hidden;background:#fff;border-radius:22px;box-shadow:0 24px 70px rgba(37,48,39,.18)}
.sidebar{background:#f7f8f5;border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0;z-index:5}.brand-row{height:82px;display:flex;align-items:center;padding:0 22px;gap:12px}.brand-mark{width:34px;height:34px;border-radius:11px;background:var(--green);display:grid;place-items:center;font:800 17px/1 Georgia,serif;transform:rotate(-5deg)}.brand-name{font:700 22px/1 Georgia,serif}.icon-button{border:0;background:transparent;width:38px;height:38px;border-radius:12px;cursor:pointer;display:grid;place-items:center;font-size:21px;transition:.2s}.icon-button:hover,.icon-button.active{background:#e9ede5}.compose{margin-left:auto;background:#202421;color:#fff;font-size:25px}.search-box{height:44px;margin:0 18px 22px;display:flex;align-items:center;gap:9px;background:#ecefea;border-radius:12px;padding:0 12px;color:#697169}.search-box input{border:0;outline:0;background:transparent;flex:1;min-width:0}.search-box kbd{font:11px Arial;color:#9aa199;background:#f7f8f5;border:1px solid #dfe3dc;padding:4px 6px;border-radius:5px}.section-label{padding:0 22px 10px;color:#99a098;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;display:flex;justify-content:space-between}
.chat-list{padding:0 10px;flex:1;overflow-y:auto}.chat-item{width:100%;border:0;background:transparent;display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:12px;border-radius:15px;text-align:left;cursor:pointer}.chat-item:hover{background:#eef1eb}.chat-item.active{background:#e7eadf}.avatar{position:relative;width:46px;height:46px;flex:0 0 auto;border-radius:15px;display:grid;place-items:center;font-weight:800;font-size:13px;color:#31372f}.avatar i{position:absolute;width:11px;height:11px;right:-2px;bottom:-2px;background:#76b73b;border:3px solid #fff;border-radius:99px}.coral{background:#f6b6a5}.violet{background:#cabaf4}.blue{background:#a9d4ef}.lime{background:#cfe99b}.amber{background:#f5d396}.chat-copy{min-width:0;display:grid;gap:5px}.chat-copy strong{font-size:14px}.chat-copy small{color:#858d85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.chat-meta{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;gap:8px;color:#9aa19a;font-size:10px;padding-top:3px}.chat-meta b{background:#2c3429;color:#fff;min-width:18px;height:18px;display:grid;place-items:center;border-radius:9px;font-size:10px}.profile-row{height:76px;border-top:1px solid var(--line);display:grid;grid-template-columns:42px 1fr 38px;align-items:center;gap:11px;padding:0 18px}.profile-row .avatar{width:40px;height:40px;border-radius:13px}.profile-row>span:not(.avatar){display:grid;gap:3px}.profile-row small{color:#7da45c;font-size:11px}
.conversation{min-width:0;display:grid;grid-template-rows:76px minmax(0,1fr) auto;background:#fff}.chat-header{border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 26px;gap:13px}.chat-header .avatar{width:42px;height:42px;border-radius:14px}.header-copy{display:grid;gap:3px}.header-copy strong{font-size:14px}.header-copy small{color:#8c938c;font-size:11px}.status-dot{display:inline-block;width:6px;height:6px;background:#76b73b;border-radius:50%;margin-right:3px}.header-actions{margin-left:auto;display:flex;gap:3px}.mobile-menu{display:none}.message-area{overflow-y:auto;padding:24px clamp(24px,5vw,72px) 20px;background-color:#fafbf8;background-image:radial-gradient(#dfe4db .8px,transparent .8px);background-size:22px 22px}.day-divider{display:flex;align-items:center;gap:12px;color:#9ba19b;font-size:10px;margin:0 0 26px}.day-divider:before,.day-divider:after{content:"";height:1px;background:#e5e8e2;flex:1}.day-divider span{background:#eff2ec;padding:6px 11px;border-radius:10px}
.message-line{display:flex;align-items:flex-end;gap:9px;margin:7px 0;min-height:32px}.message-line.me{justify-content:flex-end;padding-left:15%}.message-line.them{padding-right:15%}.avatar.mini{width:32px;height:32px;border-radius:11px;font-size:10px}.bubble{max-width:620px;border-radius:17px 17px 17px 5px;padding:10px 13px 7px;background:#fff;border:1px solid #e7eae4;box-shadow:0 2px 7px rgba(43,54,44,.05)}.me .bubble{background:#dafa94;border-color:#d2eb9e;border-radius:17px 17px 5px 17px}.bubble p{white-space:pre-line;margin:0;font-size:14px;line-height:1.5}.bubble time{display:block;text-align:right;color:#8e978b;font-size:9px;margin-top:4px}.checks{color:#6da03d;margin-left:4px;letter-spacing:-2px}.file-bubble{min-width:min(320px,65vw);padding:7px}.file-row{padding:5px 6px;display:flex;gap:11px;align-items:center}.file-row>span:last-child{display:grid;gap:4px;min-width:0}.file-row strong{font-size:13px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.file-row small{font-size:10px;color:#7b8578}.file-icon{width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.75);display:grid;place-items:center;font-size:20px}.image-preview{display:block;width:min(380px,55vw);max-height:280px;object-fit:cover;border-radius:12px}
.composer-wrap{padding:0 26px 16px;border-top:1px solid var(--line);background:#fff}.typing{height:34px;display:flex;align-items:center;gap:4px;color:#8b938a;font-size:10px}.typing.notice{color:#a16a3d}.avatar.tiny{width:20px;height:20px;border-radius:7px;font-size:7px;margin-right:3px}.typing i{width:3px;height:3px;border-radius:50%;background:#8d958c;animation:blink 1.2s infinite}@keyframes blink{50%{opacity:.25;transform:translateY(-2px)}}.composer{min-height:54px;position:relative;background:#f2f4f0;border:1px solid #e4e8e1;border-radius:16px;display:flex;align-items:flex-end;padding:7px;gap:5px}.composer textarea{flex:1;align-self:center;max-height:110px;resize:none;border:0;outline:0;background:transparent;line-height:1.5;padding:8px 6px;font-size:14px}.attach{flex:0 0 auto;background:#fff;color:#697169}.emoji-trigger{color:#697169}.send-button{width:39px;height:39px;flex:0 0 auto;border:0;border-radius:12px;background:#222822;color:#fff;cursor:pointer}.send-button:disabled{background:#d8ddd6}.composer-hint{text-align:right;color:#abb1aa;font-size:9px;padding:7px 3px 0}.emoji-panel{position:absolute;right:42px;bottom:60px;width:234px;padding:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 45px rgba(40,50,40,.16);z-index:8}.emoji-panel[hidden]{display:none}.emoji-panel button{border:0;background:transparent;border-radius:8px;padding:7px;font-size:20px;cursor:pointer}.scrim{display:none}
@media(max-width:820px){.app-shell{width:100%;height:100dvh;min-height:560px;margin:0;border-radius:0;grid-template-columns:1fr}.sidebar{position:fixed;width:min(350px,88vw);height:100dvh;transform:translateX(-105%);transition:.25s;box-shadow:16px 0 50px rgba(20,30,20,.18)}.sidebar.mobile-open{transform:translateX(0)}.mobile-menu{display:grid}.scrim.mobile-open{display:block;position:fixed;inset:0;border:0;background:rgba(28,35,29,.34);z-index:4}.chat-header{padding:0 14px}.message-area{padding-inline:16px}.message-line.them{padding-right:5%}.message-line.me{padding-left:5%}.composer-wrap{padding-inline:12px}.composer-hint{display:none}.typing{height:28px}}@media(max-width:480px){.header-actions .icon-button:first-child{display:none}.bubble p{font-size:13px}.file-bubble{min-width:240px}}
.auth-screen{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 30% 20%,#f2f7e7,#dce4da 55%,#cfd8ce)}.auth-screen[hidden],.app-shell[hidden]{display:none}.auth-card{width:min(440px,100%);padding:38px;background:#fff;border:1px solid #e5e9e2;border-radius:25px;box-shadow:0 28px 80px rgba(35,49,38,.18);display:grid;gap:17px}.auth-logo{width:52px;height:52px;border-radius:16px;font-size:24px}.auth-card h1{font:700 28px/1.15 Georgia,serif;margin:5px 0 0}.auth-card p{margin:0;color:#7c857c;line-height:1.55}.auth-card label{display:grid;gap:8px;font-weight:700;font-size:13px}.auth-card input,.modal-card input{width:100%;border:1px solid #dfe5dd;border-radius:13px;padding:14px 15px;outline:none;background:#f7f9f5}.auth-card input:focus,.modal-card input:focus{border-color:#9fbd65;box-shadow:0 0 0 3px rgba(199,240,111,.2)}.primary-button{border:0;border-radius:13px;padding:14px 18px;background:#202421;color:#fff;font-weight:700;cursor:pointer}.auth-card small,.modal-card small{color:#b04f4f;min-height:16px}
.profile-card{height:88px;display:grid;grid-template-columns:46px 1fr 40px;align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--line)}.profile-copy{display:grid;gap:4px;min-width:0}.profile-copy strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-copy button{border:0;padding:0;background:transparent;text-align:left;color:#7e887c;cursor:pointer}.profile-copy small{font-size:10px;letter-spacing:.04em}.profile-card .compose{margin:0}.sidebar-help{padding:15px 20px;border-top:1px solid var(--line);color:#929a91;font-size:10px;line-height:1.5}.no-chats{text-align:center;color:#929a91;padding:45px 15px;font-size:12px}.empty-state{height:100%;display:grid;place-content:center;text-align:center;color:#8b948a}.empty-state div{font-size:42px;color:#a9cf61}.empty-state h2{margin:12px 0 5px;font:700 22px Georgia,serif;color:#3d453d}.empty-state p{margin:0;max-width:300px;line-height:1.5;font-size:12px}.message-area .empty-state[hidden]{display:none}
.modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:rgba(27,34,29,.48);backdrop-filter:blur(5px)}.modal[hidden]{display:none}.modal-card{position:relative;width:min(410px,100%);background:#fff;border-radius:22px;padding:30px;display:grid;gap:15px;box-shadow:0 25px 80px rgba(0,0,0,.25)}.modal-card h2{margin:0;font:700 24px Georgia,serif}.modal-card p{margin:0;color:#808980;font-size:13px}.modal-card input{text-transform:uppercase;letter-spacing:.08em;font-weight:700}.modal-close{position:absolute;right:14px;top:12px;width:35px;height:35px;border:0;border-radius:10px;background:transparent;font-size:25px;cursor:pointer}.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translate(-50%,20px);opacity:0;padding:11px 17px;border-radius:12px;background:#202421;color:#fff;font-size:12px;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
.file-row{color:var(--ink);text-decoration:none}.bubble p{color:var(--ink)}
.conversation{height:100%;min-height:0;overflow:hidden}.message-area{height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.messages-loading{text-align:center;color:var(--muted);font-size:12px;padding:30px}.message-line:last-child{scroll-margin-bottom:12px}
.message-area{padding:18px clamp(16px,4vw,48px) 14px}.day-divider{margin-bottom:18px}.message-line{gap:7px;margin:4px 0;min-height:26px}.message-line.me{padding-left:12%}.message-line.them{padding-right:12%}.bubble{max-width:520px;padding:7px 10px 5px;border-radius:13px 13px 13px 4px;box-shadow:none}.me .bubble{border-radius:13px 13px 4px 13px}.bubble p{font-size:13px;line-height:1.35}.bubble time{font-size:8px;margin-top:3px}.avatar.mini{width:28px;height:28px;border-radius:9px;font-size:9px}.file-bubble{min-width:min(250px,62vw);padding:5px}.file-row{padding:4px;gap:8px}.file-icon{width:32px;height:32px;border-radius:9px;font-size:17px}.file-row strong{font-size:12px}.image-preview{width:min(320px,62vw);max-height:220px;border-radius:10px}
@media(max-width:820px){.message-area{padding-inline:12px}.message-line.me{padding-left:8%}.message-line.them{padding-right:8%}.image-preview{width:min(300px,72vw);max-height:210px}.file-bubble{min-width:min(230px,72vw)}}