:root{color-scheme:dark;--bg:#061019;--surface:#081722;--surface-solid:#091823;--raised:#0d2230;--line:#173844;--line-strong:#2b5966;--text:#e6f1f5;--secondary:#a4bac3;--muted:#718c97;--cyan:#55dff7;--green:#4de6a0;--amber:#ffc45c;--red:#ff6b68;--unknown:#78939e;--grid:rgba(76,180,204,.09);--shadow:rgba(0,0,0,.55)}
:root[data-theme="light"]{color-scheme:light;--bg:#edf4f5;--surface:#f8fbfb;--surface-solid:#fff;--raised:#e5f0f2;--line:#bdd2d8;--line-strong:#789ba5;--text:#10242c;--secondary:#3e5b65;--muted:#65818a;--cyan:#087d99;--green:#087d55;--amber:#a46500;--red:#b72d32;--unknown:#607982;--grid:rgba(22,94,112,.09);--shadow:rgba(34,68,77,.2)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:var(--bg);color:var(--text);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.app-shell{height:100dvh;min-height:480px;display:grid;grid-template-rows:auto minmax(0,1fr);background-color:var(--bg)}button,select{font:inherit}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.app-header{position:relative;z-index:30;min-height:64px;display:grid;grid-template-columns:minmax(170px,1fr) auto minmax(170px,1fr);align-items:center;gap:16px;padding:max(10px,env(safe-area-inset-top)) 16px 10px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 94%,transparent)}.brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none;width:max-content}.brand>span:last-child{display:grid}.brand strong{font-size:17px;line-height:1.1;letter-spacing:-.02em}.brand small{margin-top:3px;color:var(--muted);font-size:11px}.brand-globe{position:relative;width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--cyan);border-radius:50%;box-shadow:0 0 16px color-mix(in srgb,var(--cyan) 26%,transparent);overflow:hidden}.brand-globe::before,.brand-globe::after,.brand-globe i{content:"";position:absolute;border:1px solid color-mix(in srgb,var(--cyan) 72%,transparent);border-radius:50%}.brand-globe::before{inset:4px 9px}.brand-globe::after{inset:8px 3px}.brand-globe i{width:44px;height:12px;left:-7px;animation:orbit 5s linear infinite}@keyframes orbit{to{transform:rotate(360deg)}}
.zone-verdicts{display:grid;grid-template-columns:repeat(4,minmax(86px,1fr));align-self:stretch}.zone-button{position:relative;min-width:88px;display:grid;grid-template-columns:auto 1fr;grid-template-areas:"dot name" "dot state";align-content:center;column-gap:8px;padding:8px 13px;border:0;border-left:1px solid var(--line);background:transparent;color:var(--text);text-align:left;cursor:pointer}.zone-button:last-child{border-right:1px solid var(--line)}.zone-button:hover{background:color-mix(in srgb,var(--cyan) 5%,transparent)}.zone-button:focus-visible,.icon-button:focus-visible,.tool-button:focus-visible,select:focus-visible,.node-card:focus-visible,.external-node:focus-visible,.accessible-map button:focus-visible,.inspector button:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}.zone-button .status-dot{grid-area:dot;align-self:center}.zone-button strong{grid-area:name;font-size:12px;font-weight:650}.zone-button small{grid-area:state;color:var(--muted);font-size:10px;white-space:nowrap}.zone-button[data-state="healthy"] small{color:var(--green)}.zone-button[data-state="degraded"] small{color:var(--amber)}.zone-button[data-state="critical"] small{color:var(--red)}
.header-status{justify-self:end;display:flex;align-items:center;gap:8px}.stream-state{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}.stream-state i{width:7px;height:7px;border-radius:50%;background:var(--amber)}.stream-state.connected i{background:var(--green);box-shadow:0 0 9px var(--green)}.stream-state.disconnected i{background:var(--red)}.icon-button{width:40px;height:40px;border:1px solid var(--line);border-radius:5px;background:var(--surface);color:var(--secondary);cursor:pointer}.icon-button:hover,.tool-button:hover{border-color:var(--line-strong);color:var(--text)}
.map-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background-color:var(--bg);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:58px 58px}.map-stage::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--cyan) 6%,transparent),transparent 46%)}.map-toolbar{position:absolute;z-index:20;top:12px;left:12px;display:flex;gap:7px;padding:5px;border:1px solid var(--line);border-radius:7px;background:color-mix(in srgb,var(--surface-solid) 92%,transparent);box-shadow:0 12px 34px var(--shadow);backdrop-filter:blur(12px)}.map-toolbar select,.tool-button{height:40px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text);cursor:pointer}.map-toolbar select{min-width:112px;padding:0 32px 0 11px}.tool-button{padding:0 12px;color:var(--secondary)}.map-surface{position:absolute;inset:0;width:100%;height:100%}.map-surface[hidden]{display:none!important}.map-surface canvas{display:block}.status-banner{position:absolute;z-index:18;top:68px;left:50%;max-width:min(520px,calc(100% - 24px));transform:translateX(-50%);padding:9px 12px;border:1px solid color-mix(in srgb,var(--amber) 45%,var(--line));border-radius:5px;background:var(--surface-solid);color:var(--secondary);box-shadow:0 10px 30px var(--shadow)}
.center-state{position:absolute;z-index:15;inset:0;display:grid;place-content:center;justify-items:center;gap:9px;text-align:center;background:color-mix(in srgb,var(--bg) 88%,transparent)}.center-state[hidden]{display:none}.center-state span{color:var(--muted)}.center-state button,.auth-button{min-height:44px;padding:0 18px;border:1px solid var(--cyan);border-radius:5px;background:color-mix(in srgb,var(--cyan) 12%,var(--surface));color:var(--text);font-weight:650;cursor:pointer}.loader{width:24px;height:24px;border:2px solid var(--line);border-top-color:var(--cyan);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.node-card,.external-node,.relay-node{width:216px;min-height:84px;display:grid;gap:9px;padding:11px 12px;border:1px solid var(--line-strong);border-radius:5px;background:color-mix(in srgb,var(--surface-solid) 94%,transparent);color:var(--text);text-align:left;box-shadow:0 12px 28px var(--shadow);cursor:pointer}.node-card[data-relevant="false"]{opacity:.34}.node-head{display:grid;grid-template-columns:1fr auto;gap:8px}.node-name{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.node-location{display:block;margin-top:2px;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.node-reading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:8px;border-top:1px solid var(--line);color:var(--muted);font-size:10px}.node-reading b{color:var(--secondary);font:600 10px ui-monospace,SFMono-Regular,Menlo,monospace}.external-node,.relay-node{width:184px;min-height:66px;border:1px dashed var(--line-strong);border-radius:20px;background:color-mix(in srgb,var(--surface) 82%,transparent);box-shadow:none}.external-node .node-reading,.relay-node .node-reading{border-top:0;padding-top:0}.relay-node{border-style:double;border-color:var(--cyan);border-radius:8px;background:color-mix(in srgb,var(--cyan) 8%,var(--surface-solid));box-shadow:0 0 18px color-mix(in srgb,var(--cyan) 16%,transparent)}.status-dot{width:9px;height:9px;display:inline-block;border:1px solid var(--unknown);border-radius:50%}.status-dot.healthy{border-color:var(--green);background:var(--green);box-shadow:0 0 10px color-mix(in srgb,var(--green) 70%,transparent)}.status-dot.degraded{border-color:var(--amber);background:var(--amber);box-shadow:0 0 10px color-mix(in srgb,var(--amber) 65%,transparent)}.status-dot.critical{border-color:var(--red);background:var(--red);box-shadow:0 0 10px color-mix(in srgb,var(--red) 65%,transparent)}
.inspector{position:absolute;z-index:25;right:16px;top:74px;bottom:54px;width:min(360px,calc(100% - 32px));overflow:hidden;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface-solid);box-shadow:-16px 18px 54px var(--shadow);opacity:0;transform:translateX(calc(100% + 24px));pointer-events:none;transition:transform 180ms ease,opacity 120ms ease}.inspector.open{opacity:1;transform:none;pointer-events:auto}.inspector[data-pinned="false"]{top:auto;bottom:54px;width:288px;max-height:246px;transform:translateY(12px)}.inspector[data-pinned="false"].open{transform:none}.inspector[data-preview-side="left"]{left:16px;right:auto}.inspector[data-preview-side="right"]{left:auto;right:16px}.inspector>header{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;border-bottom:1px solid var(--line)}.inspector header small,.inspector-section h3{color:var(--muted);font-size:10px;font-weight:600}.inspector h2{margin:2px 0 0;font-size:17px}.inspector header button{width:40px;height:40px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--secondary);font-size:20px;cursor:pointer}.inspector-content,#inspector-content{height:calc(100% - 64px);overflow:auto;padding:0 13px 16px}.inspector-section{padding:12px 0;border-bottom:1px solid var(--line)}.inspector-section:last-child{border:0}.inspector-section h3{margin:0 0 8px}.inspector-grid{display:grid;grid-template-columns:104px 1fr;gap:7px 10px;margin:0;font-size:11px}.inspector-grid dt{color:var(--muted)}.inspector-grid dd{margin:0;color:var(--text);overflow-wrap:anywhere}.inspector[data-pinned="false"] .inspector-section:not(:first-child){display:none}.inspector[data-pinned="false"] #inspector-content{height:auto;max-height:170px;overflow:hidden}.sheet-grip{display:none}
.legend{position:absolute;z-index:12;right:15px;bottom:14px;display:flex;gap:16px;color:var(--muted);font-size:11px}.legend span{display:flex;align-items:center;gap:6px}.accessible-map{position:absolute;z-index:14;left:12px;bottom:10px;max-width:min(420px,calc(100% - 24px));border:1px solid var(--line);border-radius:5px;background:var(--surface-solid);color:var(--secondary)}.accessible-map summary{min-height:38px;display:flex;align-items:center;padding:0 12px;cursor:pointer;font-size:11px}.accessible-map>div{max-height:45dvh;overflow:auto;padding:0 8px 8px}.accessible-map section{padding:8px 4px;border-top:1px solid var(--line)}.accessible-map h3{margin:0 0 6px;color:var(--muted);font-size:10px}.accessible-map button{width:100%;min-height:40px;padding:7px 8px;border:0;border-radius:3px;background:transparent;color:var(--text);text-align:left;cursor:pointer}.accessible-map button:hover{background:var(--raised)}
.globe-marker{position:relative;min-width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--cyan);border-radius:50%;background:var(--surface-solid);color:var(--text);font-size:17px;box-shadow:0 0 16px color-mix(in srgb,var(--cyan) 30%,transparent);cursor:pointer;transform:translate(-50%,-50%)}.globe-marker b{position:absolute;right:-5px;top:-5px;min-width:20px;height:20px;display:grid;place-items:center;border-radius:10px;background:var(--cyan);color:#041016;font-size:10px}
.auth-page{min-height:100dvh;display:grid;place-items:center;padding:20px;background:var(--bg)}.auth-card{width:min(390px,100%);padding:30px;border:1px solid var(--line);border-radius:9px;background:var(--surface-solid);box-shadow:0 22px 70px var(--shadow)}.auth-globe{width:42px;height:42px}.auth-brand{margin:16px 0 3px;color:var(--cyan);font-weight:650}.auth-card h1{margin:0;font-size:28px;letter-spacing:-.035em}.auth-card>p:not(.auth-brand){color:var(--secondary)}.auth-button{width:100%;margin-top:10px}.auth-status{min-height:22px;margin-bottom:0!important;color:var(--amber)!important}.auth-status.success{color:var(--green)!important}
@media(max-width:900px){.app-header{grid-template-columns:auto 1fr auto}.brand small,.stream-state span{display:none}.zone-verdicts{justify-self:center}.zone-button{min-width:72px;padding-inline:9px}.map-toolbar{right:12px;overflow-x:auto}.tool-button{display:none}.legend{display:none}}
@media(max-width:620px){.app-header{min-height:112px;grid-template-columns:auto 1fr;grid-template-rows:auto auto;padding-inline:12px}.brand>span:last-child{display:none}.header-status{grid-column:2;grid-row:1}.zone-verdicts{grid-column:1/-1;grid-row:2;width:100%}.zone-button{min-width:0}.map-toolbar{top:8px;left:8px;right:8px;gap:5px}.map-toolbar label{flex:1;min-width:0}.map-toolbar select{width:100%;min-width:0;padding-left:8px;font-size:12px}.accessible-map{bottom:8px}.inspector,.inspector[data-pinned="false"]{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:min(72dvh,620px);transform:translateY(calc(100% + 16px));border-radius:10px}.inspector.open{transform:none}.inspector[data-pinned="false"] .inspector-section:not(:first-child){display:block}.inspector[data-pinned="false"] #inspector-content{height:calc(100% - 72px);max-height:none;overflow:auto}.sheet-grip{width:36px;height:4px;display:block;margin:7px auto -3px;border-radius:2px;background:var(--line-strong)}.inspector>header{min-height:68px}.status-banner{top:58px}.zone-button strong{font-size:11px}.zone-button small{font-size:9px}}
@media(max-width:390px){.zone-button{padding-inline:6px;column-gap:5px}.zone-button .status-dot{width:7px;height:7px}.map-toolbar select{font-size:11px}.accessible-map{max-width:210px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Readability and operational history */
body{font-size:15px}.app-header{min-height:70px;padding:max(11px,env(safe-area-inset-top)) 18px 11px}.brand strong{font-size:20px}.brand small,.stream-state{font-size:12px}.zone-button strong{font-size:13px}.zone-button small{font-size:11px}.map-toolbar select{min-width:124px;padding-inline:12px 34px;font-size:14px;font-weight:560}.tool-button{padding-inline:14px;font-size:14px}.node-name{font-size:14px}.node-location,.node-reading{font-size:11px}.node-reading b{font-size:11px}.node-technologies{display:flex;gap:6px;margin:-2px 0}.node-technologies img,.component-list img{padding:2px;border-radius:4px;background:#f3f7f8}.component-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.component-list li{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:28px}.component-list small{color:var(--muted);font-size:11px}.component-fallback{display:grid;place-items:center;color:var(--cyan)}
.component-list .proxy-component{display:block}.proxy-component-toggle{width:100%;padding:8px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer}.proxy-component-toggle:hover{border-color:var(--line-strong)}.proxy-component-toggle:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.proxy-component-details{padding:9px 8px 2px;font-size:11px}.proxy-component-details p{margin:0 0 9px;overflow-wrap:anywhere}.proxy-component-details a{color:var(--cyan)}.authorization-warning{color:var(--warning)}.proxy-checks,.proxy-evidence{display:grid;grid-template-columns:104px minmax(0,1fr);gap:6px 9px;margin:9px 0}.proxy-checks dt,.proxy-evidence dt{color:var(--muted)}.proxy-checks dd,.proxy-evidence dd{margin:0;overflow-wrap:anywhere}
.history-dock{position:absolute;z-index:22;left:12px;bottom:12px;width:min(720px,calc(100% - 24px));border:1px solid var(--line);border-radius:7px;background:color-mix(in srgb,var(--surface-solid) 96%,transparent);box-shadow:0 14px 42px var(--shadow);overflow:hidden}.history-dock>header button{width:100%;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 12px;border:0;background:transparent;color:var(--text);text-align:left;cursor:pointer}.history-dock>header span{display:flex;align-items:baseline;gap:12px;min-width:0}.history-dock>header strong{font-size:14px}.history-dock>header small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-dock>header i{font-style:normal;transition:transform 160ms ease}.history-dock[data-open="true"]>header i{transform:rotate(180deg)}.history-body{height:260px;padding:0 12px 10px;border-top:1px solid var(--line)}.history-controls{height:42px;display:flex;align-items:center;justify-content:space-between}.history-controls label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}.history-controls select,.history-controls button{min-height:32px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text);padding-inline:9px}.history-message{height:185px;display:grid;place-items:center;color:var(--muted);text-align:center}.history-message[hidden]{display:none}.history-message.error{color:var(--amber)}.history-content{height:185px;display:grid;grid-template-columns:minmax(0,2fr) minmax(210px,1fr);gap:12px}.history-content[hidden]{display:none}.history-chart{min-width:0;margin:0}.history-chart svg{display:block;width:100%;height:160px;overflow:visible}.history-chart figcaption{color:var(--muted);font-size:11px}.chart-grid{stroke:var(--line);stroke-width:1}.chart-label{fill:var(--muted);font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.chart-line{fill:none;stroke-width:2;vector-effect:non-scaling-stroke}.chart-line-0{stroke:var(--cyan)}.chart-line-1{stroke:var(--green)}.chart-line-2{stroke:var(--amber)}.chart-line-3{stroke:#b190ff}.chart-point{fill:var(--surface-solid);stroke-width:2}.chart-failure{stroke:var(--red);stroke-width:2.5;vector-effect:non-scaling-stroke}.event-log{min-width:0;overflow:hidden;border-left:1px solid var(--line);padding-left:12px}.event-log h3{margin:0 0 6px;color:var(--muted);font-size:11px}.event-log ol{height:158px;overflow:auto;margin:0;padding:0;list-style:none}.event-log li{display:grid;grid-template-columns:auto 1fr;gap:0 8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:11px}.event-log time{grid-row:1/3;color:var(--muted);font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.event-log strong{font-size:11px}.event-log span{color:var(--muted);overflow-wrap:anywhere}.event-log li[data-event="opened"] strong{color:var(--red)}.event-log li[data-event="resolved"] strong{color:var(--green)}.event-log .event-empty{display:block;color:var(--muted)}.history-summary{margin:5px 0 0;color:var(--secondary);font-size:11px}.legend{bottom:70px}.history-open .inspector{bottom:318px;max-height:calc(100% - 400px)}
@media(max-width:900px){.history-dock{width:min(620px,calc(100% - 24px))}}
@media(max-width:620px){body{font-size:14px}.app-header{min-height:118px}.brand strong{font-size:18px}.zone-button strong{font-size:12px}.zone-button small{font-size:10px}.map-toolbar select{font-size:13px}.history-dock{left:8px;right:8px;bottom:8px;width:auto}.history-body{height:min(52dvh,390px);overflow:auto}.history-content{height:auto;grid-template-columns:1fr}.history-chart svg{height:175px}.event-log{border-left:0;border-top:1px solid var(--line);padding:9px 0 0}.event-log ol{height:110px}.history-open .inspector{bottom:8px;max-height:min(72dvh,620px)}.history-dock>header span{gap:8px}.history-dock>header small{max-width:58vw}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.chart-event{stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}.chart-event.opened{stroke:var(--red)}.chart-event.resolved{stroke:var(--green)}
.accessible-map{bottom:70px}.history-open .accessible-map{bottom:318px}@media(max-width:620px){.history-open .accessible-map{display:none}}
.edge-evidence-legend{position:absolute;z-index:12;top:12px;left:12px;display:flex;flex-wrap:wrap;gap:7px 13px;max-width:min(680px,calc(100% - 24px));padding:7px 9px;border:1px solid var(--line);border-radius:5px;background:color-mix(in srgb,var(--surface-solid) 90%,transparent);color:var(--muted);font-size:11px;pointer-events:none}.edge-evidence-item{display:flex;align-items:center;gap:6px}.edge-evidence-line{width:24px;height:0;border-top-width:2px;border-top-color:var(--secondary)}.edge-evidence-line.solid{border-top-style:solid}.edge-evidence-line.dashed{border-top-style:dashed}.edge-evidence-line.dotted{border-top-style:dotted}
@media(max-width:620px){.edge-evidence-legend{top:64px;left:8px;right:8px;max-width:none;gap:4px 10px;padding:5px 7px;font-size:9px}.edge-evidence-line{width:18px}}
:root[data-theme="light"]{--muted:#5b7882}.icon-button,.map-toolbar select,.tool-button,.inspector header button,.accessible-map summary,.accessible-map button,.globe-marker,.history-controls select,.history-controls button{min-width:44px;min-height:44px}.icon-button,.inspector header button{width:44px;height:44px}.globe-marker{height:44px}.series-legend{display:flex;flex-wrap:wrap;gap:4px 12px;margin:3px 0 0;padding:0;list-style:none;color:var(--muted);font-size:10px}.series-legend li{display:flex;align-items:center;gap:5px;min-width:0}.series-legend span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.series-shape{width:18px;height:0;border-top:2px solid var(--cyan)}.series-shape-1{border-top-color:var(--green);border-top-style:dashed}.series-shape-2{border-top-color:var(--amber);border-top-style:dotted}.series-shape-3{border-top-color:#b190ff;border-top:3px double #b190ff}.chart-line-1{stroke-dasharray:8 4}.chart-line-2{stroke-dasharray:2 4}.chart-line-3{stroke-dasharray:10 3 2 3}.history-chart svg{height:146px}
@media(max-width:620px){.app-header{min-height:158px;grid-template-rows:auto auto}.zone-verdicts{grid-template-columns:repeat(2,minmax(0,1fr))}.zone-button:nth-child(3){border-top:1px solid var(--line)}.zone-button:nth-child(4){border-top:1px solid var(--line)}.map-toolbar select{min-height:44px}.history-chart svg{height:160px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.zone-verdicts{min-width:0}.zone-button{min-width:0;grid-template-columns:auto minmax(0,1fr)}.zone-button strong,.zone-button small{min-width:0;white-space:normal;overflow-wrap:anywhere}
.relay-node:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}

/* Compact five-level topology and explicit actions */
.header-menu{position:relative}.header-menu>summary{display:grid;place-items:center;list-style:none;letter-spacing:2px}.header-menu>summary::-webkit-details-marker{display:none}
.header-menu-panel{position:absolute;right:0;top:calc(100% + 8px);width:190px;padding:9px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface-solid);box-shadow:0 16px 42px var(--shadow)}
.header-menu-panel fieldset{display:grid;gap:3px;margin:0 0 7px;padding:0 0 8px;border:0;border-bottom:1px solid var(--line)}.header-menu-panel legend{padding:0 0 5px;color:var(--muted);font-size:11px}
.header-menu-panel label,.header-menu-panel a,.header-menu-panel button{width:100%;min-height:36px;display:flex;align-items:center;gap:8px;padding:6px 8px;border:0;border-radius:4px;background:transparent;color:var(--text);text-align:left;text-decoration:none;cursor:pointer}.header-menu-panel label:hover,.header-menu-panel a:hover,.header-menu-panel button:hover{background:var(--raised)}.tool-button:disabled{opacity:.42;cursor:not-allowed}
.node-card,.relay-node{width:206px;min-height:76px;gap:6px;padding:9px 10px}.node-card .node-name,.relay-node .node-name{font-size:14px;line-height:1.25}.node-card .node-location,.relay-node .node-location,.node-card .node-reading,.relay-node .node-reading{font-size:12px;line-height:1.25}.node-card .node-reading b,.relay-node .node-reading b{font-size:12px}
.node-service{width:188px;min-height:52px;border-style:dashed;border-radius:6px;box-shadow:none}.node-zone{width:176px;min-height:64px;border-style:dashed;border-radius:14px;background:color-mix(in srgb,var(--surface) 84%,transparent);box-shadow:none}.node-infrastructure,.relay-node{width:182px;min-height:72px;border-radius:6px}.node-device{width:188px;min-height:72px}.node-card,.relay-node{padding:5px 8px;gap:3px}.node-card .node-reading,.relay-node .node-reading{display:flex;min-width:0;padding-top:0;border-top:0;gap:6px;white-space:nowrap}.node-state{min-width:0;overflow:hidden;text-overflow:ellipsis}.node-provider{border-style:double}.node-type-icon{display:inline-block;width:18px;color:var(--cyan);text-align:center}.node-name{display:flex!important;align-items:center;gap:4px}.node-name>span:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis}.node-name img{flex:none;width:14px;height:14px;padding:1px;border-radius:3px;background:#f3f7f8}.node-card[data-relevant="false"],.relay-node[data-relevant="false"]{opacity:1;border-color:var(--line);background:color-mix(in srgb,var(--surface) 68%,transparent)}
.node-head{min-width:0;grid-template-columns:minmax(0,1fr) auto;overflow:hidden}.node-copy{min-width:0;overflow:hidden}.node-name{min-width:0;max-width:100%;align-items:flex-start}.node-name>span:nth-child(2){display:-webkit-box;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;line-height:1.15}.node-location{display:flex!important;align-items:center;gap:4px}.node-location>span{min-width:0;overflow:hidden;text-overflow:ellipsis}.node-location img{flex:none;width:14px;height:14px;padding:1px;border-radius:3px;background:#f3f7f8}.node-state{flex:none;overflow:visible;text-overflow:clip}.node-age,.node-reading b{flex:none}.node-service{width:224px;height:52px;min-height:52px;overflow:hidden}.node-service .node-name>span:nth-child(2){display:block;white-space:nowrap;-webkit-line-clamp:1;line-clamp:1}.node-provider{display:grid;width:150px;height:30px;min-height:30px;max-height:30px;padding:4px 7px;border-radius:15px;overflow:hidden}.node-provider .node-head{align-items:center}.node-provider .node-copy{display:flex;align-items:center}.node-provider .node-name{align-items:center;white-space:nowrap}.node-provider .node-name>span:nth-child(2){display:block;white-space:nowrap;-webkit-line-clamp:1}.node-provider .node-location,.node-provider .node-reading{display:none!important}.node-provider .node-type-icon{width:14px}.node-provider .status-dot{width:8px;height:8px}
.node-infrastructure,.relay-node{height:80px;min-height:80px;overflow:hidden}
.grafana-links{display:flex;flex-wrap:wrap;gap:7px}.grafana-links a,.grafana-overview{min-height:34px;display:inline-flex;align-items:center;padding:5px 9px;border:1px solid var(--line);border-radius:4px;color:var(--cyan);text-decoration:none}.grafana-links a:hover,.grafana-overview:hover{border-color:var(--cyan);background:color-mix(in srgb,var(--cyan) 8%,transparent)}
.history-controls{height:50px;gap:8px;justify-content:flex-start}.history-controls label{gap:5px}.history-controls input{min-height:34px;width:180px;padding:0 9px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text)}.history-controls .grafana-overview{margin-left:auto;white-space:nowrap}.history-content.event-log{height:158px;display:block;overflow:hidden;border:0;padding:0}.history-content.event-log[hidden]{display:none}.history-content.event-log h3{margin:0 0 4px}.history-content.event-log ol{height:135px}.history-content.event-log li{grid-template-columns:112px minmax(130px,180px) 1fr;align-items:center}.history-content.event-log time{grid-row:auto}
.mobile-topology,.mobile-map-toggle{display:none}
.globe-anchor{position:relative;width:1px;height:1px;overflow:visible;pointer-events:none}.globe-leader{position:absolute;overflow:visible;pointer-events:none}.globe-leader line{stroke:var(--line-strong);stroke-width:1.5;vector-effect:non-scaling-stroke}.globe-marker{position:absolute;left:var(--marker-x,0);top:var(--marker-y,0);width:max-content;max-width:148px;min-width:44px;height:44px;display:flex;align-items:center;gap:6px;padding:0 9px;transform:translate(-50%,-50%);pointer-events:auto}.globe-marker-flag{flex:none;font-size:17px}.globe-marker-label{overflow:hidden;color:var(--text);font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.globe-local-links{position:absolute;inset:0;overflow:visible;pointer-events:none}.globe-local-links path{fill:none;stroke:var(--unknown);stroke-width:2;pointer-events:stroke;cursor:pointer}.globe-local-link[data-state="healthy"]{stroke:var(--green)}.globe-local-link[data-state="degraded"]{stroke:var(--amber)}.globe-local-link[data-state="critical"]{stroke:var(--red)}.globe-local-link:focus-visible{stroke-width:4;filter:drop-shadow(0 0 4px var(--cyan))}
@media(max-width:620px){#graph-view[data-mobile-mode="list"]{overflow:auto;padding:112px 8px 86px}#graph-view[data-mobile-mode="list"]>:not(.mobile-topology):not(.mobile-map-toggle){display:none!important}#graph-view[data-mobile-mode="graph"]{overflow:hidden;padding:0}#graph-view[data-mobile-mode="graph"]>.mobile-topology{display:none}.mobile-map-toggle{position:fixed;z-index:19;top:calc(158px + 62px);left:12px;display:flex;padding:3px;border:1px solid var(--line);border-radius:6px;background:var(--surface-solid)}.mobile-map-toggle button{min-height:36px;padding:0 10px;border:0;border-radius:4px;background:transparent;color:var(--secondary)}.mobile-map-toggle button[aria-pressed="true"]{background:var(--raised);color:var(--text)}.mobile-topology{position:relative;display:grid;gap:12px;width:100%;padding-bottom:20px}.mobile-topology section{display:grid;gap:6px;padding:10px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb,var(--surface-solid) 94%,transparent)}.mobile-topology h3{margin:0 0 3px;color:var(--secondary);font-size:12px}.mobile-topology .mobile-node{width:100%;min-height:58px;display:grid;border-radius:5px}.history-controls{height:auto;min-height:50px;flex-wrap:wrap;padding-block:7px}.history-controls label>span:not(.visually-hidden){display:none}.history-controls input{width:min(180px,46vw)}.history-controls .grafana-overview{margin-left:0}.history-content.event-log li{grid-template-columns:94px 1fr}.history-content.event-log li span{grid-column:1/-1}}
@media(max-width:620px){.brand>span:last-child{display:grid}.brand small{display:none}.map-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:visible}.map-toolbar label{width:100%}.map-toolbar label:nth-child(1){grid-column:1;grid-row:1}.map-toolbar label:nth-child(3){grid-column:2;grid-row:1}#route-control{grid-column:1/-1;grid-row:2}.map-toolbar select{width:100%}#graph-view[data-mobile-mode="list"]{padding-top:164px}.mobile-map-toggle{position:absolute;top:112px;left:12px}}

/* Closed controls drawer keeps the topology as the primary workspace. */
.app-header{min-height:58px;padding:max(7px,env(safe-area-inset-top)) 14px 7px}.brand strong{font-size:18px}.zone-button{padding-block:5px}.zone-button strong{font-size:12px}.zone-button small{font-size:10px}.header-status{gap:6px}.status-banner{top:12px}
.control-drawer{position:absolute;z-index:27;top:12px;right:12px;bottom:12px;width:min(390px,calc(100% - 24px));display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface-solid);box-shadow:-18px 20px 54px var(--shadow);opacity:0;transform:translateX(calc(100% + 24px));pointer-events:none;transition:transform 180ms ease,opacity 120ms ease}.control-drawer.open{opacity:1;transform:none;pointer-events:auto}.drawer-header{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line)}.drawer-header small,.drawer-section>h3{color:var(--muted);font-size:10px;font-weight:600}.drawer-header h2{margin:1px 0 0;font-size:17px}.drawer-header button{width:44px;height:44px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--secondary);font-size:20px;cursor:pointer}.drawer-content{min-height:0;overflow:auto;padding:0 12px 14px}.drawer-section{padding:12px 0;border-bottom:1px solid var(--line)}.drawer-section>h3{margin:0 0 9px;text-transform:uppercase;letter-spacing:.04em}
.control-drawer .map-toolbar{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}.control-drawer .map-toolbar label{min-width:0;display:grid;gap:4px;color:var(--muted);font-size:11px}.control-drawer .map-toolbar select{width:100%;min-width:0;min-height:44px;height:44px;padding-inline:9px 28px;font-size:13px}.control-drawer #route-control{grid-column:1/-1}.control-drawer .map-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.control-drawer .tool-button{min-width:0;min-height:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-size:12px}
.local-browser>label{display:block;margin-bottom:5px;color:var(--muted);font-size:11px}.browser-alias-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.browser-alias-row input,.browser-alias-row button{min-width:0;min-height:44px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text);font:inherit}.browser-alias-row input{padding:0 9px}.browser-alias-row button{padding:0 11px;cursor:pointer}.browser-alias-row button:disabled{opacity:.55;cursor:wait}.local-browser p{margin:8px 0 0;color:var(--secondary);font-size:11px;line-height:1.45}
.control-drawer .history-dock{position:static;width:100%;margin:12px 0 0;border-radius:6px;box-shadow:none;background:var(--surface);overflow:hidden}.control-drawer .history-body{height:auto;padding-bottom:10px}.control-drawer .history-controls{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:9px 0}.control-drawer .history-controls label{min-width:0;display:grid;gap:4px}.control-drawer .history-controls select,.control-drawer .history-controls input{width:100%;min-width:0;min-height:44px}.control-drawer .incident-search{grid-column:1/-1}.control-drawer .history-controls .grafana-overview{margin:0}.control-drawer .history-message{height:130px}.control-drawer .history-content.event-log{height:220px}.control-drawer .history-content.event-log ol{height:195px}.control-drawer .history-content.event-log li{grid-template-columns:96px 1fr}.control-drawer .history-content.event-log li span{grid-column:1/-1}.control-drawer .history-summary{padding-bottom:4px}.drawer-open .accessible-map{max-width:min(320px,calc(100% - 24px))}.mobile-map-toggle button{min-width:44px;min-height:44px}
@media(max-width:900px){.brand small,.stream-state span{display:none}.control-drawer .tool-button{display:inline-flex}}
@media(max-width:620px){.app-header{min-height:92px;grid-template-columns:auto 1fr;grid-template-rows:44px 40px;padding:4px 8px}.brand>span:last-child{display:grid}.header-status{grid-column:2;grid-row:1}.zone-verdicts{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.zone-button{min-height:44px;padding:3px 6px;column-gap:5px}.zone-button strong{font-size:10px}.zone-button small{display:none}.control-drawer{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:min(78dvh,650px);border-radius:12px;transform:translateY(calc(100% + 16px))}.control-drawer.open{transform:none}.control-drawer>.sheet-grip{width:36px;height:4px;display:block;position:absolute;z-index:1;top:7px;left:50%;margin:0;transform:translateX(-50%)}.drawer-header{padding-top:13px}.drawer-content{padding-inline:10px}.control-drawer .map-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.control-drawer .history-controls{grid-template-columns:1fr}.control-drawer .incident-search{grid-column:auto}.control-drawer .history-controls label>span:not(.visually-hidden){display:block}.control-drawer .history-controls input{width:100%}.mobile-map-toggle{position:absolute;top:12px;left:8px}#graph-view[data-mobile-mode="list"]{padding:62px 8px 72px}.accessible-map{max-width:210px}.drawer-open .accessible-map{display:none}}
