.phone-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:border-color .2s;position:relative;max-height:calc(100vh - 110px)}.phone-card:focus-within{border-color:var(--accent);outline:none}.phone-card--offline{opacity:.6}.phone-card__header{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border);flex-shrink:0}.phone-card__name{flex:1;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.phone-card__fps{font-size:11px;font-family:var(--mono);color:var(--text-muted);min-width:48px;text-align:right}.phone-card__canvas-wrap{position:relative;width:100%;background:#000;cursor:crosshair;overflow:hidden;flex:1 1 auto;min-height:200px}.phone-card__canvas-wrap canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.phone-card__overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#0f172ad9;color:var(--text-muted);font-size:13px;pointer-events:none}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.phone-card__error{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#ef44441a;color:var(--danger);font-size:12px;padding:8px;text-align:center}.phone-card__footer{display:flex;align-items:center;gap:6px;padding:6px 12px;border-top:1px solid var(--border);font-size:11px;color:var(--text-muted);flex-shrink:0}.phone-card-skeleton{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.phone-card-skeleton__header{height:40px;margin:0}.phone-card-skeleton__screen{padding-top:177.78%}.phone-card-skeleton__footer{height:30px}.call-popup-container{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column-reverse;gap:10px;z-index:1000;pointer-events:none}.call-popup{pointer-events:all;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 16px;min-width:280px;max-width:340px;animation:slideIn .2s ease-out}@keyframes slideIn{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.call-popup--ringing{border-left-color:var(--accent)}.call-popup--active{border-left-color:var(--success)}.call-popup__label{font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px}.call-popup__number{font-size:18px;font-weight:700;color:var(--text);margin-bottom:2px}.call-popup__device{font-size:12px;color:var(--text-muted);margin-bottom:12px}.call-popup__timer{font-family:var(--mono);font-size:12px;color:var(--success);margin-bottom:10px}.call-popup__actions{display:flex;gap:8px}.call-popup__btn{flex:1;padding:8px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;transition:opacity .15s,transform .1s}.call-popup__btn:active{transform:scale(.97)}.call-popup__btn--answer{background:var(--success);color:#fff}.call-popup__btn--answer:hover{opacity:.85}.call-popup__btn--reject{background:var(--danger);color:#fff}.call-popup__btn--reject:hover{opacity:.85}.call-popup__btn--hangup{background:var(--danger);color:#fff;flex:none;padding:8px 16px}.call-popup__btn--hangup:hover{opacity:.85}.dashboard{display:flex;flex-direction:column;height:100%;overflow:hidden}.header{display:flex;align-items:center;gap:12px;padding:0 20px;height:56px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;z-index:10}.header__logo{font-size:18px;font-weight:700;color:var(--accent);letter-spacing:-.5px}.header__badge{font-size:11px;background:var(--surface-2);color:var(--text-muted);padding:2px 8px;border-radius:10px;border:1px solid var(--border)}.header__spacer{flex:1}.header__events-status{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted)}.header__btn{background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 12px;font-size:13px;transition:background .15s}.header__btn:hover{background:var(--border)}.dashboard__body{display:flex;flex:1;overflow:hidden}.dashboard__main{flex:1;overflow-y:auto;padding:20px}.device-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.device-grid--empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:80px 20px;color:var(--text-muted);text-align:center}.device-grid--empty svg{opacity:.3}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton{background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 50%,var(--surface) 75%);background-size:800px 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius)}:root{--bg: #0F172A;--surface: #1E293B;--surface-2: #263348;--border: #334155;--text: #E2E8F0;--text-muted: #94A3B8;--accent: #3B82F6;--accent-hover: #2563EB;--success: #22C55E;--warning: #EAB308;--danger: #EF4444;--radius: 8px;--radius-sm: 4px;--shadow: 0 4px 24px rgba(0,0,0,.4);--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono: "JetBrains Mono", "Fira Code", "Consolas", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{height:100%;display:flex;flex-direction:column}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;font-family:inherit;font-size:inherit;border:none;outline:none}input,button{font-family:var(--font)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--surface)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}.dot--live{background:var(--success);box-shadow:0 0 6px var(--success)}.dot--connecting{background:var(--warning)}.dot--offline{background:var(--danger)}