:root{--primary-color: #0066cc;--secondary-color: #004499;--bg-color: #ffffff;--text-color: #1a1a1a;--border-color: #e5e7eb;--shadow-color: rgba(0, 0, 0, .1);--panel-bg: #ffffff;--hover-bg: #f3f4f6;--input-bg: #ffffff;--critical-color: #dc2626;--major-color: #ea580c;--minor-color: #f59e0b;--resolved-color: #10b981;--vh: 1vh}body.dark-mode{--bg-color: #1f2937;--text-color: #f3f4f6;--border-color: #374151;--shadow-color: rgba(0, 0, 0, .3);--panel-bg: #111827;--hover-bg: #374151;--input-bg: #1f2937}*{margin:0;padding:0;box-sizing:border-box}html{background-color:#1f2937}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-color);transition:background-color .3s ease,color .3s ease;min-height:100vh;min-height:100dvh}#app{width:100vw;height:calc(var(--vh) * 100);height:100dvh;display:flex;flex-direction:column;position:relative;min-height:calc(var(--vh) * 100);min-height:100dvh}#header{background-color:var(--panel-bg);border-bottom:1px solid var(--border-color);box-shadow:0 2px 4px var(--shadow-color);z-index:1001;transition:all .3s ease}.header-content{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:.75rem 1.5rem;max-width:100%;gap:1rem}.branding{display:flex;align-items:center;gap:1rem}.branding img{height:53px;width:auto}.branding h1{display:none}.header-center{display:flex;justify-content:center;align-items:center;width:100%;position:relative}.counters-container{display:flex;justify-content:center;align-items:stretch;width:100%;gap:2rem}.offline-counter,.custom-counter{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;text-align:center;min-width:150px;padding:.5rem 1rem}.counter-count{font-size:2rem;font-weight:700;line-height:1;text-align:center;display:flex;align-items:center;justify-content:center;height:2rem}.counter-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-color);opacity:.7;text-align:center;display:flex;align-items:flex-start;justify-content:center;line-height:1.3;max-width:180px}.offline-count{font-size:2rem;font-weight:700;color:var(--critical-color);line-height:1;text-align:center;display:flex;align-items:center;justify-content:center;height:2rem}.offline-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-color);opacity:.7;text-align:center;display:flex;align-items:flex-start;justify-content:center;line-height:1.3}.header-controls{display:flex;align-items:center;gap:1.5rem;justify-self:end;margin-right:16px}.status-indicator{font-size:.875rem;color:var(--text-color);opacity:.7}.theme-toggle{background:none;border:1px solid var(--border-color);border-radius:.5rem;padding:.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;width:40px;height:40px;transition:all .3s ease}.theme-toggle:hover{background-color:var(--hover-bg);border-color:var(--primary-color)}.theme-toggle svg{width:20px;height:20px;stroke:var(--text-color)}.dark-mode .sun-icon{display:none}.dark-mode .moon-icon{display:block}body:not(.dark-mode) .sun-icon{display:block}body:not(.dark-mode) .moon-icon{display:none}#map{flex:1;width:100%;position:relative}.mapboxgl-ctrl-geocoder{background-color:var(--panel-bg)!important;border:1px solid var(--border-color)!important;border-radius:.5rem!important;box-shadow:0 1px 2px var(--shadow-color)!important;color:var(--text-color)!important;z-index:1101!important}.dark-mode .mapboxgl-ctrl-geocoder{background-color:#111827!important;border-color:#374151!important}.mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input{color:var(--text-color)!important;background-color:transparent!important}.dark-mode .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input{color:#f3f4f6!important;background-color:transparent!important}.mapboxgl-ctrl-top-right,.mapboxgl-ctrl-top-left,.mapboxgl-ctrl-bottom-right,.mapboxgl-ctrl-bottom-left{z-index:1101!important}.mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--button{background-color:transparent!important;border-left:1px solid var(--border-color)!important}.dark-mode .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--button{background-color:transparent!important;border-left-color:#374151!important}.mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--button:hover{background-color:var(--hover-bg)!important}.dark-mode .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--button:hover{background-color:#374151!important}.mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--icon-close{fill:var(--text-color)!important;opacity:.9!important}.dark-mode .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--icon-close{fill:#f3f4f6!important}.mapboxgl-ctrl-geocoder--suggestions,.mapboxgl-ctrl-geocoder .suggestions{background-color:var(--panel-bg)!important;border:1px solid var(--border-color)!important;border-top:none!important;box-shadow:0 2px 4px var(--shadow-color)!important;z-index:1102!important}.dark-mode .mapboxgl-ctrl-geocoder--suggestions,.dark-mode .mapboxgl-ctrl-geocoder .suggestions{background-color:#111827!important;border-color:#374151!important}.mapboxgl-ctrl-geocoder--suggestion,.mapboxgl-ctrl-geocoder .suggestions>li{background-color:transparent!important;color:var(--text-color)!important}.dark-mode .mapboxgl-ctrl-geocoder--suggestion,.dark-mode .mapboxgl-ctrl-geocoder .suggestions>li{color:#f3f4f6!important}.mapboxgl-ctrl-geocoder .suggestions>li>a{background-color:transparent!important;color:var(--text-color)!important}.dark-mode .mapboxgl-ctrl-geocoder .suggestions>li>a{color:#f3f4f6!important}.mapboxgl-ctrl-geocoder .suggestions>li>a:hover,.mapboxgl-ctrl-geocoder .suggestions>.active>a{background-color:var(--hover-bg)!important}.dark-mode .mapboxgl-ctrl-geocoder .suggestions>li>a:hover,.dark-mode .mapboxgl-ctrl-geocoder .suggestions>.active>a{background-color:#374151!important}.mapboxgl-ctrl-geocoder--suggestion-title{color:var(--text-color)!important;font-weight:600}.dark-mode .mapboxgl-ctrl-geocoder--suggestion-title{color:#f3f4f6!important}.mapboxgl-ctrl-geocoder--suggestion-address{color:var(--text-color)!important;opacity:.75!important}.dark-mode .mapboxgl-ctrl-geocoder--suggestion-address{color:#d1d5db!important}.mapboxgl-ctrl-geocoder--powered-by{background-color:var(--panel-bg)!important;border-top:1px solid var(--border-color)!important}.dark-mode .mapboxgl-ctrl-geocoder--powered-by{background-color:#111827!important;border-top-color:#374151!important}.mapboxgl-ctrl-group{background-color:var(--panel-bg)!important;border-radius:.5rem!important;box-shadow:0 1px 2px var(--shadow-color)!important;border:1px solid var(--border-color)!important}.dark-mode .mapboxgl-ctrl-group{background-color:#111827!important;border-color:#374151!important}.mapboxgl-ctrl-group button{background-color:var(--panel-bg)!important;color:var(--text-color)!important;border-color:var(--border-color)!important}.dark-mode .mapboxgl-ctrl-group button{background-color:#111827!important;border-color:#374151!important}.mapboxgl-ctrl-group button:hover{background-color:var(--hover-bg)!important}.dark-mode .mapboxgl-ctrl-group button:hover{background-color:#374151!important}.dark-mode .mapboxgl-ctrl-icon{filter:invert(1)}.dark-mode .mapboxgl-ctrl-compass .mapboxgl-ctrl-icon{filter:none}.legend{position:absolute;bottom:30px;left:30px;background-color:var(--panel-bg);border-radius:.75rem;padding:1rem;box-shadow:0 2px 8px var(--shadow-color);z-index:1000;min-width:180px;transition:all .3s ease}.legend h3{font-size:.875rem;font-weight:600;margin-bottom:.75rem;color:var(--text-color);text-transform:uppercase;letter-spacing:.05em}.legend-items{display:flex;flex-direction:column;gap:.5rem}.legend-item{display:flex;align-items:center;gap:.75rem;font-size:.875rem}.legend-color{width:16px;height:16px;border-radius:50%;border:2px solid var(--panel-bg);box-shadow:0 0 0 1px var(--border-color)}.legend-color.offline,.legend-color.cluster{background-color:var(--critical-color)}.legend-note{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-color);font-weight:600;color:var(--text-color)}.legend-note small{font-size:.875rem}#subscriber-count{color:var(--critical-color);font-weight:700}.outage-info{position:absolute;top:80px;right:30px;background-color:var(--panel-bg);border-radius:.75rem;padding:1.5rem;box-shadow:0 4px 12px var(--shadow-color);z-index:1000;min-width:320px;max-width:400px;transition:all .3s ease;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.outage-info h3{font-size:1.125rem;font-weight:600;margin-bottom:1rem;color:var(--text-color)}.outage-info .close-btn{position:absolute;top:.75rem;right:.75rem;background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-color);opacity:.6;transition:opacity .2s ease;line-height:1;padding:.25rem}.outage-info .close-btn:hover{opacity:1}#outage-content{display:flex;flex-direction:column;gap:.75rem}#outage-content p{font-size:.875rem;line-height:1.5}#outage-content strong{font-weight:600;color:var(--text-color)}#outage-content span{color:var(--text-color);opacity:.9}.status-badge{display:inline-block;padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.status-badge.critical{background-color:var(--critical-color);color:#fff}.status-badge.major{background-color:var(--major-color);color:#fff}.status-badge.minor{background-color:var(--minor-color);color:#fff}.status-badge.resolved{background-color:var(--resolved-color);color:#fff}.loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1rem;z-index:2000;background-color:var(--panel-bg);padding:2rem;border-radius:.75rem;box-shadow:0 4px 12px var(--shadow-color)}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading p{font-size:.875rem;color:var(--text-color);opacity:.7}.error-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--panel-bg);padding:2rem;border-radius:.75rem;box-shadow:0 4px 12px var(--shadow-color);text-align:center;max-width:400px}.error-message h3{color:var(--critical-color);margin-bottom:1rem}.error-message p{color:var(--text-color);margin-bottom:.5rem;line-height:1.5}.version-info{background:none;border:1px solid var(--border-color);border-radius:.5rem;padding:.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;width:40px;height:40px;transition:all .3s ease}.version-info:hover{background-color:var(--hover-bg);border-color:var(--primary-color)}.dark-mode .version-info{background:none;color:#e5e5e5;border-color:#fff3}.dark-mode .version-info:hover{background:#ffffff1a}.version-modal{display:none;position:fixed;z-index:2000;left:0;top:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.version-modal-content{background-color:var(--panel-bg);color:var(--text-color);margin:15% auto;padding:0;border-radius:8px;width:90%;max-width:400px;box-shadow:0 4px 20px var(--shadow-color);animation:modalSlideIn .3s ease}.version-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border-color)}.version-modal-header h3{margin:0;font-size:1.2rem;font-weight:600;color:var(--text-color)}.version-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--text-color);opacity:.6;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.version-close:hover{background-color:var(--hover-bg);opacity:1}.version-modal-body{padding:20px}.version-detail{margin-bottom:12px;font-size:14px;line-height:1.5;color:var(--text-color)}.version-detail:last-child{margin-bottom:0}.version-detail strong{color:var(--text-color);font-weight:600;opacity:.9}.version-detail span{color:var(--text-color);opacity:.8}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){#header{position:relative}.header-content{padding:.5rem;grid-template-columns:auto 1fr auto;gap:.5rem}.branding{gap:.5rem}.branding img{height:36px}.branding h1{font-size:.875rem;white-space:nowrap}.header-center{order:0;justify-content:center}.counters-container{flex-direction:row;gap:.5rem;padding:0 .25rem}.offline-counter{flex-direction:column;gap:.25rem;align-items:center;min-width:80px;padding:.25rem .5rem}.offline-count{font-size:1.25rem;height:1.25rem}.offline-label{font-size:.6rem;line-height:1.2;align-items:flex-start}.custom-counter{min-width:80px;padding:.25rem .5rem;gap:.25rem}.counter-count{font-size:1.25rem;height:1.25rem}.counter-label{font-size:.6rem;line-height:1.2;max-width:100px;align-items:flex-start}.header-controls{display:flex;justify-self:end;gap:.25rem;margin-right:8px}.version-info{width:32px;height:32px;padding:.25rem}.version-info svg{width:14px;height:14px}.status-indicator{display:none}.mapboxgl-ctrl-top-right{top:8px!important}.mapboxgl-ctrl-group button{width:29px!important;height:29px!important}}@media (max-width: 480px){.header-content{padding:.375rem;gap:.375rem}.branding img{display:inline;height:32px}.branding h1{font-size:.75rem}.counters-container{gap:.375rem;padding:0}.offline-counter,.custom-counter{min-width:70px;padding:.25rem .375rem}.offline-count,.counter-count{font-size:1.1rem;height:1.1rem}.offline-label,.counter-label{font-size:.55rem;line-height:1.1;max-width:85px}.header-controls{gap:.25rem;margin-right:4px}.version-info{width:28px;height:28px}.version-info svg{width:12px;height:12px}.mapboxgl-ctrl-top-right{top:8px!important}}button:focus,a:focus{outline:2px solid var(--primary-color);outline-offset:2px}.map-component{position:absolute;z-index:1000;pointer-events:none}.map-component.disclaimer{display:flex;align-items:center;justify-content:center;pointer-events:auto}.map-component.disclaimer img{height:240px;width:auto;max-width:800px;object-fit:contain}.map-component.position-top-right{top:1rem;right:1rem}.map-component.position-top-left{top:1rem;left:1rem}.map-component.position-bottom-right{bottom:1rem;right:1rem}.map-component.position-bottom-left{bottom:1rem;left:1rem}@media (max-width: 768px){.map-component.disclaimer img{height:180px;max-width:600px}.map-component.position-top-right{top:.75rem;right:.75rem}.map-component.position-top-left{top:.75rem;left:.75rem}}@media (max-width: 480px){.map-component.disclaimer img{height:140px;max-width:480px}.map-component.position-top-right{top:.5rem;right:.5rem}.map-component.position-top-left{top:.5rem;left:.5rem}}.notification-container{position:fixed;top:80px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:.75rem;max-width:400px;pointer-events:none}.notification{background-color:var(--panel-bg);border-radius:.5rem;box-shadow:0 4px 12px var(--shadow-color);padding:1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-width:300px;pointer-events:auto;transform:translate(120%);transition:transform .3s ease,opacity .3s ease;opacity:0;border-left:4px solid var(--primary-color)}.notification-show{transform:translate(0);opacity:1}.notification-hide{transform:translate(120%);opacity:0}.notification-content{display:flex;align-items:center;gap:.75rem;flex:1}.notification-icon{font-size:1.25rem;flex-shrink:0}.notification-message{font-size:.875rem;line-height:1.4;color:var(--text-color);word-break:break-word}.notification-close{background:none;border:none;color:var(--text-color);opacity:.6;cursor:pointer;font-size:1.5rem;line-height:1;padding:.25rem;flex-shrink:0;transition:opacity .2s ease}.notification-close:hover{opacity:1}.notification-error{border-left-color:var(--critical-color);background-color:#dc26261a}.dark-mode .notification-error{background-color:#dc262626}.notification-warning{border-left-color:var(--minor-color);background-color:#f59e0b1a}.dark-mode .notification-warning{background-color:#f59e0b26}.notification-success{border-left-color:var(--resolved-color);background-color:#10b9811a}.dark-mode .notification-success{background-color:#10b98126}.notification-info{border-left-color:var(--primary-color)}.network-status{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:var(--panel-bg);border:2px solid var(--critical-color);border-radius:2rem;padding:.5rem 1.5rem;display:none;align-items:center;gap:.5rem;z-index:10000;box-shadow:0 4px 12px var(--shadow-color);animation:slideUp .3s ease}.network-status.offline{display:flex}.network-status-icon{font-size:1rem}.network-status-text{font-size:.875rem;font-weight:600;color:var(--text-color)}@keyframes slideUp{0%{transform:translate(-50%) translateY(100px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}@media (max-width: 768px){.notification-container{top:auto;bottom:20px;right:10px;left:10px;max-width:none}.notification{min-width:auto;width:100%}.network-status{bottom:80px;left:10px;right:10px;transform:none;justify-content:center}}@media print{#header,.theme-toggle,.mapboxgl-ctrl-group,.mapboxgl-ctrl-geocoder,.notification-container,.network-status{display:none}#map{height:100vh}}