: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:61px;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}#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}#subscriber-count{color:var(--critical-color);font-weight:700}.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:1fr auto 1fr;gap:.5rem}.branding{gap:.5rem}.branding img{height:41px}.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:37px}.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}.skip-to-content{position:absolute;top:-40px;left:0;background:var(--primary-color);color:#fff;padding:8px 16px;text-decoration:none;z-index:10000;border-radius:0 0 4px;font-weight:600;transition:top .2s ease}.skip-to-content:focus{top:0;outline:2px solid white;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:276px;width:auto;max-width:800px;object-fit:contain}.map-component.legend{background-color:var(--panel-bg);border:1px solid var(--border-color);border-radius:8px;padding:12px 16px;box-shadow:0 2px 8px var(--shadow-color);font-size:13px;line-height:1.5;max-width:220px;z-index:1000;pointer-events:auto;transition:transform .3s ease,opacity .3s ease}.map-component.legend.legend-hidden{transform:translate(calc(-100% + 32px));opacity:0;pointer-events:none}.map-component.legend.legend-hidden .legend-close{pointer-events:auto}.map-component.legend .legend-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border-color)}.map-component.legend .legend-title{font-size:14px;font-weight:600;margin:0;color:var(--text-color)}.map-component.legend .legend-close{background:transparent;border:none;color:var(--text-color);font-size:18px;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s ease,opacity .2s ease;opacity:.6;line-height:1;min-width:28px;min-height:28px;display:flex;align-items:center;justify-content:center;font-weight:700}.map-component.legend .legend-close:hover{background-color:var(--hover-bg);opacity:1}.legend-toggle{position:absolute;bottom:2.5rem;left:0;background-color:var(--panel-bg);border:1px solid var(--border-color);border-left:none;border-radius:0 8px 8px 0;box-shadow:2px 0 4px var(--shadow-color);color:var(--text-color);font-size:13px;font-weight:500;cursor:pointer;padding:8px 12px;min-width:auto;height:auto;display:flex;align-items:center;justify-content:center;gap:6px;z-index:1001;transition:background-color .2s ease,transform .2s ease;white-space:nowrap}.legend-toggle:hover{background-color:var(--hover-bg);transform:translate(2px)}.legend-toggle:before{content:"☰";font-size:16px;line-height:1}.map-component.legend .legend-items{display:flex;flex-direction:column;gap:10px}.map-component.legend .legend-item{display:flex;align-items:center;gap:10px}.map-component.legend .legend-icon{flex-shrink:0}.map-component.legend .legend-label{color:var(--text-color);font-size:13px}.map-component.position-top-right{top:1rem;right:1rem}.map-component.position-top-left{top:7rem;left:1rem}.map-component.position-bottom-right{bottom:1rem;right:1rem}.map-component.position-bottom-left{bottom:1rem;left:1rem}.map-component.legend.position-bottom-left{bottom:2.5rem}@media (max-width: 768px){.map-component.disclaimer img{height:207px;max-width:600px}.map-component.position-top-right{top:.75rem;right:.75rem}.map-component.position-top-left{top:5rem;left:.75rem}.map-component.legend.position-bottom-left{bottom:2.5rem}}@media (max-width: 480px){.map-component.disclaimer img{height:161px;max-width:480px}.map-component.position-top-right{top:.5rem;right:.5rem}.map-component.position-top-left{top:4.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:#dc262640}.dark-mode .notification-error{background-color:#dc26264d}.notification-warning{border-left-color:var(--minor-color);background-color:#f59e0b40}.dark-mode .notification-warning{background-color:#f59e0b4d}.notification-success{border-left-color:var(--resolved-color);background-color:#10b98140}.dark-mode .notification-success{background-color:#10b9814d}.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{inset:auto 10px 20px;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,.mapboxgl-ctrl-group,.mapboxgl-ctrl-geocoder,.notification-container,.network-status{display:none}#map{height:100vh}}
