:root{font-family:system-ui,-apple-system,"Microsoft YaHei",sans-serif;color-scheme:light dark}*{box-sizing:border-box}body{margin:0;background:#f3f4fa;color:#242234}main{height:100dvh;max-width:720px;margin:auto;display:flex;flex-direction:column;background:#fff}header{padding:15px 18px;border-bottom:1px solid #ddd}h1{font-size:1.25rem;margin:0}small{font-size:.75rem;color:#777;margin-left:6px}header p{margin:5px 0 0;color:#777;font-size:.8rem}#auth{padding:14px 16px;display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid #eee}#auth label{flex-basis:100%;font-size:.8rem}#auth input{flex:1;min-width:80px}input,textarea,button{font:inherit;border-radius:10px;padding:10px;border:1px solid #ddd}button{background:#6455b3;color:white;border:none;font-weight:600;cursor:pointer}button:disabled{opacity:.45}#messages{padding:16px;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.bubble{padding:10px 13px;max-width:87%;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.95rem;line-height:1.5}.mine{align-self:flex-end;background:#e7e2ff}.fish{align-self:flex-start;background:#f1f1f5}footer{border-top:1px solid #e5e5e5;padding:8px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom))}#status{font-size:.75rem;color:#777;margin:3px 2px 8px}form{display:flex;gap:8px;align-items:end}textarea{resize:none;min-height:48px;flex:1}#send{height:46px}@media (prefers-color-scheme:dark){body{background:#111}main{background:#211f29;color:#eee}header,#auth,footer{border-color:#444}.mine{background:#504279}.fish{background:#35333d}input,textarea{background:#24222c;color:#fff;border-color:#555}}
