:root{color:#edf5ff;background:#0e1621;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#root{height:100%;min-height:0;overflow:hidden}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}.pairing-screen{align-items:center;background:#0e1621;display:flex;min-height:100vh;justify-content:center;padding:24px}.pairing-card{align-items:center;background:#162232;border:1px solid #243447;border-radius:18px;display:flex;flex-direction:column;gap:16px;max-width:420px;padding:32px;text-align:center;width:100%}.pairing-card h1{margin:0}.pairing-card p,.pairing-card span{color:#b4c4d6;margin:0}.pairing-card canvas{background:#fff;border-radius:14px;padding:10px}.app-shell{background:#0e1621;display:grid;grid-template-columns:clamp(280px,30vw,360px) minmax(0,1fr);height:100%;height:100dvh;min-height:0;overflow:hidden}.chat-panel{display:grid;grid-template-rows:64px minmax(0,1fr) auto;min-height:0;min-width:0;overflow:hidden}.topbar,.composer{align-items:center;background:#111f2c;border-color:#243447;display:flex;gap:12px;padding:12px 16px}.topbar{border-bottom:1px solid #243447;justify-content:space-between}.topbar strong,.topbar span{display:block}.topbar span{color:#b4c4d6;font-size:13px;margin-top:2px}.topbar-actions{display:flex;gap:8px}.topbar-actions button,.composer button,.call-toast button,.call-window button{align-items:center;background:#45a3ff;border:0;border-radius:10px;color:#fff;display:inline-flex;gap:7px;justify-content:center;font-weight:800;min-height:36px;padding:0 12px}.topbar-actions button:disabled,.composer button:disabled{cursor:default;opacity:.45}.messages{background:#0b141a;display:flex;flex-direction:column;min-height:0;overflow:auto;padding:18px}.center{color:#b4c4d6;display:grid;min-height:100%;place-items:center}.message{align-self:flex-start;background:#182533;border-radius:12px;margin:0 0 10px;max-width:72%;padding:10px 12px}.message.mine{align-self:flex-end;background:#0f3b57}.message p{margin:4px 0;white-space:pre-wrap;word-break:break-word}.message time,.sender{color:#8ba1b8;font-size:12px}.message-meta{align-items:center;display:flex;gap:5px;justify-content:flex-end}.message-status{color:#22c55e;display:inline-flex}.message-status.read{color:#34b7f1}.message-media{border-radius:10px;display:block;max-height:360px;max-width:100%}.composer{border-top:1px solid #243447;flex-shrink:0;min-width:0;position:relative}.composer input{background:#162232;border:1px solid #243447;border-radius:12px;color:#edf5ff;flex:1;min-width:0;min-height:42px;outline:0;padding:0 14px}.hidden-input{display:none}.attachment-control{position:relative}.composer .composer-icon-button{background:#23384b;padding:0;width:42px}.attachment-menu{background:#162232;border:1px solid #30445a;border-radius:8px;bottom:calc(100% + 12px);box-shadow:0 14px 36px #0000006b;display:grid;gap:3px;left:0;min-width:270px;padding:6px;position:absolute;z-index:12}.attachment-menu button{align-items:center;background:transparent;border:0;border-radius:6px;color:#edf5ff;display:grid;gap:10px;grid-template-columns:20px minmax(0,1fr);justify-content:stretch;min-height:42px;padding:0 10px;text-align:left;white-space:nowrap;width:100%}.attachment-menu button svg{justify-self:center}.attachment-menu button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-menu button:hover{background:#23384b}.attachment-error{align-items:center;background:#632d35;bottom:72px;color:#fff;display:flex;gap:10px;justify-content:space-between;left:max(16px,calc(clamp(280px,30vw,360px) + 16px));padding:10px 12px;position:fixed;right:16px;z-index:14}.attachment-error button,.modal-close{align-items:center;background:transparent;border:0;color:inherit;display:inline-flex;justify-content:center;padding:4px}.modal-backdrop{align-items:center;background:#000000ad;display:flex;inset:0;justify-content:center;padding:20px;position:fixed;z-index:30}.contact-picker{background:#162232;border:1px solid #30445a;border-radius:8px;display:grid;grid-template-rows:auto auto minmax(0,1fr);max-height:min(680px,calc(100dvh - 40px));max-width:520px;overflow:hidden;width:100%}.contact-picker>header{align-items:center;border-bottom:1px solid #243447;display:flex;justify-content:space-between;padding:14px 16px}.contact-picker>input{background:#101d2a;border:1px solid #30445a;border-radius:6px;color:#edf5ff;margin:12px;min-height:42px;outline:0;padding:0 12px}.contact-list{min-height:220px;overflow:auto}.contact-list>button{align-items:center;background:transparent;border:0;border-top:1px solid #243447;color:#edf5ff;display:grid;gap:12px;grid-template-columns:44px minmax(0,1fr) auto;min-height:66px;padding:10px 14px;text-align:left;width:100%}.contact-list>button:hover{background:#1d3043}.contact-list strong,.contact-list small{display:block}.contact-list small{color:#8ba1b8;margin-top:3px}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.conversation-panel{background:#162232;border-right:1px solid #243447;min-height:0;overflow:auto}.brand{align-items:center;border-bottom:1px solid #243447;display:flex;font-size:20px;font-weight:900;height:64px;justify-content:space-between;padding:0 16px}.brand button{align-items:center;background:#23384b;border:0;border-radius:6px;color:#edf5ff;display:inline-flex;height:38px;justify-content:center;width:38px}.reply-banner{align-items:center;background:#142536;border-left:3px solid #45a3ff;border-top:1px solid #243447;display:grid;gap:10px;grid-template-columns:auto minmax(0,1fr) auto;padding:9px 14px}.reply-banner>div{min-width:0}.reply-banner strong,.reply-banner span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-banner strong{color:#45a3ff;font-size:13px}.reply-banner span{color:#b4c4d6;font-size:13px;margin-top:2px}.reply-banner button{align-items:center;background:transparent;border:0;color:#b4c4d6;display:inline-flex;justify-content:center;padding:5px}.context-menu-backdrop{inset:0;position:fixed;z-index:40}.context-menu{background:#162232;border:1px solid #30445a;border-radius:8px;box-shadow:0 16px 42px #0000007a;display:grid;min-width:240px;padding:6px;position:absolute}.context-menu>strong{color:#8ba1b8;font-size:12px;padding:8px 10px}.context-menu button{align-items:center;background:transparent;border:0;border-radius:6px;color:#edf5ff;display:grid;gap:10px;grid-template-columns:20px minmax(0,1fr);min-height:40px;padding:0 10px;text-align:left;width:100%}.context-menu button:hover{background:#23384b}.context-menu button.destructive{color:#ff7272}.conversation{align-items:center;background:transparent;border:0;border-bottom:1px solid #243447;color:#edf5ff;display:grid;gap:12px;grid-template-columns:44px minmax(0,1fr) auto;min-height:72px;padding:10px 14px;text-align:left;width:100%}.conversation.active,.conversation:hover{background:#1d3043}.conversation strong,.conversation small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation small{color:#8ba1b8;margin-top:3px}.conversation b{align-items:center;background:#45a3ff;border-radius:999px;color:#fff;display:inline-flex;font-size:12px;height:22px;justify-content:center;min-width:22px;padding:0 6px}.avatar{align-items:center;background:#45a3ff;border-radius:50%;color:#fff;display:inline-flex;font-weight:900;height:44px;justify-content:center;object-fit:cover;width:44px}.call-toast{background:#162232;border:1px solid #243447;border-radius:16px;bottom:24px;box-shadow:0 16px 40px #00000059;display:flex;flex-direction:column;gap:10px;left:24px;padding:16px;position:fixed;width:300px;z-index:10}.call-toast div{display:flex;gap:8px;justify-content:flex-end}.call-overlay{pointer-events:none;inset:0;position:fixed;z-index:20}.call-overlay.maximized{background:#000000b8;pointer-events:auto}.call-window{background:#0b141a;border:1px solid #243447;border-radius:18px;bottom:32px;box-shadow:0 18px 60px #0000007a;display:grid;grid-template-rows:auto minmax(240px,1fr) auto;max-height:calc(100vh - 64px);overflow:hidden;pointer-events:auto;position:absolute;right:32px;width:min(760px,calc(100vw - 64px))}.call-window.maximized{border:0;border-radius:0;height:100vh;inset:0;max-height:none;width:100vw}.call-window header,.call-window footer{align-items:center;background:#111f2c;display:flex;justify-content:space-between;padding:12px 16px}.call-window footer{gap:10px;justify-content:center}.call-window-header{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.call-window.maximized .call-window-header{cursor:default}.call-window-actions{display:flex;gap:8px}.call-window .icon-button{padding:0;width:38px}.call-window .secondary{background:#23384b}.call-window .end-call-button{background:#e64949}.remote-media{align-items:center;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));min-height:0;overflow:hidden;padding:12px}.remote-video{background:#000;border-radius:12px;height:100%;min-height:0;object-fit:contain;width:100%}.remote-audio{display:none}.local-video{background:#000;border-radius:12px;bottom:86px;height:150px;object-fit:cover;position:absolute;right:18px;width:112px}.call-window:not(.maximized) .remote-media{aspect-ratio:16 / 9}@media(max-width:800px){.app-shell{grid-template-columns:clamp(190px,38vw,280px) minmax(0,1fr)}.conversation-panel{border-right:1px solid #243447}.call-window{bottom:12px;right:12px;width:calc(100vw - 24px)}.topbar-actions button span{display:none}.topbar,.composer{padding-left:10px;padding-right:10px}.attachment-error{left:calc(clamp(190px,38vw,280px) + 10px)}}@media(max-width:520px){.app-shell{grid-template-columns:150px minmax(0,1fr)}.conversation{gap:8px;grid-template-columns:36px minmax(0,1fr);padding-left:8px;padding-right:8px}.conversation b{display:none}.avatar{height:36px;width:36px}.brand{font-size:16px;padding:0 10px}.topbar-actions{gap:4px}.topbar-actions button{padding:0 8px}.attachment-error{left:160px}}