@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');
:root{--green:#174b3b;--green2:#2d7559;--ink:#1c3029;--line:#e6ebe7;--muted:#83918a;--bubble:#e5f4e5}*{box-sizing:border-box}body{margin:0;background:#e9efeb;color:var(--ink);font-family:'DM Sans',sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.gate{min-height:100dvh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 20% 10%,#e0eee4,transparent 45%),#f5f7f3}.gate-card{width:min(420px,100%);background:#fff;border:1px solid #e7ece8;border-radius:25px;padding:35px;box-shadow:0 25px 90px #183d2c13}.mark,.brand-mark{width:52px;height:52px;display:grid;place-items:center;border-radius:17px;background:var(--green);color:white;font-size:29px}.kicker{font-size:9px;letter-spacing:2px;font-weight:700;color:#7f9487;margin:22px 0 8px}.gate h1{font:700 32px 'Playfair Display',serif;margin:0}.muted{font-size:13px;color:var(--muted);margin:9px 0 28px}.gate label{display:block;font-size:11px;font-weight:700;color:#5c6f64;margin:16px 0 7px}.gate input{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:11px;outline:none}.gate input:focus{border-color:#87b69b}.primary{background:var(--green);color:white;border:0;border-radius:11px;padding:13px 16px;font-weight:700;font-size:12px;margin-top:20px}.primary:hover{background:var(--green2)}.primary span{float:right}.wide{width:100%}.fine{font-size:10px;line-height:1.7;color:#9aa59f;margin:20px 0 0;overflow-wrap:anywhere}.app{height:100dvh;min-height:570px;display:grid;grid-template-columns:320px minmax(0,1fr);max-width:1600px;margin:auto;background:white;box-shadow:0 20px 70px #173c2a10}.sidebar{border-right:1px solid var(--line);display:flex;flex-direction:column;padding:25px 18px 18px;min-width:0}.brand{display:flex;align-items:center;gap:11px;padding:0 5px 23px;border-bottom:1px solid var(--line)}.brand-mark{width:42px;height:42px;border-radius:14px;font-size:24px}.brand h2{font:700 18px 'Playfair Display',serif;margin:0}.brand p{font-size:11px;color:#7f8f86;margin:4px 0 0}.round{width:36px;height:36px;border:1px solid var(--line);background:white;color:#587064;border-radius:12px;font-size:17px;display:grid;place-items:center}.brand .round{margin-left:auto}.search{display:flex;align-items:center;gap:9px;background:#f4f6f4;border-radius:12px;padding:0 13px;height:43px;margin:22px 0 27px;color:#72867a}.search span{font-size:24px}.search input{width:100%;background:transparent;border:0;outline:0;font-size:12px}.section{font-size:9px;font-weight:700;letter-spacing:1.4px;color:#9aa69f;padding:0 8px 13px}.section span{float:right}.room-card{display:flex;align-items:center;gap:11px;border:1px solid #dce9df;background:#f0f6f0;border-radius:15px;padding:13px 12px}.avatar{width:43px;height:43px;display:grid;place-items:center;border-radius:15px;background:#dbeadf;color:#275b45;font-size:12px;font-weight:700;flex-shrink:0}.room-copy{min-width:0;flex:1}.room-copy strong{font-size:12px}.room-copy p{font-size:10px;color:#839187;margin:6px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card i,.live{width:7px;height:7px;background:#42ad78;border-radius:50%;display:inline-block}.side-bottom{margin-top:auto;border-top:1px solid var(--line);padding:19px 5px 0;display:flex;align-items:flex-start;gap:9px}.side-bottom .live{margin-top:5px}.side-bottom strong{font-size:11px}.side-bottom p{font-size:10px;color:#8d9992;margin:5px 0 0}.side-bottom button{margin-left:auto}.chat{display:flex;flex-direction:column;min-width:0;background:#f8f9f6;position:relative}.chat-head{height:78px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 25px;flex-shrink:0}.peer{flex:1}.peer strong{font-size:13px}.peer p{font-size:10px;color:#839187;margin:5px 0 0;display:flex;align-items:center;gap:6px}.privacy{margin:17px auto 5px;width:min(530px,calc(100% - 40px));display:flex;align-items:center;gap:13px;padding:13px 17px;background:#eaf3e9;border:1px solid #e0ece0;border-radius:14px;color:#28563f}.privacy>span{font-size:23px}.privacy strong{font-size:11px}.privacy p{font-size:10px;color:#688171;margin:5px 0 0;line-height:1.6}.messages{flex:1;overflow:auto;padding:20px clamp(18px,5vw,70px);display:flex;flex-direction:column;gap:12px;background-color:#f7f8f4;background-image:radial-gradient(#dfe8de .65px,transparent .65px);background-size:17px 17px}.welcome{align-self:center;text-align:center;margin:auto 0;color:#85948a}.welcome-symbol{width:45px;height:45px;border-radius:16px;background:#e9f1e8;color:#47745b;display:grid;place-items:center;font-size:23px;margin:0 auto 13px}.welcome strong{font-size:12px;color:#526b5c}.welcome p{font-size:11px;line-height:1.7;max-width:260px}.msg{max-width:min(75%,500px);align-self:flex-start;background:white;border:1px solid #e8ede8;border-radius:5px 15px 15px 15px;padding:11px 13px 8px;box-shadow:0 3px 10px #1c3d2c05;font-size:12px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}.msg.mine{align-self:flex-end;background:var(--bubble);border-color:#d9ebd9;border-radius:15px 5px 15px 15px}.msg-meta{display:flex;justify-content:flex-end;gap:5px;font-size:9px;color:#89988e;margin-top:5px}.file-link{display:block;margin-top:7px;color:#245e47;font-weight:700;font-size:11px;overflow-wrap:anywhere}.composer{display:flex;align-items:center;gap:10px;padding:13px 23px 12px;background:white;border-top:1px solid var(--line)}.attach{border:0;background:transparent;color:#7f9185;font-size:25px;width:32px;height:42px}.composer textarea{flex:1;resize:none;max-height:110px;min-height:44px;padding:13px 16px;background:#f6f8f5;border:1px solid #edf0ec;border-radius:25px;outline:none;font-size:12px}.composer textarea:focus{border-color:#b5d4bd;background:white}.send{width:43px;height:43px;border:0;border-radius:50%;background:var(--green);color:white;font-size:19px}.footer{text-align:center;background:white;color:#a1aaa3;font-size:8px;letter-spacing:1.6px;padding:0 0 12px}.footer span{padding:0 6px;color:#4e8a66}.file-status{padding:8px 25px;background:white;color:#527160;font-size:10px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#1b3e30;color:white;padding:12px 17px;border-radius:10px;font-size:11px;opacity:0;pointer-events:none;transition:.2s;z-index:5}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid var(--line);border-radius:20px;padding:0;width:min(390px,calc(100% - 30px));color:var(--ink);box-shadow:0 20px 80px #173c2a25}dialog::backdrop{background:#132d2280;backdrop-filter:blur(3px)}.dialog-inner{padding:27px;position:relative}.dialog-inner .kicker{margin-top:0}.dialog-inner h2{font:700 24px 'Playfair Display',serif;margin:0 0 12px}.dialog-inner>p:not(.kicker){font-size:12px;line-height:1.8;color:#7e8c83}.close{position:absolute;right:18px;top:18px}.info-row{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:12px 0;font-size:11px}.info-row span{color:#829087}.info-row b{font-size:11px}body.dark{background:#101b15;color:#e2ebe5}.dark .app,.dark .sidebar,.dark .chat-head,.dark .composer,.dark .footer,.dark .round{background:#17271f;color:#e2ebe5}.dark .chat,.dark .messages{background-color:#14221b}.dark .msg{background:#1d3126;color:#e2ebe5;border-color:#2a4234}.dark .msg.mine{background:#284e39;border-color:#315c43}.dark .search,.dark .composer textarea{background:#20342a;color:#e2ebe5}.dark .privacy{background:#20392a;border-color:#2b4834;color:#d9eadc}.dark .privacy p{color:#a7c2ad}.dark .room-card{background:#20392a;border-color:#355c42}.dark .room-copy p,.dark .peer p{color:#a0b1a5}.dark .gate-card{background:#17271f;border-color:#2c4036;color:#e2ebe5}.dark .gate{background:#111d16}.dark .gate input{background:#20342a;color:#e2ebe5;border-color:#2c4036}.dark .gate label{color:#a7b8ac}@media(max-width:720px){.app{grid-template-columns:1fr;min-height:0}.sidebar{display:none}.chat-head{height:70px;padding:0 13px}.privacy{margin-top:13px;padding:12px}.messages{padding:15px 12px}.msg{max-width:88%}.composer{padding:10px 10px 12px;gap:6px}.footer{padding-bottom:8px}.gate-card{padding:27px}.brand .round{margin-left:auto}}