*{box-sizing:border-box} :root{--green:#18b86a;--green-dark:#079455;--ink:#16231f;--muted:#7d8884;--line:#e8ecea;--soft:#f7f8f7;--paper:#f6f3ed}body{margin:0;color:var(--ink);font-family:'DM Sans',sans-serif;background:#eef2ef}button,input{font:inherit}button{cursor:pointer;border:0;background:none}.app-shell{min-height:100vh}.login-view{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.login-art{position:relative;overflow:hidden;padding:42px 7vw;background:var(--green);color:#fff}.art-top{font:700 24px 'Space Grotesk';display:flex;gap:10px;align-items:center}.wa-mark{font-size:27px;line-height:1}.art-copy{position:relative;z-index:1;margin-top:20vh;max-width:500px}.eyebrow,.mini-label{font-size:11px;letter-spacing:.18em;font-weight:700;opacity:.7}.art-copy h1{font:600 clamp(48px,6vw,92px)/.98 'Space Grotesk';letter-spacing:-3px;margin:24px 0}.art-copy h1 em{font-style:normal;color:#b7f5cc}.art-copy p:last-child{max-width:360px;line-height:1.7;opacity:.8}.art-orbit{position:absolute;border:1px solid rgba(255,255,255,.24);border-radius:50%}.orbit-one{width:650px;height:650px;right:-220px;bottom:-180px}.orbit-two{width:370px;height:370px;right:-20px;bottom:30px}.login-panel{display:flex;align-items:center;padding:40px 9vw}.login-box{width:100%;max-width:420px}.mobile-brand{display:none;color:var(--green);font:700 25px 'Space Grotesk';margin-bottom:80px}.login-box h2{font:600 44px/1.05 'Space Grotesk';letter-spacing:-1.5px;margin:18px 0}.muted{color:var(--muted);line-height:1.6}.login-box form{margin-top:36px}.login-box label{display:block;font-size:13px;font-weight:600;margin-bottom:20px}.login-box input{display:block;width:100%;border:0;border-bottom:1px solid #cbd3cf;padding:14px 0;outline:none;color:var(--ink);background:transparent}.login-box input:focus{border-color:var(--green)}.primary-button{display:flex;justify-content:space-between;align-items:center;width:100%;background:var(--green);color:#fff;border-radius:9px;padding:16px 18px;margin-top:34px;font-weight:700;transition:.2s}.primary-button:hover{background:var(--green-dark);transform:translateY(-1px)}.primary-button span{font-size:22px}.form-error{color:#d55252;font-size:13px;min-height:19px}.login-note{border-top:1px solid var(--line);margin-top:58px;padding-top:18px;color:var(--muted);font-size:12px}.login-note span{color:var(--green);font-size:20px;margin-right:8px}.workspace{display:none;height:100vh;overflow:hidden;background:#fff}.workspace.visible{display:grid;grid-template-columns:62px 480px 1fr}.rail{border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:17px 0;gap:38px}.rail-logo{width:36px;height:36px;display:grid;place-items:center;background:#f0f2f1;border-radius:50%;font-size:20px}.rail nav,.rail-bottom{display:flex;flex-direction:column;align-items:center;gap:19px}.rail-bottom{margin-top:auto}.rail-button,.profile-dot{width:38px;height:38px;border-radius:50%;color:#67736e;font-size:20px}.rail-button.active{background:#e1f8e7;color:var(--green)}.profile-dot{background:#d8f7df;color:#169450;font-weight:700;font-size:11px}.chat-list{position:relative;border-right:1px solid var(--line);min-width:0}.list-header{height:70px;display:flex;justify-content:space-between;align-items:center;padding:0 20px}.list-header h1{font:700 22px 'Space Grotesk';color:#0da65a;margin:4px 0}.mini-label{font-size:9px;color:var(--muted);margin:0}.round-button{background:var(--green);color:#fff;border-radius:50%;width:40px;height:40px;font-size:25px}.search-box{display:flex;align-items:center;gap:12px;margin:0 20px 10px;padding:11px 14px;border-radius:22px;background:#f5f5f5;color:#727a77}.search-box input{border:0;outline:0;background:transparent;min-width:0;width:100%;font-size:13px}.filter-row{display:flex;gap:8px;padding:0 20px 14px;overflow:auto}.filter{white-space:nowrap;border:1px solid #d7dcda;padding:7px 15px;border-radius:20px;color:#68716e;font-size:12px}.filter.active{background:#dcf9e2;border-color:#a8d9b3;color:#118847}.filter-more{padding:7px 12px}.chat-items{height:calc(100vh - 190px);overflow:auto;padding:0 10px}.chat-item{display:flex;align-items:center;gap:13px;padding:12px;margin-bottom:1px;border-radius:12px}.chat-item.active{background:#f4f4f4}.avatar{position:relative;flex:0 0 48px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#dbf9df;color:#149753;font-weight:600}.avatar.brand{background:var(--green);color:#fff}.presence{position:absolute;right:-1px;bottom:1px;background:var(--green);border:2px solid white;width:11px;height:11px;border-radius:50%}.chat-copy{min-width:0;flex:1}.chat-copy strong{display:block;font-size:15px;font-weight:500}.chat-copy p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#777f7c;font-size:13px;margin:5px 0 0}.chat-time{align-self:flex-start;color:#737a77;font-size:11px}.download-banner{position:absolute;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);display:flex;gap:12px;align-items:center;padding:17px 25px;color:#129352;font-size:14px}.download-banner b{margin-left:auto}.apple{font-size:23px}.conversation{min-width:0;display:flex;flex-direction:column;background:var(--paper)}.conversation-header{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px}.contact{display:flex;align-items:center;gap:12px}.contact .avatar{width:40px;height:40px;flex-basis:40px}.contact strong,.contact small{display:block}.contact strong{font-weight:500}.contact small{color:var(--muted);font-size:12px;margin-top:4px}.conversation-tools{display:flex;gap:15px}.conversation-tools button{font-size:24px;color:#19231f}.messages{flex:1;overflow:auto;padding:70px 4.5vw 20px;background-color:#f8f4ec;background-image:radial-gradient(#e8dfd1 1px,transparent 1px);background-size:20px 20px}.message-date{width:max-content;margin:0 auto 13px;padding:5px 12px;background:#fff;border-radius:6px;color:#777;font-size:11px;box-shadow:0 1px 2px #ddd}.bubble{max-width:min(80%,510px);padding:9px 11px;margin:0 0 9px;font-size:13px;border-radius:8px;box-shadow:0 1px 1px #ddd}.bubble time{font-size:10px;color:#738078;margin-left:9px;float:right;margin-top:4px}.bubble i{color:#1ba8f2;font-style:normal}.incoming{background:#fff;margin-right:auto}.outgoing{background:#d8ffd5;margin-left:auto}.composer{margin:0 10px 10px;background:#fff;border-radius:24px;display:flex;align-items:center;gap:14px;padding:7px 13px;box-shadow:0 1px 4px #ddd}.composer button{font-size:22px;color:#222}.composer input{border:0;outline:0;flex:1;min-width:0;padding:9px;font-size:14px}.send-button{color:var(--green)!important}.qr-modal{display:none;position:fixed;inset:0;background:rgba(15,30,24,.55);z-index:10;place-items:center;padding:20px}.qr-modal.open{display:grid}.modal-card{position:relative;width:min(100%,430px);background:#fff;border-radius:18px;padding:35px;text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.25)}.modal-close{position:absolute;right:16px;top:12px;font-size:25px;color:#9aa39f}.modal-icon{margin:auto;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#e0f8e5;color:var(--green);font-size:22px}.modal-card h2{font:600 28px 'Space Grotesk';margin:14px 0 6px}.qr-frame{width:240px;height:240px;margin:22px auto 14px;display:grid;place-items:center;background:#f5f8f6;border:1px solid #e0e8e3;border-radius:10px;padding:10px}.qr-frame img{width:100%;height:100%;image-rendering:pixelated}.qr-loading{color:var(--muted);font-size:13px}.qr-status{font-size:12px;color:var(--muted)}.text-button{color:var(--green);font-weight:600;margin-top:22px}@media(max-width:900px){.login-art{padding:32px}.art-copy{margin-top:18vh}.workspace.visible{grid-template-columns:62px minmax(280px,38vw) 1fr}}@media(max-width:650px){.login-view{grid-template-columns:1fr}.login-art{min-height:260px;padding:25px 28px}.art-copy{margin-top:45px}.art-copy h1{font-size:49px;margin:12px 0}.art-copy p:last-child{display:none}.orbit-one{width:400px;height:400px}.login-panel{padding:38px 28px;align-items:flex-start}.mobile-brand{display:block}.login-box h2{font-size:35px}.workspace.visible{display:block;position:relative}.rail{display:none}.chat-list{height:100vh;border:0}.conversation{display:none}.chat-items{height:calc(100vh - 190px)}.chat-list.mobile-hidden{display:none}.conversation.mobile-visible{display:flex;height:100vh}.conversation-header{height:64px}.messages{padding:35px 14px 15px}.bubble{max-width:88%}.modal-card{padding:30px 20px}.download-banner{display:none}}