
:root{color-scheme:dark;--bg:#101417;--surface:#171c20;--raised:#1d2429;--hover:#252e34;--line:#303b43;--ink:#eef3f5;--muted:#a1afb7;--faint:#91a0a9;--accent:#66d7be;--accent-bg:#1a3833;--warn:#e9be78;--warn-bg:#3a3021;--red:#f09996;--red-bg:#3c292b;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--sans:-apple-system,BlinkMacSystemFont,"IBM Plex Sans","PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:13px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button,input,select{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{transition:background 150ms,color 150ms,border-color 150ms}a{color:var(--accent)}button,input,select{border:1px solid var(--line);border-radius:6px;background:var(--surface)}button{min-height:36px;padding:8px 12px}button:hover:not(:disabled){background:var(--hover)}h1,h2,h3,p{margin:0}h1{font-weight:570;font-size:26px;letter-spacing:-.6px}h2{font-weight:600;font-size:15px}h3{font-size:13px;font-weight:600}small{font-size:12px}svg{display:block}button svg{width:16px;height:16px}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}.muted{color:var(--muted)}.eyebrow{text-transform:uppercase;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;color:var(--muted)}.green{color:var(--accent)}.amber{color:var(--warn)}.red{color:var(--red)}.dot{width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block;flex-shrink:0}.badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;line-height:19px;padding:1px 7px;border-radius:4px;white-space:nowrap}.badge.good{color:var(--accent);background:var(--accent-bg)}.badge.warn{color:var(--warn);background:var(--warn-bg)}.badge.unknown{color:var(--red);background:var(--red-bg)}.badge.neutral{color:var(--muted);background:var(--raised)}.flex{display:flex;align-items:center;gap:8px}.spread{justify-content:space-between}.app{display:grid;grid-template-columns:66px minmax(0,1fr);min-height:100dvh}.rail{border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column;gap:14px;padding:20px 10px;position:sticky;top:0;height:100dvh}.brand{font-family:var(--mono);font-weight:700;color:var(--accent);font-size:24px;padding-bottom:18px}.rail a{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:7px;color:var(--muted);text-decoration:none}.rail a.active{background:var(--accent-bg);color:var(--accent)}.rail a:hover{background:var(--raised)}.rail svg{width:20px;height:20px}.rail .version{writing-mode:vertical-rl;font-size:10px;letter-spacing:2px;font-family:var(--mono);color:var(--muted);margin-top:auto}.workspace{min-width:0}.topbar{height:62px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.breadcrumb{font-size:12px;letter-spacing:.2px}.slash{color:var(--faint);margin:0 10px}.demo{font-size:11px;color:var(--warn);background:var(--warn-bg);padding:5px 9px;border:1px solid #695237;border-radius:4px}.topright{display:flex;align-items:center;gap:17px}.clock{font-size:12px;color:var(--muted)}.avatar{background:var(--raised);border:1px solid var(--line);width:28px;height:28px;display:grid;place-items:center;border-radius:50%;font-family:var(--mono);font-size:11px}.main{padding:25px 30px 20px;max-width:1980px;margin:auto}.titlebar{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px;gap:18px}.subtitle{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.6}.titlebar .actions{display:flex;gap:8px;align-items:center}.primary{background:var(--accent);color:#122720;border-color:var(--accent);font-weight:650}.primary:hover:not(:disabled){background:#88e3cf;color:#122720}.action-icon{display:inline-flex;gap:8px;align-items:center}.summary{display:grid;grid-template-columns:1.04fr 1fr 1fr 1.14fr;gap:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);margin-bottom:18px;overflow:hidden}.metric{padding:17px 20px;border-right:1px solid var(--line)}.metric:last-child{border-right:0}.metric-label{color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:8px}.metric-value{display:flex;align-items:baseline;gap:8px;margin-top:10px;font-family:var(--mono);font-size:27px;letter-spacing:-.8px}.metric-value .unit{font-size:13px;color:var(--muted);letter-spacing:0}.metric-sub{margin-top:8px;color:var(--muted);font-size:11px;line-height:1.45}.control-strip{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;border-bottom:1px solid var(--line);padding:0 0 16px;margin:0 0 22px;font-size:12px}.control-strip .control-item{display:flex;gap:7px;align-items:center}.control-strip .sep{width:1px;height:15px;background:var(--line)}.control-strip .revision{margin-left:auto;color:var(--muted);font-size:11px}.data-banner{border:1px solid #71593a;background:#302a20;color:var(--warn);padding:12px 15px;border-radius:6px;margin:0 0 16px;font-size:12px;line-height:1.6}.hidden{display:none!important}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 332px;gap:18px;align-items:start}.panel{border:1px solid var(--line);border-radius:8px;background:var(--surface);min-width:0;overflow:hidden}.panel-header{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.panel-title{display:flex;align-items:center;gap:9px}.count{color:var(--muted);font-family:var(--mono);font-size:12px;background:var(--raised);padding:2px 7px;border-radius:4px}.tiny-note{color:var(--muted);font-size:11px;line-height:1.5}.tools{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line)}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tabs button{font-size:11px;min-height:31px;padding:5px 10px;border:0;background:transparent;color:var(--muted)}.tabs button.active{color:var(--ink);background:var(--hover)}.search{position:relative;max-width:180px;min-width:130px}.search input{width:100%;padding:7px 9px 7px 29px;font-size:11px;min-height:32px}.search svg{position:absolute;width:13px;height:13px;left:9px;top:10px;color:var(--muted)}.table-wrap{max-height:535px;overflow:auto;scrollbar-width:thin;scrollbar-color:#405059 transparent}table{border-collapse:collapse;width:100%;table-layout:fixed;font-size:12px}thead{position:sticky;top:0;z-index:2;background:#1b2227}th{padding:0 10px;text-align:right;height:38px;font-weight:400;color:var(--muted);border-bottom:1px solid var(--line);font-size:10px}th:first-child{text-align:left;padding-left:18px}th:last-child{text-align:left}th button{padding:0;border:0;min-height:32px;font-size:10px;background:none;color:inherit;text-align:inherit;width:100%}th button:hover{color:var(--ink);background:none!important}td{padding:9px 10px;border-bottom:1px solid #293238;text-align:right;font-family:var(--mono);height:50px;white-space:nowrap}td:first-child{text-align:left;padding-left:18px;font-family:var(--sans)}td:last-child{text-align:left}tbody tr{transition:background 140ms}tbody tr:hover{background:#202a30}tbody tr.selected{background:#1d302d}tbody tr.selected td:first-child{box-shadow:inset 2px 0 var(--accent)}.symbol-btn{border:0;padding:0;background:none;text-align:left;min-height:30px;display:flex;align-items:center;gap:8px;width:100%}.symbol-btn:hover{background:none!important}.symbol{font-weight:650;font-size:12px;letter-spacing:.1px}.route{display:block;margin-top:4px;color:var(--muted);font-family:var(--mono);font-size:10px}.dex-mark{font-family:var(--mono);font-size:9px;padding:2px 4px;border-radius:3px;background:var(--raised);color:var(--muted)}.tiny-sub{display:block;color:var(--muted);font-size:10px;margin-top:4px}.reason{font-family:var(--sans);font-size:11px;white-space:normal;line-height:1.45}.bar{height:2px;width:30px;background:var(--line);display:inline-block;vertical-align:middle;margin-left:5px}.bar i{display:block;height:100%;background:var(--accent);max-width:100%}.panel-footer{display:flex;align-items:center;justify-content:space-between;padding:11px 17px;gap:8px;color:var(--muted);font-size:10px;line-height:1.5}.sidebar{display:flex;flex-direction:column;gap:16px}.detail-top{padding:18px}.selected-line{display:flex;justify-content:space-between;align-items:center;margin:9px 0 7px}.selected-line strong{font-family:var(--mono);font-size:24px;font-weight:550}.detail-route{font-family:var(--mono);font-size:10px;color:var(--muted);overflow-wrap:anywhere}.detail-values{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.detail-values .label{color:var(--muted);font-size:10px}.detail-values .value{font-family:var(--mono);font-size:21px;margin:6px 0}.detail-values .target{font-size:10px;color:var(--muted)}.chart{margin-top:16px;height:68px;width:100%}.chart svg{width:100%;height:100%;overflow:visible}.chart-scale{display:flex;justify-content:space-between;color:var(--muted);font-family:var(--mono);font-size:9px;margin-top:3px}.detail-section{border-top:1px solid var(--line);padding:16px 18px}.section-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;font-size:12px}.gate{display:grid;grid-template-columns:16px 1fr auto;gap:7px;align-items:start;font-size:11px;line-height:1.45;position:relative;margin-bottom:13px}.gate:last-child{margin:0}.gate-icon{width:15px;height:15px;display:grid;place-items:center;border:1px solid #3f7769;border-radius:50%;color:var(--accent);font-size:10px;background:#1b322d}.gate-icon.wait{border-color:#816844;color:var(--warn);background:#332c21}.gate-icon.off{border-color:var(--line);color:var(--muted);background:var(--raised)}.gate-name{color:var(--muted)}.gate-value{color:var(--ink);font-family:var(--mono);font-size:10px;text-align:right}.gate-note{font-size:10px;color:var(--muted);line-height:1.65;padding:9px 11px;background:var(--raised);border-radius:5px;margin-top:14px}.keyvals{display:grid;grid-template-columns:1fr auto;gap:11px;font-size:11px}.keyvals dt{color:var(--muted)}.keyvals dd{margin:0;font-family:var(--mono);text-align:right}.feed-row{display:grid;grid-template-columns:12px 1fr auto;gap:7px;align-items:center;font-size:11px;margin:12px 0}.feed-row:last-child{margin-bottom:0}.feed-row .time{font-family:var(--mono);color:var(--muted);font-size:10px}.events{margin-top:18px}.event-row{display:grid;grid-template-columns:82px 67px 1fr 95px;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line);font-size:11px;line-height:1.5}.event-row:last-child{border-bottom:0}.event-time{color:var(--muted);font-family:var(--mono);font-size:10px}.event-id{font-family:var(--mono);color:var(--muted);font-size:10px;text-align:right}.event-text{color:#c1ccd1}.bottom-note{display:flex;justify-content:space-between;gap:14px;color:var(--muted);font-size:10px;margin-top:18px;line-height:1.65}.bottom-note span{max-width:720px}.empty{padding:55px 15px;text-align:center;color:var(--muted)}.offline .spread-value{color:var(--muted)!important}.offline tbody tr.selected{background:#252a2e}.offline .bar i{background:var(--muted)}.offline .chart polyline{stroke:var(--muted)}.no-data{color:var(--muted)}dialog{border:1px solid #4b5963;border-radius:10px;padding:0;background:var(--surface);color:var(--ink);width:min(520px,calc(100vw - 30px));max-height:calc(100dvh - 40px);box-shadow:0 24px 70px #0008}dialog::backdrop{background:#000a}dialog .dialog-head{padding:22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:18px}.close-button{border:0;min-height:32px;padding:4px 9px;font-size:20px;color:var(--muted);background:none}.dialog-content{padding:20px 22px}.dialog-intro{color:var(--muted);font-size:12px;line-height:1.7;margin-bottom:20px}.form-row{padding:15px 0;border-top:1px solid var(--line);display:flex;gap:15px;justify-content:space-between}.form-title{font-size:13px;font-weight:600;display:block;margin-bottom:6px}.form-help{color:var(--muted);font-size:11px;line-height:1.7;max-width:350px}.form-row input[type=checkbox]{width:19px;height:19px;accent-color:var(--accent);margin:2px 0;flex-shrink:0}.thresholds{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.thresholds label{font-size:12px;display:block}.input-unit{position:relative;margin-top:9px}.input-unit input{width:100%;padding:11px 45px 11px 12px;font-family:var(--mono);font-size:16px}.input-unit span{position:absolute;right:12px;top:13px;color:var(--muted);font-size:12px}.thresholds .form-help{margin-top:6px}.form-warning{font-size:11px;line-height:1.7;color:var(--warn);border:1px solid #675237;background:var(--warn-bg);padding:11px;border-radius:5px}.scenario{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;margin-top:16px}.scenario select{padding:7px}.dialog-foot{padding:16px 22px;background:#141a1e;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}.dialog-foot .tiny-note{max-width:235px}.review-summary{background:var(--raised);padding:15px;border:1px solid var(--line);border-radius:6px;margin:15px 0}.review-summary .keyvals{font-size:12px;line-height:1.6}.progress{border:1px solid var(--line);padding:15px;border-radius:6px;line-height:1.9;font-size:12px;margin-top:15px}.progress .mono{font-size:10px;color:var(--muted)}#formError{color:var(--red);font-size:12px;line-height:1.6;margin:12px 0}.skip{position:absolute;left:80px;top:-100px;background:var(--accent);color:#122720;padding:10px;z-index:10}.skip:focus{top:10px}
@media(min-width:1650px){.content-grid{grid-template-columns:minmax(0,1fr) 360px}.table-wrap{max-height:630px}.metric{padding:21px 24px}td{height:52px}}
@media(max-width:1200px){.main{padding:22px 20px}.topbar{padding:0 20px}.content-grid{grid-template-columns:minmax(0,1fr) 300px;gap:14px}.optional-col{display:none}.metric{padding:15px}.clock{display:none}.titlebar{align-items:flex-start}.panel-header{padding:15px}.tools{padding:10px}.search{max-width:150px}.control-strip .revision{display:none}.chart{height:55px}.detail-top,.detail-section{padding:15px}.bar{display:none}}
@media(max-width:1000px){.content-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr;align-items:start}.table-wrap{max-height:520px}.optional-col{display:table-cell}.summary{grid-template-columns:1fr 1fr}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid var(--line)}.titlebar .actions .secondary-label{display:none}.bottom-note{flex-direction:column;gap:5px}}
@media(max-width:650px){html,body{font-size:14px}.app{grid-template-columns:1fr}.rail{display:none}.topbar{height:auto;min-height:61px;padding:12px 16px;gap:8px;flex-wrap:wrap}.breadcrumb{font-size:11px}.topright{gap:8px}.avatar{display:none}.demo{font-size:10px}.main{padding:20px 12px}.titlebar{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:18px}h1{font-size:25px}.subtitle{font-size:11px}.titlebar .actions{width:100%;justify-content:space-between}.titlebar .actions .secondary-label{display:inline}.titlebar button{min-height:42px}.summary{margin-bottom:15px}.metric{padding:14px}.metric-value{font-size:24px}.metric-label{font-size:11px}.metric-sub{font-size:10px}.control-strip{gap:10px 13px;font-size:11px;line-height:1.7;margin-bottom:18px}.control-strip .sep{display:none}.panel-header{padding:14px 12px}.panel-title h2{font-size:14px}.tools{flex-direction:column;align-items:stretch;gap:7px}.tabs{justify-content:space-between;gap:0}.tabs button{font-size:11px;min-height:36px}.search{max-width:none}.search input{min-height:38px;font-size:14px}.search svg{top:12px}.table-wrap{max-height:470px}.optional-col,.tablet-col{display:none!important}th,td{padding-right:7px;padding-left:7px}th:first-child,td:first-child{padding-left:12px}th{font-size:9px}th button{font-size:9px}td{font-size:11px;height:56px}.reason{font-size:10px}.symbol{font-size:11px}.route{font-size:9px}.symbol-btn{gap:4px}.dex-mark{font-size:8px}.panel-footer{font-size:9px;padding:10px 12px;align-items:flex-start}.panel-footer .optional-note{display:none}.sidebar{grid-template-columns:1fr}.detail-top,.detail-section{padding:18px}.detail-values .value{font-size:24px}.chart{height:70px}.events{margin-top:14px}.event-row{grid-template-columns:62px 1fr;gap:5px 10px;padding:12px}.event-row .event-text{grid-column:2}.event-id{display:none}.event-row .badge{justify-self:start}.bottom-note{font-size:9px}.dialog-content{padding:18px}.dialog-foot{padding:15px 18px}.thresholds{gap:12px}.thresholds input{font-size:16px}.dialog-foot .tiny-note{font-size:10px;max-width:170px}.form-help{font-size:11px}.form-row{gap:13px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}


/* Concept 02 — ORBITAL. Self-contained, no remote assets. */
:root{
  --bg:#030911;--surface:#071522;--raised:#0d2233;--hover:#103148;
  --line:#244759;--ink:#e8f5fc;--muted:#a0bbcb;--faint:#8aa7ba;
  --accent:#64e6ff;--accent-bg:#0c3446;--warn:#ffc680;--warn-bg:#362819;
  --red:#ff9baf;--red-bg:#37202c;
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(ellipse at 74% 0%,#0b456055 0,transparent 42%),
    radial-gradient(ellipse at 2% 55%,#08243744 0,transparent 38%),
    linear-gradient(#173d501c 1px,transparent 1px),
    linear-gradient(90deg,#173d501c 1px,transparent 1px),var(--bg);
  background-size:auto,auto,44px 44px,44px 44px,auto;
}
.app{grid-template-columns:76px minmax(0,1fr)}
.rail{padding:25px 10px;background:#04101bea;border-color:#24495d;gap:20px}
.rail::after{content:"";position:absolute;right:-1px;top:105px;width:1px;height:160px;background:linear-gradient(transparent,var(--accent),transparent);box-shadow:0 0 12px #42dfff88}
.brand{padding:0 0 23px;font-size:25px;letter-spacing:-4px;position:relative}
.brand::after{content:"ORB";display:block;font-size:8px;letter-spacing:4px;color:var(--muted);margin-top:8px}
.rail a{border:1px solid transparent;border-radius:0;position:relative;width:44px;height:44px}
.rail a.active{border-color:#4694af;background:#0d344766;box-shadow:inset 0 0 18px #4ce2ff12}
.rail a.active::after{content:"";position:absolute;left:-11px;top:11px;width:3px;height:20px;background:var(--accent);box-shadow:0 0 14px #64e6ff99}
.rail .version{letter-spacing:2.5px;color:#98bacc;font-size:9px}
.topbar{height:68px;background:#06101bc9;border-bottom:1px solid #254c60;padding:0 30px;position:relative}
.topbar::after{content:"";position:absolute;bottom:-1px;left:30px;width:105px;height:2px;background:var(--accent);box-shadow:0 0 12px #64e6ff88}
.breadcrumb{font-family:var(--mono);letter-spacing:1px;font-size:11px}
.breadcrumb strong{font-size:16px;letter-spacing:3px;color:#e2f8ff}
.demo{border-color:#776346;background:#33291b99;color:#ffcf94;border-radius:0;letter-spacing:.3px}
.avatar{border-color:#477c97;border-radius:0;background:#102535;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.clock{font-size:10px;color:#9fc3d9}
.main{max-width:1940px;padding:29px 30px 24px}
.titlebar{margin-bottom:19px;gap:20px;align-items:center}
.eyebrow{color:#85cfe8;font-size:10px;letter-spacing:2.4px}
h1{font-size:32px;letter-spacing:2px;font-weight:580;line-height:1.25}
.title-index{display:inline-block;margin-right:13px;color:#477f99;font-family:var(--mono);font-size:15px;vertical-align:middle;border-left:2px solid #59dbfa;padding:4px 0 4px 10px;letter-spacing:1px}
.subtitle{color:#a0bdcf;font-size:11px;letter-spacing:.3px}
button,input,select{border-color:#315b70;border-radius:2px;background:#071a2a}
button:hover:not(:disabled){background:#11364b;border-color:#5dc2de}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline-color:#b4f5ff;outline-offset:4px}
.primary{color:#011722;background:linear-gradient(110deg,#72e7ff,#46baff);border-color:#95f3ff;box-shadow:0 0 20px #32c8f52b,inset 0 1px #d7faff99;letter-spacing:.5px}
.primary:hover:not(:disabled){background:#a1efff;color:#021523;box-shadow:0 0 28px #32c8f545}
.titlebar .actions button{min-height:43px;padding:10px 15px;font-size:12px}
.topology-frame{position:relative;margin-bottom:20px;height:150px;border:1px solid #244657;background:linear-gradient(105deg,#061321dd,#09213688 55%,#05101b);overflow:hidden}
.topology-frame::before,.topology-frame::after{content:"";position:absolute;z-index:1;pointer-events:none;width:28px;height:12px;border-color:#61dafa;border-style:solid}
.topology-frame::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.topology-frame::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.topology-frame>svg{display:block;width:100%;height:100%}
.offline .topology-frame{opacity:.4;filter:grayscale(1)}
.summary{background:transparent;border:0;border-radius:0;gap:12px;overflow:visible;grid-template-columns:1.08fr .96fr 1fr 1.12fr;margin-bottom:17px}
.metric{position:relative;overflow:hidden;padding:16px 18px 21px;background:linear-gradient(115deg,#0c2032f2,#071521ef);border:1px solid #294c63!important;min-width:0;border-radius:0;box-shadow:inset 0 1px #2e668b33}
.metric::before{position:absolute;bottom:0;left:18px;right:18px;height:5px;content:"";background:repeating-linear-gradient(90deg,#3b8aab 0 3px,transparent 3px 8px);opacity:.45}
.metric::after{position:absolute;top:0;right:0;content:"";height:16px;width:16px;background:linear-gradient(45deg,transparent 48%,#3a6d88 50%,#040c14 55%)}
.metric-label{font-size:11px;color:#bed4e0;gap:8px;line-height:1.4}
.metric-value{font-size:30px;line-height:1.2;color:#e8f9ff;letter-spacing:-.8px;margin-top:12px;text-shadow:0 0 22px #5ebeee22}
.metric-value .unit{color:#9cbdcf;font-size:12px}
.metric-sub{font-size:10px;color:#a0b9c9;line-height:1.65}
.metric:first-child{border-color:#3b829e!important;background:linear-gradient(115deg,#0d2d40f5,#071623)}
.metric:first-child::before{background:repeating-linear-gradient(90deg,#61e3f7 0 3px,transparent 3px 8px)}
.metric:nth-child(2){background:radial-gradient(circle at 85% 62%,transparent 20px,#33739233 21px,#33739233 22px,transparent 23px,transparent 30px,#33739222 31px,#33739222 32px,transparent 33px),linear-gradient(115deg,#0c2032f2,#071521ef)}
.metric:nth-child(4)::before{background:repeating-linear-gradient(90deg,#d6a36f 0 3px,transparent 3px 8px)}
.control-strip{background:#081b2acc;border:1px solid #23485d;border-left:2px solid #5fc9e9;padding:13px 16px;margin-bottom:20px;gap:12px 19px;font-size:11px;line-height:1.5}
.control-strip .revision{font-size:10px;color:#accbde;letter-spacing:.1px}
.control-strip .mono{font-size:12px}
.content-grid{grid-template-columns:minmax(0,1fr) 326px;gap:18px}
.panel{position:relative;overflow:hidden;border-radius:0;background:#061421f2;border-color:#2a4d62;box-shadow:0 12px 30px #0003,inset 0 1px #39799e22}
.panel::before{content:"";position:absolute;top:0;right:0;height:16px;width:16px;pointer-events:none;z-index:3;background:linear-gradient(45deg,transparent 46%,#43829d 49%,#030b14 54%)}
.panel-header{background:linear-gradient(90deg,#102c40dd,#081a29);border-bottom-color:#295168;padding:15px 17px;min-height:57px}
.panel-header h2{font-size:15px;letter-spacing:1px}
.panel-title::before{content:"";width:3px;height:14px;background:#72e7ff;box-shadow:0 0 11px #55d6ff66;margin-right:2px}
.count{border:1px solid #345c74;border-radius:1px;background:#0a2235;color:#c1e1f0;font-size:11px}
.tiny-note{color:#a5bfd0}
.tools{background:#071624;border-color:#244458;padding:12px 15px;gap:12px}
.tabs{gap:3px}
.tabs button{border:1px solid transparent;font-size:11px;letter-spacing:.3px;min-height:32px}
.tabs button.active{background:#10334a;color:#a5edff;border-color:#3987a5;box-shadow:inset 0 -2px #63d9f0}
.search input{background:#040f1b;border-color:#2a4b60;color:#e1f5ff;border-radius:1px}
.search svg{color:#8bc2d9}
.table-wrap{max-height:535px;scrollbar-color:#387c9b #061422}
thead{background:#0b2234}
th{border-color:#30536a;color:#a9c9dc;font-size:10px;height:39px}
th button{font-size:10px;background:none;color:#c4dce9}
td{height:51px;border-bottom-color:#1d374b;font-size:12px;padding-top:9px;padding-bottom:9px}
tbody tr:nth-child(even){background:#0d203044}
tbody tr:hover{background:#0e3045}
tbody tr.selected{background:linear-gradient(90deg,#12415a,#0c2c4090)}
tbody tr.selected td:first-child{box-shadow:inset 2px 0 #70e9ff}
.symbol{font-size:12px;letter-spacing:.6px;color:#e7f6fc}
.route{color:#9eb9cc}
.dex-mark{border:1px solid #28495e;background:#092033;color:#9dc8e0;border-radius:0;letter-spacing:.5px}
.tiny-sub{font-size:10px;color:#a2b9c9}
.badge{border-radius:1px;border:1px solid transparent;font-size:10px;line-height:17px;letter-spacing:.1px}
.badge.good{color:#97e9fa;background:#10384a;border-color:#316578}
.badge.warn{color:#ffcf90;background:#332619;border-color:#7c5a35}
.badge.unknown{color:#ffaec0;background:#341e2d;border-color:#6a364e}
.badge.neutral{color:#b0c5d4;background:#142838;border-color:#344c5d}
.green{color:#7ee7fc}.amber{color:var(--warn)}
.bar{background:#153245;border-radius:0;height:2px}
.bar i{background:#62d5fa;box-shadow:0 0 7px #6dd8ff44}
.panel-footer{background:#071624;border-top:1px solid #204156;color:#9bb8ce;font-family:var(--mono);font-size:9px}
.detail-top{padding:19px 18px;background:radial-gradient(ellipse at 90% 5%,#14527466,transparent 58%),#081928}
.selected-line strong{font-size:29px;letter-spacing:2px;color:#e7f8ff}
.detail-route{color:#a3c7dd;font-size:10px}
.detail-values{margin-top:17px;gap:14px}
.detail-values .label{color:#b1ccda;font-size:11px}
.detail-values .value{font-size:23px;margin:8px 0;letter-spacing:.5px}
.detail-values .target{color:#a8c4d6;font-size:10px}
.chart{height:78px;background:linear-gradient(#366b8b28 1px,transparent 1px),linear-gradient(90deg,#366b8b28 1px,transparent 1px);background-size:20px 20px;border-bottom:1px solid #376982}
.chart polyline{stroke:#76eaff;filter:drop-shadow(0 0 3px #52caf477)}
.chart path{stroke:#52738a}
.chart-scale{color:#94b7cc}
.detail-section{border-color:#284b61;padding:17px 18px}
.section-label h3{font-size:12px;letter-spacing:1px}
.gate{grid-template-columns:17px 1fr auto;margin-bottom:15px;gap:9px;font-size:11px}
.gate-icon{border-radius:0;border-color:#4288a4;background:#0b2e40;color:#93edff;position:relative}
.gate:not(:last-child) .gate-icon::after{content:"";position:absolute;top:16px;left:6px;width:1px;height:12px;background:#274f65}
.gate-icon.wait{background:#392c1d;border-color:#9b794f;color:#ffd294}
.gate-icon.off{border-color:#3b5a6e;color:#b5c9d5;background:#162736}
.gate-name{color:#b0cbdc}.gate-value{font-size:10px;color:#e4f2fa}
.gate-note{border-radius:0;border-left:2px solid #42738e;color:#adc4d4;background:#102638;line-height:1.75;font-size:10px}
.keyvals{gap:12px;font-size:11px}.keyvals dt{color:#adc6d7}.keyvals dd{color:#d9eefa}
.feed-row{font-size:11px}.feed-row .time{color:#b7d6e8}
.feed-row .dot{border-radius:0;width:5px;height:5px}
.event-row{background:#08192777;border-color:#264456;font-size:11px;grid-template-columns:81px 68px 1fr 90px;gap:10px}
.event-time,.event-id{color:#9bbacc}.event-text{color:#bdd3e0;line-height:1.7}
.bottom-note{border-top:1px solid #23465d;padding-top:15px;margin-top:24px;color:#91afc3;letter-spacing:.3px;font-size:10px}
.data-banner{border-radius:0;border-color:#876744;color:#ffd7a3;background:#34291deb}
dialog{border-radius:2px;border-color:#5099b8;background:linear-gradient(145deg,#102b40,#071725 60%);box-shadow:0 0 0 1px #7bdbf122,0 0 70px #000c,0 0 28px #26b8e319}
dialog::backdrop{background:#01060cda}
dialog .dialog-head{border-bottom-color:#39728d;background:#102f43}
.dialog-head h2{letter-spacing:2px;font-size:19px}
.dialog-intro{color:#b3cddc}.form-row{border-color:#2c5065}.form-help{color:#adc6d8}
.input-unit input{border-color:#4684a0;background:#061523;color:#b7f3ff;letter-spacing:1px;border-radius:0}
.form-warning{border-radius:0;border-color:#806444;background:#33291e;color:#ffd099}
.dialog-foot{background:#071422;border-color:#345d73}
.review-summary{background:#0b2234;border-color:#376981;border-radius:0}
.progress{background:#071824;border-color:#3d6f86;border-radius:0}
.offline .topology-frame,.offline .summary::before{filter:grayscale(1)}
.offline .chart polyline{stroke:var(--muted);filter:none}
@media(min-width:1650px){.main{padding-left:42px;padding-right:42px}.content-grid{grid-template-columns:minmax(0,1fr) 365px}.topology-frame{height:170px}.table-wrap{max-height:600px}}
@media(max-width:1200px){
  .main{padding:24px 21px}.topbar{padding:0 21px}.content-grid{grid-template-columns:minmax(0,1fr) 300px;gap:14px}
  .summary{gap:9px}.metric{padding:14px 14px 21px}.metric-label{font-size:10px}.metric-value{font-size:26px}
  .metric:first-child .metric-value{font-size:22px!important}.metric-sub{font-size:10px}
  .control-strip{gap:10px 16px}.control-strip .revision{display:block;margin-left:0;width:100%}
  .topology-frame{height:130px}.chart{height:72px}
}
@media(max-width:1000px){
  .content-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr;align-items:start}
  .summary{grid-template-columns:1fr 1fr;gap:11px}.metric{min-height:135px}
  .topology-frame{height:116px}.metric-value{font-size:30px}
  .titlebar .actions .secondary-label{display:none}.titlebar .actions button{min-height:41px;padding:10px 12px}
  .table-wrap{max-height:490px}
}
@media(max-width:650px){
  .app{grid-template-columns:1fr}.rail{display:none}.topbar{padding:13px 15px;min-height:70px;height:auto;gap:12px;flex-wrap:wrap}
  .topbar::after{left:15px;width:76px}.breadcrumb{font-size:10px}.breadcrumb strong{font-size:14px}
  .demo{font-size:9px;padding:4px 7px;letter-spacing:0}.main{padding:22px 12px 16px}
  h1{font-size:29px;letter-spacing:2px}.title-index{font-size:12px;margin-right:10px;padding-left:8px}
  .eyebrow{font-size:9px;letter-spacing:1.8px}.titlebar{gap:18px;margin-bottom:18px}.subtitle{font-size:10px;line-height:1.8}
  .titlebar .actions{justify-content:flex-end;gap:10px}.titlebar .actions .secondary-label{display:inline}
  .titlebar .actions button{min-height:41px;font-size:11px}.topology-frame{height:93px;margin-bottom:14px}
  .summary{gap:8px;margin-bottom:14px}.metric{padding:13px 12px 19px;min-height:136px}
  .metric-label{font-size:10px;gap:7px;min-height:32px;flex-wrap:wrap}.metric-value{font-size:27px;margin-top:8px}
  .metric:first-child .metric-value{font-size:20px!important}.metric-value .unit{font-size:10px}.metric-sub{font-size:10px;line-height:1.65}
  .metric .badge{padding:0 5px;font-size:9px}.metric::before{left:12px;right:12px}
  .control-strip{padding:11px 12px;gap:9px 15px;font-size:10px;margin-bottom:16px}.control-strip .mono{font-size:11px}
  .control-strip .revision{font-size:9px}.panel-header{padding:13px 12px;min-height:53px}.panel-header h2{font-size:14px}
  .panel-title{gap:7px}.tools{padding:9px 10px}.tabs{gap:0;justify-content:space-between}.tabs button{font-size:10px;padding:6px 9px;min-height:35px}
  .search input{height:38px;font-size:13px}.table-wrap{max-height:430px}th{font-size:9px}th button{font-size:9px}
  td{font-size:11px;height:57px;padding-left:7px;padding-right:7px}td:first-child{padding-left:11px}
  .symbol{font-size:11px}.route{font-size:9px}.dex-mark{font-size:8px;padding:2px 3px}.tiny-sub{font-size:9px}
  .reason .badge{font-size:9px;padding:1px 5px}.panel-footer{font-size:9px;padding:10px 11px}.sidebar{display:flex}
  .detail-top,.detail-section{padding:18px}.detail-values .value{font-size:26px}.chart{height:85px}
  .event-row{grid-template-columns:62px 1fr;gap:5px 10px;padding:12px;font-size:10px}
  .bottom-note{font-size:9px;line-height:1.8}.dialog-content{padding:17px}.dialog-foot{padding:14px 17px;flex-wrap:wrap}
  .dialog-foot .tiny-note{max-width:100%;font-size:10px}.dialog-foot button{font-size:11px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}



/* Material depth belongs to the shell; market rows remain a stable reading plane. */
.main{perspective:1600px}
.summary{gap:15px;perspective:1500px}
.metric{
  box-shadow:1px 1px 0 #366880,2px 2px 0 #20465d,3px 3px 0 #163649,4px 4px 0 #0d283a,
    9px 12px 21px #0008,inset 0 1px 0 #8ad8f038;
  background:linear-gradient(132deg,#183b50e8 0,#0b2133f5 22%,#061521f8 80%);
  transition:transform 240ms ease,box-shadow 240ms ease;
}
.metric:first-child{background:linear-gradient(132deg,#225168ed,#0e3042 23%,#071827 85%)}
.metric-label{color:#c5dce8}
.metric-value{color:#eefaff;text-shadow:0 1px 0 #fff2,0 0 23px #66c5f020}
.control-strip{
  background:linear-gradient(180deg,#122e40f0,#071725f5);
  border-top-color:#497b92;border-right-color:#1c3c51;
  box-shadow:0 3px 0 #06111c,0 4px 0 #25475c,0 10px 25px #0005,inset 0 1px #93dfff17;
}
.panel{
  background:linear-gradient(150deg,#112a3a,#071725 32%,#05121e);
  box-shadow:1px 1px 0 #315e76,2px 2px 0 #1c3f55,3px 3px 0 #112e40,4px 4px 0 #0a2131,
    10px 16px 27px #0008,inset 0 1px #7dd7f326;
}
.panel-header{background:linear-gradient(180deg,#20465aee,#102c40ee 38%,#0a2032);border-top:1px solid #689bb22b}
.sidebar .panel{box-shadow:1px 1px 0 #477c94,2px 2px 0 #285165,3px 3px 0 #1b3d53,4px 4px 0 #102c40,8px 14px 34px #0009}
.detail-top{background:radial-gradient(ellipse at 78% -10%,#23759a66,transparent 58%),linear-gradient(145deg,#163e53,#0a2133 50%,#071522)}
.detail-values>div{padding:10px 11px;border:1px solid #31516a;background:linear-gradient(130deg,#081722,#112e41);box-shadow:inset 0 2px 5px #0008,0 1px #77b9d722}
.detail-values .value{font-size:21px;letter-spacing:0}
.primary{
  border-color:#8ceafa #49a6c8 #297890;
  background:linear-gradient(180deg,#a9efff 0,#79dcfc 12%,#4eb8e6 85%,#3693bd 100%);
  box-shadow:0 3px 0 #235c76,0 4px 0 #0a2636,0 8px 17px #13bded24,inset 0 1px #f0fcffbd;
}
.primary:hover:not(:disabled){background:linear-gradient(#c5f6ff,#79deff 22%,#54bde9);box-shadow:0 3px 0 #235c76,0 4px 0 #0a2636,0 9px 23px #13bded3d,inset 0 1px #fff}
.primary:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 0 #235c76,0 3px 0 #0a2636,0 5px 12px #13bded24,inset 0 1px #fff9}
.tabs button.active{box-shadow:inset 0 1px #7be1ff42,inset 0 -2px #63d9f0,0 2px 0 #030d16}
.search input{box-shadow:inset 0 2px 5px #0006,0 1px #83c3df19}
.topology-frame{height:225px;background:radial-gradient(ellipse at 50% 90%,#0a466266,transparent 56%),linear-gradient(140deg,#0b2033,#030c16 70%);box-shadow:inset 0 1px #74cfff33,inset 0 -15px 35px #0008,0 4px 0 #0b2030,0 5px 0 #284d64;isolation:isolate}
.topology-frame::before,.topology-frame::after{z-index:20}
.offline .topology-frame{opacity:.5}
dialog{box-shadow:1px 1px 0 #6db0ca,2px 2px 0 #3c6b85,3px 3px 0 #254961,4px 4px 0 #102d41,20px 26px 60px #000c,0 0 25px #23a5d21c}
.dialog-head{box-shadow:inset 0 1px #95e2ff33}
.input-unit input{box-shadow:inset 0 3px 7px #0008,0 1px #74c2e12b}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .metric:hover{transform:translateY(-3px);box-shadow:1px 1px 0 #48849e,2px 2px 0 #28516a,3px 3px 0 #173c52,4px 4px 0 #0e2a3d,11px 17px 27px #0009,inset 0 1px #97e7ff4f}
}
@media(max-width:1200px){.summary{gap:12px}.topology-frame{height:210px}}
@media(max-width:650px){.summary{gap:11px}.topology-frame{height:174px}.metric{min-height:128px}.detail-values .value{font-size:24px}.content-grid{gap:18px}}
@media(prefers-reduced-motion:reduce){.metric{transition:none}.primary:active:not(:disabled){transform:none}}



/* Static, genuinely spatial CSS geometry. Parent may update --orb3d-view-x / --orb3d-view-y on .orb3d-stage.
   The text labels remain outside the perspective world. No animation or network assets. */
.orb3d-stage { --orb3d-cube-size:70px; --orb3d-half:35px; --orb3d-sphere-size:80px; --orb3d-ring-size:146px; --orb3d-node-a:24%; --orb3d-node-b:76%; position:relative; isolation:isolate; height:224px; margin:0; overflow:hidden; background:radial-gradient(ellipse at 50% 55%,#10263b 0%,#091521 41%,#07101c 78%); color:#cce9f5; font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
.orb3d-stage::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,#07101c80,transparent 22%,transparent 78%,#07101c80); z-index:2; }
.orb3d-stage::after { content:""; position:absolute; inset:12px; border:1px solid #81d4f018; clip-path:polygon(0 0,36px 0,36px 1px,1px 1px,1px 16px,0 16px,0 0,100% 0,100% 16px,calc(100% - 1px) 16px,calc(100% - 1px) 1px,calc(100% - 36px) 1px,calc(100% - 36px) 0,100% 0,100% 100%,calc(100% - 36px) 100%,calc(100% - 36px) calc(100% - 1px),calc(100% - 1px) calc(100% - 1px),calc(100% - 1px) calc(100% - 16px),100% calc(100% - 16px),100% 100%,0 100%,0 calc(100% - 16px),1px calc(100% - 16px),1px calc(100% - 1px),36px calc(100% - 1px),36px 100%,0 100%); pointer-events:none; }
.orb3d-heading { position:absolute; top:18px; left:24px; right:24px; display:flex; justify-content:space-between; gap:16px; z-index:3; }
.orb3d-kicker { font-size:11px; letter-spacing:2px; color:#bcdde9; }
.orb3d-mode { font-size:10px; letter-spacing:1.3px; color:#86a8bd; }
.orb3d-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.orb3d-space { position:absolute; inset:0; perspective:900px; perspective-origin:50% 35%; }
.orb3d-world { position:absolute; inset:0; transform-style:preserve-3d; transform:rotateX(calc(-3deg + var(--orb3d-view-x,0deg))) rotateY(calc(-5deg + var(--orb3d-view-y,0deg))); }
.orb3d-deck { position:absolute; width:81%; height:202px; top:40px; left:9.5%; transform-style:preserve-3d; transform:rotateX(69deg) translateZ(-18px); }
.orb3d-deck-top { position:absolute; inset:0; border:1px solid #82d5ef50; background:linear-gradient(90deg,transparent calc(50% - .5px),#9ce6fd50 50%,transparent calc(50% + .5px)),repeating-linear-gradient(90deg,#569fc224 0,#569fc224 1px,transparent 1px,transparent 34px),repeating-linear-gradient(0deg,#569fc224 0,#569fc224 1px,transparent 1px,transparent 34px),linear-gradient(145deg,#0d2238e8,#08192be8); box-shadow:inset 0 0 0 7px #071321,inset 0 0 0 8px #3b698143; }
.orb3d-deck-top::before { content:""; position:absolute; inset:17px; border:1px solid #39698460; }
.orb3d-deck-top::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,#a7eafd9c,transparent); }
.orb3d-deck-edge { position:absolute; left:0; right:0; top:100%; height:12px; transform-origin:50% 0; transform:rotateX(-90deg); border:1px solid #4a7b956e; border-top:0; background:linear-gradient(#19334d,#081320); box-shadow:0 9px 15px #0005; }
.orb3d-cross { position:absolute; top:50%; width:20px; height:20px; margin:-10px; border:1px solid #759cb375; transform:rotate(45deg); }
.orb3d-cross::after { content:""; position:absolute; inset:5px; border:1px solid #75c9e07a; }
.orb3d-cross-a { left:18%; }.orb3d-cross-b { left:50%; }.orb3d-cross-c { left:82%; }
.orb3d-node-shadow,.orb3d-core-shadow { position:absolute; top:132px; width:100px; height:68px; border-radius:50%; background:radial-gradient(ellipse,#04101ccc,#03101b70 45%,transparent 70%); transform:translate(-50%,-50%) rotateX(65deg); }
.orb3d-node-shadow-a { left:var(--orb3d-node-a); }.orb3d-node-shadow-b { left:var(--orb3d-node-b); }.orb3d-core-shadow { left:50%; width:142px; height:100px; background:radial-gradient(ellipse,#5cc9ef23,#09263733 35%,transparent 70%); }
.orb3d-node { position:absolute; top:105px; left:var(--orb3d-node-a); width:var(--orb3d-cube-size); height:var(--orb3d-cube-size); transform-style:preserve-3d; transform:translate(-50%,-50%) translateZ(35px); }
.orb3d-node-b { left:var(--orb3d-node-b); }
.orb3d-node-stem { position:absolute; top:78%; left:50%; height:49px; width:1px; transform:translateZ(-9px); background:linear-gradient(#71d4ee66,#71d4ee08); }
.orb3d-node-stem::after { content:""; position:absolute; width:30px; height:30px; left:-15px; bottom:-14px; border:1px solid #6acde66b; border-radius:50%; transform:rotateX(70deg); }
.orb3d-cube { position:relative; width:100%; height:100%; transform-style:preserve-3d; transform:rotateX(-19deg) rotateY(-31deg); }
.orb3d-node-b .orb3d-cube { transform:rotateX(-19deg) rotateY(31deg); }
.orb3d-face { position:absolute; inset:0; border:1px solid #7ab8d2; background:#0d2034; backface-visibility:hidden; }
.orb3d-face-front { transform:translateZ(var(--orb3d-half)); background:linear-gradient(145deg,#173d59 0%,#0c243d 62%,#081a2e); box-shadow:inset 0 0 0 5px #07192c,inset 0 0 0 6px #3c819b66; display:grid; place-items:center; }
.orb3d-face-front span { display:block; font-size:37px; font-weight:500; color:#cdf5ff; line-height:1; text-shadow:0 0 14px #73d5ef33; }
.orb3d-face-front > i { position:absolute; bottom:10px; width:19px; height:2px; background:#91ddef9c; }
.orb3d-face-back { transform:rotateY(180deg) translateZ(var(--orb3d-half)); background:#09182a; }
.orb3d-face-right { transform:rotateY(90deg) translateZ(var(--orb3d-half)); background:linear-gradient(90deg,#102840,#071625); box-shadow:inset 0 0 0 7px #0a1b2d; }
.orb3d-face-left { transform:rotateY(-90deg) translateZ(var(--orb3d-half)); background:linear-gradient(-90deg,#102b44,#071625); box-shadow:inset 0 0 0 7px #0a1b2d; }
.orb3d-face-top { transform:rotateX(90deg) translateZ(var(--orb3d-half)); background:linear-gradient(135deg,#244d68,#12354f); border-color:#9addf0; }
.orb3d-face-bottom { transform:rotateX(-90deg) translateZ(var(--orb3d-half)); background:#081425; }
.orb3d-face-mark { position:absolute; inset:13px; border:1px solid #5a8ea667; background:repeating-linear-gradient(0deg,transparent 0,transparent 7px,#6dabc338 7px,#6dabc338 8px); }
.orb3d-top-inset { position:absolute; inset:12px; border:1px solid #92c7d867; background:linear-gradient(45deg,transparent 49%,#8ac6d455 50%,transparent 51%),linear-gradient(-45deg,transparent 49%,#8ac6d455 50%,transparent 51%); }
.orb3d-route { position:absolute; top:116px; height:22px; left:27.5%; width:18.5%; transform-style:preserve-3d; transform:rotateX(62deg) translateZ(33px); }
.orb3d-route-b { left:54%; }
.orb3d-route i { position:absolute; width:100%; height:1px; top:50%; left:0; background:linear-gradient(90deg,#90e3f536,#7ddbf9d9,#90e3f536); box-shadow:0 0 5px #72d4ee22; }
.orb3d-route i:first-child { top:0; opacity:.3; }.orb3d-route i:last-of-type { top:100%; opacity:.3; }
.orb3d-route b { position:absolute; top:calc(50% - 4px); left:45%; width:8px; height:8px; border-top:1px solid #b5f0ff; border-right:1px solid #b5f0ff; transform:rotate(45deg); }
.orb3d-route-b b { transform:rotate(225deg); }
.orb3d-reactor { position:absolute; left:50%; top:99px; width:var(--orb3d-sphere-size); height:var(--orb3d-sphere-size); transform-style:preserve-3d; transform:translate(-50%,-50%) translateZ(43px); }
.orb3d-sphere { position:absolute; inset:0; border-radius:50%; background:radial-gradient(circle at 30% 25%,#d8f9ff 0%,#7dcdea 6%,#397595 21%,#153954 42%,#071426 70%,#020713 100%); box-shadow:inset -4px -3px 9px #020710,inset 1px 1px 2px #b5f5ff8c,0 0 15px #75cce91a; overflow:hidden; border:1px solid #7bc4df90; }
.orb3d-sphere::before { content:""; position:absolute; inset:0; border-radius:50%; background:repeating-linear-gradient(0deg,transparent 0,transparent 8px,#97d4e829 8px,#97d4e829 9px); }
.orb3d-sphere::after { content:""; position:absolute; inset:2px 24%; border:1px solid #a9e7f02e; border-radius:50%; transform:rotate(-25deg); }
.orb3d-sphere-meridian { position:absolute; inset:-3px 12%; border:1px solid #85c4e12e; border-radius:50%; transform:rotate(-25deg); }
.orb3d-sphere-equator { position:absolute; left:-5%; top:25%; width:110%; height:36%; border:1px solid #b3ddeb4d; border-radius:50%; transform:rotate(15deg); }
.orb3d-sphere > span { position:absolute; width:30%; height:13%; left:22%; top:15%; border-radius:50%; transform:rotate(-33deg); background:#c5f0fa12; }
.orb3d-orbit { position:absolute; left:50%; top:50%; width:var(--orb3d-ring-size); height:var(--orb3d-ring-size); margin-left:calc(var(--orb3d-ring-size) / -2); margin-top:calc(var(--orb3d-ring-size) / -2); border:1px solid #91daf0ad; border-radius:50%; transform-style:preserve-3d; box-shadow:0 0 3px #4eace31c; }
.orb3d-orbit::before { content:""; position:absolute; inset:5px; border:1px solid #659ab637; border-radius:50%; }
.orb3d-orbit-equatorial { transform:rotateX(72deg) rotateY(-8deg); border-color:#b0edfccf; }
.orb3d-orbit-polar { transform:rotateY(69deg) rotateZ(-24deg); border-color:#6498b786; }
.orb3d-orbit-oblique { transform:rotateX(52deg) rotateY(48deg) rotateZ(27deg); border-color:#8cccebbc; }
.orb3d-orbit-outer { transform:rotateX(72deg) rotateY(-8deg) scale(1.15); border:1px dashed #71adc047; box-shadow:none; }
.orb3d-orbit-outer::before { display:none; }
.orb3d-orbit > i { position:absolute; top:calc(50% - 3px); right:-3px; width:6px; height:6px; border:1px solid #c9f6ff; border-radius:50%; background:#70cbe8; box-shadow:0 0 7px #75cfea77; }
.orb3d-orbit-polar > i { right:auto; left:-3px; }
.orb3d-orbit-oblique > i { top:-3px; left:calc(50% - 3px); }
.orb3d-label { position:absolute; z-index:3; left:var(--orb3d-node-a); bottom:17px; transform:translateX(-50%); text-align:center; white-space:nowrap; }
.orb3d-label > span { font-size:12px; letter-spacing:1.6px; color:#c7e6f1; }
.orb3d-label > small { display:block; font-family:inherit; font-size:10px; color:#84a8bd; letter-spacing:1.3px; margin-top:5px; }
.orb3d-label-b { left:var(--orb3d-node-b); }.orb3d-label-core { left:50%; bottom:15px; }
.orb3d-label-core > span { font-size:11px; letter-spacing:1.2px; }
.orb3d-label-core strong { font-weight:500; font-size:22px; letter-spacing:0; margin-right:5px; color:#e3f8ff; }
.orb3d-label-core > small { font-family:system-ui,-apple-system,sans-serif; font-size:10px; letter-spacing:.5px; margin-top:3px; }
@media (max-width:700px) {
  .orb3d-stage { --orb3d-cube-size:49px; --orb3d-half:24.5px; --orb3d-sphere-size:61px; --orb3d-ring-size:119px; --orb3d-node-a:20%; --orb3d-node-b:80%; height:178px; }
  .orb3d-heading { top:12px; left:15px; right:15px; gap:10px; }.orb3d-kicker { font-size:9px; letter-spacing:1px; }.orb3d-mode { font-size:8px; letter-spacing:.7px; }
  .orb3d-deck { width:92%; left:4%; top:26px; height:160px; }.orb3d-deck-edge { height:9px; }.orb3d-deck-top { background-size:auto,24px 100%,100% 24px,auto; }
  .orb3d-node { top:80px; transform:translate(-50%,-50%) translateZ(22px); }.orb3d-face-front span { font-size:27px; }.orb3d-face-front > i { bottom:8px; width:14px; height:1px; }.orb3d-face-front { box-shadow:inset 0 0 0 4px #07192c,inset 0 0 0 5px #3c819b66; }.orb3d-face-mark,.orb3d-top-inset { inset:9px; }
  .orb3d-node-stem { height:33px; }.orb3d-node-shadow,.orb3d-core-shadow { top:107px; }.orb3d-reactor { top:77px; transform:translate(-50%,-50%) translateZ(24px); }
  .orb3d-route { top:91px; left:25%; width:15%; height:16px; transform:rotateX(62deg) translateZ(20px); }.orb3d-route-b { left:60%; }
  .orb3d-label { bottom:14px; }.orb3d-label > span { font-size:9px; letter-spacing:.8px; }.orb3d-label > small { font-size:8px; letter-spacing:.6px; margin-top:4px; }
  .orb3d-label-core { bottom:9px; }.orb3d-label-core > span { font-size:8px; letter-spacing:.45px; }.orb3d-label-core strong { font-size:18px; margin-right:2px; }.orb3d-label-core > small { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) { .orb3d-world { transform:rotateX(-3deg) rotateY(-5deg); transition:none!important; animation:none!important; } }

.topology-frame.orbital-3d{height:auto!important}
.orb3d-world{transition:transform 160ms ease-out}
@media(prefers-reduced-motion:reduce){.orb3d-world{transition:none}}



.logout-button{min-height:30px;font-size:11px;padding:5px 9px}.live-detail-panel{margin-top:20px}.diagnostic-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;padding:16px}.diagnostic-grid details{min-width:0;border:1px solid #294c61;background:#071522}.diagnostic-grid summary{padding:12px;cursor:pointer;color:#d2e8f5}.diagnostic-grid pre{white-space:pre-wrap;word-break:break-word;max-height:360px;overflow:auto;font:11px/1.6 var(--mono);padding:12px;border-top:1px solid #294c61;color:#b6d0df;margin:0}.live-stale .spread-value{color:var(--muted)!important}.live-stale .topology-frame{opacity:.5}.chart-scale{gap:8px}.metric-label .badge{white-space:normal}.topology-frame.orbital-3d{max-height:180px}.orb3d-stage{transform-origin:50% 0;transform:scale(.80);width:125%;margin-left:-12.5%;margin-bottom:-45px}.control-strip .control-item{flex-wrap:wrap}.meta-note{font-size:10px;color:#a5bfce;line-height:1.6}.state-error{color:#ffc680}.live-stale .orb3d-world{transition:none!important}#runtimeValue{font-size:23px!important}#formError{margin-top:12px}.event-row{grid-template-columns:82px minmax(0,1fr)}.event-row .event-text{overflow-wrap:anywhere}.tag-code{font:10px var(--mono);color:#81d5f0}.titlebar{margin-bottom:13px}.main{padding-top:21px}.summary{margin-top:14px}.table-wrap{max-height:590px}
@media(max-width:1000px){.diagnostic-grid{grid-template-columns:1fr}.topology-frame.orbital-3d{max-height:142px}.orb3d-stage{transform:scale(.8);margin-bottom:-36px}.titlebar{gap:12px}}
@media(max-width:650px){.main{padding-top:17px}.titlebar .actions{justify-content:space-between}.orb3d-stage{width:125%}.topology-frame.orbital-3d{max-height:142px}.metric-sub{font-size:10px}.diagnostic-grid{padding:10px}.event-row{grid-template-columns:65px minmax(0,1fr)}.dialog-foot{gap:10px}.dialog-foot .tiny-note{width:100%}.control-strip .revision{overflow-wrap:anywhere}}
