@font-face { font-family:BankGothic; src:url('../files/fonts/BankGothic.ttf'); }
:root { color-scheme:dark; --bg:#111929; --panel:#1b263a; --panel-2:#202d43; --line:#3a4961; --text:#e8eef8; --muted:#a8b6cb; --cyan:#a9c9ef; --blue:#8bb8fb; --violet:#cba3ed; --green:#a5d9bb; --amber:#e5c183; }
body { background:#e9ecf1; color:#1c263b; font-family:'Helvetica Neue',Arial,sans-serif; }
main { width:min(1440px,90%); padding:0 0 60px; }
button,input { font:inherit; }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible { outline:2px solid #bda4f4; outline-offset:4px; }
.map-nav { display:flex; justify-content:space-between; align-items:center; gap:20px; height:88px; }
.map-wordmark { color:#1c263b; font-size:22px; font-weight:700; letter-spacing:-1px; text-decoration:none; }.map-wordmark span { color:#6b7fbb; }
.map-nav div { display:flex; gap:28px; font-size:12px; }.map-nav div a { color:#294fc5; text-decoration:none; }.map-nav div span { color:#566175; }
.map-hero { position:relative; isolation:isolate; display:flex; justify-content:space-between; align-items:end; gap:35px; padding:clamp(60px,8vw,115px) 0 65px; color:#fff; }
.map-hero::before { content:''; position:absolute; inset:0 calc((min(1440px, 90vw) - 100vw)/2); z-index:-1; background:#294fc5; }
.eyebrow { color:#a9c9ef; font:10px/1.5 ui-monospace,monospace; letter-spacing:2px; }.map-hero .eyebrow { color:#c3d5ff; }.map-hero .eyebrow span { color:#7fa7ff; }
.map-hero h1 { margin:26px 0 0; font:400 clamp(70px,10vw,150px)/.86 BankGothic,Arial,sans-serif; letter-spacing:-.06em; }.map-hero h1 em { font-style:normal; color:#bcd0ff; }
.map-hero .lead { color:#e0e7ff; font-size:13px; line-height:2; max-width:32ch; margin:0 0 7px; }
.badges { margin:0; gap:0; padding:20px 0; border-bottom:1px solid #bbc3d1; }.badge { border:0; border-right:1px solid #bbc3d1; border-radius:0; background:none; color:#566175; font:10px ui-monospace,monospace; padding:0 18px; }.badge:first-child { padding-left:0; }.badge:last-child { border:0; }
.explorer { padding:95px 0 75px; }.explorer-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:30px; }.explorer-heading .eyebrow,.architecture .eyebrow { color:#526eb1; }.explorer-heading h2,.architecture strong { margin:12px 0 0; font:400 clamp(32px,4vw,54px)/1 BankGothic,Arial,sans-serif; letter-spacing:-.04em; }.explorer-heading p { margin:0; font-size:12px; line-height:1.8; color:#566175; }
.explorer-shell { background:#111827; border:1px solid #334461; color:#e7effb; box-shadow:0 28px 60px #14234326; }
.explorer-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 20px; border-bottom:1px solid #344158; color:#b5c7de; font:10px/1.4 ui-monospace,monospace; letter-spacing:1px; }.explorer-indicator { display:inline-block; width:7px; height:7px; margin-right:9px; background:#a7e4bb; border-radius:50%; box-shadow:0 0 12px #93e4b4; }
.explorer-tools { display:flex; gap:20px; }.explorer-tools button,.network-details button { color:#c6d8f5; border:0; background:none; cursor:pointer; padding:3px 0; font:10px ui-monospace,monospace; }.explorer-tools button:hover,.network-details button:hover { color:white; }
.explorer-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; }.network-stage { position:relative; min-width:0; background:radial-gradient(ellipse at 50% 45%,#1d3150 0,#101a2a 67%); overflow:hidden; }
.network-stage::before { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(#a3bce909 1px,transparent 1px),linear-gradient(90deg,#a3bce909 1px,transparent 1px); background-size:40px 40px; }
.network-label,.network-hint { position:absolute; z-index:1; pointer-events:none; font:9px/1.5 ui-monospace,monospace; letter-spacing:1px; color:#9aafc9; }.network-label { inset:20px 22px auto; display:flex; justify-content:space-between; }.network-hint { left:22px; bottom:20px; }.network-hint span { color:#6c87a8; }
#network-graph { position:relative; width:100%; min-width:0; height:auto; min-height:440px; touch-action:pan-y; }.network-edge { fill:none; stroke:#6487b4; stroke-opacity:.25; stroke-width:1.2; transition:stroke-opacity .2s,stroke .2s; }.network-node { cursor:grab; outline:none; }.network-node:active { cursor:grabbing; }.network-node circle { stroke:#c5d7f0; stroke-width:1.2; transition:r .2s,stroke-width .2s,opacity .2s; }.network-node text { fill:#d5e2f5; font:11px ui-monospace,monospace; paint-order:stroke; stroke:#142033; stroke-width:4px; stroke-linejoin:round; pointer-events:none; }.network-node:focus-visible circle { stroke:#fff; stroke-width:4px; }.network-node:hover circle { stroke-width:3px; }.network-stage.has-selection .network-edge:not(.related) { stroke-opacity:.06; }.network-stage.has-selection .network-edge.related { stroke:#bdd8ff; stroke-opacity:.9; stroke-width:2; }.network-stage.has-selection .network-node:not(.related) { opacity:.2; }.network-node.selected circle { stroke:#fff; stroke-width:3px; filter:drop-shadow(0 0 10px #a9c9ef); }
.network-sidebar { padding:25px 22px; border-left:1px solid #344158; background:#151f2e; min-width:0; }.network-sidebar>label { display:block; font:9px ui-monospace,monospace; letter-spacing:1.4px; color:#a9bad2; margin-bottom:10px; }.network-sidebar input { display:block; width:100%; padding:11px 10px; border:1px solid #455a78; border-radius:0; background:#101927; color:#eff5ff; font:12px ui-monospace,monospace; }.network-sidebar input::placeholder { color:#899bb3; }.search-results { max-height:170px; overflow:auto; }.search-results button { display:block; width:100%; text-align:left; padding:8px; border:0; border-bottom:1px solid #344158; background:#1a283a; color:#d4e2f4; font:10px/1.5 ui-monospace,monospace; overflow-wrap:anywhere; cursor:pointer; }.search-results button:hover { background:#2b3d58; }
.network-details { padding:30px 0; border-bottom:1px solid #344158; }.network-details h3 { margin:12px 0; color:#f0f5ff; font:400 24px/1.25 BankGothic,Arial,sans-serif; overflow-wrap:anywhere; }.network-details p { color:#b5c3d5; font:12px/1.8 Arial,sans-serif; overflow-wrap:anywhere; }.network-details h4 { color:#9ab2d2; font:9px ui-monospace,monospace; letter-spacing:1px; margin:18px 0 8px; }.network-details .connections button { display:block; text-align:left; max-width:100%; overflow-wrap:anywhere; line-height:1.5; }.network-details a { display:inline-block; margin-top:18px; color:#b4d5ff; font:10px ui-monospace,monospace; text-decoration:none; border-bottom:1px solid #698bb4; }.network-legend { display:grid; grid-template-columns:1fr 1fr; gap:12px 4px; padding-top:22px; color:#a7b8cf; font:9px ui-monospace,monospace; }.network-legend i { display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:5px; background:#a9c9ef; }.network-legend .legend-system { background:#a890ed; }.network-legend .legend-home { background:#8bd6b5; }.network-legend .legend-asset { background:#d9b58e; }
.explorer-note { color:#647287; font-size:11px; line-height:1.8; margin:17px 0 0; }.architecture { border-top:1px solid #bbc3d1; padding:28px 0 45px; }.architecture summary { display:flex; align-items:end; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; }.architecture summary::-webkit-details-marker { display:none; }.architecture strong { display:block; color:#1c263b; }.architecture-toggle { font:10px ui-monospace,monospace; color:#526eb1; white-space:nowrap; }.architecture[open] .architecture-toggle { font-size:0; }.architecture[open] .architecture-toggle::after { content:'CLOSE DIAGRAM −'; font:10px ui-monospace,monospace; }.architecture .panel { margin-top:30px; }
.panel,.card { border-radius:0; background:var(--panel); color:var(--text); }.panel-head { border-color:#3a4961; }.cards .card,.live-block,.flow-step { border-radius:0; }.stamp { color:#b4c3d7; } footer { color:#65758a; }
@media(max-width:850px) { .map-hero { align-items:start; flex-direction:column; }.explorer-layout { grid-template-columns:1fr; }.network-sidebar { border-left:0; border-top:1px solid #344158; }.network-stage #network-graph { min-height:350px; }.network-legend { grid-template-columns:repeat(4,1fr); }.explorer { padding-top:65px; } }
@media(max-width:540px) { main { width:calc(100% - 36px); }.map-nav { height:auto; padding:20px 0; align-items:start; flex-direction:column; gap:13px; }.map-hero::before { inset-inline:-18px; }.map-hero h1 { font-size:17vw; }.badges { gap:10px; }.badge { border:0; padding:0; }.explorer-heading { align-items:start; flex-direction:column; }.explorer-toolbar { align-items:start; flex-direction:column; gap:12px; }.network-stage #network-graph { min-height:300px; }.network-label,.network-hint { font-size:8px; }.network-legend { grid-template-columns:1fr 1fr; }.architecture summary { align-items:start; flex-direction:column; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
.network-node { touch-action:none; }
.network-node .node-hit { stroke:none!important; filter:none!important; }