:root{color-scheme:dark;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#0b1018;color:#edf5fc;line-height:1.4}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at 12% 8%,#203d58 0,transparent 31rem),radial-gradient(circle at 92% 92%,#142b43 0,transparent 36rem),#0b1018}button,input,textarea,select{font:inherit}button{border:0;background:none;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #64c5ff;outline-offset:2px}#app{width:min(100%,900px);height:100dvh;margin:auto;display:grid;grid-template-rows:64px auto minmax(0,1fr) 70px;background:#111b27;box-shadow:0 0 60px #0008;overflow:hidden;animation:shell-in .35s cubic-bezier(.2,.8,.2,1)}header{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#142131;border-bottom:1px solid #27394b;z-index:2}header h1{font-size:18px;letter-spacing:.01em;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}header button{width:38px;height:38px;border-radius:12px;font-size:29px;line-height:1;color:#8fd4ff;transition:background .2s,transform .2s}header button:hover{background:#24384a}header button:active{transform:scale(.92)}#tabs{display:flex;gap:4px;padding:8px 12px;background:#142131;border-bottom:1px solid #27394b;overflow-x:auto;scrollbar-width:none}#tabs::-webkit-scrollbar{display:none}#tabs button{min-width:max-content;padding:8px 13px;border-radius:9px;color:#91a5b8;font-size:13px;transition:background .2s,color .2s}#tabs button.active{background:#244f6b;color:#dff3ff}#view{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#3a5369 transparent;animation:view-in .2s ease}.chat{width:100%;display:flex;align-items:center;gap:13px;padding:12px 18px;text-align:left;border-bottom:1px solid #1e3040;transition:background .16s,transform .16s;animation:item-in .28s both}.chat:hover{background:#192a3a}.chat:active{background:#20394d;transform:scale(.992)}.avatar{width:48px;height:48px;border-radius:16px;background:linear-gradient(145deg,#4f93c7,#2d5d81);box-shadow:inset 0 1px #ffffff33,0 5px 14px #0003;display:grid;place-items:center;font-weight:750;font-size:18px;flex:none;text-transform:uppercase}.chat-body{min-width:0;flex:1}.row{display:flex;justify-content:space-between;align-items:center;gap:8px}.row small{color:#7890a3;font-size:12px;text-transform:capitalize}.name{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview{color:#8da1b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px;font-size:14px}.check{color:#74cdfc;margin-left:4px}.empty,.profile{padding:22px}.empty{color:#8da1b3;text-align:center;margin-top:12vh}.chat-view{display:flex;flex-direction:column;background:linear-gradient(145deg,#101b27,#0d1721)}.message-list{flex:1;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;min-height:min-content}.message{width:fit-content;max-width:min(78%,600px);background:#2676a3;border-radius:16px 16px 4px 16px;padding:9px 12px;margin:5px 0 5px auto;box-shadow:0 3px 12px #0002;word-break:break-word;animation:message-in .2s ease}.message.other{margin-right:auto;margin-left:0;background:#253746;border-radius:16px 16px 16px 4px}.message a{color:#e6f7ff}.sender{font-size:12px;color:#abddfb;margin-bottom:2px}.composer{position:sticky;bottom:0;display:flex;gap:9px;align-items:center;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#142131eF;border-top:1px solid #27394b;backdrop-filter:blur(14px)}.composer input,.card input,.card select{min-width:0;background:#0e1823;border:1px solid #304557;border-radius:12px;color:#edf5fc;padding:11px 13px;transition:border-color .2s,box-shadow .2s}.composer input{flex:1;border-radius:22px}.composer input:focus,.card input:focus,.card select:focus{border-color:#64c5ff;box-shadow:0 0 0 3px #64c5ff22}.composer button{flex:none;width:40px;height:40px;border-radius:50%;background:#5bc0fa;color:#092131;font-weight:800;transition:transform .18s,filter .18s}.composer button:hover{filter:brightness(1.1)}.composer button:active{transform:scale(.9)}.profile{max-width:650px;margin:auto}.profile>.avatar{margin:8px 0 14px;width:64px;height:64px;font-size:24px}.profile h2{margin:0;font-size:21px}.profile p{color:#91a5b8}.card{background:#192a3a;border:1px solid #2a4053;border-radius:16px;padding:17px;margin:14px 0;box-shadow:0 8px 20px #0002}.card b{display:block;margin-bottom:6px}.card input,.card select{display:block;width:100%;margin:10px 0}.primary,#upload{background:#62c4fb;color:#0a202f;font-weight:700;padding:10px 15px;border-radius:10px;transition:transform .18s,filter .18s}.primary:hover,#upload:hover{filter:brightness(1.08)}.primary:active,#upload:active{transform:scale(.97)}.modal{position:fixed;inset:0;background:#03080db8;display:grid;place-items:center;z-index:10;padding:18px;backdrop-filter:blur(5px);animation:fade-in .18s ease}.modal>div{max-height:min(700px,calc(100dvh - 36px));overflow:auto;background:#182838;border:1px solid #385066;border-radius:20px;padding:22px;width:min(430px,100%);box-shadow:0 24px 70px #000a;animation:modal-in .24s cubic-bezier(.2,.85,.25,1.15)}.modal h2{margin:0 0 8px}.modal p{color:#a8bac8;font-size:14px}.modal input,.modal select{display:block;width:100%;margin:11px 0;padding:12px;border-radius:10px;border:1px solid #3b5367;background:#0e1823;color:#fff}.modal .primary{float:right}.hidden{display:none!important}nav{height:70px;padding:7px max(12px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;gap:5px;align-items:center;justify-content:space-around;background:#142131;border-top:1px solid #27394b}nav button{height:54px;font-size:11px;color:#91a5b8;display:grid;place-content:center;gap:3px;flex:1;border-radius:12px;transition:background .2s,color .2s,transform .2s}nav button:hover{background:#203548}nav button:active{transform:scale(.95)}nav button.active{background:#244b64;color:#bce9ff}nav img{width:21px;height:21px;filter:invert(70%) sepia(14%) saturate(703%) hue-rotate(161deg)}nav button.active img{filter:invert(82%) sepia(35%) saturate(535%) hue-rotate(158deg)}@keyframes shell-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes view-in{from{opacity:.5}to{opacity:1}}@keyframes item-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes message-in{from{opacity:0;transform:translateY(5px) scale(.98)}to{opacity:1;transform:none}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1}}@media (min-width:901px){#app{height:min(860px,calc(100dvh - 48px));margin:24px auto;border:1px solid #2a4053;border-radius:22px}body{display:grid;place-items:center}}@media (max-width:420px){#app{grid-template-rows:58px auto minmax(0,1fr) 65px}header{height:58px;padding:0 12px}.chat{padding:11px 13px}.message-list{padding:12px}.message{max-width:86%}.composer{padding-left:12px;padding-right:12px}nav{height:65px}}