:root{font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#263a34;background:#f4f6f1;font-synthesis:none;--green:#216b5b;--muted:#6a7d75;--line:#dce5de;--cream:#fbf6e9}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;border-radius:14px;padding:12px 19px;background:var(--green);color:white;font-weight:600;min-height:44px}button:disabled{opacity:.5;cursor:default}.quiet{background:#eaf1eb;color:var(--green)}.danger{color:#a43f39;background:#fbeceb}.text-button{color:var(--green);background:none;padding:3px;min-height:32px;font-weight:500}.small{padding:8px 12px;min-height:36px;font-size:13px}header{max-width:1120px;margin:auto;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none;font-weight:750;font-size:21px}.brand small{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:3px}.star{width:47px;height:47px;display:grid;place-items:center;background:var(--green);color:#f1deb0;font-size:35px;border-radius:16px}.head-actions{display:flex;gap:14px;align-items:center}.connection{font-size:12px;color:var(--muted)}.connection::before{content:"";display:inline-block;width:7px;height:7px;background:#4a9d71;border-radius:50%;margin-right:6px}main{max-width:1080px;margin:0 auto;padding:0 20px;min-height:70vh}.welcome,.auth{max-width:570px;margin:7vh auto;background:white;border:1px solid var(--line);border-radius:26px;padding:36px;box-shadow:0 15px 50px #153b2310}.welcome h1,.auth h1{font-size:27px;line-height:1.5;letter-spacing:-.6px;margin:0 0 13px}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--green);margin-bottom:14px}.muted{color:var(--muted);font-size:14px;line-height:1.7}label{display:block;font-size:14px;font-weight:600;margin:18px 0 8px}input,textarea,select{width:100%;border:1px solid #d7e0d9;border-radius:12px;background:#fafcf9;padding:12px;color:inherit;outline:none}input:focus,textarea:focus,select:focus{border-color:#377c69;box-shadow:0 0 0 3px #216b5b12}textarea{resize:vertical;min-height:95px;line-height:1.65}.full{width:100%;margin-top:22px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grow{flex:1}.invite-card{background:var(--cream);border:1px solid #e8dfc8;padding:18px;border-radius:16px;margin:18px 0}.invite-card h2{margin:0 0 8px;font-size:20px}.error{color:#a13c35;background:#fff0ed;border-radius:12px;padding:12px;font-size:14px}.layout{display:grid;grid-template-columns:275px minmax(0,1fr);gap:20px;height:min(760px,calc(100dvh - 155px));min-height:540px}.spaces{background:#fdfefa;border:1px solid var(--line);padding:18px;border-radius:22px;overflow:auto}.spaces h2{margin:5px 0 18px;font-size:20px}.space-card{width:100%;background:transparent;color:inherit;text-align:left;margin:7px 0;padding:14px;font-weight:500;line-height:1.6;border:1px solid transparent}.space-card.selected{background:#e8f0e7;border-color:#c4d8c6}.space-card span{display:block;font-size:12px;color:var(--muted);font-weight:400}.room{display:flex;flex-direction:column;border:1px solid var(--line);background:white;border-radius:22px;overflow:hidden;min-width:0}.room-header{padding:20px 22px 12px}.room-header h2{font-size:22px;margin:0 0 4px}.room-header p{margin:0;color:var(--muted);font-size:13px}.room-tools{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}.tabs{display:flex;border-bottom:1px solid var(--line);padding:0 16px;gap:5px}.tabs button{background:transparent;color:var(--muted);border-radius:0;font-weight:500;border-bottom:3px solid transparent;padding:13px 17px}.tabs button.active{color:var(--green);font-weight:700;border-color:var(--green)}.room-content{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column}.messages{padding:20px 22px;overflow:auto;flex:1;background:#f7f9f4;min-height:0}.message{display:flex;flex-direction:column;margin:0 0 18px;align-items:flex-start}.message.self{align-items:flex-end}.message small{font-size:11px;color:#7d8982;margin:0 3px 5px}.bubble{max-width:82%;padding:12px 15px;background:white;border:1px solid #e1e8e1;border-radius:17px 17px 17px 5px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;font-size:15px}.self .bubble{background:#d9e9d7;border-color:#ccdecb;border-radius:17px 17px 5px 17px}.pending .bubble{opacity:.65}.composer{display:flex;gap:10px;align-items:flex-end;padding:14px 18px;background:white;border-top:1px solid var(--line)}.composer textarea{min-height:48px;max-height:135px;height:48px;resize:none;flex:1}.composer button{white-space:nowrap}.notice{font-size:13px;line-height:1.7;padding:10px 18px;background:#faf5e7;color:#726040;margin:0}.empty{padding:40px 24px;text-align:center;color:var(--muted);line-height:1.9}.section{padding:20px 22px}.section h3{margin:0 0 10px}.wish{padding:16px;border:1px solid var(--line);border-radius:15px;margin-top:12px;background:#fbfcf8}.wish .row{justify-content:space-between}.wish p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;margin:9px 0 0}.pill{display:inline-block;padding:3px 9px;background:#eef2e7;color:#4c7151;border-radius:20px;font-size:12px}.match-pair{padding:16px;margin:12px 0;background:#f5f7eb;border:1px solid #e0e7cd;border-radius:15px}.match-pair p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.65}.topbar{display:flex;align-items:center;justify-content:space-between}.mobile-back{display:none}dialog{border:1px solid var(--line);border-radius:22px;width:min(480px,calc(100vw - 32px));padding:25px;box-shadow:0 25px 90px #10291f40}dialog::backdrop{background:#142b274d}dialog h2{margin:0 0 12px}dialog p{line-height:1.8}#dialog-close{margin-top:18px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#203f36;color:white;padding:12px 20px;border-radius:14px;max-width:calc(100% - 30px);z-index:10;display:none;box-shadow:0 8px 30px #1735262d}footer{max-width:1080px;margin:16px auto 0;padding:0 22px 18px;text-align:center;font-size:11px;color:#7e8b82;line-height:1.8}a{color:var(--green)}.join-login{border-bottom:1px solid var(--line);padding-bottom:12px}.loading{padding:25px;color:var(--muted)}
@media(max-width:720px){header{padding:14px 16px}.brand{font-size:18px}.brand small{font-size:10px}.star{width:40px;height:40px;font-size:29px;border-radius:13px}.connection{font-size:10px}.head-actions{gap:7px}.head-actions button{font-size:12px;padding:8px 11px;min-height:37px}main{padding:0 10px}.auth,.welcome{margin:4vh auto;padding:25px;border-radius:21px}.auth h1,.welcome h1{font-size:24px}.layout{display:block;height:calc(100dvh - 117px);min-height:260px}.spaces,.room{height:100%;border-radius:18px}.layout.in-room .spaces{display:none}.layout:not(.in-room) .room{display:none}.room-header{padding:14px 16px 8px}.room-header h2{font-size:19px}.mobile-back{display:inline-block;background:none;color:var(--green);padding:6px 10px 6px 0;min-height:32px}.tabs{padding:0 10px}.tabs button{padding:10px 14px;font-size:14px}.messages{padding:16px 12px}.bubble{max-width:87%;font-size:15px}.composer{padding:10px 11px max(10px,env(safe-area-inset-bottom));gap:8px}.composer button{padding:12px 16px}.section{padding:18px 16px}.notice{padding:9px 14px;font-size:12px}footer{padding:6px 12px 12px;margin:0;font-size:10px}.room-tools{margin-top:8px}.room-tools button{padding:6px 10px;min-height:32px;font-size:12px}}

.in-app .brand{display:none}.in-app header{padding:6px 12px;justify-content:flex-end}.in-app main{padding:0 8px}.in-app .layout{height:calc(100dvh - 84px);min-height:220px}.in-app footer{font-size:10px;padding:2px 10px}