:root{--bg: #08060b;--bg-2: #0f0b14;--card: rgba(120, 64, 150, .1);--card-solid: #151019;--card-hi: rgba(120, 64, 150, .2);--text: #f3eef7;--muted: #9a8ea6;--purple: #6e3790;--purple-hi: #9352b8;--purple-deep: #3f1d55;--gold: #cfaa6e;--gold-hi: #ecd29e;--gold-deep: #9c7a43;--green: #46c98a;--red: #e0474f;--line: rgba(207, 170, 110, .14);--line-soft: rgba(255, 255, 255, .06);--glow: 0 0 0 1px rgba(207, 170, 110, .25), 0 8px 28px rgba(110, 55, 144, .35)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:radial-gradient(120% 60% at 50% -10%,rgba(110,55,144,.35),transparent 60%),radial-gradient(80% 40% at 50% 110%,rgba(207,170,110,.08),transparent 70%),var(--bg);background-attachment:fixed;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}.screen{max-width:480px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;padding:14px 18px calc(18px + env(safe-area-inset-bottom))}.center{align-items:center;justify-content:center}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.brand-wrap{display:flex;align-items:center;gap:10px}.logo{width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1.5px var(--gold),0 0 18px #9352b88c}.brand{font-weight:800;font-size:19px;letter-spacing:2px;text-transform:uppercase;background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent}.reg{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--card);border:1px solid var(--line-soft)}.reg-dot{width:7px;height:7px;border-radius:50%;background:currentColor}.reg.on{color:var(--green)}.reg.on .reg-dot{box-shadow:0 0 8px var(--green)}.reg.off{color:var(--muted)}.reg.off .reg-dot{animation:blink 1.2s ease-in-out infinite}.tabs{display:flex;gap:4px;background:#ffffff08;border:1px solid var(--line-soft);padding:4px;border-radius:14px;margin-bottom:18px}.tabs button{flex:1;border:0;background:transparent;color:var(--muted);padding:9px 4px;border-radius:10px;font-size:13.5px;font-weight:600;transition:background .2s,color .2s}.tabs button.active{background:linear-gradient(180deg,var(--purple-hi),var(--purple));color:var(--gold-hi);box-shadow:0 4px 14px #6e379073,inset 0 0 0 1px #ecd29e2e}.pane{flex:1;display:flex;flex-direction:column}.status-line{text-align:center;color:var(--muted);min-height:18px;margin-bottom:4px;font-size:13px;letter-spacing:.3px}.display{margin-bottom:14px}.display input{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--text);font-size:34px;font-weight:300;text-align:center;padding:10px 8px 12px;letter-spacing:3px;transition:border-color .2s}.display input::placeholder{color:#9a8ea673;letter-spacing:1px}.display input:focus{outline:none;border-bottom-color:var(--gold)}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:min(12px,1.4vh) 22px;margin:0 auto 14px;width:100%;max-width:320px}.key{aspect-ratio:1;width:100%;max-width:min(76px,9.4vh);justify-self:center;border-radius:50%;border:1px solid var(--line);background:radial-gradient(circle at 50% 30%,#9352b829,#140e1ae6 70%);color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transition:transform .08s,background .15s,box-shadow .15s}.key:active{transform:scale(.94);background:radial-gradient(circle at 50% 40%,var(--purple-hi),var(--purple-deep) 75%);box-shadow:var(--glow)}.key-digit{font-size:28px;font-weight:500;line-height:1}.key-letters{font-size:9.5px;font-weight:700;letter-spacing:1.6px;color:var(--gold);opacity:.85}.dial-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-items:center;margin-top:auto;max-width:320px;width:100%;align-self:center}.roundbtn{width:74px;height:74px;border-radius:50%;border:0;display:flex;align-items:center;justify-content:center;transition:transform .1s,box-shadow .2s}.roundbtn:active{transform:scale(.93)}.roundbtn.dial{color:#1b1208;background:linear-gradient(160deg,var(--gold-hi),var(--gold) 45%,var(--gold-deep));box-shadow:0 8px 26px #cfaa6e59,inset 0 1px #ffffff59}.roundbtn.hangup{color:#fff;background:linear-gradient(160deg,#f0656c,var(--red) 50%,#a92a31);box-shadow:0 8px 26px #e0474f66}.bksp{background:transparent;border:0;color:var(--muted);padding:10px;display:flex}.bksp:active{color:var(--gold)}.form label{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--gold);margin-bottom:8px}.form input{background:var(--card-solid);border:1px solid var(--line);color:var(--text);padding:15px;border-radius:14px;font-size:18px;margin-bottom:8px;transition:border-color .2s,box-shadow .2s}.form input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #cfaa6e1f}.hint{color:var(--muted);font-size:13px;line-height:1.45;margin:4px 0 16px}.primary{border:0;background:linear-gradient(180deg,var(--purple-hi),var(--purple));color:var(--gold-hi);font-weight:700;letter-spacing:.3px;padding:14px;border-radius:14px;font-size:15px;box-shadow:0 6px 18px #6e379066,inset 0 0 0 1px #ecd29e2e;transition:transform .08s,opacity .2s}.primary:active{transform:scale(.98)}.primary:disabled{opacity:.45;box-shadow:none}.ghost{border:1px solid var(--line);background:transparent;color:var(--muted);padding:13px;border-radius:14px;margin-top:8px;font-size:15px}.wallet{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#9352b847,#3f1d5559),var(--card-solid);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:12px;color:var(--muted);font-size:13px}.wallet strong{font-size:26px;font-weight:700;color:var(--gold-hi)}.sub-active{background:#46c98a1a;border:1px solid rgba(70,201,138,.25);color:var(--green);border-radius:14px;padding:12px 14px;font-size:13.5px;margin-bottom:16px}.sub-none{color:var(--muted);font-size:14px;margin-bottom:16px;text-align:center}.plan-row{display:flex;justify-content:space-between;align-items:center;background:var(--card);border:1px solid var(--line-soft);border-radius:16px;padding:15px 16px;margin-bottom:10px}.plan-name{font-weight:700;font-size:15px}.plan-price{color:var(--gold);font-size:14px;font-weight:600;margin-top:2px}.plan-row .primary{padding:10px 24px}.card{background:var(--card-solid);border:1px solid var(--line);border-radius:18px;padding:26px;text-align:center}.card.error h2{color:var(--gold);margin-top:0}.toast{position:fixed;left:50%;bottom:calc(26px + env(safe-area-inset-bottom));transform:translate(-50%);background:#151019f5;border:1px solid var(--line);color:var(--text);padding:12px 18px;border-radius:14px;font-size:14px;line-height:1.4;max-width:90%;text-align:center;z-index:100;box-shadow:0 10px 30px #0000008c;animation:rise .2s ease-out}.spinner{width:34px;height:34px;border:3px solid rgba(147,82,184,.25);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}.incall{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:radial-gradient(90% 55% at 50% 18%,rgba(110,55,144,.45),transparent 70%),var(--bg);display:flex;flex-direction:column;padding:calc(28px + env(safe-area-inset-top)) 22px calc(26px + env(safe-area-inset-bottom));max-width:480px;margin:0 auto}.incall-top{text-align:center;margin-top:18px;display:flex;flex-direction:column;align-items:center}.avatar{position:relative;width:112px;height:112px;border-radius:50%;margin-bottom:20px}.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px var(--gold),0 0 40px #9352b899}.avatar.pulse:before,.avatar.pulse:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid var(--gold);animation:ripple 2s ease-out infinite}.avatar.pulse:after{animation-delay:1s}.avatar.live img{box-shadow:0 0 0 2px var(--green),0 0 40px #46c98a59}.incall-number{font-size:30px;font-weight:600;letter-spacing:1.5px}.incall-status{color:var(--muted);font-size:15px;margin-top:8px}.incall-status.timer{color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:1px}.incall-cid{color:var(--muted);font-size:12.5px;margin-top:6px;opacity:.8}.incall-controls{margin-top:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:26px}.ctrl{display:flex;flex-direction:column;align-items:center;gap:8px;background:transparent;border:0;color:var(--text);padding:0;font-size:12px;font-weight:600}.ctrl-ico{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--card-hi);border:1px solid var(--line);transition:background .15s,color .15s,box-shadow .15s}.ctrl:disabled{opacity:.35}.ctrl.on .ctrl-ico{background:linear-gradient(160deg,var(--gold-hi),var(--gold));color:#1b1208;border-color:transparent;box-shadow:0 6px 18px #cfaa6e59}.incall-keypad{margin-top:auto;margin-bottom:20px}.incall-bottom{display:flex;flex-direction:column;align-items:center;gap:10px}.textbtn{background:transparent;border:0;color:var(--gold);font-size:14px;font-weight:600;padding:6px 12px}.recent{gap:8px;overflow-y:auto}.recent-row{display:flex;align-items:center;gap:12px;padding:12px;background:var(--card);border:1px solid var(--line-soft);border-radius:16px;cursor:pointer;transition:background .15s}.recent-row:active{background:var(--card-hi)}.recent-ico{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.recent-ico.ok{color:var(--green);background:#46c98a1f}.recent-ico.missed{color:var(--red);background:#e0474f1f}.recent-ico.live{color:var(--gold);background:#cfaa6e1f}.recent-main{flex:1;min-width:0}.recent-num{font-size:16px;font-weight:600;letter-spacing:.5px;overflow:hidden;text-overflow:ellipsis}.recent-sub{font-size:12px;color:var(--muted);margin-top:3px}.recent-call{border:0;width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#1b1208;background:linear-gradient(160deg,var(--gold-hi),var(--gold));box-shadow:0 4px 12px #cfaa6e40}.recent-call:active{transform:scale(.92)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ripple{0%{transform:scale(1);opacity:.7}to{transform:scale(1.6);opacity:0}}@keyframes blink{50%{opacity:.3}}@keyframes rise{0%{opacity:0;transform:translate(-50%,8px)}}@media(max-height:700px){.keypad{gap:10px 18px;max-width:280px}.key-digit{font-size:24px}.roundbtn{width:64px;height:64px}}
