:root{--indigo: #4f46e5;--bg: #f5f5f7;--border: #e2e2e8}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:#1a1a1a}.screen{display:flex;flex-direction:column;height:100dvh;max-width:640px;margin:0 auto;background:#fff}.screen.center{justify-content:center;align-items:center}.card{padding:28px;text-align:center;width:100%;max-width:360px}.card h1{font-size:22px;margin:0 0 8px}.header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;padding-top:max(14px,env(safe-area-inset-top));background:var(--indigo);color:#fff;font-weight:600}.messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}.msg{max-width:78%;align-self:flex-start}.msg.mine{align-self:flex-end;text-align:right}.meta{font-size:11px;color:#888;margin-bottom:2px}.bubble{display:inline-block;padding:8px 12px;border-radius:14px;background:#ececf3;word-break:break-word;text-align:left}.msg.mine .bubble{background:var(--indigo);color:#fff}.composer{display:flex;gap:8px;padding:12px;padding-bottom:max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--border)}.input{flex:1;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:16px;outline:none}.input:focus{border-color:var(--indigo)}.btn{border:none;border-radius:10px;padding:10px 16px;font-size:15px;cursor:pointer;background:#e4e4ea}.btn.primary{background:var(--indigo);color:#fff}.btn.small{padding:6px 10px;font-size:13px;background:#fff3;color:#fff}.card .btn,.card .input{width:100%;margin-top:12px}.pill{font-size:12px;padding:5px 10px;border-radius:999px}.pill.ok{background:#1f9d55;color:#fff}.pill.warn{background:#d9822b;color:#fff}.muted{color:#888}.center-text{text-align:center;margin:auto}