*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,sans-serif;color:#fff;background:#000;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer}.app{height:100%;width:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 600px at 50% -20%,rgba(120,120,130,.35),transparent 60%),linear-gradient(180deg,#1c1c1e,#000)}.phone{position:relative;width:100%;max-width:420px;height:100%;max-height:900px;padding:env(safe-area-inset-top) 24px env(safe-area-inset-bottom);display:flex;flex-direction:column;align-items:center;justify-content:space-between}.status-bar{width:100%;height:44px;display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600;padding:0 8px;opacity:.9}.status-bar .right{display:flex;gap:6px;align-items:center}.caller{margin-top:8px;display:flex;flex-direction:column;align-items:center;gap:6px}.caller .state{font-size:15px;opacity:.7;letter-spacing:.5px;min-height:20px}.caller .name{font-size:34px;font-weight:300;letter-spacing:.5px}.caller .sub{font-size:14px;opacity:.55}.avatar{width:140px;height:140px;border-radius:50%;margin-top:28px;background:linear-gradient(135deg,#7e8794,#3a3a3c);display:flex;align-items:center;justify-content:center;font-size:54px;font-weight:300;box-shadow:0 10px 40px #00000080,inset 0 0 0 1px #ffffff14;position:relative}.avatar.pulsing:before,.avatar.pulsing:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;border:2px solid rgba(255,255,255,.18);animation:pulse 2.2s ease-out infinite}.avatar.pulsing:after{animation-delay:1.1s}@keyframes pulse{0%{transform:scale(1);opacity:.6}to{transform:scale(1.45);opacity:0}}.wave{margin-top:32px;display:flex;align-items:flex-end;gap:6px;height:56px}.wave span{display:block;width:4px;border-radius:2px;background:#ffffff8c;height:10%;transition:height 80ms linear}.controls{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:26px 20px;padding-bottom:40px;margin-top:24px}.ctl{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px;opacity:.85}.ctl .btn{width:72px;height:72px;border-radius:50%;background:#ffffff24;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);font-size:26px;transition:transform .12s ease,background .12s ease}.ctl .btn:active{transform:scale(.94);background:#ffffff40}.ctl .btn.active{background:#fff;color:#000}.ctl .btn:disabled{opacity:.35}.action{margin-top:10px;display:flex;justify-content:center;padding-bottom:40px}.big-btn{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;color:#fff;box-shadow:0 10px 30px #00000080;transition:transform .12s ease,filter .12s ease}.big-btn:active{transform:scale(.94);filter:brightness(.9)}.big-btn.call{background:#34c759}.big-btn.hangup{background:#ff3b30}.toast{position:absolute;bottom:140px;left:50%;transform:translate(-50%);background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 14px;border-radius:18px;font-size:13px;opacity:.9;max-width:80%;text-align:center;pointer-events:none}