:root {
  --ink: #17211d;
  --muted: #64716b;
  --line: #dce3df;
  --surface: #ffffff;
  --canvas: #f4f7f5;
  --nav: #18231f;
  --nav-muted: #aebbb5;
  --green: #16825d;
  --green-soft: #e5f4ed;
  --red: #c4473b;
  --red-soft: #fae9e6;
  --amber: #b46e13;
  --amber-soft: #fff2da;
  --blue: #276b9b;
  --blue-soft: #e5f0f7;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--canvas); }
button, input, select { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.muted { color: var(--muted); }
.eyebrow { margin: 0 0 5px; color: var(--green); font-size: 12px; font-weight: 750; text-transform: uppercase; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: 26px; line-height: 1.2; letter-spacing: 0; }
h2 { margin-bottom: 3px; font-size: 16px; letter-spacing: 0; }

.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(260px, 38%) minmax(360px, 1fr); background: var(--surface); }
.login-brand { display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 56px; color: white; background: var(--nav); }
.login-brand .brand-mark { width: 54px; height: 54px; margin-bottom: 24px; }
.login-brand strong { font-size: 38px; }
.login-brand span { color: var(--nav-muted); font-size: 16px; }
.login-panel { width: calc(100% - 48px); max-width: 410px; margin: auto; display: grid; gap: 20px; }
.login-panel h1 { font-size: 32px; margin-bottom: 8px; }
.login-panel label { display: grid; gap: 7px; font-size: 13px; font-weight: 700; }
.login-panel input { width: 100%; min-width: 0; height: 44px; border: 1px solid var(--line); border-radius: 5px; padding: 0 12px; outline: none; }
.login-panel input:focus { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.primary-button { min-height: 44px; border: 0; border-radius: 5px; display: flex; align-items: center; justify-content: center; gap: 9px; color: white; background: var(--green); font-weight: 750; }
.primary-button:hover { background: #106c4c; }
.primary-button svg { width: 18px; }
.form-error { min-height: 18px; margin: -8px 0; color: var(--red); font-size: 13px; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 236px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 22px 14px; display: flex; flex-direction: column; color: white; background: var(--nav); }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 26px; }
.brand-mark { width: 38px; height: 38px; border-radius: 6px; display: grid; place-items: center; color: white; background: var(--green); }
.brand-mark svg { width: 23px; }
.brand div:last-child { display: flex; flex-direction: column; }
.brand strong { font-size: 18px; }
.brand span { color: var(--nav-muted); font-size: 10px; text-transform: uppercase; }
nav { display: grid; gap: 5px; }
.nav-item { width: 100%; height: 42px; padding: 0 11px; border: 0; border-radius: 5px; display: flex; align-items: center; gap: 11px; color: var(--nav-muted); background: transparent; text-align: left; }
.nav-item:hover { color: white; background: #22332c; }
.nav-item.active { color: white; background: #2b3d35; }
.nav-item svg { width: 18px; }
.nav-item span { flex: 1; }
.nav-item b { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 10px; display: grid; place-items: center; color: #d5dfda; background: #344940; font-size: 11px; }
.nav-item .alert-count { color: #ffd9d4; background: #713b35; }
.sidebar-status { margin-top: auto; padding: 14px 10px 0; border-top: 1px solid #34423c; display: flex; align-items: center; gap: 10px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #35c88a; box-shadow: 0 0 0 4px rgba(53, 200, 138, .12); }
.sidebar-status div { display: flex; flex-direction: column; }
.sidebar-status strong { font-size: 12px; }
.sidebar-status span:last-child { color: var(--nav-muted); font-size: 11px; }

main { min-width: 0; }
.topbar { height: 66px; padding: 0 28px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.96); }
.tenant { display: flex; flex-direction: column; }
.tenant span { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.tenant strong { font-size: 14px; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.updated-at { margin-right: 6px; color: var(--muted); font-size: 12px; }
.icon-button { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 5px; display: grid; place-items: center; color: var(--ink); background: white; }
.icon-button:hover { border-color: #abb8b1; background: var(--canvas); }
.icon-button svg { width: 18px; }
.icon-button.loading svg { animation: spin .8s linear infinite; }
.menu-button { display: none; }
.user-button { height: 38px; padding: 0 9px 0 5px; border: 1px solid var(--line); border-radius: 5px; display: flex; align-items: center; gap: 8px; background: white; }
.user-button svg { width: 16px; color: var(--muted); }
.avatar { width: 28px; height: 28px; border-radius: 4px; display: grid; place-items: center; color: white; background: var(--blue); font-size: 12px; font-weight: 800; }

.content { width: min(1440px, 100%); padding: 28px; }
.view { display: none; }
.view.active { display: block; }
.page-heading { min-height: 48px; margin-bottom: 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.source-pill { height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 15px; display: flex; align-items: center; gap: 7px; color: var(--muted); background: white; font-size: 11px; }
.source-pill span { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.metrics { margin-bottom: 20px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.metric { min-height: 114px; padding: 17px; border: 1px solid var(--line); border-radius: 6px; display: flex; flex-direction: column; justify-content: space-between; background: var(--surface); }
.metric-top { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; }
.metric-icon { width: 31px; height: 31px; border-radius: 5px; display: grid; place-items: center; }
.metric-icon svg { width: 17px; }
.metric strong { font-size: 29px; line-height: 1; }
.metric small { color: var(--muted); font-size: 11px; }
.tone-green { color: var(--green); background: var(--green-soft); }
.tone-red { color: var(--red); background: var(--red-soft); }
.tone-blue { color: var(--blue); background: var(--blue-soft); }
.tone-amber { color: var(--amber); background: var(--amber-soft); }
.service-strip { margin-bottom: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.section-heading { min-height: 62px; padding: 12px 17px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.section-heading h2 { margin: 0; }
.section-heading p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.service-strip-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.service-strip-item { min-width: 0; min-height: 82px; padding: 14px 17px; border-right: 1px solid var(--line); display: flex; align-items: center; gap: 11px; }
.service-strip-item:last-child { border-right: 0; }
.health-icon { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 5px; display: grid; place-items: center; }
.health-icon svg { width: 17px; }
.health-operational { color: var(--green); background: var(--green-soft); }
.health-degraded { color: var(--amber); background: var(--amber-soft); }
.health-critical { color: var(--red); background: var(--red-soft); }
.health-unknown { color: var(--muted); background: #edf1ef; }
.service-strip-item div:last-child { min-width: 0; display: flex; flex-direction: column; }
.service-strip-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.service-strip-item span { color: var(--muted); font-size: 10px; }
.service-strip-empty { grid-column: 1 / -1; min-height: 82px; padding: 14px 17px; display: flex; align-items: center; gap: 11px; color: var(--muted); }
.service-strip-empty > svg { width: 24px; color: var(--green); }
.service-strip-empty div { display: flex; flex-direction: column; }
.service-strip-empty strong { color: var(--ink); font-size: 12px; }
.service-strip-empty span { font-size: 10px; }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); gap: 12px; }
.panel { border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.panel-heading { min-height: 67px; padding: 15px 17px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }
.panel-heading h2 { margin: 0; }
.panel-heading p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.text-button { border: 0; display: flex; align-items: center; gap: 5px; color: var(--green); background: transparent; font-size: 12px; font-weight: 700; }
.text-button svg { width: 14px; }
.problem-row { min-height: 73px; padding: 12px 17px; border-bottom: 1px solid #edf1ef; display: grid; grid-template-columns: 4px minmax(0, 1fr) auto; align-items: center; gap: 13px; }
.problem-row:last-child { border-bottom: 0; }
.incident-row { width: 100%; border-top: 0; border-right: 0; border-left: 0; color: var(--ink); background: transparent; text-align: left; }
.incident-row:hover { background: #fafcfb; }
.severity-bar { align-self: stretch; width: 4px; border-radius: 2px; background: var(--amber); }
.severity-4, .severity-5 { background: var(--red); }
.severity-2 { background: var(--blue); }
.problem-main { min-width: 0; }
.problem-main strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.problem-main span, .problem-age { color: var(--muted); font-size: 11px; }
.incident-code { color: var(--green) !important; font-weight: 750; }
.availability-panel { min-height: 330px; }
.donut-wrap { height: 190px; display: grid; place-items: center; }
.donut { width: 150px; height: 150px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--green) 0deg, var(--red) 0deg); position: relative; }
.donut::after { content: ""; position: absolute; inset: 17px; border-radius: 50%; background: white; }
.donut div { z-index: 1; display: flex; flex-direction: column; align-items: center; }
.donut strong { font-size: 28px; }
.donut span { color: var(--muted); font-size: 11px; }
.availability-legend { padding: 0 22px 18px; display: grid; gap: 10px; }
.availability-legend span { display: flex; align-items: center; color: var(--muted); font-size: 12px; }
.availability-legend i { width: 8px; height: 8px; margin-right: 8px; border-radius: 2px; }
.availability-legend strong { margin-left: auto; color: var(--ink); }
.legend-ok { background: var(--green); }
.legend-error { background: var(--red); }

.intelligence-brief { min-height: 112px; margin-bottom: 20px; padding: 17px; border-top: 3px solid var(--blue); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 78px minmax(0, 1fr) auto; align-items: center; gap: 18px; background: var(--surface); }
.score-gauge { width: 70px; height: 70px; border: 6px solid var(--green); border-radius: 50%; display: grid; place-items: center; align-content: center; background: white; }
.score-gauge.score-high { border-color: var(--amber); }
.score-gauge.score-critical { border-color: var(--red); }
.score-gauge strong { font-size: 22px; line-height: 1; }
.score-gauge span { margin-top: 3px; color: var(--muted); font-size: 8px; text-transform: uppercase; }
.brief-copy { min-width: 0; }
.brief-copy h2 { margin: 4px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brief-copy p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.brief-label { display: flex; align-items: center; gap: 6px; color: var(--blue); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.brief-label svg { width: 14px; }

.intelligence-metrics { margin-bottom: 18px; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 1px solid var(--line); background: white; }
.intelligence-metrics article { min-height: 92px; padding: 16px; border-right: 1px solid var(--line); display: flex; align-items: center; gap: 12px; }
.intelligence-metrics article:last-child { border-right: 0; }
.intelligence-metrics div { display: flex; flex-direction: column; }
.intelligence-metrics strong { font-size: 24px; line-height: 1.1; }
.intelligence-metrics div span { color: var(--muted); font-size: 10px; }
.decision-band { margin-bottom: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.maturity { min-height: 27px; padding: 0 9px; border: 1px solid #bad1c6; border-radius: 14px; display: inline-flex; align-items: center; color: var(--green); background: var(--green-soft); font-size: 10px; font-weight: 750; }
.insight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.insight-item { min-height: 190px; padding: 17px; border-right: 1px solid var(--line); display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 11px; }
.insight-item:last-child { border-right: 0; }
.insight-icon { width: 34px; height: 34px; border-radius: 5px; display: grid; place-items: center; color: var(--blue); background: var(--blue-soft); }
.insight-critical .insight-icon { color: var(--red); background: var(--red-soft); }
.insight-warning .insight-icon { color: var(--amber); background: var(--amber-soft); }
.insight-positive .insight-icon { color: var(--green); background: var(--green-soft); }
.insight-icon svg { width: 17px; }
.insight-item h3 { margin: 1px 0 7px; font-size: 13px; line-height: 1.35; }
.insight-item p { min-height: 43px; margin: 0 0 10px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.insight-item small { display: block; color: var(--muted); font-size: 9px; line-height: 1.4; }
.insight-item > div > strong { margin-top: 10px; display: flex; gap: 6px; color: var(--ink); font-size: 10px; line-height: 1.45; }
.insight-item > div > strong svg { flex: 0 0 auto; width: 14px; color: var(--green); }
.intelligence-layout { margin-bottom: 18px; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr); gap: 12px; }
.situation-list { display: grid; }
.situation-item { min-height: 142px; padding: 15px 17px; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 58px minmax(0,1fr) 64px; gap: 14px; align-items: start; }
.situation-item:last-child { border-bottom: 0; }
.risk-score { width: 54px; height: 54px; border: 1px solid #c6d3cd; border-radius: 5px; display: grid; place-items: center; align-content: center; color: var(--green); background: var(--green-soft); }
.risk-score.risk-attention, .risk-score.risk-high { color: var(--amber); background: var(--amber-soft); }
.risk-score.risk-critical { color: var(--red); background: var(--red-soft); }
.risk-score strong { font-size: 19px; line-height: 1; }
.risk-score span { margin-top: 2px; font-size: 8px; text-transform: uppercase; }
.situation-copy { min-width: 0; }
.situation-copy > div { display: flex; align-items: center; gap: 7px; }
.situation-copy > div small { color: var(--muted); font-size: 9px; }
.situation-copy h3 { margin: 7px 0 4px; font-size: 13px; }
.situation-copy p { margin: 0 0 8px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.situation-copy > strong { color: var(--ink); font-size: 10px; line-height: 1.4; }
.confidence { display: flex; flex-direction: column; align-items: flex-end; }
.confidence span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.confidence strong { margin: 3px 0; font-size: 16px; }
.confidence small { color: var(--muted); font-size: 9px; }
.trend-panel { min-height: 360px; }
.trend-chart { height: 255px; padding: 22px 16px 12px; display: flex; align-items: stretch; gap: 5px; overflow-x: auto; }
.trend-column { min-width: 22px; flex: 1 0 22px; display: grid; grid-template-rows: 1fr 18px; gap: 5px; }
.trend-bars { min-height: 0; display: flex; align-items: end; justify-content: center; gap: 2px; }
.trend-bars i { width: 6px; min-height: 3px; border-radius: 2px 2px 0 0; }
.availability-bar { background: var(--green); }
.problem-bar { background: var(--red); }
.trend-column > span { overflow: hidden; color: var(--muted); font-size: 7px; text-align: center; }
.trend-empty { width: 100%; display: grid; place-items: center; color: var(--muted); font-size: 11px; }
.trend-legend { padding: 0 17px 14px; display: flex; gap: 14px; }
.trend-legend span { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 9px; }
.trend-legend i { width: 7px; height: 7px; border-radius: 2px; }
.risk-panel { margin-bottom: 20px; }
.risk-badge { min-width: 88px; display: flex; align-items: center; gap: 7px; color: var(--green); font-size: 10px; }
.risk-badge b { width: 28px; height: 28px; border-radius: 4px; display: grid; place-items: center; color: white; background: var(--green); }
.risk-badge.risk-attention, .risk-badge.risk-high { color: var(--amber); }
.risk-badge.risk-attention b, .risk-badge.risk-high b { background: var(--amber); }
.risk-badge.risk-critical { color: var(--red); }
.risk-badge.risk-critical b { background: var(--red); }
.confidence-inline { display: flex; flex-direction: column; color: var(--muted); font-size: 9px; }
.confidence-inline b { color: var(--ink); font-size: 11px; }
.recommendation-cell { min-width: 260px; max-width: 420px; color: var(--muted); line-height: 1.4; }

.inferred-pill span { background: var(--blue); }
.topology-metrics { margin-bottom: 18px; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 1px solid var(--line); background: white; }
.topology-metrics article { min-height: 96px; padding: 16px; border-right: 1px solid var(--line); display: flex; align-items: center; gap: 12px; }
.topology-metrics article:last-child { border-right: 0; }
.topology-metrics article > div { min-width: 0; display: flex; flex-direction: column; }
.topology-metrics strong { font-size: 23px; line-height: 1.1; }
.topology-metrics article > div > span { color: var(--ink); font-size: 10px; font-weight: 750; }
.topology-metrics small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.network-map-band { margin-bottom: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.registry-summary { min-height: 48px; padding: 0 16px 12px; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 1px; background: var(--line); }
.registry-summary > span { min-width: 0; min-height: 36px; padding: 7px 10px; display: flex; align-items: center; gap: 6px; background: white; color: var(--muted); font-size: 9px; }
.registry-summary svg { width: 14px; }
.registry-summary strong { color: var(--ink); font-size: 14px; }
.network-map-layout { height: 520px; display: grid; grid-template-columns: minmax(0,1fr) 300px; border-top: 1px solid var(--line); }
.network-map { min-width: 0; height: 100%; background: #e7ece9; }
.map-selection { min-width: 0; padding: 18px; border-left: 1px solid var(--line); overflow-y: auto; }
.map-selection-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.map-site-type { color: var(--muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.map-selection h3 { margin: 13px 0 3px; font-size: 18px; }
.map-selection > p { margin: 0 0 16px; color: var(--muted); font-size: 10px; }
.map-selection dl { margin: 0; border-top: 1px solid var(--line); }
.map-selection dl div { padding: 10px 0; border-bottom: 1px solid var(--line); }
.map-selection dt { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.map-selection dd { margin: 3px 0 0; font-size: 10px; font-weight: 650; }
.map-source-link { width: fit-content; margin-top: 16px; text-decoration: none; }
.map-selection-empty { height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 5px; color: var(--muted); text-align: center; }
.map-selection-empty svg { width: 22px; }
.map-selection-empty strong { color: var(--ink); font-size: 11px; }
.map-selection-empty span { font-size: 9px; }
.registry-marker-wrap { background: transparent; border: 0; }
.registry-marker { width: 22px; height: 22px; border: 3px solid white; border-radius: 50% 50% 50% 3px; display: block; transform: rotate(-45deg); background: #718079; box-shadow: 0 2px 8px rgba(11,35,27,.3); }
.registry-marker.level-normal { background: var(--green); }
.registry-marker.level-attention, .registry-marker.level-high { background: var(--amber); }
.registry-marker.level-critical { background: var(--red); }
.registry-marker.mapping-suggested { border-style: dashed; }
.registry-marker.mapping-unmapped { background: #718079; opacity: .75; }
.leaflet-container { font-family: inherit; }
.leaflet-tooltip { border: 0; border-radius: 3px; box-shadow: 0 2px 8px rgba(0,0,0,.15); font-size: 10px; font-weight: 700; }
.energy-band { margin-bottom: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.discovery-band{margin-bottom:18px;border:1px solid var(--line);background:white}.discovery-band .section-heading a{height:36px}.discovery-overview{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.discovery-overview>span{min-height:72px;padding:14px 18px;display:grid;grid-template-columns:24px auto;grid-template-rows:auto auto;align-items:center;border-right:1px solid var(--line);font-size:9px;color:var(--muted)}.discovery-overview>span:last-child{border-right:0}.discovery-overview svg{grid-row:1/3;color:var(--accent);width:17px}.discovery-overview strong{font-size:20px;color:var(--ink)}.discovery-readout{display:grid;grid-template-columns:.8fr 1.2fr;gap:0}.discovery-readout>div{padding:17px 20px;min-width:0}.discovery-readout>div+div{border-left:1px solid var(--line)}.discovery-readout h3{margin:0 0 12px;font-size:11px}.discovery-breakdown{display:flex;flex-wrap:wrap;gap:7px}.discovery-breakdown span{display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--line);border-radius:4px;font-size:9px;color:var(--muted)}.discovery-breakdown span i{width:6px;height:6px;border-radius:50%;background:var(--accent)}.discovery-breakdown span b{color:var(--ink)}.discovery-link-list article{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--line)}.discovery-link-list article:first-child{border-top:0}.link-type{width:28px;height:28px;display:grid;place-items:center;border-radius:4px;background:#2c69d812;color:#2c69d8}.link-type.link-radio{background:#d7681812;color:#c35912}.link-type.link-fiber{background:#26755a12;color:#26755a}.link-type svg{width:15px}.discovery-link-list strong,.discovery-link-list small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.discovery-link-list strong{font-size:10px}.discovery-link-list small{margin-top:2px;font-size:8px;color:var(--muted)}.discovery-link-list article>b{font-size:8px;color:var(--muted);font-weight:600}.discovery-empty{font-size:9px;color:var(--muted)}
@media(max-width:600px){.discovery-overview{grid-template-columns:1fr 1fr}.discovery-overview>span:nth-child(2){border-right:0}.discovery-overview>span:nth-child(-n+2){border-bottom:1px solid var(--line)}.discovery-readout{grid-template-columns:1fr}.discovery-readout>div+div{border-left:0;border-top:1px solid var(--line)}.discovery-breakdown span{flex:1 1 125px;justify-content:space-between}}
.energy-overview { min-height: 48px; padding: 0 16px 12px; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 1px; background: var(--line); }
.energy-overview span { min-width: 0; min-height: 36px; padding: 7px 10px; display: flex; align-items: center; gap: 6px; background: white; color: var(--muted); font-size: 9px; }
.energy-overview svg { width: 14px; flex: 0 0 auto; }
.energy-overview strong { color: var(--ink); font-size: 14px; }
.energy-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border-top: 1px solid var(--line); }
.energy-monitor { min-height: 238px; padding: 16px; border-right: 1px solid var(--line); border-top: 3px solid var(--green); }
.energy-monitor:last-child { border-right: 0; }
.energy-monitor[data-level="attention"], .energy-monitor[data-level="high"] { border-top-color: var(--amber); }
.energy-monitor[data-level="critical"] { border-top-color: var(--red); }
.energy-heading { height: 35px; display: flex; justify-content: space-between; align-items: flex-start; }
.energy-icon { width: 32px; height: 32px; border-radius: 5px; display: grid; place-items: center; color: var(--amber); background: var(--amber-soft); }
.energy-icon svg { width: 17px; }
.energy-state { min-height: 23px; padding: 0 7px; border-radius: 12px; display: inline-flex; align-items: center; font-size: 9px; font-weight: 750; }
.energy-monitor > strong { margin-top: 12px; display: block; font-size: 30px; line-height: 1; }
.energy-monitor > strong small { color: var(--muted); font-size: 12px; }
.energy-monitor h3 { margin: 8px 0 13px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.energy-facts { padding-top: 10px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; color: var(--muted); font-size: 9px; }
.energy-reason { margin-top: 4px; color: var(--ink); line-height: 1.35; }
.energy-empty { grid-column: 1 / -1; min-height: 130px; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--muted); }
.energy-empty svg { width: 20px; }
.energy-empty strong { font-size: 11px; }
.domain-band { margin-bottom: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.role-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.role-legend span { min-height: 25px; padding: 0 7px; border: 1px solid var(--line); border-radius: 13px; display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 9px; }
.role-legend i, .domain-nodes > li > i { width: 8px; height: 8px; border-radius: 2px; background: #84918b; }
[data-role="core"] { background: var(--red) !important; }
[data-role="security"] { background: #80539a !important; }
[data-role="access"], [data-role="distribution"] { background: var(--amber) !important; }
[data-role="wireless"] { background: var(--blue) !important; }
[data-role="compute"] { background: var(--green) !important; }
[data-role="circuit"] { background: #3b7c88 !important; }
[data-role="network"] { background: #657b72 !important; }
.role-legend b { color: var(--ink); }
.domain-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); border-top: 1px solid var(--line); }
.domain-card { min-height: 360px; padding: 17px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-top: 3px solid var(--green); background: white; }
.domain-card:nth-child(2n) { border-right: 0; }
.domain-card[data-level="critical"] { border-top-color: var(--red); }
.domain-card[data-level="high"], .domain-card[data-level="attention"] { border-top-color: var(--amber); }
.domain-heading { min-height: 48px; display: flex; justify-content: space-between; gap: 12px; }
.domain-heading > div > span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.domain-heading h2 { margin: 3px 0 0; font-size: 15px; }
.domain-facts { min-height: 44px; margin: 12px 0; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; gap: 18px; }
.domain-facts span { color: var(--muted); font-size: 9px; }
.domain-facts b { margin-right: 2px; color: var(--ink); font-size: 11px; }
.root-candidate { min-height: 72px; padding: 11px; border-left: 3px solid var(--red); display: flex; flex-direction: column; justify-content: center; background: var(--red-soft); }
.root-candidate > span { display: flex; align-items: center; gap: 5px; color: var(--red); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.root-candidate svg { width: 12px; }
.root-candidate > strong { margin-top: 4px; font-size: 11px; }
.root-candidate > small { color: var(--muted); font-size: 9px; }
.root-empty { border-left-color: #aeb9b3; background: #f1f4f2; }
.root-empty > span { color: var(--muted); }
.domain-nodes { margin: 13px 0 0; padding: 0; list-style: none; }
.domain-nodes li { min-height: 39px; border-bottom: 1px solid #edf1ef; display: grid; grid-template-columns: 9px minmax(0,1fr) 25px; align-items: center; gap: 8px; }
.domain-nodes li:last-child { border-bottom: 0; }
.domain-nodes span { min-width: 0; display: flex; flex-direction: column; }
.domain-nodes strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.domain-nodes small { color: var(--muted); font-size: 8px; }
.node-risk { width: 23px; height: 23px; border-radius: 4px; display: grid; place-items: center; color: var(--green); background: var(--green-soft); font-size: 9px; }
.node-risk.risk-critical { color: var(--red); background: var(--red-soft); }
.node-risk.risk-high, .node-risk.risk-attention { color: var(--amber); background: var(--amber-soft); }
.capacity-panel { margin-bottom: 20px; }
.capacity-panel .panel-heading { gap: 12px; }
.capacity-normal { color: var(--green); background: var(--green-soft); }
.capacity-attention, .capacity-high { color: var(--amber); background: var(--amber-soft); }
.capacity-critical { color: var(--red); background: var(--red-soft); }

.toolbar { margin-bottom: 12px; display: flex; justify-content: space-between; gap: 10px; }
.search { width: min(420px, 100%); height: 40px; padding: 0 11px; border: 1px solid var(--line); border-radius: 5px; display: flex; align-items: center; gap: 8px; background: white; }
.search:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.search svg { width: 17px; color: var(--muted); }
.search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; }
select { height: 40px; padding: 0 30px 0 11px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); background: white; }
.table-panel { min-height: 220px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { height: 42px; padding: 0 16px; color: var(--muted); background: #fafcfb; font-size: 10px; text-align: left; text-transform: uppercase; }
td { height: 58px; padding: 0 16px; border-top: 1px solid #edf1ef; font-size: 12px; }
td strong { display: block; font-size: 12px; }
td small { color: var(--muted); }
.status-badge, .severity-badge { width: fit-content; min-height: 23px; padding: 3px 8px; border-radius: 12px; display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 750; white-space: nowrap; }
.status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; }
.status-available { color: #0b704e; background: var(--green-soft); }.status-available::before { background: var(--green); }
.status-unavailable { color: #a3362e; background: var(--red-soft); }.status-unavailable::before { background: var(--red); }
.status-disabled { color: #5f6b66; background: #edf1ef; }.status-disabled::before { background: #89958f; }
.severity-badge { color: var(--blue); background: var(--blue-soft); }
.severity-badge.s4, .severity-badge.s5 { color: var(--red); background: var(--red-soft); }
.severity-badge.s3 { color: var(--amber); background: var(--amber-soft); }
.ack { color: var(--green); }.not-ack { color: var(--muted); }
.empty { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 5px; color: var(--muted); }
.empty svg { width: 29px; margin-bottom: 7px; }
.empty strong { color: var(--ink); font-size: 13px; }
.empty span { font-size: 11px; }
.service-summary { margin-bottom: 14px; display: flex; gap: 8px; flex-wrap: wrap; }
.summary-chip { min-height: 34px; padding: 0 11px; border: 1px solid var(--line); border-radius: 17px; display: flex; align-items: center; gap: 7px; color: var(--muted); background: white; font-size: 11px; }
.summary-chip i { width: 8px; height: 8px; border-radius: 50%; }
.summary-chip strong { color: var(--ink); }
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.catalog-empty { grid-column: 1 / -1; }
.service-card { min-height: 206px; padding: 17px; border: 1px solid var(--line); border-top: 3px solid var(--green); border-radius: 6px; background: var(--surface); }
.service-card[data-health="degraded"] { border-top-color: var(--amber); }
.service-card[data-health="critical"] { border-top-color: var(--red); }
.service-card[data-health="unknown"] { border-top-color: #89958f; }
.service-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.service-card-heading h2 { margin: 0 0 4px; font-size: 16px; }
.service-card-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.health-badge { min-height: 25px; padding: 4px 8px; border-radius: 13px; display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 750; white-space: nowrap; }
.health-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.service-description { min-height: 42px; margin: 16px 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.service-facts { padding-top: 13px; border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.service-facts div { min-width: 0; display: flex; flex-direction: column; }
.service-facts span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.service-facts strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.dependency-line { margin-top: 13px; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.dependency-line svg { width: 14px; }
.incident-link { border: 0; color: var(--ink); background: transparent; font-weight: 750; text-align: left; }
.incident-link:hover { color: var(--green); }
.incident-link + small { display: block; margin-top: 3px; }
.status-open { color: var(--red); background: var(--red-soft); }
.status-acknowledged { color: var(--amber); background: var(--amber-soft); }
.status-resolved { color: var(--green); background: var(--green-soft); }
.status-open::before { background: var(--red); }
.status-acknowledged::before { background: var(--amber); }
.status-resolved::before { background: var(--green); }
.sla { display: flex; flex-direction: column; gap: 2px; }
.sla strong { font-size: 11px; }
.sla span { color: var(--muted); font-size: 9px; }
.sla-breached strong { color: var(--red); }
.sla-risk strong { color: var(--amber); }
.row-actions { display: flex; justify-content: flex-end; gap: 5px; }
.row-actions .icon-button { width: 31px; height: 31px; }
.row-actions svg { width: 15px; }
.incident-dialog { width: min(680px, calc(100% - 28px)); max-height: min(760px, calc(100vh - 40px)); padding: 0; border: 0; border-radius: 6px; color: var(--ink); background: white; box-shadow: 0 24px 70px rgba(12,22,17,.28); }
.incident-dialog::backdrop { background: rgba(13,25,19,.5); }
.dialog-heading { min-height: 78px; padding: 17px 20px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.dialog-heading h2 { margin: 0; font-size: 19px; }
.dialog-summary { padding: 18px 20px; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.dialog-summary div { display: flex; flex-direction: column; }
.dialog-summary span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.dialog-summary strong { margin-top: 3px; font-size: 11px; }
.dialog-actions { padding: 0 20px 18px; display: flex; gap: 8px; }
.secondary-button { min-height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 5px; display: inline-flex; align-items: center; gap: 7px; color: var(--ink); background: white; font-size: 11px; font-weight: 750; }
.secondary-button:hover { background: var(--canvas); }
.secondary-button svg { width: 15px; }
.timeline-section { padding: 18px 20px 22px; border-top: 1px solid var(--line); background: #fafcfb; }
.timeline-section h3 { margin: 0 0 14px; font-size: 12px; }
.timeline { display: grid; gap: 0; }
.timeline-item { min-height: 52px; padding: 0 0 13px 24px; border-left: 1px solid #cbd5d0; position: relative; }
.timeline-item:last-child { border-left-color: transparent; }
.timeline-item::before { content: ""; position: absolute; left: -5px; top: 1px; width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px #e6f3ed; }
.timeline-item strong { display: block; font-size: 11px; }
.timeline-item p { margin: 3px 0; color: var(--muted); font-size: 10px; }
.timeline-item time { color: #87938d; font-size: 9px; }
.toast { position: fixed; right: 22px; bottom: 22px; max-width: 360px; padding: 11px 14px; border-radius: 5px; color: white; background: var(--ink); box-shadow: 0 10px 30px rgba(10,20,15,.18); font-size: 12px; opacity: 0; transform: translateY(8px); pointer-events: none; transition: .2s; }
.toast.show { opacity: 1; transform: translateY(0); }
@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 960px) {
  .app-shell { grid-template-columns: 72px minmax(0,1fr); }
  .sidebar { padding-inline: 9px; }
  .brand { justify-content: center; padding-inline: 0; }
  .brand > div:last-child, .nav-item span, .nav-item b, .sidebar-status div { display: none; }
  .nav-item { justify-content: center; padding: 0; }
  .sidebar-status { justify-content: center; }
  .metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .service-strip-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .service-strip-item:nth-child(2) { border-right: 0; }
  .service-strip-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .intelligence-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .intelligence-metrics article:nth-child(2) { border-right: 0; }
  .intelligence-metrics article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .insight-grid { grid-template-columns: 1fr; }
  .insight-item { min-height: 140px; border-right: 0; border-bottom: 1px solid var(--line); }
  .intelligence-layout { grid-template-columns: 1fr; }
  .topology-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .topology-metrics article:nth-child(2) { border-right: 0; }
  .topology-metrics article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .energy-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .energy-monitor:nth-child(2n) { border-right: 0; }
  .energy-monitor:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}

@media (max-width: 700px) {
  .registry-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .registry-summary > span:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .network-map-layout { height: 680px; grid-template-columns: 1fr; grid-template-rows: 430px 250px; }
  .map-selection { border-top: 1px solid var(--line); border-left: 0; }
  .energy-overview { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .energy-overview span:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .login-shell { grid-template-columns: 1fr; }
  .login-brand { min-height: 180px; padding: 28px; justify-content: center; }
  .login-brand .brand-mark { margin-bottom: 12px; }
  .login-brand strong { font-size: 28px; }
  .login-panel { padding: 40px 0; }
  .app-shell { display: block; }
  .sidebar { position: fixed; z-index: 20; left: -244px; width: 236px; padding: 22px 14px; transition: left .2s; }
  .sidebar.open { left: 0; box-shadow: 20px 0 40px rgba(0,0,0,.18); }
  .brand { justify-content: flex-start; padding-inline: 8px; }
  .brand > div:last-child, .nav-item span, .nav-item b, .sidebar-status div { display: flex; }
  .nav-item { justify-content: flex-start; padding: 0 11px; }
  .sidebar-status { justify-content: flex-start; }
  .topbar { padding: 0 14px; }
  .menu-button { display: grid; }
  .tenant, .updated-at, .user-button span:not(.avatar) { display: none; }
  .content { padding: 20px 14px; }
  .metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .metric { min-height: 105px; padding: 14px; }
  .overview-grid { grid-template-columns: 1fr; }
  .service-grid { grid-template-columns: 1fr; }
  .toolbar { flex-direction: column; }
  .search, select { width: 100%; }
  th, td { padding-inline: 12px; }
  .dialog-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .intelligence-brief { grid-template-columns: 64px minmax(0,1fr); }
  .intelligence-brief > .secondary-button { grid-column: 1 / -1; width: fit-content; }
  .score-gauge { width: 60px; height: 60px; }
  .domain-grid { grid-template-columns: 1fr; }
  .domain-card { border-right: 0; }
  .role-legend { justify-content: flex-start; }
  .domain-band .section-heading { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 420px) {
  .metrics { grid-template-columns: 1fr; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .source-pill { align-self: flex-start; }
  .service-strip-grid { grid-template-columns: 1fr; }
  .service-strip-item { border-right: 0; border-bottom: 1px solid var(--line); }
  .service-strip-item:last-child { border-bottom: 0; }
  .section-heading { align-items: flex-start; flex-direction: column; padding-block: 15px; }
  .dialog-actions { flex-direction: column; }
  .intelligence-metrics { grid-template-columns: 1fr; }
  .intelligence-metrics article { border-right: 0; border-bottom: 1px solid var(--line); }
  .situation-item { grid-template-columns: 48px minmax(0,1fr); }
  .risk-score { width: 46px; height: 46px; }
  .confidence { grid-column: 2; align-items: flex-start; flex-direction: row; gap: 6px; }
  .topology-metrics { grid-template-columns: 1fr; }
  .topology-metrics article { border-right: 0; border-bottom: 1px solid var(--line); }
  .domain-facts { gap: 10px; }
  .energy-grid { grid-template-columns: 1fr; }
  .energy-monitor { border-right: 0; border-bottom: 1px solid var(--line); }
}
