@import url('/static/fonts.css');
:root{--ink:#243c34;--muted:#718178;--green:#266858;--green-dark:#174d3f;--lime:#e0edbd;--cream:#f8f7f2;--line:#e4e9e1;--white:#fff;--orange:#f1b27b; font-family:ui-rounded,'Avenir Next','Segoe UI',sans-serif;color:var(--ink);background:var(--cream);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;border-radius:14px;background:var(--green);color:white;padding:13px 20px;font-weight:650;transition:background .15s,transform .15s}button:hover{background:var(--green-dark)}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #dba64f;outline-offset:3px}input,textarea,select{width:100%;border:1px solid #d5dfd5;border-radius:12px;padding:13px 14px;background:white;color:var(--ink)}input:focus,textarea:focus,select:focus{outline:2px solid #98b7a7;outline-offset:1px}label{display:block;font-size:13px;font-weight:650;margin:20px 0 8px}h1,h2,h3,p{margin-top:0}h1{font-size:46px;letter-spacing:-1.9px;line-height:1.13}h2{font-size:28px;letter-spacing:-.8px}h3{font-size:17px}p{line-height:1.65}a{color:var(--green)}.muted{color:var(--muted);font-size:13px;line-height:1.6}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:750;color:var(--green)}.secondary{background:#edf1e9;color:var(--ink)}.secondary:hover{background:#dfe8db}.text-button{background:transparent;color:var(--muted);padding:8px;font-size:13px}.text-button:hover{background:#ecf0e8;color:var(--green)}.danger{background:#f9ece7;color:#9a4133}.danger:hover{background:#f0d9d0}.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:23px;letter-spacing:-.7px}.brand-icon{display:grid;place-items:center;border-radius:15px;width:42px;height:42px;background:var(--green);color:var(--lime);font-size:26px}.pill{display:inline-flex;border-radius:30px;padding:7px 12px;background:#eaf0e5;color:var(--green);font-size:11px;font-weight:650;gap:6px;align-items:center}.dot{width:6px;height:6px;border-radius:50%;background:#75a37b}.login-shell{max-width:1180px;margin:auto;padding:36px 46px}.login-top{display:flex;justify-content:space-between;align-items:center}.login-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center;min-height:calc(100svh - 180px)}.intro{padding-top:30px}.intro h1{max-width:470px;margin:20px 0}.intro p{max-width:405px;font-size:16px;color:var(--muted)}.illustration{height:235px;position:relative;max-width:405px;margin:35px 0 10px}.orbit{position:absolute;inset:20px 30px;border-radius:50%;border:1px dashed #c4d5bd;transform:rotate(-15deg)}.letter{position:absolute;left:115px;top:56px;width:172px;height:123px;background:#dfeab8;border-radius:18px;transform:rotate(-9deg);box-shadow:0 17px 0 -7px #e8eade;display:grid;place-items:center;font-size:68px;color:var(--green)}.friend{display:grid;place-items:center;position:absolute;width:66px;height:66px;font-size:36px;border-radius:23px;box-shadow:0 6px 0 #ffffff80}.friend.one{top:5px;left:35px;background:#f7dec8;transform:rotate(-12deg)}.friend.two{right:8px;top:80px;background:#e0e9ef;transform:rotate(10deg)}.friend.three{bottom:8px;left:45px;background:#eadff1;transform:rotate(8deg)}.spark{position:absolute;right:70px;top:8px;color:#d49a54;font-size:27px}.login-card{background:white;border:1px solid var(--line);border-radius:25px;padding:34px;box-shadow:0 18px 60px #263c3406}.login-card h2{margin:8px 0}.login-card .full{width:100%;margin-top:23px}.code-input{letter-spacing:3px;text-transform:uppercase;font-family:ui-monospace,monospace}.login-note{border-top:1px solid var(--line);padding-top:20px;margin-top:24px;display:flex;gap:12px;font-size:12px;color:var(--muted);line-height:1.6}.login-bottom{display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}.app-shell{height:100svh;display:grid;grid-template-rows:82px 1fr;max-width:1600px;margin:auto}.topbar{padding:0 30px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);background:var(--cream);gap:16px}.top-actions{display:flex;align-items:center;gap:12px}.profile{display:flex;align-items:center;gap:10px;font-weight:650;font-size:14px}.avatar{width:45px;height:45px;border-radius:16px;display:inline-grid;place-items:center;background:#eceddf;font-size:26px;flex-shrink:0}.workspace{display:grid;grid-template-columns:300px 1fr;min-height:0}.sidebar{border-right:1px solid var(--line);padding:30px 18px;display:flex;flex-direction:column;background:#f2f4ed;min-height:0}.sidebar-heading{padding:0 12px;display:flex;align-items:center;justify-content:space-between}.sidebar-heading h2{font-size:20px}.contact-list{overflow:auto;flex:1}.contact{width:100%;display:flex;gap:12px;text-align:left;align-items:center;color:var(--ink);background:transparent;padding:14px 12px;margin:4px 0;font-weight:500}.contact:hover{background:#e8eede}.contact.selected{background:white;box-shadow:0 3px 15px #294f3210}.contact strong{display:block;font-size:14px;margin-bottom:4px}.contact small{font-size:11px;color:var(--muted)}.contact-info{flex:1}.badge{background:var(--green);color:white;border-radius:12px;min-width:21px;text-align:center;font-size:11px;padding:4px}.sidebar-note{padding:18px 12px 0;border-top:1px solid #dfe5d8;font-size:11px;color:var(--muted);line-height:1.7}.chat-panel{min-width:0;min-height:0;display:flex;flex-direction:column;background:#fffefa}.welcome{margin:auto;text-align:center;padding:32px;max-width:470px}.welcome .big{font-size:60px;background:#edf1df;width:120px;height:120px;margin:0 auto 28px;display:grid;place-items:center;border-radius:40px}.welcome h2{font-size:32px}.welcome p{color:var(--muted);font-size:14px}.chat-header{padding:18px 28px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);background:white}.chat-header strong{font-size:17px}.chat-header .pill{margin-left:auto}.chat-scroll{overflow:auto;padding:26px 34px;flex:1;min-height:0;scroll-behavior:smooth}.chat-intro{text-align:center;color:var(--muted);font-size:11px;margin:8px 0 30px}.message{max-width:78%;width:fit-content;margin-bottom:16px;display:flex;flex-direction:column;align-items:flex-start}.message.mine{margin-left:auto;align-items:flex-end}.bubble{padding:13px 17px;background:#eff2e9;border-radius:18px 18px 18px 5px;font-size:14px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.mine .bubble{background:var(--green);color:white;border-radius:18px 18px 5px 18px}.message-meta{font-size:10px;color:var(--muted);margin:6px 3px;display:flex;gap:9px;flex-wrap:wrap}.read{color:var(--green);font-weight:650}.bubble audio{width:255px;max-width:100%;height:42px;display:block}.voice-label{font-size:11px;margin-bottom:9px;display:block}.composer-area{padding:16px 28px 20px;background:white;border-top:1px solid var(--line)}.composer{display:flex;gap:10px;align-items:flex-end}.composer textarea{border:0;background:#f3f5ef;resize:none;min-height:49px;max-height:130px;flex:1;font-size:14px}.composer button{height:49px;flex-shrink:0}.composer-note{font-size:10px;color:var(--muted);margin:9px 0 0;text-align:center}.recording{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px;border-radius:15px;background:#fff2e9;margin-bottom:12px}.recording audio{max-width:100%}.hidden{display:none!important}.back{display:none}.admin-layout{max-width:1130px;margin:0 auto;padding:36px 32px}.admin-heading{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:24px}.admin-heading h1{font-size:34px;margin-bottom:8px}.admin-grid{display:grid;grid-template-columns:340px 1fr;gap:25px;align-items:start}.card{background:white;border:1px solid var(--line);border-radius:20px;padding:25px;margin-bottom:22px}.card h2{font-size:20px}.avatar-options{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin:10px 0 20px}.avatar-option{background:#f3f5ef;padding:7px 0;font-size:25px;border:2px solid transparent;border-radius:12px}.avatar-option:hover{background:#e3ebd8}.avatar-option.chosen{border-color:var(--green);background:#e7eedb}.child-row{display:flex;align-items:center;gap:12px;padding:17px 0;border-top:1px solid var(--line);flex-wrap:wrap}.child-row .info{flex:1;min-width:90px}.child-row strong{font-size:14px}.child-row .actions{display:flex;gap:6px;flex-wrap:wrap}.child-row button{font-size:11px;padding:9px 11px}.contact-editor{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.contact-toggle{border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;gap:9px;align-items:center;font-size:14px;margin:0;cursor:pointer}.contact-toggle input{width:18px;height:18px;accent-color:var(--green)}.empty{padding:28px 10px;text-align:center;color:var(--muted);font-size:13px;line-height:1.7}.admin-notice{background:#eaf0e2;border-radius:14px;padding:16px;font-size:12px;line-height:1.7;color:#536b52}.qr{width:220px;max-width:100%;display:block;margin:16px auto}.invite-code{text-align:center;font-family:ui-monospace,monospace;font-size:24px;letter-spacing:2px;margin:20px 0}.invite-link{font-size:12px;overflow-wrap:anywhere;text-align:center}.device-row{padding:14px 0;border-top:1px solid var(--line);display:flex;gap:15px;justify-content:space-between;align-items:center}.device-row button{font-size:12px}dialog{border:1px solid var(--line);border-radius:24px;padding:28px;width:480px;max-width:calc(100% - 30px);max-height:90svh;color:var(--ink);box-shadow:0 30px 100px #17362730}dialog::backdrop{background:#233c3455;backdrop-filter:blur(3px)}dialog h2{font-size:23px}#dialog-close{margin-top:20px;width:100%}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:13px 21px;border-radius:13px;font-size:13px;z-index:100;max-width:calc(100vw - 32px);box-shadow:0 5px 25px #0002;display:none}#toast.visible{display:block}.loading{text-align:center;padding:25vh 25px;line-height:2;color:var(--green)}.load-more{display:block;margin:0 auto 22px;font-size:12px}
@media(min-width:1450px){.app-shell{border-left:1px solid var(--line);border-right:1px solid var(--line)}}
@media(max-width:850px){.login-grid{gap:35px}.login-shell{padding:25px}.login-card{padding:25px}h1{font-size:37px}.workspace{grid-template-columns:250px 1fr}.topbar{padding:0 20px}.top-actions .pill{display:none}.chat-scroll{padding:20px}.admin-grid{grid-template-columns:290px 1fr}.admin-layout{padding:28px 20px}.child-row .actions{width:100%}}
@media(max-width:620px){.login-shell{padding:22px}.login-grid{display:block;min-height:auto}.intro{padding-top:35px}.intro h1{font-size:34px;max-width:330px}.intro p{font-size:14px}.illustration{display:none}.login-card{margin:25px 0}.login-bottom{display:block;line-height:2}.login-top .pill{font-size:10px}.brand{font-size:21px}.app-shell{grid-template-rows:70px 1fr}.topbar{padding:0 16px}.top-actions{gap:6px}.profile span:not(.avatar){display:none}.profile .avatar{width:35px;height:35px;font-size:23px;border-radius:12px}.top-actions button{font-size:11px;padding:8px}.workspace{display:block;position:relative}.sidebar{height:100%;border:0;padding:25px 16px}.chat-panel{display:none;height:100%}.workspace.chat-open .sidebar{display:none}.workspace.chat-open .chat-panel{display:flex}.chat-header{padding:14px 16px}.back{display:block;padding:7px 11px;font-size:22px}.chat-header .pill{font-size:9px}.chat-scroll{padding:18px}.message{max-width:90%}.composer-area{padding:12px 12px max(16px,env(safe-area-inset-bottom))}.composer{gap:7px}.composer button{padding:10px 13px}.composer textarea{font-size:16px}.admin-grid{display:block}.admin-heading h1{font-size:28px}.admin-layout{padding:25px 16px}.admin-heading{display:block}.card{padding:21px}.bubble audio{width:220px}.login-top .brand-icon{width:35px;height:35px;border-radius:12px}.message-meta{font-size:10px}.welcome{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:620px){.topbar{padding:0 12px;gap:8px}.topbar .brand{font-size:19px;gap:8px;white-space:nowrap}.topbar .brand-icon{width:34px;height:34px;border-radius:12px;font-size:22px}.topbar .brand>.muted{display:none}.top-actions{gap:4px}.top-actions button{padding:6px}.top-actions .profile .avatar{width:30px;height:30px;font-size:21px}}
