:root{color-scheme:light;--bg: #f4f5f7;--panel: #ffffff;--border: #d7dbe0;--text: #1b2430;--muted: #5b6672;--accent: #1f6feb;--ok: #1a7f37;--warn: #9a6700;--danger: #cf222e;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.45}.mono{font-family:var(--mono)}.code{font-family:var(--mono);background:#f0f2f5;border-radius:4px;padding:0 4px}.muted{color:var(--muted)}.hint{font-size:12px}.shell{display:flex;height:100%}.sidebar{width:220px;min-width:220px;background:var(--panel);border-inline-end:1px solid var(--border);display:flex;flex-direction:column;padding:16px 12px}.sidebar-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}.brand{font-weight:700;font-size:15px;padding:0 8px 16px}.sidebar-toggle{flex:none;min-width:30px;padding:4px 8px}.sidebar nav{display:flex;flex-direction:column;gap:2px;flex:1}.nav-group{display:flex;flex-direction:column;gap:2px}.nav-group-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;color:var(--danger);font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:14px 10px 4px;border:none;background:none;cursor:pointer;text-align:start}.nav-group-header:hover{color:#a61b24}.nav-group-chevron{flex:none;font-size:10px}.nav-group-items{display:flex;flex-direction:column;gap:2px}.nav-link{padding:8px 10px;border-radius:6px;color:var(--text);text-decoration:none}.nav-link:hover{background:#eef1f5}.nav-link.active{background:var(--accent);color:#fff}.sidebar-footer{padding-top:12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}.user{font-size:13px}.role{font-size:11px;color:var(--muted);text-transform:uppercase;margin-inline-start:6px}.sidebar.collapsed{width:56px;min-width:56px;padding:16px 8px}.sidebar.collapsed .sidebar-top{justify-content:center}.sidebar.collapsed .brand{padding:0;font-size:13px}.sidebar.collapsed nav,.sidebar.collapsed .sidebar-footer{display:none}.main{flex:1;overflow:auto;padding:24px 28px}.main h1{margin-top:0;font-size:20px}.main h2{font-size:15px;margin:18px 0 8px}.card{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:16px}.stat-row{display:flex;gap:12px;flex-wrap:wrap}.stat{min-width:120px}.stat-value{font-size:24px;font-weight:700}.stat-label{color:var(--muted);font-size:12px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.table{width:100%;border-collapse:collapse;background:var(--panel)}.table th,.table td{text-align:start;padding:8px 10px;border-bottom:1px solid var(--border)}.table th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}.table a{color:var(--accent)}.kv{list-style:none;margin:0;padding:0}.kv li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--border)}.kv li:last-child{border-bottom:none}.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--border)}.badge .dot{width:8px;height:8px;border-radius:50%;background:currentColor}.badge-on{color:#15803d;border-color:#bbf7d0;background:#f0fdf4}.badge-off{color:#9f1239;border-color:#fecdd3;background:#fff1f2}.dash-section{margin-top:16px}.dash-section h2{font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 8px}.stat-row{display:flex;flex-wrap:wrap;gap:10px}.stat{flex:1 1 150px;min-width:140px}.stat-link{text-decoration:none;color:inherit;display:block}.stat-link:hover .stat{border-color:var(--accent)}.stat-danger{border-color:var(--danger)}.stat-danger .stat-value{color:var(--danger)}.status-online{color:var(--ok);border-color:#bfe3c5}.status-degraded{color:var(--warn);border-color:#f0d9a8}.status-offline{color:var(--danger);border-color:#f2c2c5}.status-pending{color:var(--accent)}.status-not_observed,.status-unknown{color:var(--muted)}.state{padding:16px;color:var(--muted)}.state-error{color:var(--danger)}.state-stale{color:var(--warn)}.tabs{display:flex;gap:4px;margin-bottom:12px}.tab{padding:6px 14px;border:1px solid var(--border);background:var(--panel);border-radius:6px;cursor:pointer}.tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.login{height:100%;display:flex;align-items:center;justify-content:center}.login-card{width:360px;display:flex;flex-direction:column;gap:12px}.login-card h1{margin:0;font-size:20px}.login-card label{display:flex;flex-direction:column;gap:4px;font-size:13px}.login-card input{padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:14px}.login-card button{padding:9px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:14px;cursor:pointer}.login-card button:disabled{opacity:.6;cursor:default}.error{color:var(--danger);font-size:13px;margin:0}button.ghost{background:none;border:1px solid var(--border);border-radius:6px;padding:6px 10px;cursor:pointer;color:var(--text)}.filters{display:flex;gap:16px;align-items:end;margin-bottom:12px;flex-wrap:wrap}.filters label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.filters input,.filters select{padding:6px 8px;border:1px solid var(--border);border-radius:6px;font-size:13px}.clickable{cursor:pointer}.clickable:hover{background:#f4f6f8}.summary,.transport-card{margin-bottom:12px}.transport-warning{color:var(--danger);font-weight:600;margin:8px 0 0}.transport-unavailable{border-color:#f2c2c5;background:#fff7f7}.json{background:#0f172a;color:#d1e4ff;border-radius:6px;padding:12px;font-size:12px;max-height:420px;overflow:auto;white-space:pre-wrap;word-break:break-word}.drawer{position:fixed;inset-inline-end:0;top:0;bottom:0;width:360px;background:var(--panel);border-inline-start:1px solid var(--border);box-shadow:-8px 0 24px #00000014;padding:16px;overflow:auto;z-index:10}.drawer-header{display:flex;justify-content:space-between;align-items:center}.drawer-header h3{margin:0 0 8px}.btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.btn{display:inline-block;text-decoration:none;color:var(--text)}button.primary{background:var(--accent);border:none;color:#fff;padding:7px 14px;border-radius:6px;cursor:pointer}button.primary:disabled{opacity:.5;cursor:default}.payment-simulation-switch{display:inline-flex;align-items:center;gap:10px;padding:9px 14px;border:1px solid var(--border);border-radius:8px;background:var(--surface, #fff);color:var(--text);font:inherit;font-weight:600;cursor:pointer}.payment-simulation-switch:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.payment-simulation-switch:disabled{opacity:.55;cursor:default}.payment-switch-track{position:relative;display:inline-block;width:38px;height:22px;border-radius:99px;background:#64748b;flex:none}.payment-switch-track:before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s ease}.payment-simulation-switch[aria-checked=true] .payment-switch-track{background:var(--accent)}.payment-simulation-switch[aria-checked=true] .payment-switch-track:before{transform:translate(16px)}@media(prefers-reduced-motion:reduce){.payment-switch-track:before{transition:none}}a.primary{background:var(--accent);color:#fff;padding:7px 14px;border-radius:6px;text-decoration:none;display:inline-block}button.danger{background:var(--danger);border:none;color:#fff;padding:7px 14px;border-radius:6px;cursor:pointer}button.danger:disabled{opacity:.5;cursor:default}input,textarea{padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:14px;background:var(--panel);color:var(--text);width:100%;box-sizing:border-box;margin:4px 0}textarea{min-height:80px;resize:vertical;font-family:inherit}.code-block{background:#0f172a;color:#d1e4ff;border-radius:6px;padding:12px;font-size:12px;overflow:auto;white-space:pre-wrap;word-break:break-all}.setup-steps{margin:0;padding-inline-start:20px;display:grid;gap:8px}.platform-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.diff{background:#0f172a;color:#d1e4ff;border-radius:6px;padding:12px;font-size:12px;max-height:420px;overflow:auto;white-space:pre-wrap;word-break:break-word}.crumb{margin-bottom:8px}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:20}.modal-card{width:480px;max-width:90vw;max-height:90vh;overflow:auto}.modal-wide{width:640px;max-width:92vw;max-height:90vh;overflow:auto}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin:12px 0}button.tab{background:none;border:none;border-bottom:2px solid transparent;padding:8px 12px;cursor:pointer;color:var(--text)}button.tab.active{border-bottom-color:var(--accent);font-weight:600}.editor-split{display:flex;gap:12px;margin-top:8px}.file-tree{flex:0 0 220px;display:flex;flex-direction:column;gap:4px;border-inline-end:1px solid var(--border);padding-inline-end:8px}button.file-node{background:none;border:none;text-align:start;padding:6px 8px;border-radius:4px;cursor:pointer;font-family:var(--mono, monospace);font-size:12px;color:var(--text)}button.file-node:hover{background:#0000000d}button.file-node.active{background:var(--accent);color:#fff}.progress{position:relative;background:#00000014;border-radius:8px;height:28px;margin-top:10px;overflow:hidden}.progress-bar{position:absolute;inset-inline-start:0;top:0;bottom:0;background:var(--accent);border-radius:8px}.progress-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--text)}.field{display:flex;flex-direction:column;gap:4px;font-size:13px}.field input{padding:6px 8px;border:1px solid var(--border);border-radius:6px;font-size:14px}.checkbox{display:flex;align-items:center;gap:8px;font-size:13px;margin-top:8px}.form-stack{display:flex;flex-direction:column;gap:12px;margin:12px 0}.form-stack .btn-row{margin:0}.error-text{color:var(--danger, #d33);margin:8px 0}.state-ok{color:var(--ok)}.state-muted{color:var(--muted)}.note{font-size:12px}.arch{display:flex;flex-wrap:wrap;gap:12px}.arch-node{padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--panel);font-size:13px}.arch-node a{color:var(--accent)}.arch-status{font-size:11px;font-weight:700;margin-inline-start:6px}.arch-edge{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border)}.arch-apps{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.arch-app{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--border)}.locale-switcher{font-size:12px;padding:2px 6px;border:1px solid var(--border, #333);border-radius:4px;background:transparent;color:inherit;margin-bottom:8px}.portal-public-locale{position:fixed;top:10px;inset-inline-end:14px;z-index:20}[dir=rtl] .portal-public-locale{inset-inline-end:auto;inset-inline-start:14px}[dir=rtl]{direction:rtl}:root{--pip-label: #1b2430;--pip-ok: #1a7f37;--pip-info: #1858c4;--pip-warn: #9a6700;--pip-bad: #cf222e;--pip-muted: #6b7280}.pip-net-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.pip-net-head h2{margin:0}.pip-card{border:1px solid var(--border);border-radius:8px;padding:12px 14px;background:var(--panel)}.pip-card-wide{grid-column:1 / -1}.pip-card h3{margin:0 0 8px;font-size:13px;font-weight:600}.pip-sub{margin:10px 0 4px;font-size:12px;font-weight:600;color:var(--muted);text-transform:none}.pip-kv-label{color:var(--pip-label);font-weight:500;flex:0 0 auto;margin-inline-end:12px}.pip-kv-value{font-weight:600;text-align:end}.pip-tone-ok{color:var(--pip-ok)}.pip-tone-info{color:var(--pip-info)}.pip-tone-warn{color:var(--pip-warn)}.pip-tone-bad{color:var(--pip-bad)}.pip-tone-muted{color:var(--pip-muted)}.pip-banner{border-radius:8px;padding:10px 12px;margin:10px 0;border:1px solid var(--border);border-inline-start-width:4px}.pip-banner p{margin:4px 0 0}.pip-banner-warn{border-inline-start-color:var(--pip-warn);background:#fff8e6}.pip-banner-ok{border-inline-start-color:var(--pip-ok);background:#f0f9f2}.pip-egress-groups{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.pip-egress-group{border:1px solid var(--border);border-radius:6px;padding:8px 10px}.pip-egress-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.pip-egress-head .muted{margin-inline-start:auto;font-size:12px}.pip-chip{font-size:11px;font-weight:600;padding:1px 6px;border-radius:999px;border:1px solid var(--border);color:var(--pip-info);background:#eef3fd}.pip-svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.pip-svc-card{border:1px solid var(--border);border-radius:6px;padding:8px 10px;display:flex;flex-direction:column;gap:2px}.pip-svc-name{color:var(--pip-label);font-weight:500;font-size:13px}.pip-svc-state{font-weight:600}.pip-svc-latency{color:var(--muted);font-size:12px}.pip-region{margin-top:12px}.pip-region>h3{margin:0 0 4px}.pip-region-kicker{margin:2px 0 0;color:var(--muted);font-size:12px}.pip-path-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.pip-path-overview{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.pip-path-overview .muted{margin-inline-start:auto}.pip-matrix-list{display:flex;flex-direction:column;gap:10px}.pip-matrix{border:1px solid var(--border);border-radius:8px;padding:10px}.pip-matrix-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}.pip-matrix-head .code{margin-inline-start:8px}.pip-metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px}.pip-metric{border:1px solid var(--border);border-radius:6px;padding:6px 8px;display:flex;flex-direction:column;gap:2px}.pip-metric .pip-kv-value{text-align:start}.pip-metric-detail{color:var(--muted);font-size:12px}.pip-egress-paths{display:flex;flex-direction:column;gap:10px}.pip-egress-path{border:1px solid var(--border);border-radius:8px;padding:10px}.pip-egress-path-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.pip-egress-family{margin-top:8px}.nd-path-flow{display:flex;flex-direction:column;align-items:stretch;gap:0}.nd-path-node{border:1px solid var(--border);border-radius:9px;padding:10px 12px;background:var(--panel);border-inline-start-width:4px}.nd-path-node-ok{border-inline-start-color:var(--pip-ok)}.nd-path-node-info{border-inline-start-color:var(--pip-info)}.nd-path-node-warn{border-inline-start-color:var(--pip-warn);background:#fffaf0}.nd-path-node-bad{border-inline-start-color:var(--pip-bad);background:#fff6f6}.nd-path-node-muted{border-inline-start-color:var(--pip-muted);background:#fafafa}.nd-path-node-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.nd-path-node-subtitle{color:var(--muted);font-size:12px;margin-top:2px}.nd-path-node-value{font-weight:600;margin-top:4px;overflow-wrap:anywhere}.nd-path-node-details{margin:7px 0 0;display:grid;gap:3px}.nd-path-node-details>div{display:flex;justify-content:space-between;gap:12px}.nd-path-node-details dt{color:var(--pip-label);font-weight:500}.nd-path-node-details dd{margin:0;text-align:end;overflow-wrap:anywhere}.nd-path-status{display:inline-flex;align-items:center;border-radius:999px;padding:1px 7px;font-size:11px;font-weight:700;border:1px solid currentColor;white-space:nowrap}.nd-path-status-ok{color:var(--pip-ok);background:#f0f9f2}.nd-path-status-info{color:var(--pip-info);background:#eef3fd}.nd-path-status-warn{color:var(--pip-warn);background:#fff8e6}.nd-path-status-bad{color:var(--pip-bad);background:#fff1f1}.nd-path-status-muted{color:var(--pip-muted);background:#f5f5f5}.nd-path-connector{display:flex;align-items:center;gap:8px;min-height:22px;padding-inline-start:22px}.nd-path-connector-line{width:2px;height:22px;background:var(--border);display:block}.nd-path-connector-ok .nd-path-connector-line{background:var(--pip-ok)}.nd-path-connector-info .nd-path-connector-line{background:var(--pip-info)}.nd-path-connector-warn .nd-path-connector-line{background:var(--pip-warn)}.nd-path-connector-bad .nd-path-connector-line{background:var(--pip-bad)}.nd-path-connector-label{color:var(--muted);font-size:11px}.nd-path-branch{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.nd-path-evidence{margin-top:10px}.nd-path-evidence summary{cursor:pointer;color:var(--muted);font-size:12px;font-weight:600}.nd-topology-section{border:1px solid var(--border);border-radius:9px;padding:10px 12px;margin-top:10px}.nd-topology-section>h4{margin:0 0 8px;font-size:13px}.nd-topology-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.nd-topology-label{color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}.nd-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.nd-summary-card{border:1px solid var(--border);border-radius:8px;padding:9px 10px;background:var(--panel)}.nd-summary-card strong{display:block;margin-bottom:3px}.nd-issue-list{margin:8px 0 0;padding-inline-start:18px}.nd-issue-list li{margin:3px 0}.nd-compact-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:end}.nd-compact-actions label{display:flex;flex-direction:column;gap:3px;color:var(--muted);font-size:12px}.nd-protocol-toggle{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600;cursor:pointer}.nd-protocol-toggle.active{border-color:var(--pip-info);color:var(--pip-info);background:#eef3fd}.nd-protocol-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.nd-egress-group{display:grid;grid-template-columns:minmax(120px,1fr) repeat(2,minmax(100px,1fr));gap:4px 10px;margin-top:7px;padding-top:7px;border-top:1px solid var(--border);font-size:12px}.nd-egress-group strong{overflow-wrap:anywhere}.nd-egress-group span{color:var(--muted)}.nd-path-node-more{margin-top:7px}.nd-path-node-more summary{cursor:pointer;color:var(--muted);font-size:12px;font-weight:700;list-style:none}.nd-path-node-more summary::-webkit-details-marker{display:none}.nd-path-node-more[open] summary{margin-bottom:6px}@media(min-width:1100px){.pip-matrix-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(480px,1fr));align-items:start}}.portal-subscriptions .card{margin-block-end:12px;min-width:0}.subscription-orders{display:grid;gap:10px}.subscription-orders .card{margin:0}.subscription-order{padding:12px 16px}.subscription-order-meta,.subscription-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}.subscription-order-meta{padding-block-end:10px;border-bottom:1px solid var(--border)}.subscription-order-meta h2{margin:0;font-size:14px;overflow-wrap:anywhere}.subscription-order-meta a{margin-inline-start:auto}.subscription-controls{padding-block:10px 4px}.subscription-controls label{display:flex;align-items:center;gap:8px}.subscription-controls select{width:auto;margin:0}.subscription-controls button{margin:0;min-height:36px}.subscription-url{width:100%;min-width:0}.subscription-links p{margin-block:4px}.subscription-usage{display:flex;flex-wrap:wrap;gap:10px 24px;margin:10px 0 0}.subscription-usage>div{display:flex;gap:8px}.subscription-usage dt{color:var(--muted)}.subscription-usage dd{margin:0;font-variant-numeric:tabular-nums}.subscription-expired{border-inline-start:3px solid var(--warn)}@media(max-width:600px){.portal-subscriptions .subscription-order{padding:12px}.subscription-order-meta{gap:6px 12px}.subscription-order-meta h2{flex-basis:100%}.subscription-order-meta a{margin-inline-start:0}.subscription-controls{gap:8px}.subscription-controls button{min-height:44px}.subscription-usage{gap:8px 16px}.subscription-usage>div{min-width:120px}}@media(max-width:600px){.shell:has(.portal-subscriptions){flex-direction:column}.shell:has(.portal-subscriptions)>.sidebar{width:100%;min-width:0;padding:8px 12px;border-inline-end:0;border-bottom:1px solid var(--border)}.shell:has(.portal-subscriptions) .brand{padding:0 0 4px}.shell:has(.portal-subscriptions) .sidebar nav{flex-direction:row;flex:none;gap:12px;overflow-x:auto}.shell:has(.portal-subscriptions) .nav-group{flex:none}.shell:has(.portal-subscriptions) .nav-group-header{padding:4px 0}.shell:has(.portal-subscriptions) .nav-group-items{flex-direction:row}.shell:has(.portal-subscriptions) .nav-link{white-space:nowrap}.shell:has(.portal-subscriptions) .sidebar-footer{flex-direction:row;align-items:center;padding-top:6px;margin-top:4px}.shell:has(.portal-subscriptions) .sidebar-footer .locale-switcher{width:auto;max-width:130px;margin:0}.shell:has(.portal-subscriptions) .sidebar-footer .user{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.shell:has(.portal-subscriptions)>.main{min-height:0;width:100%;padding:16px 12px}}