/* SCION Horizon v0.19.0 — cohesive operational design system. */
:root{--ui-line:rgba(128,173,191,.28);--ui-outline:#80e7cf;--ui-panel:#101f2e;--ui-accent:#71e1bd;--ui-ink:#e6f3f7;--ui-muted:#99b2c4}
/* Real geographical tiles, as opposed to a stretched static illustration. */
.atlas-viewport{background:#152b3b;isolation:isolate;min-height:380px}
.atlas-viewport:before{display:none}.atlas-viewport:after{background:linear-gradient(0deg,#071b2b66,transparent 16%,transparent 88%,#071b2b45);z-index:2}
.atlas-plane,.map-plane.atlas-plane{position:absolute;inset:0;top:0;left:0;margin:0;width:100%;height:100%;transform:none!important;pointer-events:none;will-change:auto}
.atlas-live-tiles,.atlas-live-overlay{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden}
.atlas-plane>svg.atlas-live-overlay{width:100%;height:100%}
.atlas-live-tiles{z-index:0}.atlas-live-overlay{z-index:1;pointer-events:none}
.atlas-tile{position:absolute;top:0;left:0;width:256px;height:256px;max-width:none;image-rendering:auto;user-select:none;pointer-events:none;filter:saturate(.86) brightness(.93)}
.atlas-site{pointer-events:all;cursor:pointer}.atlas-halo{fill:#0928314d;stroke:#0b5249;stroke-width:2}.atlas-dot{fill:#52dabc;stroke:#073027;stroke-width:3;filter:drop-shadow(0 2px 5px #0d393baa)}
.atlas-online .atlas-dot{fill:#2fcaa2}.atlas-offline .atlas-dot{fill:#ef9a81}.atlas-unknown .atlas-dot{fill:#acc1d2}
.atlas-selected .atlas-halo{fill:#68e4cd70;stroke:#1b7d75;stroke-width:3}.atlas-colocation-dot{fill:#e5fcf8;stroke:#075e58;stroke-width:1.5}
.atlas-route{fill:none;stroke-width:3;stroke-linecap:round;pointer-events:none}.atlas-route.is-verified{stroke:#087f75;stroke-width:4;stroke-dasharray:7 8;filter:drop-shadow(0 1px 3px #06494566)}.atlas-route.is-unknown{stroke:#376779;stroke-width:2;stroke-dasharray:4 9;opacity:.82}
@media(prefers-reduced-motion:no-preference){.atlas-route.is-verified{animation:atlas-flow 1.4s linear infinite}}
@keyframes atlas-flow{to{stroke-dashoffset:-30}}
.atlas-attribution{position:absolute;z-index:8;bottom:6px;left:8px;max-width:calc(100% - 16px);font:500 10px/1.4 system-ui;background:rgba(247,250,250,.94);color:#253d46;padding:4px 7px;border-radius:5px;pointer-events:auto;box-shadow:0 1px 5px #0018}.atlas-attribution a{color:#075e65;text-decoration:underline;text-underline-offset:2px}
.atlas-tile-notice{position:absolute;z-index:7;left:50%;top:50%;transform:translate(-50%,-50%);max-width:min(90%,350px);padding:13px;background:#112a3ee8;color:#eaf5f6;border:1px solid #82c5c999;border-radius:12px;font-size:12px;line-height:1.7;text-align:center}
.atlas-tile-notice[hidden]{display:none!important}
.atlas-toolbar{border:1px solid #6b9cb488;box-shadow:0 8px 25px #09172655;border-radius:14px;padding:6px;background:#0b2335eb}.atlas-toolbar button{width:38px;height:38px;border-radius:10px;font-weight:650}.atlas-toolbar button:hover{background:#244f5b}
.atlas-tooltip{background:#0b2635f2;border:1px solid #67a5acbb;box-shadow:0 12px 28px #0006;border-radius:13px;z-index:10}.atlas-empty{border-radius:15px;z-index:5}
.atlas-colocated-list{display:grid;gap:3px;max-height:180px;overflow:auto;margin-top:8px}.atlas-colocated-list button,.atlas-close{padding:6px 8px;text-align:left;border:1px solid #7298a5;border-radius:5px;background:#18394a;color:#fff;font-size:11px}.atlas-close{margin-top:6px}
/* SVG topologies: zoom, background pan and fit, while node drag remains separate. */
.topology-zoom-host{position:relative;overflow:hidden;min-width:0;border:1px solid #3b627577;border-radius:17px}
.topology-zoom-host svg{display:block;width:100%;height:clamp(350px,57vh,740px)!important;min-height:300px!important;max-height:none!important;background:radial-gradient(ellipse at 50% 30%,#1b3949,#0e1e2e 75%);cursor:grab;touch-action:none;outline-offset:-3px}
.topology-zoom-host svg.is-panning{cursor:grabbing}.topology-zoom-host svg:focus-visible{outline:2px solid var(--ui-outline)}
.topology-zoom-tools{position:absolute;top:14px;right:14px;z-index:5;display:flex;align-items:center;gap:5px;background:#0b2134ee;border:1px solid #4b798999;box-shadow:0 9px 26px #0005;padding:6px;border-radius:12px}
.topology-zoom-tools button{appearance:none;border:1px solid transparent;background:transparent;border-radius:8px;min-width:34px;height:34px;color:#e0f3f4;font-weight:700;font-size:14px;cursor:pointer;padding:0 9px}
.topology-zoom-tools button:hover{background:#2a5061;border-color:#4a798b}.topology-zoom-tools button:focus-visible{outline:2px solid var(--ui-outline);outline-offset:2px}
.topology-zoom-tools output{min-width:48px;text-align:center;border-left:1px solid #426171;padding:0 4px 0 9px;color:#a5ced4;font:700 11px/1.2 ui-monospace,monospace}
/* Consistent modern controls across legacy and new screens. */
.main-area button,.main-area input,.main-area select,.main-area textarea,.resource-dialog button,.resource-dialog input,.resource-dialog select,.resource-dialog textarea,.sidebar button{font-family:inherit;transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
.main-area :is(input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea),.resource-dialog :is(input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea){box-sizing:border-box;min-height:41px;padding:10px 13px;background-color:#102538;border:1px solid #35566a;color:#e8f6fa;border-radius:11px;box-shadow:inset 0 1px 1px #05101b45;font-size:12.5px;line-height:1.45}
.main-area select,.resource-dialog select{appearance:none;-webkit-appearance:none;padding-right:35px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%239ed7cf' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 8 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:17px 17px}
.main-area :is(input,select,textarea):hover,.resource-dialog :is(input,select,textarea):hover{border-color:#58889a}
.main-area :is(input,select,textarea):focus-visible,.resource-dialog :is(input,select,textarea):focus-visible{outline:2px solid #66d9bc;outline-offset:1px;border-color:#66d9bc;box-shadow:0 0 0 4px #68e0bf18}
.main-area input:disabled,.main-area select:disabled,.main-area textarea:disabled{opacity:.52;cursor:not-allowed}
.main-area input[type=checkbox],.main-area input[type=radio],.resource-dialog input[type=checkbox],.resource-dialog input[type=radio]{accent-color:#67e3c2;width:17px;height:17px;vertical-align:middle;cursor:pointer}
.main-area :is(.button,.mini-button,.icon-button,.horizon-inline),.resource-dialog .button{border-radius:11px;border-width:1px;min-height:35px;letter-spacing:.01em;box-shadow:0 2px 7px #00000017;font-size:12px;font-weight:650;cursor:pointer}
.main-area :is(.button,.mini-button,.icon-button):hover:not(:disabled),.resource-dialog .button:hover:not(:disabled){transform:translateY(-1px);border-color:#75b4b4}
.main-area .button-primary,.resource-dialog .button-primary{background:linear-gradient(125deg,#75e7cb,#49c9ab);border:1px solid #85e5cb;color:#08251f;font-weight:750;box-shadow:0 6px 20px #32d2ab20}
.main-area .button-primary:hover:not(:disabled),.resource-dialog .button-primary:hover:not(:disabled){background:linear-gradient(125deg,#9af4db,#75ddc4);border-color:#b6fae6}
.main-area .button-ghost,.resource-dialog .button-ghost{background:#183246;border-color:#3c6074;color:#dcecf3}
.main-area button:focus-visible,.sidebar button:focus-visible,.resource-dialog button:focus-visible{outline:2px solid #80e7cf;outline-offset:3px}
.main-area button:disabled{opacity:.52;cursor:not-allowed;transform:none!important}
.main-area .panel,.main-area .studio-card,.main-area .horizon-panel{border-radius:17px;border-color:#304b5f;box-shadow:0 10px 30px #030e1918}
.main-area .panel-head{border-bottom-color:#30485b}.main-area .tag{border-radius:999px;padding:6px 11px}
.sidebar .nav-item{border-radius:11px}.sidebar .nav-item.active{box-shadow:inset 3px 0 0 #81e5cd;background:#1b3947}.sidebar .nav-item:hover{background:#193448}
@media(max-width:700px){.atlas-attribution span{display:none}.atlas-viewport{min-height:320px}.topology-zoom-host svg{height:420px!important}.topology-zoom-tools{top:9px;right:9px}.horizon-map-canvas{min-height:320px}}
@media(prefers-reduced-motion:reduce){.main-area button,.main-area input,.main-area select,.main-area textarea{transition:none!important}.atlas-route.is-verified{animation:none!important}}