:root {
  --bg: #07111f;
  --bg2: #0b1626;
  --panel: #101d2e;
  --panel2: #142337;
  --line: #25364c;
  --text: #ecf2f8;
  --muted: #8ea0b5;
  --accent: #2ba8e0;
  --accent2: #0b77a8;
  --green: #35c889;
  --yellow: #f3c94e;
  --orange: #f28b3c;
  --red: #ef5b61;
  --blue: #59a9ff;
  --radius: 14px;
  --shadow: 0 14px 32px rgba(0,0,0,.18);
}
* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; }
body { margin: 0; min-width: 320px; background: radial-gradient(circle at 15% 0%, #102945 0%, var(--bg) 38rem); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button,input,select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
#app { min-height: 100%; }
.topbar { min-height: 78px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 22px; border-bottom:1px solid var(--line); background:rgba(7,17,31,.92); backdrop-filter: blur(14px); position:sticky; top:0; z-index:1000; }
.brand { display:flex; align-items:center; gap:12px; min-width:0; }
.brand-mark { width:42px; height:42px; border:1px solid #38749c; border-radius:11px; display:grid; place-items:center; font-weight:900; color:#90dfff; background:linear-gradient(145deg,#133451,#0a1a2b); }
.brand-title { font-weight:850; letter-spacing:.09em; font-size:18px; white-space:nowrap; }
.brand-title span { color:#7bd6ff; font-weight:700; }
.brand-subtitle { color:var(--muted); font-size:12px; margin-top:2px; }
.top-status { display:flex; align-items:center; gap:14px; }
.status-pill { display:flex; align-items:center; gap:8px; border:1px solid var(--line); padding:8px 11px; border-radius:999px; color:#c6d3df; font-size:12px; white-space:nowrap; background:#0b1726; }
.dot { width:8px; height:8px; border-radius:50%; background:var(--yellow); box-shadow:0 0 0 3px rgba(243,201,78,.12); }
.dot.ok { background:var(--green); box-shadow:0 0 0 3px rgba(53,200,137,.12); }
.dot.bad { background:var(--red); box-shadow:0 0 0 3px rgba(239,91,97,.12); }
.clock { font-variant-numeric:tabular-nums; font-size:18px; font-weight:800; letter-spacing:.04em; }
.nav-tabs { display:flex; gap:4px; overflow-x:auto; padding:8px 20px; border-bottom:1px solid var(--line); background:#091522; scrollbar-width:none; }
.nav-tabs::-webkit-scrollbar { display:none; }
.nav-tab { color:#9eb0c3; background:transparent; border:0; border-radius:9px; padding:10px 14px; white-space:nowrap; font-weight:700; font-size:13px; }
.nav-tab:hover,.nav-tab.active { color:#fff; background:#14283e; }
main { padding:16px; max-width:1800px; margin:0 auto; }
.view { display:none; }
.view.active { display:block; }
.panel { background:linear-gradient(180deg,rgba(16,29,46,.96),rgba(12,24,39,.96)); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); min-width:0; }
.operations-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(340px,.72fr); gap:14px; }
.map-shell { overflow:hidden; }
.map-toolbar { padding:10px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line); background:#0c1a2a; }
.search-wrap { position:relative; display:flex; gap:8px; flex:1; min-width:0; }
.search-wrap input { width:100%; }
.map-actions { display:flex; gap:7px; }
input, select { width:100%; min-height:42px; border-radius:9px; border:1px solid #30445d; background:#0a1726; color:#f1f6fb; padding:9px 11px; outline:none; }
input:focus,select:focus { border-color:#4ba9d8; box-shadow:0 0 0 3px rgba(43,168,224,.13); }
input::placeholder { color:#63788e; }
.btn { min-height:40px; border:1px solid #34506c; background:#13283e; color:#dce8f2; border-radius:9px; padding:8px 12px; font-weight:750; font-size:13px; transition:.15s ease; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.btn:hover { border-color:#527598; background:#19324d; }
.btn.primary { background:#087eb3; border-color:#1497cf; color:white; }
.btn.primary:hover { background:#0a8cc5; }
.btn.danger { border-color:#7b3f48; background:#3a1d25; color:#ffc6ca; }
.icon-btn { min-height:36px; background:transparent; border:1px solid var(--line); border-radius:8px; color:#abc0d3; padding:6px 9px; }
#map { height:585px; background:#09131f; }
.leaflet-container { font-family:inherit; }
.leaflet-popup-content-wrapper,.leaflet-popup-tip { background:#101d2e; color:#f1f4f8; }
.venue-marker { width:18px; height:18px; border:3px solid #e9f5ff; border-radius:50%; box-shadow:0 0 0 4px rgba(0,0,0,.25); }
.venue-marker.green { background:var(--green); }.venue-marker.yellow{background:var(--yellow)}.venue-marker.orange{background:var(--orange)}.venue-marker.red{background:var(--red)}.venue-marker.blue{background:var(--blue)}.venue-marker.gray{background:#718096}
.warning-tooltip { background:#07111f !important; color:#fff !important; border:1px solid #314961 !important; box-shadow:0 6px 20px #0005 !important; }
.map-footer { min-height:38px; display:flex; flex-wrap:wrap; align-items:center; gap:13px; padding:8px 12px; color:#9eb1c4; font-size:11px; border-top:1px solid var(--line); }
.legend-dot { display:inline-block; width:8px;height:8px;border-radius:50%;margin-right:5px; }.legend-dot.green{background:var(--green)}.legend-dot.yellow{background:var(--yellow)}.legend-dot.orange{background:var(--orange)}.legend-dot.red{background:var(--red)}.legend-dot.blue{background:var(--blue)}
.side-stack { display:grid; gap:14px; align-content:start; }
.venue-panel,.active-watch { padding:16px; }
.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; }
.panel-heading.compact { align-items:center; }
.panel-heading h1,.panel-heading h2 { margin:3px 0 0; line-height:1.14; }
.panel-heading h1 { font-size:23px; }.panel-heading h2{font-size:19px}
.eyebrow { font-size:10px; letter-spacing:.16em; font-weight:850; color:#65bde4; }
.status-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:15px 0; }
.status-card { background:#0a1726; border:1px solid var(--line); border-radius:11px; padding:12px; min-width:0; }
.status-card .label { display:block; font-size:9px; color:#7f93a8; letter-spacing:.12em; font-weight:850; }
.status-card small { display:block; color:#8ea0b5; margin-top:5px; line-height:1.3; }
.level { display:block; margin-top:5px; font-size:16px; letter-spacing:.03em; }.level.green{color:var(--green)}.level.yellow{color:var(--yellow)}.level.orange{color:var(--orange)}.level.red{color:var(--red)}.level.blue{color:var(--blue)}.level.neutral{color:#b7c4d1}
.conditions { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.metric { border:1px solid #22354a; border-radius:10px; padding:10px; background:#0d1a2a; min-width:0; }
.metric span { display:block; color:#7f93a8; font-size:10px; }
.metric strong { display:block; margin-top:4px; font-size:16px; overflow-wrap:anywhere; }
.panel-actions { display:flex; gap:8px; margin-top:15px; }
.badge { display:inline-flex; align-items:center; min-height:25px; border-radius:999px; padding:4px 8px; border:1px solid #39536c; color:#aac0d4; font-size:9px; letter-spacing:.06em; font-weight:850; white-space:nowrap; }
.badge.ok { color:#74e9b1; border-color:#2d6650; background:#103325; }.badge.yellow{color:#ffe086;border-color:#6c5a25;background:#302912}.badge.orange{color:#ffc088;border-color:#7d4c28;background:#382517}.badge.red{color:#ffb3b7;border-color:#71333a;background:#361b21}.badge.blue{color:#acd6ff;border-color:#315b84;background:#102a43}
.empty-state { color:#7f93a8; border:1px dashed #2b4057; border-radius:10px; padding:18px; text-align:center; background:#0a1522; }.empty-state.small{padding:12px;font-size:12px}
.forecast-panel { margin-top:14px; padding:14px; }
.hourly-strip { display:grid; grid-template-columns:repeat(12,minmax(112px,1fr)); gap:8px; overflow-x:auto; padding-bottom:4px; }
.hour-card { background:#0b1828; border:1px solid #22384e; border-radius:10px; padding:10px; min-width:112px; }
.hour-card .time { font-weight:850; font-size:13px; }.hour-card .desc { color:#91a6b9; font-size:10px; min-height:28px; margin:4px 0 8px; line-height:1.25; }.hour-card .temp{font-size:22px;font-weight:800}.hour-card .mini{margin-top:5px;color:#abc0d2;font-size:10px;display:grid;gap:2px}
.two-col { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(320px,.7fr); gap:14px; }.two-col>.panel{padding:16px}
.source-note { border-left:3px solid #2c8fb9; background:#0b1b2b; border-radius:7px; padding:10px 12px; color:#9fb2c6; font-size:12px; line-height:1.5; margin-bottom:12px; }.source-note.warning{border-color:#b68230;background:#251f12;color:#dfc895}
.list-stack { display:grid; gap:8px; }.compact-list{margin-top:10px}
.list-item { border:1px solid #24384e; border-radius:10px; padding:11px; background:#0b1828; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.list-item .title { font-weight:800; }.list-item .meta { color:#8599ad; font-size:11px; margin-top:4px; line-height:1.4; }.list-item .body { color:#aebdcc; font-size:12px; margin-top:6px; line-height:1.45; max-width:900px; }.list-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.mini-btn{border:1px solid #334b63;background:#11243a;color:#c1d3e3;border-radius:7px;padding:5px 8px;font-size:11px}
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.summary-box{border:1px solid #263a4f;border-radius:10px;padding:12px;background:#0b1827}.summary-box strong{display:block;font-size:24px}.summary-box span{color:#8095a9;font-size:10px}.summary-box.yellow strong{color:var(--yellow)}.summary-box.orange strong{color:var(--orange)}.summary-box.red strong{color:var(--red)}
.separator { height:1px; background:var(--line); margin:16px 0; }
.media-grid { grid-template-columns:1fr 1fr; }.media-panel { min-width:0; }.media-frame { min-height:360px; display:grid; place-items:center; border:1px solid #21364b; border-radius:10px; overflow:hidden; background:#06101a; }.media-frame img{width:100%;height:auto;display:block;max-height:620px;object-fit:contain}.media-time{font-size:11px;margin-top:8px}.connector-state{margin-bottom:8px}.source-explainer{padding:15px;margin-top:14px}.source-explainer p{color:#9fb0c1;line-height:1.55;margin-bottom:0}
.matches-layout{grid-template-columns:.8fr 1.2fr}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{color:#a7b8c8;font-size:11px;font-weight:650;display:grid;gap:6px}.form-grid .full{grid-column:1/-1}.form-actions{display:flex;gap:8px;align-items:center}.form-actions.full{grid-column:1/-1}.button-row{display:flex;gap:8px;flex-wrap:wrap}.file-btn{cursor:pointer}
.table-wrap{overflow:auto;border:1px solid #23384d;border-radius:10px}.data-table{border-collapse:collapse;width:100%;min-width:850px;background:#0a1725}.data-table th,.data-table td{text-align:left;padding:10px 11px;border-bottom:1px solid #1e3043;font-size:12px;vertical-align:top}.data-table th{position:sticky;top:0;background:#102238;color:#8ea4b8;font-size:10px;letter-spacing:.05em}.data-table td{color:#becbd7}.data-table tr:last-child td{border-bottom:0}
.config-layout{grid-template-columns:1fr 1fr}.connector-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #1e3245}.connector-row:last-of-type{border-bottom:0}.connector-row p{color:#8196aa;font-size:11px;margin:4px 0 0;line-height:1.4}.secret-label{display:grid;gap:6px;margin-top:14px;color:#a7b8c8;font-size:11px}.secret-line{display:flex;gap:8px}.thresholds{margin-top:12px}.inline-message{font-size:11px;color:#97aabc;margin-top:8px;min-height:17px}.inline-message.ok{color:#78dcae}.inline-message.bad{color:#ff9ca2}
.search-results { position:absolute; top:48px; left:0; right:72px; z-index:1500; background:#0d1b2b; border:1px solid #344c64; border-radius:9px; box-shadow:0 16px 38px #0008; overflow:hidden; max-height:320px; overflow-y:auto; }.search-result{padding:10px 12px;border-bottom:1px solid #203348;cursor:pointer}.search-result:last-child{border-bottom:0}.search-result:hover{background:#152b41}.search-result strong{display:block;font-size:12px}.search-result span{display:block;color:#8498aa;font-size:10px;margin-top:3px}
.modal { width:min(720px,calc(100% - 26px)); background:#0c1929; color:var(--text); border:1px solid #35506a; border-radius:14px; padding:0; box-shadow:0 20px 70px #000c; }.modal::backdrop{background:#02070dc9;backdrop-filter:blur(4px)}.modal form{padding:17px}.modal-head,.modal-actions{display:flex;align-items:center;gap:10px}.modal-head{justify-content:space-between;margin-bottom:16px}.modal-head h2{margin:3px 0 0}.modal-actions{margin-top:17px}.spacer{flex:1}
.toast-region{position:fixed;right:16px;bottom:16px;display:grid;gap:8px;z-index:3000;max-width:min(380px,calc(100% - 32px))}.toast{border:1px solid #35516d;border-left:4px solid var(--blue);border-radius:10px;background:#0c1a2a;color:#dce8f3;padding:10px 12px;box-shadow:0 14px 40px #0008;font-size:12px;line-height:1.4}.toast.bad{border-left-color:var(--red)}.toast.ok{border-left-color:var(--green)}
footer { display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:18px 22px 28px;color:#60778c;font-size:10px;max-width:1800px;margin:0 auto; }
@media (max-width:1100px){.operations-layout,.two-col,.config-layout,.matches-layout{grid-template-columns:1fr}.side-stack{grid-template-columns:1fr 1fr}.forecast-panel{margin-top:14px}.media-grid{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.topbar{padding:10px 12px;position:static}.brand-subtitle{display:none}.top-status .status-pill{display:none}.clock{font-size:15px}.nav-tabs{padding:7px 8px}.nav-tab{padding:9px 10px}.operations-layout{display:block}.map-shell{margin-bottom:12px}.side-stack{display:grid;grid-template-columns:1fr}.map-toolbar{align-items:stretch;flex-direction:column}.search-results{right:0}.map-actions{width:100%}.map-actions .btn{flex:1}#map{height:420px}.conditions{grid-template-columns:repeat(2,1fr)}.status-grid{grid-template-columns:1fr 1fr}.hourly-strip{grid-template-columns:repeat(12,104px)}.media-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .full,.form-actions.full{grid-column:auto}.summary-grid{grid-template-columns:repeat(2,1fr)}main{padding:10px}.two-col>.panel{padding:13px}.secret-line{flex-direction:column}.panel-heading{gap:8px}.panel-heading h1{font-size:20px}.map-footer{font-size:9px}}
@media (max-width:390px){.status-grid{grid-template-columns:1fr}.brand-title{font-size:15px}.brand-mark{width:36px;height:36px}.conditions{grid-template-columns:1fr 1fr}.btn{padding:8px 9px}}
.live-lightning{margin-top:12px;border:1px solid #27415a;border-radius:10px;background:#091725;padding:11px}.live-lightning-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.live-lightning .label{display:block;color:#7f93a8;font-size:9px;letter-spacing:.11em;font-weight:850}.live-lightning strong{display:block;margin-top:5px;font-size:17px}.live-lightning .muted{font-size:10px;margin-top:5px;line-height:1.4}.lightning-map-dot{width:9px;height:9px;border-radius:50%;background:#8edfff;border:1px solid #fff;box-shadow:0 0 0 3px rgba(142,223,255,.2)}