/* 'unset' values are to be overridden by dynamic styling */
.fab-station-ui__viewport {
overflow: hidden;
max-width: 100%;
position: relative;
width: unset;
height: unset;
--fab-station-ui__bg-color: #191714;
--fab-station-ui__bg-color-hover: #393734;
--fab-station-ui__fg-color: white;
}
.fab-station-ui__scroll-container {
height: 100%;
width: 100%;
overflow: auto;
}
.fab-station-ui__scale-container {
background-color: var(--fab-station-ui__bg-color);
width: unset;
height: unset;
}
.fab-station-ui__canvas {
position: relative;
transform: unset;
}
.fab-station-ui__graph-node {
position: absolute;
background-color: var(--fab-station-ui__bg-color);
padding: unset;
width: unset;
height: unset;
transform: unset;
}
.fab-station-ui__icon {
position: relative;
border: 6px double var(--fab-station-ui__fg-color);
width: unset;
height: unset;
padding: unset;
}
.fab-station-ui__label {
font-size: unset;
width: unset;
font-family: var(--font-family-monospace);
color: var(--fab-station-ui__fg-color);
line-height: 1em;
text-align: end;
}
.fab-station-ui__viewport.zoomed-out .fab-station-ui__label {
display: none;
}
.fab-station-ui__link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
a.new .fab-station-ui__link {
background-color: rgba(255, 0, 0, 0.15);
}
.fab-station-ui__link:hover,
a.new .fab-station-ui__link:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.fab-station-ui__graph-edge {
position: absolute;
background-color: var(--fab-station-ui__fg-color);
width: unset;
height: unset;
transform: unset;
}
.fab-station-ui__hud-zoom {
position: absolute;
right: 20px;
bottom: 20px;
width: 100px;
height: 42px;
border: 3px solid white;
background-color: var(--fab-station-ui__bg-color);
color: white;
font-family: var(--font-family-monospace);
font-size: 22px;
font-weight: 700;
text-align: center;
cursor: pointer;
}
.fab-station-ui__hud-zoom:hover {
background-color: var(--fab-station-ui__bg-color-hover);
}
.fab-station-ui__hud-crosshair {
position: absolute;
left: 50%;
top: 50%;
height: 0;
width: 0;
pointer-events: none;
}
.fab-station-ui__hud-crosshair::before {
position: absolute;
left: -5px;
content: '+';
font-size: 20px;
line-height: 0;
color: var(--fab-station-ui__fg-color);
text-shadow: 0 0 2px var(--fab-station-ui__bg-color);
opacity: 0.5;
}