:root{--primary:#2563eb;--primary-hover:#1d4ed8;--danger:#ef4444;--success:#22c55e;--bg:#f8fafc;--text:#1e293b;--text-muted:#64748b}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app{flex-direction:column;align-items:center;min-height:100dvh;padding:2rem 1rem;display:flex}.header{text-align:center;margin-bottom:3rem}.header h1{font-size:1.5rem}.header p{color:var(--text-muted);font-size:.875rem}.main{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1rem;width:100%;max-width:400px;display:flex}.call-button{color:#fff;background:var(--primary);cursor:pointer;border:none;border-radius:999px;align-items:center;gap:.75rem;padding:1rem 2rem;font-size:1.125rem;font-weight:600;transition:background .2s;display:flex}.call-button:hover{background:var(--primary-hover)}.call-button:disabled{opacity:.5;cursor:not-allowed}.call-screen{flex-direction:column;align-items:center;gap:1.5rem;display:flex}.call-animation{justify-content:center;align-items:center;width:120px;height:120px;display:flex;position:relative}.pulse-ring{background:var(--primary);opacity:.3;border-radius:50%;width:100%;height:100%;animation:2s ease-out infinite pulse;position:absolute}.pulse-ring.delay{animation-delay:1s}@keyframes pulse{0%{opacity:.5;transform:scale(.5)}to{opacity:0;transform:scale(1.5)}}.phone-icon{z-index:1}.call-status{font-size:1.25rem;font-weight:600}.call-notice{color:var(--text-muted);font-size:.875rem}.end-button{color:#fff;background:var(--danger);cursor:pointer;border:none;border-radius:999px;padding:.75rem 2rem;font-size:1rem}.call-end{text-align:center;flex-direction:column;align-items:center;gap:1rem;display:flex}.call-end h2{font-size:1.25rem}.call-end p{color:var(--text-muted)}.reset-button{color:var(--primary);border:2px solid var(--primary);cursor:pointer;background:#fff;border-radius:999px;padding:.75rem 2rem;font-size:1rem}.connecting{flex-direction:column;align-items:center;gap:1rem;display:flex}.spinner{border:3px solid #e2e8f0;border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error{color:var(--danger);font-size:.875rem}.footer{color:var(--text-muted);margin-top:2rem;font-size:.75rem}
