:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--bg-primary: #0b0f1a;--bg-card: rgba(15, 23, 42, .7);--bg-card-hover: rgba(15, 23, 42, .9);--border-subtle: rgba(99, 102, 241, .15);--border-glow: rgba(99, 102, 241, .4);--accent: #6366f1;--accent-light: #818cf8;--accent-glow: rgba(99, 102, 241, .3);--green: #22c55e;--green-glow: rgba(34, 197, 94, .3);--red: #ef4444;--red-glow: rgba(239, 68, 68, .3);--yellow: #eab308;--yellow-glow: rgba(234, 179, 8, .3);--cyan: #06b6d4;--cyan-glow: rgba(6, 182, 212, .3);--text-primary: #f1f5f9;--text-secondary: rgba(148, 163, 184, .9);--text-muted: rgba(100, 116, 139, .8)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg-primary);color:var(--text-primary)}body{background:radial-gradient(ellipse 80% 60% at 50% -20%,rgba(99,102,241,.12),transparent),radial-gradient(ellipse 60% 40% at 80% 100%,rgba(6,182,212,.08),transparent),var(--bg-primary)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#6366f14d;border-radius:3px}.app{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0b0f1acc;position:sticky;top:0;z-index:100}.header-left{display:flex;align-items:center;gap:.75rem}.logo-icon{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--cyan));display:grid;place-items:center;font-size:1.2rem;box-shadow:0 0 20px var(--accent-glow)}.header h1{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,var(--text-primary),var(--accent-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.header-right{display:flex;align-items:center;gap:1rem}.status-badge{display:flex;align-items:center;gap:.5rem;padding:.4rem .85rem;border-radius:9999px;font-size:.78rem;font-weight:600;border:1px solid}.status-badge.online{color:var(--green);border-color:#22c55e4d;background:#22c55e14}.status-dot{width:8px;height:8px;border-radius:50%;animation:pulse-dot 2s ease-in-out infinite}.status-dot.green{background:var(--green);box-shadow:0 0 8px var(--green-glow)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}.time-display{font-size:.85rem;color:var(--text-muted);font-variant-numeric:tabular-nums}.main-content{flex:1;display:grid;grid-template-columns:1fr 380px;gap:1.5rem;padding:1.5rem 2rem}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:16px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overflow:hidden;transition:border-color .3s,box-shadow .3s}.card:hover{border-color:var(--border-glow);box-shadow:0 0 30px #6366f10f}.card-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border-subtle)}.card-title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);display:flex;align-items:center;gap:.5rem}.card-body{padding:1.25rem}.map-section{display:flex;flex-direction:column;gap:1.5rem}.map-container{position:relative;border-radius:16px;overflow:hidden;flex:1;min-height:420px}.map-canvas{width:100%;height:100%;min-height:420px;background:radial-gradient(circle at 30% 40%,rgba(99,102,241,.08) 0%,transparent 50%),radial-gradient(circle at 70% 60%,rgba(6,182,212,.06) 0%,transparent 40%),linear-gradient(180deg,#0f172a,#1e293b);position:relative}.map-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(99,102,241,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(99,102,241,.04) 1px,transparent 1px);background-size:40px 40px}.map-roads{position:absolute;top:0;right:0;bottom:0;left:0}.map-road{position:absolute;background:#6366f114;border-radius:2px}.map-road.horizontal{height:3px;left:0;right:0}.map-road.vertical{width:3px;top:0;bottom:0}.map-road.main{background:#6366f124}.location-marker{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);z-index:10}.marker-pulse{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:120px;height:120px;border-radius:50%;background:var(--accent-glow);animation:marker-pulse 3s ease-in-out infinite}.marker-pulse-2{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;background:#6366f133;animation:marker-pulse 3s ease-in-out infinite .5s}@keyframes marker-pulse{0%,to{transform:translate(-50%,-50%) scale(.8);opacity:.8}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.3}}.marker-dot{position:relative;width:18px;height:18px;border-radius:50%;background:var(--accent);border:3px solid white;box-shadow:0 0 20px var(--accent-glow),0 0 40px #6366f126;z-index:2}.marker-label{position:absolute;top:-36px;left:50%;transform:translate(-50%);white-space:nowrap;background:#0f172ae6;border:1px solid var(--border-glow);padding:.25rem .6rem;border-radius:8px;font-size:.7rem;font-weight:600;color:var(--accent-light);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.geofence-circle{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;border-radius:50%;border:2px dashed rgba(34,197,94,.4);background:#22c55e08;animation:geofence-rotate 30s linear infinite;pointer-events:none}@keyframes geofence-rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.geofence-label{position:absolute;top:calc(45% - 115px);left:50%;transform:translate(-50%);font-size:.65rem;color:var(--green);background:#0b0f1acc;padding:.15rem .5rem;border-radius:4px;border:1px solid rgba(34,197,94,.2);white-space:nowrap}.map-overlay{position:absolute;bottom:1rem;left:1rem;right:1rem;display:flex;gap:.75rem;z-index:10}.map-info-chip{background:#0f172ad9;border:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:.5rem .85rem;border-radius:10px;font-size:.75rem;display:flex;align-items:center;gap:.4rem;color:var(--text-secondary)}.map-info-chip .value{font-weight:700;color:var(--text-primary)}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.stat-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:14px;padding:1.1rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .3s;position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;border-radius:14px 14px 0 0}.stat-card.battery:before{background:linear-gradient(90deg,var(--green),var(--cyan))}.stat-card.signal:before{background:linear-gradient(90deg,var(--accent),var(--accent-light))}.stat-card.speed:before{background:linear-gradient(90deg,var(--yellow),#f59e0b)}.stat-card.safety:before{background:linear-gradient(90deg,var(--cyan),var(--green))}.stat-card:hover{border-color:var(--border-glow);transform:translateY(-2px);box-shadow:0 8px 30px #0000004d}.stat-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:1rem;margin-bottom:.75rem}.stat-icon.battery{background:#22c55e1f;color:var(--green)}.stat-icon.signal{background:var(--accent-glow);color:var(--accent-light)}.stat-icon.speed{background:var(--yellow-glow);color:var(--yellow)}.stat-icon.safety{background:var(--cyan-glow);color:var(--cyan)}.stat-value{font-size:1.5rem;font-weight:800;letter-spacing:-.03em;line-height:1;margin-bottom:.25rem}.stat-label{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.stat-bar{margin-top:.6rem;height:4px;border-radius:2px;background:#ffffff0f;overflow:hidden}.stat-bar-fill{height:100%;border-radius:2px;transition:width 1s ease}.stat-bar-fill.green{background:linear-gradient(90deg,var(--green),var(--cyan))}.stat-bar-fill.blue{background:linear-gradient(90deg,var(--accent),var(--accent-light))}.stat-bar-fill.yellow{background:linear-gradient(90deg,var(--yellow),#f59e0b)}.stat-bar-fill.cyan{background:linear-gradient(90deg,var(--cyan),var(--green))}.sidebar{display:flex;flex-direction:column;gap:1.5rem}.sos-section{text-align:center}.sos-button{width:100px;height:100px;border-radius:50%;border:3px solid var(--red);background:#ef444414;color:var(--red);font-size:1.1rem;font-weight:800;letter-spacing:.1em;cursor:pointer;transition:all .3s;position:relative;margin:0 auto .75rem}.sos-button:before{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:50%;border:2px solid rgba(239,68,68,.2);animation:sos-ring 2s ease-in-out infinite}.sos-button:hover{background:#ef444433;box-shadow:0 0 40px var(--red-glow);transform:scale(1.05)}.sos-button:active{transform:scale(.95)}.sos-button.active{background:var(--red);color:#fff;animation:sos-flash .8s ease-in-out infinite;box-shadow:0 0 60px var(--red-glow)}@keyframes sos-ring{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.15);opacity:0}}@keyframes sos-flash{0%,to{opacity:1}50%{opacity:.7}}.sos-label{font-size:.75rem;color:var(--text-muted)}.history-list{display:flex;flex-direction:column;gap:0}.history-item{display:flex;gap:.75rem;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.04);position:relative}.history-item:last-child{border-bottom:none}.history-timeline{display:flex;flex-direction:column;align-items:center;gap:0;width:20px;flex-shrink:0}.history-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.history-dot.current{background:var(--accent);box-shadow:0 0 10px var(--accent-glow)}.history-dot.past{background:#6366f14d}.history-line{width:2px;flex:1;background:#6366f126;min-height:20px}.history-info{flex:1;min-width:0}.history-place{font-size:.82rem;font-weight:600;color:var(--text-primary);margin-bottom:.15rem}.history-address{font-size:.7rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-time{font-size:.68rem;color:var(--accent-light);white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}.alerts-list{display:flex;flex-direction:column;gap:.6rem}.alert-item{display:flex;align-items:flex-start;gap:.6rem;padding:.7rem .85rem;border-radius:10px;border:1px solid;font-size:.78rem;animation:alert-in .4s ease-out}@keyframes alert-in{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.alert-item.warning{background:#eab3080f;border-color:#eab30833;color:var(--yellow)}.alert-item.danger{background:#ef44440f;border-color:#ef444433;color:var(--red)}.alert-item.info{background:#06b6d40f;border-color:#06b6d433;color:var(--cyan)}.alert-item.success{background:#22c55e0f;border-color:#22c55e33;color:var(--green)}.alert-icon{font-size:1rem;flex-shrink:0;margin-top:.05rem}.alert-content{flex:1}.alert-title{font-weight:600;margin-bottom:.1rem}.alert-desc{font-size:.7rem;opacity:.8}.alert-time{font-size:.65rem;opacity:.6;white-space:nowrap}.contacts-list{display:flex;flex-direction:column;gap:.6rem}.contact-item{display:flex;align-items:center;gap:.75rem;padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.04)}.contact-item:last-child{border-bottom:none}.contact-avatar{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:.85rem;font-weight:700;flex-shrink:0}.contact-avatar.purple{background:var(--accent-glow);color:var(--accent-light)}.contact-avatar.green{background:#22c55e1f;color:var(--green)}.contact-avatar.cyan{background:var(--cyan-glow);color:var(--cyan)}.contact-info{flex:1;min-width:0}.contact-name{font-size:.82rem;font-weight:600}.contact-role{font-size:.68rem;color:var(--text-muted)}.contact-status{width:8px;height:8px;border-radius:50%;flex-shrink:0}.contact-status.online{background:var(--green);box-shadow:0 0 6px var(--green-glow)}.contact-status.offline{background:#64748b66}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.quick-action-btn{display:flex;align-items:center;gap:.5rem;padding:.7rem .85rem;border-radius:10px;border:1px solid var(--border-subtle);background:#ffffff05;color:var(--text-secondary);font-size:.78rem;font-weight:500;cursor:pointer;transition:all .2s}.quick-action-btn:hover{background:#6366f114;border-color:var(--border-glow);color:var(--text-primary);transform:translateY(-1px)}.quick-action-icon{font-size:1rem}.geofence-toggle{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.04)}.geofence-toggle:last-child{border-bottom:none}.toggle-info{flex:1}.toggle-name{font-size:.82rem;font-weight:600;margin-bottom:.1rem}.toggle-desc{font-size:.68rem;color:var(--text-muted)}.toggle-switch{width:42px;height:24px;border-radius:12px;background:#ffffff1a;cursor:pointer;position:relative;transition:background .3s;border:none;flex-shrink:0}.toggle-switch.active{background:var(--accent)}.toggle-switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .3s}.toggle-switch.active:after{transform:translate(18px)}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fade-in .5s ease-out forwards}.fade-in-1{animation-delay:.05s;opacity:0}.fade-in-2{animation-delay:.1s;opacity:0}.fade-in-3{animation-delay:.15s;opacity:0}.fade-in-4{animation-delay:.2s;opacity:0}.fade-in-5{animation-delay:.25s;opacity:0}.fade-in-6{animation-delay:.3s;opacity:0}@media(max-width:1024px){.main-content{grid-template-columns:1fr;padding:1rem}.stats-row{grid-template-columns:repeat(2,1fr)}.header{padding:.75rem 1rem}}@media(max-width:640px){.stats-row{grid-template-columns:1fr}.map-overlay{flex-wrap:wrap}.quick-actions{grid-template-columns:1fr}}