:root{color-scheme:light;--ink:#171721;--muted:#777786;--line:rgba(31,31,48,.09);--panel:rgba(255,255,255,.82);--accent:#6657ef;--accent2:#8a74ff;--green:#36bf78;--danger:#e84d57;--shadow:0 24px 70px rgba(44,38,91,.12)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC",sans-serif;color:var(--ink);background:#f4f3f9}body{display:flex;justify-content:center;overflow-x:hidden}.ambient{position:fixed;border-radius:50%;filter:blur(2px);pointer-events:none}.ambient-one{width:520px;height:520px;top:-250px;right:-230px;background:radial-gradient(circle,rgba(144,116,255,.25),transparent 68%)}.ambient-two{width:400px;height:400px;bottom:-230px;left:-230px;background:radial-gradient(circle,rgba(89,205,190,.15),transparent 70%)}button,input{font:inherit}.app-shell{position:relative;width:min(100%,520px);min-height:100dvh;background:rgba(249,249,252,.72);backdrop-filter:blur(26px);border-inline:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow);padding:calc(env(safe-area-inset-top) + 12px) 20px calc(env(safe-area-inset-bottom) + 92px)}.topbar{display:flex;align-items:center;justify-content:space-between;height:46px;margin-bottom:24px}.brand{border:0;background:transparent;padding:0;display:flex;align-items:center;gap:10px;color:inherit;text-align:left}.brand>span:last-child{display:flex;flex-direction:column}.brand b{font-size:15px;letter-spacing:-.2px}.brand small{font-size:10px;color:var(--muted);margin-top:1px}.brand-mark,.device-orbit{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,#4e46de,#9b85ff);box-shadow:0 7px 18px rgba(101,87,239,.3);position:relative}.brand-mark:before,.device-orbit:before{content:"";width:17px;height:17px;border:1.6px solid rgba(255,255,255,.92);border-radius:50%;transform:rotate(-28deg)}.brand-mark i,.device-orbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:white;right:7px;top:8px;box-shadow:0 0 8px white}.status-pill{border:1px solid rgba(54,191,120,.18);background:rgba(54,191,120,.09);color:#258759;border-radius:99px;padding:7px 10px;display:flex;align-items:center;gap:6px;font-size:11px}.status-dot{width:6px;height:6px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px rgba(54,191,120,.11)}.view{display:none;animation:enter .25s ease}.view.active{display:block}@keyframes enter{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}.eyebrow{margin:0 0 4px;color:var(--accent);font-size:11px;text-transform:uppercase;letter-spacing:1.5px;font-weight:700}.page-heading h1{font-size:34px;line-height:1.04;margin:0;letter-spacing:-1.4px}.icon-button{width:40px;height:40px;border:0;border-radius:50%;background:rgba(102,87,239,.1);display:grid;place-items:center;color:var(--accent)}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-button svg{width:20px}.text-button,.list-header button{border:0;background:none;color:var(--accent);padding:6px;font-size:14px}.search{height:42px;border-radius:13px;background:rgba(118,117,135,.1);display:flex;align-items:center;padding:0 13px;gap:9px;margin-bottom:14px}.search svg{width:17px;color:#898896}.search input{border:0;outline:0;background:transparent;width:100%;font-size:15px;color:var(--ink)}.notice-card{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid rgba(102,87,239,.12);background:linear-gradient(110deg,rgba(102,87,239,.09),rgba(255,255,255,.7));border-radius:17px;margin-bottom:20px}.notice-icon{width:34px;height:34px;border-radius:11px;background:white;color:var(--accent);display:grid;place-items:center;box-shadow:0 5px 14px rgba(64,53,132,.08)}.notice-icon svg{width:18px}.notice-card>span:nth-child(2){display:flex;flex-direction:column;flex:1}.notice-card b{font-size:13px}.notice-card small{color:var(--muted);font-size:10px;margin-top:3px}.notice-card button{border:0;background:var(--accent);color:white;padding:7px 11px;border-radius:9px;font-size:11px}.list-header{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px;margin:0 2px 5px}.conversation{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;display:grid;grid-template-columns:48px 1fr auto;gap:11px;align-items:center;padding:13px 2px;text-align:left;color:inherit}.avatar{width:47px;height:47px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:650;background:linear-gradient(145deg,#8272f2,#5246cc);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}.avatar.blue{background:linear-gradient(145deg,#4da4d9,#5072d5)}.avatar.green{background:linear-gradient(145deg,#5bbf9b,#278c7b)}.conversation-main{min-width:0}.conversation-line{display:flex;justify-content:space-between;gap:8px}.conversation-line b{font-size:15px}.conversation-line time{font-size:11px;color:var(--muted)}.conversation p{margin:4px 0 0;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.unread{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:10px}.thread-header{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--line)}.thread-person{border:0;background:transparent;display:flex;justify-content:center;align-items:center;gap:8px}.thread-person .avatar{width:36px;height:36px;font-size:12px}.thread-person>span:last-child{display:flex;flex-direction:column;text-align:left}.thread-person b{font-size:14px}.thread-person small{font-size:10px;color:var(--muted)}.messages-stage{height:calc(100dvh - 245px);min-height:390px;overflow:auto;padding:18px 0 14px;display:flex;flex-direction:column;gap:8px}.date-chip{align-self:center;color:var(--muted);font-size:10px;margin:8px}.bubble{max-width:78%;padding:10px 13px;border-radius:18px;font-size:14px;line-height:1.4}.bubble.in{align-self:flex-start;background:white;border-bottom-left-radius:5px;box-shadow:0 4px 14px rgba(35,31,68,.06)}.bubble.out{align-self:flex-end;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-bottom-right-radius:5px}.composer{display:flex;align-items:center;gap:9px;position:sticky;bottom:84px}.composer-plus{width:32px;height:32px;border:0;border-radius:50%;background:rgba(118,117,135,.12);color:var(--muted);font-size:22px}.composer label{height:39px;flex:1;border:1px solid var(--line);background:white;border-radius:20px;padding-left:14px;display:flex;align-items:center}.composer input{border:0;outline:0;flex:1;min-width:0}.composer label button{border:0;background:var(--accent);color:#fff;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;margin-right:4px}.composer svg{width:15px}.segment{display:flex;background:rgba(118,117,135,.1);border-radius:10px;padding:3px;margin:0 auto 18px;width:220px}.segment button{flex:1;border:0;background:transparent;border-radius:8px;padding:6px;font-size:12px}.segment .active{background:white;box-shadow:0 2px 8px rgba(0,0,0,.07)}.call-row{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;padding:13px 3px;border-bottom:1px solid var(--line)}.call-kind{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(102,87,239,.1);color:var(--accent)}.call-kind svg{width:17px}.call-row>span:nth-child(2){display:flex;flex-direction:column}.call-row b{font-size:15px}.call-row small,.call-row time{font-size:11px;color:var(--muted)}.call-row.missed b,.call-row.missed .call-kind{color:var(--danger)}.keypad-wrap{text-align:center;padding-top:26px}.dial-number{height:48px;font-size:30px;letter-spacing:.5px;margin-top:18px}.dial-number.empty{color:transparent}.add-contact{border:0;background:none;color:var(--accent);font-size:12px;margin-bottom:20px}.keypad{display:grid;grid-template-columns:repeat(3,70px);gap:13px;justify-content:center}.key{width:70px;height:70px;border:0;border-radius:50%;background:rgba(255,255,255,.84);box-shadow:0 7px 20px rgba(42,37,75,.08);font-size:27px;color:var(--ink);display:flex;flex-direction:column;justify-content:center;align-items:center}.key small{font-size:8px;letter-spacing:2px;color:var(--muted)}.call-button{width:68px;height:68px;border:0;border-radius:50%;background:var(--green);color:#fff;margin-top:20px;box-shadow:0 10px 25px rgba(54,191,120,.28)}.call-button svg{width:28px}.device-hero{display:flex;align-items:center;gap:14px;border:1px solid rgba(255,255,255,.9);background:var(--panel);box-shadow:0 10px 30px rgba(45,40,80,.07);border-radius:22px;padding:18px;margin:10px 0 22px}.device-orbit{width:50px;height:50px}.device-hero>div{display:flex;flex-direction:column;flex:1}.device-hero b{font-size:15px}.device-hero small{font-size:11px;color:var(--muted);margin-top:4px}.tag{font-size:10px;color:#7c648e;background:#f2eafb;border-radius:99px;padding:5px 8px}.settings-group{border-radius:20px;background:var(--panel);overflow:hidden;border:1px solid rgba(255,255,255,.8)}.settings-group button{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:13px 14px;display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;text-align:left}.settings-group button:last-child{border:0}.setting-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff}.setting-icon.indigo{background:#6657ef}.setting-icon.violet{background:#9c67db}.setting-icon.slate{background:#596171}.settings-group button>span:nth-child(2){display:flex;flex-direction:column}.settings-group b{font-size:14px}.settings-group small{font-size:10px;color:var(--muted);margin-top:3px}.settings-group em{font-size:24px;color:#aaa;font-style:normal}.security-note{margin-top:18px;padding:15px 17px;border-radius:18px;background:rgba(102,87,239,.06);color:#504b6e}.security-note b{font-size:13px}.security-note p{font-size:11px;line-height:1.55;margin:5px 0 0}.tabbar{position:fixed;z-index:10;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,520px);height:calc(74px + env(safe-area-inset-bottom));padding:8px 10px env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(4,1fr);background:rgba(250,250,252,.88);backdrop-filter:blur(24px);border-top:1px solid rgba(31,31,48,.07)}.tabbar button{border:0;background:none;color:#898895;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px}.tabbar button.active{color:var(--accent)}.tabbar span{position:relative}.tabbar svg{width:23px;height:23px}.tabbar small{font-size:9px}.badge{position:absolute;top:-5px;right:-10px;width:15px;height:15px;background:var(--accent);color:#fff;border-radius:50%;font-size:8px;display:grid;place-items:center;font-style:normal;border:2px solid #fafafc}.toast{position:fixed;z-index:30;left:50%;bottom:105px;transform:translate(-50%,15px);max-width:calc(100% - 40px);background:rgba(24,23,33,.9);color:#fff;border-radius:13px;padding:10px 14px;font-size:12px;opacity:0;pointer-events:none;transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:700px){body{padding:28px}.app-shell{min-height:calc(100dvh - 56px);border-radius:34px;overflow:hidden}.tabbar{bottom:28px;border-radius:0 0 34px 34px}.messages-stage{height:calc(100dvh - 300px)}}
