*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0b0e13;color:#e6e9ef}button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}input,textarea{font:inherit;color:inherit}.app{display:flex;height:100%}.sidebar{width:300px;flex-shrink:0;display:flex;flex-direction:column;background:#11151d;border-right:1px solid #1e2530}.chat{flex:1;display:flex;flex-direction:column;min-width:0}.me{padding:14px 14px 10px}.me-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8b93a3;margin-bottom:6px}.npub{display:block;width:100%;text-align:left;padding:8px 10px;border-radius:8px;background:#1a212c;font-family:ui-monospace,monospace;font-size:13px;color:#c7d0e0;word-break:break-all}.npub:hover{background:#212a38}.add-contact{padding:0 14px 10px}.add-row{display:flex;gap:6px}.add-row input{flex:1;min-width:0;background:#1a212c;border:1px solid #262f3d;border-radius:8px;padding:8px 10px;font-size:13px;outline:none}.add-row input:focus{border-color:#4f8cff}.add-btn{width:38px;border-radius:8px;background:#4f8cff;color:#fff;font-size:18px}.add-btn:hover{background:#6b9dff}.err{color:#ff7a7a;font-size:12px;margin-top:4px}.section-label{padding:6px 14px 4px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8b93a3}.contacts-group{padding:0 8px 4px}.chat-title{font-size:15px;font-weight:600}.chat-sub{font-family:ui-monospace,monospace;font-size:11px;color:#8b93a3;margin-top:2px}.author{font-size:12px;font-weight:600;color:#9fc0ff;margin-bottom:2px}.setup{flex:1;display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto}.setup-card{width:100%;max-width:440px;background:#11151d;border:1px solid #1e2530;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:14px}.setup-card h2{margin:0;font-size:18px}.setup-block{display:flex;flex-direction:column;gap:8px}.setup-block label{font-size:12px;color:#8b93a3}.setup-block input{background:#0b0e13;border:1px solid #262f3d;border-radius:8px;padding:10px 12px;font-size:14px;outline:none}.setup-block input:focus{border-color:#4f8cff}.setup-divider{text-align:center;color:#8b93a3;font-size:12px}.name-input{background:#0b0e13;border:1px solid #262f3d;border-radius:10px;padding:12px;font-size:14px;outline:none}.name-input:focus{border-color:#4f8cff}.contacts{flex:1;overflow-y:auto;padding:0 8px}.contact{display:block;width:100%;text-align:left;padding:10px;border-radius:8px;font-family:ui-monospace,monospace;font-size:13px;color:#aeb7c7}.contact:hover{background:#1a212c}.contact.active{background:#223048;color:#fff}.no-contacts{padding:10px;color:#8b93a3;font-size:13px}.side-footer{padding:10px 14px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #1e2530}.relays{font-size:12px;color:#8b93a3}.relays-box{border-top:1px solid #1e2530;padding:4px 8px 6px 14px}.relays-box .section-label{padding:6px 0 4px}.relay-row{display:flex;align-items:center;gap:6px;font-size:12px;color:#aeb7c7;padding:3px 6px 3px 0;font-family:ui-monospace,monospace}.relay-host{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:#8b93a3}.dot-connected{background:#3ecf6f}.dot-connecting{background:#ffb454}.dot-disconnected,.dot-error,.dot-unreachable{background:#ff5f5f}.wr{font-weight:700}.wr.ok{color:#3ecf6f}.wr.fail{color:#ff5f5f}.relay-x{flex-shrink:0;color:#8b93a3;font-size:13px;padding:0 2px;line-height:1}.relay-x:hover{color:#ff7a7a}.add-row.small{margin-top:4px}.add-row.small input{font-size:11px;padding:6px 8px;font-family:ui-monospace,monospace}.add-row.small .add-btn{width:30px;font-size:14px}.footer-btns{display:flex;gap:10px}.diag-btn{font-size:12px;color:#7ba7ff}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#05080cbf;display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}.modal-card{width:100%;max-width:560px;max-height:85vh;display:flex;flex-direction:column;gap:12px;background:#11151d;border:1px solid #262f3d;border-radius:14px;padding:20px}.modal-card h3{margin:0;font-size:16px}.diag-pre{flex:1;overflow:auto;margin:0;background:#0b0e13;border:1px solid #262f3d;border-radius:8px;padding:12px;font-size:11px;line-height:1.6;white-space:pre-wrap;word-break:break-word}.modal-btns{display:flex;gap:8px}.modal-relays{border:1px solid #262f3d;border-radius:8px;padding:10px 12px}.modal-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8b93a3;margin-bottom:6px}.modal-relays .add-row.small{margin-top:8px}.logout{font-size:12px;color:#ff7a7a}.chat-head{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-bottom:1px solid #1e2530}.chat-head-name{font-family:ui-monospace,monospace;font-size:14px}.ghost{padding:6px 10px;border-radius:6px;background:#1a212c;font-size:12px;color:#aeb7c7}.ghost:hover{background:#212a38}.messages{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:8px}.row{display:flex}.row.mine{justify-content:flex-end}.row.theirs{justify-content:flex-start}.bubble{max-width:70%;padding:8px 12px;border-radius:14px;background:#1a212c}.row.mine .bubble{background:#2b4d8f}.bubble.pending{opacity:.6}.bubble.failed{background:#5a2230}.bubble .text{white-space:pre-wrap;word-break:break-word}.bubble .meta{margin-top:4px;font-size:11px;color:#ffffff8c;text-align:right}.conv-empty,.empty{margin:auto;text-align:center;color:#8b93a3;line-height:1.7;padding:20px}.composer{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #1e2530}.composer textarea{flex:1;resize:none;background:#1a212c;border:1px solid #262f3d;border-radius:10px;padding:10px 12px;font-size:14px;outline:none}.composer textarea:focus{border-color:#4f8cff}.send{padding:0 18px;border-radius:10px;background:#4f8cff;color:#fff;font-weight:600}.send:hover{background:#6b9dff}.auth{height:100%;display:flex;align-items:center;justify-content:center;padding:20px}.auth-card{width:100%;max-width:460px;background:#11151d;border:1px solid #1e2530;border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:12px}.auth-card h1{margin:0;font-size:22px}.sub{margin:0;color:#8b93a3;font-size:14px;line-height:1.5}.primary{padding:12px;border-radius:10px;background:#4f8cff;color:#fff;font-weight:600;font-size:15px}.primary:hover:not(:disabled){background:#6b9dff}.primary:disabled{opacity:.45;cursor:not-allowed}.link{color:#7ba7ff;font-size:13px;padding:4px}.created{display:flex;flex-direction:column;gap:10px}.warn{margin:0;color:#ffb454;font-size:13px;line-height:1.5}.nsec{display:block;padding:10px;border-radius:8px;background:#0b0e13;border:1px solid #262f3d;font-family:ui-monospace,monospace;font-size:12px;word-break:break-all;color:#ffb454}.nsec.pub{color:#7ba7ff}.copy-row{display:flex;gap:8px}.check{display:flex;align-items:center;gap:8px;font-size:13px;color:#c7d0e0}.nsec-input{background:#0b0e13;border:1px solid #262f3d;border-radius:10px;padding:12px;font-family:ui-monospace,monospace;font-size:13px;outline:none}.nsec-input:focus{border-color:#4f8cff}.crash{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:30px}.crash h2{color:#ff7a7a}.crash pre{max-width:700px;max-height:40vh;overflow:auto;background:#11151d;border:1px solid #262f3d;border-radius:10px;padding:14px;font-size:12px;white-space:pre-wrap;word-break:break-word}.menu-btn,.backdrop{display:none}@media (max-width: 768px){.chat{position:relative}.menu-btn{display:flex;align-items:center;justify-content:center;position:absolute;top:10px;left:10px;z-index:30;width:38px;height:38px;border-radius:8px;background:#1a212c;font-size:18px;color:#c7d0e0}.menu-btn:hover{background:#212a38}.chat-head{padding-left:60px;padding-top:14px;padding-bottom:14px}.setup{padding-top:60px}.setup-card{padding-top:56px}.backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#05080c99;z-index:55;padding:0;border:none}.sidebar{position:fixed;top:0;bottom:0;left:0;width:min(80vw,300px);transform:translate(-105%);transition:transform .25s ease;z-index:60;box-shadow:8px 0 30px #00000073}.sidebar.open{transform:none}.bubble{max-width:85%}.messages{padding:12px}.composer{padding:8px}.composer textarea{padding:8px 10px}.composer .send{padding:0 14px}}