/* BUNDLED LEAFLET 1.9.4 — see assets/licenses/leaflet.txt */
/* required styles */



.leaflet-pane,

.leaflet-tile,

.leaflet-marker-icon,

.leaflet-marker-shadow,

.leaflet-tile-container,

.leaflet-pane > svg,

.leaflet-pane > canvas,

.leaflet-zoom-box,

.leaflet-image-layer,

.leaflet-layer {

	position: absolute;

	left: 0;

	top: 0;

	}

.leaflet-container {

	overflow: hidden;

	}

.leaflet-tile,

.leaflet-marker-icon,

.leaflet-marker-shadow {

	-webkit-user-select: none;

	   -moz-user-select: none;

	        user-select: none;

	  -webkit-user-drag: none;

	}

/* Prevents IE11 from highlighting tiles in blue */

.leaflet-tile::selection {

	background: transparent;

}

/* Safari renders non-retina tile on retina better with this, but Chrome is worse */

.leaflet-safari .leaflet-tile {

	image-rendering: -webkit-optimize-contrast;

	}

/* hack that prevents hw layers "stretching" when loading new tiles */

.leaflet-safari .leaflet-tile-container {

	width: 1600px;

	height: 1600px;

	-webkit-transform-origin: 0 0;

	}

.leaflet-marker-icon,

.leaflet-marker-shadow {

	display: block;

	}

/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */

/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */

.leaflet-container .leaflet-overlay-pane svg {

	max-width: none !important;

	max-height: none !important;

	}

.leaflet-container .leaflet-marker-pane img,

.leaflet-container .leaflet-shadow-pane img,

.leaflet-container .leaflet-tile-pane img,

.leaflet-container img.leaflet-image-layer,

.leaflet-container .leaflet-tile {

	max-width: none !important;

	max-height: none !important;

	width: auto;

	padding: 0;

	}



.leaflet-container img.leaflet-tile {

	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */

	mix-blend-mode: plus-lighter;

}



.leaflet-container.leaflet-touch-zoom {

	-ms-touch-action: pan-x pan-y;

	touch-action: pan-x pan-y;

	}

.leaflet-container.leaflet-touch-drag {

	-ms-touch-action: pinch-zoom;

	/* Fallback for FF which doesn't support pinch-zoom */

	touch-action: none;

	touch-action: pinch-zoom;

}

.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {

	-ms-touch-action: none;

	touch-action: none;

}

.leaflet-container {

	-webkit-tap-highlight-color: transparent;

}

.leaflet-container a {

	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);

}

.leaflet-tile {

	filter: inherit;

	visibility: hidden;

	}

.leaflet-tile-loaded {

	visibility: inherit;

	}

.leaflet-zoom-box {

	width: 0;

	height: 0;

	-moz-box-sizing: border-box;

	     box-sizing: border-box;

	z-index: 800;

	}

/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */

.leaflet-overlay-pane svg {

	-moz-user-select: none;

	}



.leaflet-pane         { z-index: 400; }



.leaflet-tile-pane    { z-index: 200; }

.leaflet-overlay-pane { z-index: 400; }

.leaflet-shadow-pane  { z-index: 500; }

.leaflet-marker-pane  { z-index: 600; }

.leaflet-tooltip-pane   { z-index: 650; }

.leaflet-popup-pane   { z-index: 700; }



.leaflet-map-pane canvas { z-index: 100; }

.leaflet-map-pane svg    { z-index: 200; }



.leaflet-vml-shape {

	width: 1px;

	height: 1px;

	}

.lvml {

	behavior: url(#default#VML);

	display: inline-block;

	position: absolute;

	}





/* control positioning */



.leaflet-control {

	position: relative;

	z-index: 800;

	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */

	pointer-events: auto;

	}

.leaflet-top,

.leaflet-bottom {

	position: absolute;

	z-index: 1000;

	pointer-events: none;

	}

.leaflet-top {

	top: 0;

	}

.leaflet-right {

	right: 0;

	}

.leaflet-bottom {

	bottom: 0;

	}

.leaflet-left {

	left: 0;

	}

.leaflet-control {

	float: left;

	clear: both;

	}

.leaflet-right .leaflet-control {

	float: right;

	}

.leaflet-top .leaflet-control {

	margin-top: 10px;

	}

.leaflet-bottom .leaflet-control {

	margin-bottom: 10px;

	}

.leaflet-left .leaflet-control {

	margin-left: 10px;

	}

.leaflet-right .leaflet-control {

	margin-right: 10px;

	}





/* zoom and fade animations */



.leaflet-fade-anim .leaflet-popup {

	opacity: 0;

	-webkit-transition: opacity 0.2s linear;

	   -moz-transition: opacity 0.2s linear;

	        transition: opacity 0.2s linear;

	}

.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {

	opacity: 1;

	}

.leaflet-zoom-animated {

	-webkit-transform-origin: 0 0;

	    -ms-transform-origin: 0 0;

	        transform-origin: 0 0;

	}

svg.leaflet-zoom-animated {

	will-change: transform;

}



.leaflet-zoom-anim .leaflet-zoom-animated {

	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);

	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);

	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);

	}

.leaflet-zoom-anim .leaflet-tile,

.leaflet-pan-anim .leaflet-tile {

	-webkit-transition: none;

	   -moz-transition: none;

	        transition: none;

	}



.leaflet-zoom-anim .leaflet-zoom-hide {

	visibility: hidden;

	}





/* cursors */



.leaflet-interactive {

	cursor: pointer;

	}

.leaflet-grab {

	cursor: -webkit-grab;

	cursor:    -moz-grab;

	cursor:         grab;

	}

.leaflet-crosshair,

.leaflet-crosshair .leaflet-interactive {

	cursor: crosshair;

	}

.leaflet-popup-pane,

.leaflet-control {

	cursor: auto;

	}

.leaflet-dragging .leaflet-grab,

.leaflet-dragging .leaflet-grab .leaflet-interactive,

.leaflet-dragging .leaflet-marker-draggable {

	cursor: move;

	cursor: -webkit-grabbing;

	cursor:    -moz-grabbing;

	cursor:         grabbing;

	}



/* marker & overlays interactivity */

.leaflet-marker-icon,

.leaflet-marker-shadow,

.leaflet-image-layer,

.leaflet-pane > svg path,

.leaflet-tile-container {

	pointer-events: none;

	}



.leaflet-marker-icon.leaflet-interactive,

.leaflet-image-layer.leaflet-interactive,

.leaflet-pane > svg path.leaflet-interactive,

svg.leaflet-image-layer.leaflet-interactive path {

	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */

	pointer-events: auto;

	}



/* visual tweaks */



.leaflet-container {

	background: #ddd;

	outline-offset: 1px;

	}

.leaflet-container a {

	color: #0078A8;

	}

.leaflet-zoom-box {

	border: 2px dotted #38f;

	background: rgba(255,255,255,0.5);

	}





/* general typography */

.leaflet-container {

	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;

	font-size: 12px;

	font-size: 0.75rem;

	line-height: 1.5;

	}





/* general toolbar styles */



.leaflet-bar {

	box-shadow: 0 1px 5px rgba(0,0,0,0.65);

	border-radius: 4px;

	}

.leaflet-bar a {

	background-color: #fff;

	border-bottom: 1px solid #ccc;

	width: 26px;

	height: 26px;

	line-height: 26px;

	display: block;

	text-align: center;

	text-decoration: none;

	color: black;

	}

.leaflet-bar a,

.leaflet-control-layers-toggle {

	background-position: 50% 50%;

	background-repeat: no-repeat;

	display: block;

	}

.leaflet-bar a:hover,

.leaflet-bar a:focus {

	background-color: #f4f4f4;

	}

.leaflet-bar a:first-child {

	border-top-left-radius: 4px;

	border-top-right-radius: 4px;

	}

.leaflet-bar a:last-child {

	border-bottom-left-radius: 4px;

	border-bottom-right-radius: 4px;

	border-bottom: none;

	}

.leaflet-bar a.leaflet-disabled {

	cursor: default;

	background-color: #f4f4f4;

	color: #bbb;

	}



.leaflet-touch .leaflet-bar a {

	width: 30px;

	height: 30px;

	line-height: 30px;

	}

.leaflet-touch .leaflet-bar a:first-child {

	border-top-left-radius: 2px;

	border-top-right-radius: 2px;

	}

.leaflet-touch .leaflet-bar a:last-child {

	border-bottom-left-radius: 2px;

	border-bottom-right-radius: 2px;

	}



/* zoom control */



.leaflet-control-zoom-in,

.leaflet-control-zoom-out {

	font: bold 18px 'Lucida Console', Monaco, monospace;

	text-indent: 1px;

	}



.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {

	font-size: 22px;

	}





/* layers control */



.leaflet-control-layers {

	box-shadow: 0 1px 5px rgba(0,0,0,0.4);

	background: #fff;

	border-radius: 5px;

	}

.leaflet-control-layers-toggle {

	background-image: url(images/layers.png);

	width: 36px;

	height: 36px;

	}

.leaflet-retina .leaflet-control-layers-toggle {

	background-image: url(images/layers-2x.png);

	background-size: 26px 26px;

	}

.leaflet-touch .leaflet-control-layers-toggle {

	width: 44px;

	height: 44px;

	}

.leaflet-control-layers .leaflet-control-layers-list,

.leaflet-control-layers-expanded .leaflet-control-layers-toggle {

	display: none;

	}

.leaflet-control-layers-expanded .leaflet-control-layers-list {

	display: block;

	position: relative;

	}

.leaflet-control-layers-expanded {

	padding: 6px 10px 6px 6px;

	color: #333;

	background: #fff;

	}

.leaflet-control-layers-scrollbar {

	overflow-y: scroll;

	overflow-x: hidden;

	padding-right: 5px;

	}

.leaflet-control-layers-selector {

	margin-top: 2px;

	position: relative;

	top: 1px;

	}

.leaflet-control-layers label {

	display: block;

	font-size: 13px;

	font-size: 1.08333em;

	}

.leaflet-control-layers-separator {

	height: 0;

	border-top: 1px solid #ddd;

	margin: 5px -10px 5px -6px;

	}



/* Default icon URLs */

.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */

	background-image: url(images/marker-icon.png);

	}





/* attribution and scale controls */



.leaflet-container .leaflet-control-attribution {

	background: #fff;

	background: rgba(255, 255, 255, 0.8);

	margin: 0;

	}

.leaflet-control-attribution,

.leaflet-control-scale-line {

	padding: 0 5px;

	color: #333;

	line-height: 1.4;

	}

.leaflet-control-attribution a {

	text-decoration: none;

	}

.leaflet-control-attribution a:hover,

.leaflet-control-attribution a:focus {

	text-decoration: underline;

	}

.leaflet-attribution-flag {

	display: inline !important;

	vertical-align: baseline !important;

	width: 1em;

	height: 0.6669em;

	}

.leaflet-left .leaflet-control-scale {

	margin-left: 5px;

	}

.leaflet-bottom .leaflet-control-scale {

	margin-bottom: 5px;

	}

.leaflet-control-scale-line {

	border: 2px solid #777;

	border-top: none;

	line-height: 1.1;

	padding: 2px 5px 1px;

	white-space: nowrap;

	-moz-box-sizing: border-box;

	     box-sizing: border-box;

	background: rgba(255, 255, 255, 0.8);

	text-shadow: 1px 1px #fff;

	}

.leaflet-control-scale-line:not(:first-child) {

	border-top: 2px solid #777;

	border-bottom: none;

	margin-top: -2px;

	}

.leaflet-control-scale-line:not(:first-child):not(:last-child) {

	border-bottom: 2px solid #777;

	}



.leaflet-touch .leaflet-control-attribution,

.leaflet-touch .leaflet-control-layers,

.leaflet-touch .leaflet-bar {

	box-shadow: none;

	}

.leaflet-touch .leaflet-control-layers,

.leaflet-touch .leaflet-bar {

	border: 2px solid rgba(0,0,0,0.2);

	background-clip: padding-box;

	}





/* popup */



.leaflet-popup {

	position: absolute;

	text-align: center;

	margin-bottom: 20px;

	}

.leaflet-popup-content-wrapper {

	padding: 1px;

	text-align: left;

	border-radius: 12px;

	}

.leaflet-popup-content {

	margin: 13px 24px 13px 20px;

	line-height: 1.3;

	font-size: 13px;

	font-size: 1.08333em;

	min-height: 1px;

	}

.leaflet-popup-content p {

	margin: 17px 0;

	margin: 1.3em 0;

	}

.leaflet-popup-tip-container {

	width: 40px;

	height: 20px;

	position: absolute;

	left: 50%;

	margin-top: -1px;

	margin-left: -20px;

	overflow: hidden;

	pointer-events: none;

	}

.leaflet-popup-tip {

	width: 17px;

	height: 17px;

	padding: 1px;



	margin: -10px auto 0;

	pointer-events: auto;



	-webkit-transform: rotate(45deg);

	   -moz-transform: rotate(45deg);

	    -ms-transform: rotate(45deg);

	        transform: rotate(45deg);

	}

.leaflet-popup-content-wrapper,

.leaflet-popup-tip {

	background: white;

	color: #333;

	box-shadow: 0 3px 14px rgba(0,0,0,0.4);

	}

.leaflet-container a.leaflet-popup-close-button {

	position: absolute;

	top: 0;

	right: 0;

	border: none;

	text-align: center;

	width: 24px;

	height: 24px;

	font: 16px/24px Tahoma, Verdana, sans-serif;

	color: #757575;

	text-decoration: none;

	background: transparent;

	}

.leaflet-container a.leaflet-popup-close-button:hover,

.leaflet-container a.leaflet-popup-close-button:focus {

	color: #585858;

	}

.leaflet-popup-scrolled {

	overflow: auto;

	}



.leaflet-oldie .leaflet-popup-content-wrapper {

	-ms-zoom: 1;

	}

.leaflet-oldie .leaflet-popup-tip {

	width: 24px;

	margin: 0 auto;



	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";

	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);

	}



.leaflet-oldie .leaflet-control-zoom,

.leaflet-oldie .leaflet-control-layers,

.leaflet-oldie .leaflet-popup-content-wrapper,

.leaflet-oldie .leaflet-popup-tip {

	border: 1px solid #999;

	}





/* div icon */



.leaflet-div-icon {

	background: #fff;

	border: 1px solid #666;

	}





/* Tooltip */

/* Base styles for the element that has a tooltip */

.leaflet-tooltip {

	position: absolute;

	padding: 6px;

	background-color: #fff;

	border: 1px solid #fff;

	border-radius: 3px;

	color: #222;

	white-space: nowrap;

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	user-select: none;

	pointer-events: none;

	box-shadow: 0 1px 3px rgba(0,0,0,0.4);

	}

.leaflet-tooltip.leaflet-interactive {

	cursor: pointer;

	pointer-events: auto;

	}

.leaflet-tooltip-top:before,

.leaflet-tooltip-bottom:before,

.leaflet-tooltip-left:before,

.leaflet-tooltip-right:before {

	position: absolute;

	pointer-events: none;

	border: 6px solid transparent;

	background: transparent;

	content: "";

	}



/* Directions */



.leaflet-tooltip-bottom {

	margin-top: 6px;

}

.leaflet-tooltip-top {

	margin-top: -6px;

}

.leaflet-tooltip-bottom:before,

.leaflet-tooltip-top:before {

	left: 50%;

	margin-left: -6px;

	}

.leaflet-tooltip-top:before {

	bottom: 0;

	margin-bottom: -12px;

	border-top-color: #fff;

	}

.leaflet-tooltip-bottom:before {

	top: 0;

	margin-top: -12px;

	margin-left: -6px;

	border-bottom-color: #fff;

	}

.leaflet-tooltip-left {

	margin-left: -6px;

}

.leaflet-tooltip-right {

	margin-left: 6px;

}

.leaflet-tooltip-left:before,

.leaflet-tooltip-right:before {

	top: 50%;

	margin-top: -6px;

	}

.leaflet-tooltip-left:before {

	right: 0;

	margin-right: -12px;

	border-left-color: #fff;

	}

.leaflet-tooltip-right:before {

	left: 0;

	margin-left: -12px;

	border-right-color: #fff;

	}



/* Printing */



@media print {

	/* Prevent printers from removing background-images of controls. */

	.leaflet-control {

		-webkit-print-color-adjust: exact;

		print-color-adjust: exact;

		}

	}


/* END BUNDLED LEAFLET */
:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color-scheme:dark;--bg:#111217;--surface:#181b1f;--raised:#22252b;--button:#2b2e35;--border:#34373f;--text:#d5d8e2;--muted:#9398a8;--blue:#3d73db;--accent:#ff783c;--field:#111217;--hover:#30343b}
/* Coordinate-based fiber optic map */
.fiber-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.fiber-summary>div{background:var(--surface);border:1px solid var(--border);border-radius:7px;padding:16px 18px}.fiber-summary span{font-size:10px;color:var(--muted);display:block}.fiber-summary strong{font-size:26px;font-weight:500;display:block;margin-top:10px}.fiber-summary small{font-size:12px;color:var(--muted);margin-left:5px}.fiber-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}.fiber-map-panel{overflow:hidden;min-width:0}.fiber-map.leaflet-container{height:540px;background:var(--raised);font-family:inherit;z-index:0}.fiber-map .leaflet-popup-content-wrapper,.fiber-map .leaflet-popup-tip{background:var(--surface);color:var(--text)}.fiber-map .leaflet-popup-content{font-size:12px;line-height:1.8}.fiber-map .leaflet-control-zoom a{background:var(--surface);color:var(--text);border-color:var(--border)}.fiber-map .leaflet-control-attribution{background:var(--surface);color:var(--muted);font-size:9px}.fiber-map .leaflet-control-attribution a{color:#487ac4}.fiber-map .leaflet-tooltip{background:var(--surface);color:var(--text);border-color:var(--border);box-shadow:0 1px 5px #0002}.fiber-map .fiber-point-label{font-size:10px;padding:3px 7px;font-weight:500}.fiber-map .fiber-route-tooltip{font-size:10px}.fiber-map .leaflet-tooltip-top:before{border-top-color:var(--border)}.fiber-marker-icon{background:none;border:0}.fiber-marker-dot{display:block;width:22px;height:22px;background:var(--point-color);border:3px solid var(--surface);border-radius:50%;box-shadow:0 0 0 2px var(--point-status),0 2px 7px #0005}.fiber-marker-dot.pop{border-radius:5px}.fiber-marker-dot.olt{border-radius:3px;transform:rotate(45deg)}.fiber-marker-dot.odc{width:19px;height:19px;margin:1px;border-radius:5px}.fiber-marker-dot.odp{width:16px;height:16px;margin:3px}.fiber-map-legend{display:flex;align-items:center;gap:17px;flex-wrap:wrap;padding:12px 15px;font-size:10px}.fiber-line-key{display:flex;align-items:center;gap:7px;color:var(--muted)}.fiber-line-key:before{content:"";width:23px;border-top:3px solid #31a96b}.fiber-line-key.planned:before{border-color:#d99a29;border-top-style:dashed}.fiber-line-key.down:before{border-color:#e04c62;border-top-style:dashed}.fiber-detail-panel{min-width:0}.fiber-detail-panel .panel-body{padding:18px}.fiber-detail-panel h3{font-size:20px;margin:9px 0 12px}.fiber-detail-panel .device-detail-list{grid-template-columns:85px minmax(0,1fr);font-size:11px;gap:12px 8px}.fiber-detail-panel .inline-link svg{width:15px;height:15px}.fiber-point-picker{padding:0 12px 12px;border-top:1px solid var(--border)}.fiber-point-picker h3{font-size:11px;font-weight:500;color:var(--muted);padding:13px 5px 5px}.fiber-point-picker>div{display:grid;gap:3px;max-height:255px;overflow:auto}.fiber-point-picker button{display:flex;justify-content:flex-start;gap:9px;border:0;background:none;padding:8px 5px;min-height:40px;text-align:left;font-size:11px}.fiber-point-picker button.active{background:var(--raised)}.fiber-point-picker i{width:8px;height:8px;flex-shrink:0;border-radius:50%}.fiber-point-picker small{display:block;font-size:9px;color:var(--muted);margin-top:5px}.fiber-point-picker b{margin-left:auto;color:var(--muted);font-size:9px;font-weight:500}.fiber-filter-note{font-size:10px;align-self:center;margin-left:auto}.fiber-example .network-filterbar>.checkbox-label{display:flex;align-items:center;gap:7px;min-height:36px}.fiber-tile-notice{padding:10px 15px;background:#e5b76515;color:var(--muted);font-size:11px;line-height:1.7}.fiber-load-message{padding:25px;color:var(--muted);font-size:13px}
@media(max-width:1200px){.fiber-layout{grid-template-columns:1fr}.fiber-detail-panel{display:grid;grid-template-columns:1fr 1fr}.fiber-detail-panel>.panel-heading{grid-column:1/-1}.fiber-point-picker{border-top:0;border-left:1px solid var(--border)}.fiber-map.leaflet-container{height:490px}}
@media(max-width:650px){.fiber-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.fiber-summary>div{padding:14px}.fiber-summary strong{font-size:23px}.fiber-detail-panel{display:block}.fiber-point-picker{border-left:0;border-top:1px solid var(--border)}.fiber-map.leaflet-container{height:410px}.fiber-filter-note{margin-left:0;flex-basis:100%}.fiber-example .network-filterbar>.checkbox-label{min-width:140px}.fiber-map-legend{gap:10px;font-size:9px}}
/* Network workspace and backup explorer */
.network-filterbar{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;padding:16px;margin-bottom:22px}.network-filterbar>label{display:grid;gap:7px;font-size:11px;color:var(--muted);min-width:0}.network-filterbar select,.network-filterbar button,.network-filterbar .button-link{font-size:12px}.network-filterbar>.search-field{display:flex;flex:1;min-width:180px;align-self:flex-end;gap:0}.network-filterbar>.search-field input{width:100%;min-width:0}.network-filterbar input[type=range]{padding:0;width:170px;accent-color:var(--blue);min-height:22px}.network-filterbar output{font-size:10px}.backup-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:15px;align-items:start}.backup-tree-panel{min-width:0}.backup-tree-panel nav{padding:10px 7px;max-height:580px;overflow:auto}.backup-tree-panel details{margin-bottom:10px}.backup-tree-panel summary{list-style:none;display:flex;align-items:center;gap:6px;font-size:11px;cursor:pointer;color:var(--muted);padding:8px 4px}.backup-tree-panel summary::-webkit-details-marker{display:none}.backup-tree-panel summary svg{width:16px;height:16px;flex-shrink:0}.backup-tree-panel details:not([open]) summary svg:first-child{transform:rotate(-90deg)}.backup-tree-panel nav button{display:flex;align-items:center;gap:8px;justify-content:flex-start;width:100%;border:0;background:none;font-size:10px;margin:3px 0;padding:8px 10px 8px 24px;text-align:left;white-space:normal;overflow-wrap:anywhere}.backup-tree-panel nav button>span{min-width:0;overflow-wrap:anywhere}.backup-tree-panel nav button.active{background:var(--raised);color:#80adff}.backup-tree-panel nav button svg{width:15px;height:15px}.backup-note{padding:0 14px 12px;line-height:1.8}.backup-workspace{min-width:0;overflow:hidden}.backup-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border-bottom:1px solid var(--border);flex-wrap:wrap}.backup-toolbar button{font-size:11px}.backup-file-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px;flex-wrap:wrap}.backup-file-heading strong{font-size:13px;overflow-wrap:anywhere}.backup-file-heading p{font-size:10px;margin:6px 0 0}.backup-file-heading button{font-size:10px}.backup-code{max-height:520px;min-height:330px;overflow:auto;padding:10px 0;background:var(--field)}.backup-code-line{display:grid;grid-template-columns:42px auto;width:max-content;min-width:100%;min-height:23px;font:11px/23px Consolas,"Courier New",monospace}.backup-code-line>span{padding-right:10px;text-align:right;color:var(--muted);border-right:1px solid var(--border);user-select:none}.backup-code-line>code{padding:0 10px;white-space:pre;font:inherit}.backup-compare-controls{display:flex;align-items:flex-end;gap:10px;padding:14px;flex-wrap:wrap}.backup-compare-controls>label:not(.checkbox-label){display:grid;gap:6px;font-size:10px;flex:1;min-width:150px}.backup-compare-controls select{font-size:10px;width:100%;min-width:0}.diff-summary{padding:10px 14px;border-top:1px solid var(--border);font-size:11px;color:var(--muted);background:var(--raised)}.diff-headings,.diff-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.diff-headings strong{font-size:10px;font-weight:500;padding:12px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.diff-headings strong:first-child,.diff-pane:first-child{border-right:1px solid var(--border)}.diff-pane{height:420px;overflow:auto;background:var(--field);min-width:0}.diff-removed{background:#f2495c1a;color:#ef8794}.diff-added{background:#73bf691a;color:#73bf69}.diff-gap{background:var(--raised)}.diff-legend{display:flex;gap:12px;flex-wrap:wrap;padding:12px;font-size:9px;color:var(--muted)}.diff-legend span{padding:3px 6px;border-radius:3px}.osm-holder{position:relative;overflow:hidden;background:var(--raised)}.osm-holder iframe{display:block;width:100%;height:100%;border:0}.map-examples-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.map-small{height:240px}.map-medium{height:360px}.map-custom{height:500px}.map-wide{grid-column:1/-1}.map-caption{font-size:10px;line-height:1.7;color:var(--muted);padding:0 14px;margin:12px 0}.map-height-label{grid-template-columns:1fr auto}.map-height-label input{grid-column:1/-1}.terminal-layout{display:grid;grid-template-columns:275px minmax(0,1fr);gap:16px;align-items:start}.terminal-form{display:grid;gap:14px}.terminal-form>label{display:grid;gap:7px;font-size:11px}.terminal-form input,.terminal-form select{width:100%;min-width:0;font-size:12px}.terminal-form .sample-form{gap:12px}.terminal-shortcuts{padding:0 18px 18px;display:grid;gap:7px}.terminal-shortcuts h3{font-size:11px;color:var(--muted);font-weight:500}.terminal-shortcuts button{justify-content:flex-start;font:10px Consolas,monospace;white-space:normal;overflow-wrap:anywhere;min-height:29px}.terminal-panel{min-width:0;overflow:hidden}.terminal-panel .panel-heading{flex-wrap:wrap}.terminal-panel h2{display:flex;align-items:center;gap:7px;font-size:12px}.terminal-status-dot{width:6px;height:6px;border-radius:50%;background:#9398a8}.terminal-status-dot.online{background:#73bf69}.terminal-output{height:480px;overflow:auto;background:#0b0e12;padding:18px;color:#d5d8e2;scrollbar-color:#34373f #0b0e12}.terminal-output pre{margin:0 0 10px;white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.7 Consolas,"Courier New",monospace}.terminal-output .terminal-muted{color:#9398a8}.terminal-output .terminal-success{color:#73bf69}.terminal-output .terminal-command{color:#80adff}.terminal-input{display:flex;align-items:center;gap:8px;background:#0b0e12;border-top:1px solid #34373f;padding:10px 14px;color:#73bf69;font:11px Consolas,monospace}.terminal-input label{white-space:nowrap;font-size:10px}.terminal-input input{flex:1;min-width:0;background:none;border:0;color:#d5d8e2;font:12px Consolas,monospace;padding:5px}.terminal-input button{background:#22252b;border-color:#34373f;color:#d5d8e2;min-height:28px}.terminal-footer{font-size:9px;color:var(--muted);padding:12px}.entity-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:20px;align-items:start}.entity-filters{padding:15px;display:grid;gap:14px}.entity-filters .search-field{width:100%}.entity-filters .search-field input{width:100%;min-width:0;font-size:11px;padding:8px}.entity-filters h3{font-size:11px;margin:8px 0 0;font-weight:500;color:var(--muted)}.entity-filters .checkbox-label{font-size:11px;line-height:1.6}.entity-filters select{font-size:11px;min-width:0}.entity-content{min-width:0}.entity-content .content-tabs{margin-bottom:10px}.device-name-button{padding:0;border:0;background:none;min-height:22px;color:#80adff;justify-content:flex-start;font-size:12px;text-align:left;white-space:normal}.device-name-button:hover{background:none;text-decoration:underline}.device-subtitle{display:block;font-size:10px;color:var(--muted);margin-top:5px}.mini-meter,.quality-meter{display:inline-block;width:50px;height:6px;background:var(--raised);border-radius:8px;overflow:hidden;vertical-align:middle;margin-right:8px}.quality-meter{width:65px}.mini-meter i,.quality-meter i{display:block;height:100%;background:#73bf69;border-radius:8px}.device-insight{width:33px;height:33px;border-radius:50%;padding:6px;border:1px solid var(--muted);background:transparent;color:var(--muted)}.device-insight.insight-error{border-color:#f2495c;color:#f2495c}.check-chip{display:inline-block;font-size:9px;background:var(--raised);border:1px solid var(--border);padding:4px 6px;border-radius:4px;margin:2px}.device-detail-list{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;font-size:12px;margin:20px 0;line-height:1.6}.device-detail-list dt{color:var(--muted)}.device-detail-list dd{margin:0;overflow-wrap:anywhere}.mapping-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}.topology-panel{min-width:0;overflow:hidden}.topology-canvas{overflow:auto;background:radial-gradient(circle,var(--border) 1px,transparent 1px);background-size:20px 20px}.topology-canvas>svg{display:block;width:100%;height:550px}.topology-edge line{stroke:#527861;stroke-width:2}.topology-edge.warning line{stroke:#e5b765;stroke-dasharray:5 3}.topology-edge.offline line{stroke:#f2495c;stroke-dasharray:4 5}.topology-edge text{fill:var(--muted);font-size:9px}.topology-node{cursor:pointer;outline:none}.topology-node rect{fill:var(--surface);stroke:var(--border);stroke-width:1.5}.topology-node.selected rect,.topology-node:focus rect{stroke:#6e9fff;stroke-width:2.5}.topology-node:hover rect{fill:var(--raised)}.topology-node text{fill:var(--text);font:11px "Segoe UI",sans-serif}.topology-node .node-type,.topology-node .node-ip{fill:var(--muted);font-size:9px}.node-status.online{fill:#73bf69}.node-status.warning{fill:#e5b765}.node-status.offline{fill:#f2495c}.topology-dim{opacity:.2}.topology-legend{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px;font-size:9px}.topology-detail{min-width:0}.topology-detail h3{font-size:17px}.topology-detail .device-detail-list{grid-template-columns:100px minmax(0,1fr);font-size:11px}.topology-map{height:200px}.flow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.flow-chart-panel .chart{height:225px;margin:0}.protocol-layout{display:flex;align-items:center;justify-content:center;gap:25px;min-height:280px;padding:20px;flex-wrap:wrap}.protocol-donut{width:160px;height:160px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--border);flex-shrink:0}.protocol-donut>div{width:112px;height:112px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.protocol-donut strong{font-size:28px;font-weight:500}.protocol-donut small{font-size:10px;color:var(--muted)}#flow-protocol-legend{display:grid;gap:15px}#flow-protocol-legend>div{display:grid;grid-template-columns:8px 40px 50px;gap:6px;align-items:center;font-size:11px}#flow-protocol-legend i{width:7px;height:7px;border-radius:2px}#flow-protocol-legend strong{font-weight:500}#flow-protocol-legend small{grid-column:2/-1;color:var(--muted);font-size:10px}.flow-rankings{display:grid;gap:20px;min-height:220px}.ranking-label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;margin-bottom:7px}.ranking-label strong{font-weight:400;color:var(--muted);font-size:10px}.ranking-track{background:var(--raised);height:6px;border-radius:5px;overflow:hidden}.ranking-track i{display:block;height:100%;border-radius:5px;background:#6e9fff}.protocol-chip{padding:3px 6px;border:1px solid var(--border);font-size:10px;border-radius:4px;color:#80adff}
@media(max-width:1200px){.backup-layout{grid-template-columns:210px minmax(0,1fr)}.entity-layout{grid-template-columns:210px minmax(0,1fr)}.mapping-layout{grid-template-columns:1fr}.topology-detail{display:grid;grid-template-columns:1fr 1fr}.topology-detail>.panel-heading{grid-column:1/-1}.topology-map{height:280px;align-self:center}.topology-detail .map-caption{grid-column:1/-1}.terminal-layout{grid-template-columns:230px minmax(0,1fr)}}
@media(max-width:800px){.backup-layout,.entity-layout,.terminal-layout,.map-examples-grid,.flow-grid{grid-template-columns:1fr}.backup-tree-panel nav{max-height:230px}.backup-tree-panel{width:100%}.backup-note{margin-bottom:0}.terminal-form{grid-template-columns:1fr 1fr;padding:15px;gap:12px}.terminal-form .sample-form{grid-column:1/-1}.terminal-shortcuts{display:flex;flex-wrap:wrap;gap:6px}.terminal-shortcuts h3{width:100%}.terminal-shortcuts button{font-size:9px}.entity-filters{grid-template-columns:1fr 1fr;gap:12px}.entity-filters>.search-field,.entity-filters>h3{grid-column:1/-1}.map-wide{grid-column:auto}.topology-detail{display:block}.topology-canvas>svg{height:430px}.backup-compare-controls{gap:8px}.diff-pane{height:330px}.backup-code-line{font-size:10px;grid-template-columns:30px auto}.backup-code-line>code{padding:0 6px}.backup-code-line>span{padding-right:5px}.network-filterbar{padding:12px;gap:12px}.network-filterbar>label{flex:1;min-width:130px}.network-filterbar select{width:100%}.flow-search{flex-basis:100%!important}.terminal-output{height:370px}.terminal-input{flex-wrap:wrap}.terminal-input label{width:100%}.device-detail-list{grid-template-columns:100px minmax(0,1fr)}.diff-headings strong{font-size:9px}.map-custom{max-height:650px}}
/* Button gallery, secondary sidebar and content tabs */
.component-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.example-card{padding:24px;min-width:0}.example-card h2{font-size:17px;margin:10px 0}.example-card p{font-size:12px;line-height:1.7;color:var(--muted);margin-bottom:22px}.button-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.btn-outline{background:transparent;border-color:var(--blue);color:#80adff}.btn-ghost{background:transparent;border-color:transparent}.btn-success{background:#2c713c;color:#fff;border-color:#2c713c}.btn-success:hover{background:#37874a}.btn-warning{background:#e5b765;color:#282013;border-color:#e5b765}.btn-warning:hover{background:#efc77d}.btn-sm{font-size:11px;padding:4px 9px;min-height:28px}.btn-lg{font-size:16px;padding:11px 20px;min-height:46px}.btn-square{width:36px;padding:7px}.example-result{display:block;color:var(--muted);font-size:11px;margin-top:14px;min-height:16px}.button-group{display:inline-flex;max-width:100%}.button-group button{border-radius:0;margin-left:-1px}.button-group button:first-child{margin-left:0;border-radius:6px 0 0 6px}.button-group button:last-child{border-radius:0 6px 6px 0}.button-group button[aria-pressed=true],#button-toggle[aria-pressed=true]{background:#3d73db22;border-color:var(--blue);color:#80adff;position:relative}.button-spinner{width:16px;height:16px;border:2px solid #ffffff50;border-top-color:#fff;border-radius:50%;animation:button-spin .7s linear infinite}@keyframes button-spin{to{transform:rotate(360deg)}}.button-dropdown{position:relative;display:inline-block}.button-dropdown summary{display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;min-height:36px;padding:7px 12px;border:1px solid var(--border);border-radius:6px;background:var(--button);font-size:14px}.button-dropdown summary::-webkit-details-marker{display:none}.button-dropdown summary:focus-visible{outline:2px solid #73a5ff;outline-offset:2px}.button-dropdown[open] summary{border-color:var(--blue)}.dropdown-actions{position:absolute;top:calc(100% + 6px);left:0;z-index:5;min-width:200px;padding:5px;background:var(--surface);border:1px solid var(--border);border-radius:7px;box-shadow:0 8px 25px #0003}.dropdown-actions button,.dropdown-actions a{display:flex;align-items:center;justify-content:flex-start;gap:8px;width:100%;background:none;border:0;text-decoration:none;color:var(--text);font-size:12px;padding:9px;border-radius:4px}.dropdown-actions button:hover,.dropdown-actions a:hover{background:var(--raised)}.secondary-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:start}.content-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:12px 6px;min-height:490px;position:sticky;top:16px}.content-sidebar-title{display:flex;align-items:center;gap:8px;padding:8px 9px 18px;color:var(--muted);font-size:11px}.content-sidebar nav{display:grid;gap:3px}.content-sidebar nav button{position:relative;justify-content:flex-start;border:0;background:none;color:var(--muted);padding:11px 12px;font-size:13px}.content-sidebar nav button.active{background:var(--raised);color:var(--text)}.content-sidebar nav button.active:before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:3px;background:var(--accent);border-radius:2px}.content-sidebar-note{border-top:1px solid var(--border);margin:30px 9px 0;padding-top:14px;color:var(--muted);font-size:9px;line-height:1.9}.local-content{min-width:0}.local-panel{min-height:490px}.panel-body{padding:22px}.panel-body h3{font-size:19px;font-weight:500;margin:0 0 8px}.panel-body>p{font-size:12px;line-height:1.8;margin-bottom:23px}.sample-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:780px}.sample-form label:not(.checkbox-label){display:grid;gap:8px;font-size:12px}.sample-form input,.sample-form select{width:100%;min-width:0}.sample-form .checkbox-label{display:flex}.sample-form .checkbox-label input{width:auto}.full-field{grid-column:1/-1}.sample-form textarea{margin-top:0;min-height:100px}.form-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:11px}.form-save-status{color:#73bf69;font-size:11px}.local-section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:24px}.local-section-heading h2{font-size:24px;font-weight:500;margin:0 0 8px}.local-section-heading p{font-size:13px;margin:0;line-height:1.7}.local-demo-chart{height:300px}.tabs-page-title{display:flex;align-items:center;gap:14px;margin-top:28px;margin-bottom:12px}.tabs-page-title .component-icon{margin:0;width:52px;height:52px}.tabs-page-title h2{font-size:26px;font-weight:400;margin:0}.content-tabs{display:flex;gap:8px;overflow-x:auto;border-bottom:1px solid var(--border);margin-bottom:26px}.content-tabs [role=tab]{position:relative;flex-shrink:0;background:none;border:0;border-radius:0;min-height:55px;padding:14px 17px;font-size:14px;color:var(--muted)}.content-tabs [role=tab][aria-selected=true]{color:var(--accent)}.content-tabs [role=tab][aria-selected=true]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;border-radius:3px;background:var(--accent)}.content-tabs [role=tab]:focus-visible{outline-offset:-3px}.tab-panel:focus-visible{outline:2px solid #73a5ff;outline-offset:5px}.tabs-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:22px}.metric-tile{padding:20px;display:flex;flex-direction:column;gap:14px;min-width:0}.metric-tile>span{font-size:12px;color:var(--muted)}.metric-tile>strong{font-size:30px;font-weight:500;color:#80adff}.metric-tile small{font-size:11px;color:var(--muted)}.usage-bars{display:grid;gap:22px}.usage-bars>div{display:grid;grid-template-columns:70px minmax(0,1fr) 40px;align-items:center;gap:14px;font-size:12px}.usage-bars b{font-size:11px;font-weight:400;color:var(--muted)}.usage-bars progress{width:100%;height:9px;appearance:none;border:0;border-radius:10px;overflow:hidden;background:var(--raised)}.usage-bars progress::-webkit-progress-bar{background:var(--raised)}.usage-bars progress::-webkit-progress-value{background:var(--blue);border-radius:10px}.usage-bars progress::-moz-progress-bar{background:var(--blue)}
@media(max-width:1100px){.secondary-layout{grid-template-columns:170px minmax(0,1fr)}.component-grid{grid-template-columns:1fr}.tabs-stat-grid{gap:10px}.metric-tile{padding:16px}.metric-tile>strong{font-size:25px}}
@media(max-width:750px){.secondary-layout{grid-template-columns:1fr}.content-sidebar{position:static;min-height:0;padding:8px}.content-sidebar-title{padding:7px 7px 12px}.content-sidebar nav{display:flex;overflow-x:auto;gap:4px}.content-sidebar nav button{flex-shrink:0;padding:10px}.content-sidebar-note{display:none}.content-sidebar nav button.active:before{top:auto;bottom:0;left:8px;right:8px;width:auto;height:3px}.sample-form{grid-template-columns:1fr}.panel-body{padding:17px}.local-panel{min-height:420px}.local-demo-chart{height:220px}.tabs-page-title h2{font-size:20px}.tabs-page-title .component-icon{width:43px;height:43px;flex-shrink:0}.content-tabs{gap:0}.content-tabs [role=tab]{font-size:12px;padding:12px;min-height:49px}.tabs-stat-grid{grid-template-columns:1fr}.local-section-heading{align-items:flex-start;flex-direction:column}.local-section-heading h2{font-size:21px}.example-card{padding:19px}.usage-bars>div{grid-template-columns:55px minmax(0,1fr) 30px;gap:8px}}
@media(prefers-reduced-motion:reduce){.button-spinner{animation:none}}
/* Server log explorer */
.logs-filterbar{display:flex;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:17px 18px;margin-bottom:18px;border:1px solid var(--border);border-radius:7px;background:var(--raised)}.logs-filterbar>label{display:grid;gap:7px;font-size:12px;font-weight:500}.logs-filter>label{font-size:12px;font-weight:500}.logs-filter .field-group{margin-top:7px}.logs-filter select{max-width:none;font-size:13px}.filter-key,.filter-equals{display:flex;align-items:center;min-height:36px;padding:8px 12px;background:var(--field);border:1px solid var(--border);font-size:12px;color:var(--muted);white-space:nowrap}.logs-reset{font-size:12px;margin-left:auto}.logs-volume-chart{height:185px!important;margin:0}.logs-volume-panel #logs-volume{padding:16px 15px 0}.logs-volume-legend{display:flex;gap:17px;padding:0 22px 14px;min-height:22px}.log-level-key{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted)}.log-level-key:before{content:"";width:7px;height:7px;border-radius:2px;background:var(--log-color)}.level-error{--log-color:#f2495c}.level-warn{--log-color:#e5b765}.level-info{--log-color:#73bf69}.level-debug{--log-color:#6e9fff}.logs-tabs{margin-top:20px;margin-bottom:18px}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:21px;padding:2px 6px;border-radius:12px;background:var(--raised);font-size:10px;color:var(--muted)}.logs-searchbar{display:flex;align-items:center;gap:12px;margin-bottom:22px;flex-wrap:wrap}.logs-searchbar .search-field{flex:1;min-width:220px}.logs-searchbar .search-field input{width:100%}.logs-searchbar>select,.logs-searchbar>button{font-size:12px}.logs-searchbar .checkbox-label{white-space:nowrap}.log-lines{padding:12px;min-width:0}.log-entry{border-left:3px solid var(--log-color);margin:3px 0;background:transparent}.log-entry>summary{display:flex;gap:7px;align-items:flex-start;cursor:pointer;list-style:none;padding:6px 8px;min-width:0}.log-entry>summary::-webkit-details-marker{display:none}.log-entry>summary:hover{background:var(--raised)}.log-entry>summary:focus-visible{outline:2px solid #73a5ff;outline-offset:1px}.log-chevron{display:flex;margin-top:2px;flex-shrink:0;color:var(--muted)}.log-chevron svg{width:13px;height:13px}.log-entry[open] .log-chevron{transform:rotate(90deg)}.log-entry code{font-family:Consolas,"Courier New",monospace;font-size:11px;line-height:1.7;overflow-wrap:anywhere;white-space:pre-wrap;min-width:0}.log-lines.nowrap{overflow-x:auto}.log-lines.nowrap .log-entry{width:max-content;min-width:100%}.log-lines.nowrap .log-entry>summary{padding-top:2px;padding-bottom:2px}.log-lines.nowrap .log-context{max-width:900px}.log-lines.nowrap code{white-space:pre;flex-shrink:0}.log-context{padding:15px 18px;background:var(--raised);border-top:1px solid var(--border);font-size:11px}.log-context-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.log-context-heading>strong{font-weight:500}.log-context dl{display:grid;grid-template-columns:130px minmax(0,1fr);gap:8px 18px;margin:15px 0 0}.log-context dt{color:var(--muted)}.log-context dd{margin:0;overflow-wrap:anywhere;font-family:Consolas,monospace}.logs-list-footer{border-top:1px solid var(--border);padding:12px 18px;display:flex;align-items:center;justify-content:space-between;font-size:11px}.logs-footnote{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:10px;flex-wrap:wrap;margin-top:17px}.logs-empty{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);gap:10px;padding:20px;text-align:center}.logs-empty>svg{width:24px;height:24px}.logs-empty strong{font-size:16px;font-weight:500}.logs-empty p{font-size:12px;margin:0}.logs-volume-panel .panel-heading>span{font-size:10px}#logs-panel-labels td:nth-child(2),#logs-panel-fields td:nth-child(3),#logs-panel-patterns td:first-child{white-space:normal;min-width:200px;max-width:650px;overflow-wrap:anywhere}
@media(max-width:750px){.logs-filterbar{gap:15px;padding:14px}.logs-filterbar>label{width:100%}.logs-filter{max-width:100%}.logs-filter .field-group>*{max-width:none}.logs-filter .filter-key{padding:8px;font-size:11px}.logs-filter select{font-size:12px;min-width:0;padding:8px}.logs-reset{margin-left:0}.logs-searchbar .search-field{width:100%;flex-basis:100%}.logs-volume-chart{height:155px!important}.log-lines{padding:8px}.log-entry code{font-size:10px}.log-context{padding:12px}.log-context dl{grid-template-columns:90px minmax(0,1fr);gap:9px}.logs-tabs [role=tab]{padding:12px 10px;font-size:11px}.logs-volume-legend{gap:12px;flex-wrap:wrap}}
/* System monitoring examples */
.system-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:34px 0 18px}.system-heading h2{font-size:21px;font-weight:500;margin:8px 0}.system-heading p{font-size:12px;line-height:1.7;margin:0}.system-heading .page-actions{justify-content:flex-end}.system-heading select,.system-heading button{font-size:12px}.system-stats{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;margin-bottom:22px}.system-stat{position:relative;min-width:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:13px 6px 0;text-align:center;overflow:hidden;min-height:128px}.system-stat h3{font-size:10px;font-weight:500;color:var(--muted);margin:0 0 17px}.system-stat>strong{font-size:23px;font-weight:600;display:block;margin-bottom:3px;letter-spacing:-.5px}.system-stat small{font-size:9px;color:var(--muted)}.system-stat strong small{font-size:13px;margin-left:2px}.stat-spark{width:100%;height:23px;display:block;margin-top:10px}.stat-spark polyline{fill:#6e9fff12;stroke:#6e9fff;stroke-width:1}.gauge-stat{padding:13px 4px 0}.gauge-stat h3{margin-bottom:5px}.system-gauge{display:block;width:100%;height:90px}.system-gauge path{fill:none;stroke-width:9}.gauge-track{stroke:var(--border)}.gauge-threshold{stroke:#f2495c;stroke-width:2!important;stroke-dasharray:25 100;stroke-dashoffset:-75}.gauge-value{stroke:#73bf69}.gauge-value.gauge-warning{stroke:#e5b765}.system-gauge text{fill:#73bf69;font:600 19px "Segoe UI",sans-serif}.system-gauge .gauge-end{fill:var(--muted);font-size:8px;font-weight:400}.system-section{margin-bottom:17px}.system-section>summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;padding:10px 0 12px;color:var(--muted);border-bottom:1px solid var(--border);margin-bottom:12px}.system-section>summary::-webkit-details-marker{display:none}.system-section>summary svg{width:15px;height:15px;display:block}.system-section h3{font-size:12px;color:var(--text);font-weight:500;margin:0}.section-chevron{transform:rotate(-90deg);transition:transform .15s}.system-section[open] .section-chevron{transform:rotate(0)}.section-count{font-size:10px;margin-left:auto}.system-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.system-panel-grid.three-columns{grid-template-columns:repeat(3,minmax(0,1fr))}.system-panel-grid>.wide-panel{grid-column:1/-1}.system-panel-grid .panel{min-width:0}.system-section .panel-heading{padding:11px 14px}.system-section .panel h2{font-size:12px}.chart-model{color:var(--muted);font-size:9px!important;border:1px solid var(--border);border-radius:3px;padding:2px 5px}.detailed-chart{padding:10px 13px!important}.chart-unit{font-size:9px;color:var(--muted);margin-bottom:4px}.chart-plot{position:relative}.detailed-chart .chart{height:165px;margin-top:0}.system-panel-grid .chart{height:155px}.system-panel-grid .wide-panel .chart{height:180px}.chart-threshold{stroke:#f2495c;stroke-width:1;stroke-dasharray:5 3;opacity:.7}.chart-crosshair{stroke:var(--muted);stroke-dasharray:3 3;stroke-width:1;pointer-events:none}.chart-tooltip{position:absolute;top:10px;width:185px;padding:9px 11px;z-index:4;pointer-events:none;background:var(--surface);border:1px solid var(--border);border-radius:5px;box-shadow:0 4px 16px #0004;font-size:10px}.chart-tooltip strong{display:block;margin-bottom:7px;color:var(--muted);font-weight:500}.chart-tooltip span{display:flex;justify-content:space-between;gap:5px;margin-top:4px}.chart-tooltip b{font-weight:500}.chart-legend-scroll{overflow-x:auto}.chart-legend-table{width:100%;border-collapse:collapse;text-align:right;font-size:9px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.chart-legend-table th{font-weight:400}.chart-legend-table thead th{color:#6e9fff;font-size:8px;padding:3px 5px}.chart-legend-table th:first-child{text-align:left;width:50%}.chart-legend-table td{padding:3px 5px}.series-toggle{display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;color:var(--muted);background:none;border:0;min-height:20px!important;padding:2px 0!important;font-size:9px!important}.series-toggle:hover{background:none;color:var(--text)}.series-toggle .legend-line{height:2px;width:12px;flex-shrink:0}.series-hidden{opacity:.4}.series-hidden .series-toggle{text-decoration:line-through}
@media(max-width:1500px){.system-stats{grid-template-columns:repeat(5,minmax(0,1fr))}.system-heading{align-items:flex-start;flex-direction:column}.system-heading .page-actions{justify-content:flex-start}}
@media(max-width:1050px){.system-panel-grid.three-columns{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:750px){.system-panel-grid,.system-panel-grid.three-columns{grid-template-columns:1fr}.system-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.system-stat{min-height:125px}.system-gauge{max-width:150px;margin:auto}.system-heading .page-actions{gap:8px}.system-heading h2{font-size:19px}.chart-legend-table{font-size:8px}.chart-legend-table td{padding:3px}.chart-legend-table th:first-child{width:auto}.detailed-chart{padding:8px!important}.chart-tooltip{width:165px;font-size:9px}}
/* Shared multipage components */
.button-link{display:flex;align-items:center;min-height:36px;padding:7px 12px;border:1px solid var(--border);border-radius:6px;background:var(--button);color:var(--text);text-decoration:none}.button-link:hover{background:var(--hover)}.button-link:focus-visible{outline:2px solid #73a5ff;outline-offset:2px}
.brand-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-size:18px}.brand-link img{width:28px;height:28px}.nav-link,.nav-sublink{text-decoration:none}.page-content{padding:28px;max-width:1800px;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.page-heading h1{font-size:25px;font-weight:500;margin:9px 0}.page-heading p{font-size:13px;margin:0;line-height:1.6}.eyebrow{font-size:10px;letter-spacing:1.6px;color:var(--muted);font-weight:600}.page-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.page-actions label{display:flex;align-items:center;gap:8px;font-size:12px}.demo-notice{display:flex;align-items:center;gap:9px;background:#3d73db12;border:1px solid #3d73db45;color:var(--muted);padding:12px 14px;border-radius:6px;font-size:12px;margin-bottom:20px;flex-wrap:wrap}.notice-right{margin-left:auto;font-size:11px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.stat-card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px}.stat-card{padding:19px 20px}.stat-label{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px;gap:12px}.stat-label svg{width:17px!important;height:17px!important}.stat-card>strong{display:block;font-size:33px;font-weight:500;letter-spacing:-1px;margin:16px 0 9px}.stat-card strong small{font-size:17px;color:var(--muted);margin-left:4px;letter-spacing:0}.stat-card>span{font-size:10px}.positive{color:#73bf69}.warning-text{color:#e5b765}.monitor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border)}.panel h2{font-size:14px;font-weight:500;margin:0}.panel-heading>span{font-size:11px}.monitor-chart{padding:12px 16px}.monitor-chart .chart{height:205px}.monitor-legend{display:flex;align-items:center;gap:17px;flex-wrap:wrap;font-size:11px;color:var(--muted);padding-top:4px}.monitor-legend span{display:flex;align-items:center;gap:6px}.legend-line{height:3px;width:16px;border-radius:1px}.service-panel{margin-top:20px}.inline-link,.demo-link{color:#80adff;text-decoration:none;font-size:12px;display:inline-flex;align-items:center;gap:5px}.inline-link:hover,.demo-link:hover{text-decoration:underline}.table-scroll{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;text-align:left;font-size:12px;white-space:nowrap}.data-table th{font-size:11px;font-weight:500;color:var(--muted);padding:13px 18px;background:var(--raised)}.data-table td{padding:15px 18px;border-top:1px solid var(--border)}.data-table td strong{font-weight:500}.data-table tbody tr:hover{background:var(--raised)}.status-pill{display:inline-flex;align-items:center;gap:6px;border-radius:4px;padding:4px 7px;font-size:10px;border:1px solid transparent}.status-pill:before{content:"";width:5px;height:5px;background:currentColor;border-radius:50%}.healthy{background:#73bf6915;color:#73bf69;border-color:#73bf6933}.degraded{background:#e5b76515;color:#dca94f;border-color:#e5b76533}.offline{background:#ef6a6a15;color:#ef6a6a;border-color:#ef6a6a33}.table-toolbar{display:flex;align-items:center;gap:10px;padding:16px;flex-wrap:wrap}.table-toolbar>span{margin-left:auto;font-size:11px}.search-field{display:flex;align-items:center;border:1px solid var(--border);background:var(--field);border-radius:6px;padding-left:10px;color:var(--muted)}.search-field input{border:0;background:none;width:240px}.table-toolbar select{font-size:12px}.sort-button{background:none;border:0;min-height:0;padding:0;color:var(--muted);font-size:11px}.sort-button svg{width:13px;height:13px}.sort-button:hover{background:none;color:var(--text)}th[aria-sort=descending] .sort-button svg{transform:rotate(180deg)}th[aria-sort=ascending] .sort-button{color:var(--text)}.table-pagination{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--border);font-size:11px}.table-pagination button{min-height:30px;padding:5px}.table-pagination select{min-height:30px;font-size:11px}.page-footnote{font-size:11px;color:var(--muted);margin-top:16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.popup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:22px}.popup-card{padding:24px;display:flex;flex-direction:column;align-items:flex-start}.component-icon{width:43px;height:43px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#3d73db1a;color:#80adff;margin-bottom:20px}.component-icon.orange{background:#ff783c1a;color:#ff9b70}.component-icon.green{background:#73bf691a;color:#73bf69}.component-tag{border:1px solid var(--border);border-radius:20px;font-size:11px;padding:6px 11px;color:var(--muted)}.popup-card h2{font-size:18px;margin-top:9px}.popup-card p{color:var(--muted);font-size:13px;line-height:1.7;margin-bottom:22px;max-width:360px}.popup-card>button{margin-top:auto;font-size:12px}.demo-resource{width:100%;display:flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid var(--border);border-radius:6px;background:var(--raised);font-size:12px;margin-top:auto}.demo-resource .icon-button{margin-left:auto;color:#ef6a6a}.form-result{font-size:12px;color:#73bf69;margin-top:12px;overflow-wrap:anywhere}.danger{background:#b93d44;color:#fff;border-color:#b93d44}.danger:hover{background:#ce4b52}.dialog-form{display:grid;gap:16px}.dialog-form label,.login-card form>label{display:grid;gap:7px;font-size:12px;color:var(--text)}.dialog-form input{width:100%}.dialog-buttons{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.login-page{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 15% 35%,#3d73db0e,transparent 60%),var(--bg)}.login-header{display:flex;align-items:center;justify-content:space-between;padding:26px 40px}.login-header .brand-link>.muted{font-size:13px;padding-left:12px;border-left:1px solid var(--border)}.login-layout{display:grid;grid-template-columns:1fr 420px;gap:100px;max-width:1050px;width:100%;margin:auto;padding:45px 30px 65px;align-items:center}.login-intro h1{font-size:49px;line-height:1.15;letter-spacing:-2px;font-weight:500;margin:20px 0}.login-intro>p{font-size:14px;color:var(--muted);line-height:1.8;max-width:360px}.login-visual{margin-top:32px;padding:20px;border:1px solid var(--border);border-radius:10px;background:var(--surface);transform:rotate(-2deg);max-width:390px;box-shadow:0 20px 40px #0001}.visual-top{display:flex;align-items:center;gap:7px;font-size:11px}.visual-top>.muted{margin-left:auto}.visual-metrics{display:flex;gap:45px;margin:24px 0 8px}.visual-metrics div>span{font-size:10px;color:var(--muted)}.visual-metrics strong{display:block;font-size:27px;font-weight:500;margin-top:6px}.visual-metrics small{font-size:14px;color:var(--muted)}.login-visual svg{width:100%;height:100px}.visual-caption{font-size:10px;color:#73bf69}.login-card{padding:32px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.login-logo{width:39px;height:39px}.login-card h2{font-size:25px;font-weight:500;margin:20px 0 8px}.login-card>p{font-size:13px;margin:0 0 27px}.login-card form{display:grid;gap:18px}.password-field{display:flex;align-items:center;background:var(--field);border:1px solid var(--border);border-radius:6px}.password-field input{border:0;width:100%;min-width:0;background:none}.password-field button{margin-right:5px}.login-options{display:flex;align-items:center;justify-content:space-between;gap:8px}.checkbox-label{display:flex;align-items:center;gap:7px;font-size:11px;cursor:pointer}.checkbox-label input{min-height:0;margin:0;accent-color:var(--blue)}.login-options .text-button{font-size:11px;padding:0;color:#80adff}.login-submit{width:100%;min-height:40px}.login-note{display:flex;align-items:flex-start;gap:7px;font-size:10px;color:var(--muted);line-height:1.7;margin:0}.login-note svg{width:14px!important;height:14px!important;margin-top:2px}.demo-link{margin-top:25px;font-size:11px}.login-footer{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;border-top:1px solid var(--border);font-size:11px;color:var(--muted)}
@media(max-width:1100px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-grid{grid-template-columns:1fr}.login-layout{gap:45px;grid-template-columns:1fr 390px}.login-intro h1{font-size:40px}}
@media(max-width:800px){.popup-grid{grid-template-columns:1fr}.page-content{padding:20px}.page-heading{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:22px}.login-layout{display:block;max-width:440px;padding:30px 20px 50px}.login-intro{display:none}.login-header{padding:20px}.login-footer{padding:20px}.login-footer span{display:none}}
@media(max-width:650px){.page-content{padding:18px 12px}.stat-card{padding:15px}.stat-card>strong{font-size:27px}.stat-label{font-size:11px}.stat-card>span{font-size:9px}.stats-grid{gap:10px}.table-toolbar{padding:12px}.search-field{width:100%}.search-field input{width:100%}.data-table td,.data-table th{padding:12px}.monitor-chart{padding:10px}.monitor-chart .chart{height:180px}.notice-right{margin-left:0}.popup-card{padding:20px}.login-card{padding:25px}.login-header .brand-link>.muted{display:none}}
html[data-theme=light]{color-scheme:light;--bg:#fafafa;--surface:#fff;--raised:#f4f4f5;--button:#ebebed;--border:#d8d9dc;--text:#17212f;--muted:#687080;--field:#fff;--hover:#eeeef0}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px}button,input,select,textarea{font:inherit}button,select{cursor:pointer}button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:36px;padding:7px 12px;border:1px solid var(--border);border-radius:6px;background:var(--button);color:var(--text);white-space:nowrap}button:hover{background:var(--hover)}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #73a5ff;outline-offset:2px}button svg,span[data-icon] svg{width:19px;height:19px;display:block;flex-shrink:0}button:disabled{opacity:.5}input,select,textarea{background:var(--field);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:8px 12px;min-height:36px}input::placeholder,textarea::placeholder{color:var(--muted)}.muted{color:var(--muted)}.icon-button{border:0;background:transparent;padding:7px;min-width:32px}.sidebar{width:280px;position:fixed;inset:0 auto 0 0;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;height:61px;padding:0 18px;color:var(--text);font-size:18px;text-decoration:none;border-bottom:1px solid var(--border)}.brand img{width:28px;height:28px}.brand button{margin-left:auto;font-size:23px}.sidebar nav{padding:14px 10px;overflow-y:auto}.nav-link{position:relative;width:100%;justify-content:flex-start;background:none;border:0;min-height:40px;gap:13px;color:var(--muted);padding:8px 12px;margin:0 0 1px;text-align:left;font-size:14px}.nav-link .nav-label{overflow:hidden;text-overflow:ellipsis}.nav-link .nav-chevron{margin-left:auto;font-size:16px}.nav-link.active{color:var(--text);background:var(--button)}.nav-link.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);border-radius:2px}.badge{font-size:11px;color:#80adff;border:1px solid #3d5277;padding:2px 5px;border-radius:3px}.sidebar-bottom{margin-top:auto;padding:25px 20px 32px}.trial{width:100%;border-color:#709bfb;background:#3670d51a;min-height:44px}.sidebar-footer{height:48px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 18px}.version{font-size:9px;letter-spacing:1.3px;color:var(--muted)}main{margin-left:280px;min-height:100vh}.topbar{height:61px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:20px}.breadcrumb{display:flex;align-items:center;gap:13px;font-size:15px;min-width:0}.datasource-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.header-actions{display:flex;align-items:center;gap:8px}.search-button{background:var(--field);width:260px;justify-content:flex-start;color:var(--muted)}kbd{margin-left:auto;font-size:11px;font-family:inherit}.divider{height:26px;width:1px;background:var(--border);margin:0 3px}.invite{background:none;border:0}.avatar{width:29px;min-height:29px;padding:0;border-radius:50%;background:#423cc1;color:#fff;font-size:12px;font-weight:700}.banner{display:flex;align-items:center;gap:15px;padding:12px 22px;background:var(--blue);color:white;min-height:60px}.banner>span svg{width:24px;height:24px}.banner strong{font-weight:500}.banner button{border-color:#fff;background:transparent;color:#fff;min-height:33px}.banner .banner-close{margin-left:auto;border:0;font-size:28px;padding:0 5px}.workspace{padding:20px}.toolbar,.toolbar-group{display:flex;align-items:center;gap:8px}.toolbar{justify-content:space-between;gap:15px;margin-bottom:20px;flex-wrap:wrap}.source-select{max-width:290px;background:var(--surface)}.time-controls{display:flex}.time-controls button,.time-controls select{border-radius:0}.time-controls button:first-child{border-radius:6px 0 0 6px}.time-controls button:last-child{border-radius:0 6px 6px 0}.time-controls select{max-width:145px;background:var(--button);border-left:0;border-right:0}.primary{background:var(--blue);border-color:var(--blue);color:white}.primary:hover{background:#5086ed}.explore-layout{display:flex;gap:10px}.outline{width:170px;flex-shrink:0;border:1px solid var(--border);border-radius:12px;min-height:calc(100vh - 202px);background:var(--surface);padding:10px 5px}.outline-collapse{display:flex;margin-left:auto;color:var(--muted);height:25px;min-height:25px}.outline-item{width:100%;justify-content:flex-start;position:relative;background:var(--raised);border:0;margin-top:5px;color:var(--muted);font-size:12px}.outline-item:before{content:"";position:absolute;left:0;top:0;bottom:0;background:var(--accent);width:4px;border-radius:2px}.query-content{min-width:0;flex:1}.query-card{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:10px;margin-bottom:10px}.query-heading{min-height:36px;display:flex;align-items:center;gap:22px;background:var(--raised);padding:0 12px;border-radius:6px}.query-letter{color:#6b9bff}.query-heading em{font-size:12px}.query-heading-actions{display:flex;align-items:center;gap:3px;margin-left:auto}.text-button{border:0;background:none;font-size:12px;padding:3px 8px}.query-heading .icon-button svg{width:16px;height:16px}.grip{font-size:22px}.query-body{padding:10px 20px}.builder-toolbar{display:flex;align-items:center;gap:24px;margin-bottom:10px}.small{font-size:12px;min-height:28px;padding:4px 8px}.explain{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;cursor:pointer}.explain input{position:absolute;opacity:0;width:1px;min-height:0}.switch{display:block;width:32px;height:17px;border:1px solid var(--border);border-radius:20px;background:var(--field);padding:2px}.switch:before{content:"";display:block;width:11px;height:11px;border-radius:50%;background:var(--muted);transition:transform .2s}.explain input:checked+.switch{background:var(--blue)}.explain input:checked+.switch:before{background:#fff;transform:translateX(14px)}.explain input:focus-visible+.switch{outline:2px solid #73a5ff}.segmented{margin-left:auto;display:flex;border:1px solid var(--border);border-radius:6px;padding:2px}.segmented button{border:0;background:none;min-height:23px;padding:2px 8px;font-size:12px;color:var(--muted)}.segmented button.active{background:var(--button);color:var(--text)}.metric-row{display:flex;gap:16px;align-items:flex-end;background:var(--raised);padding:12px 10px;border-radius:7px;flex-wrap:wrap}.metric-row label{font-size:12px;font-weight:500}.field-group{display:flex;margin-top:6px}.field-group>*{border-radius:0;max-width:190px;margin-left:-1px}.field-group>*:first-child{border-radius:6px 0 0 6px;margin-left:0}.field-group>*:last-child{border-radius:0 6px 6px 0}.field-group select,.field-group input{font-size:14px}.field-group input{width:145px}.filter-add{margin-bottom:0}.operations{background:var(--raised);border-radius:7px;padding:9px 10px;margin-top:5px;display:flex;align-items:center;gap:10px}.query-options{background:var(--raised);border-radius:6px;margin-top:5px;padding:12px;font-size:12px}.query-options summary{cursor:pointer;color:var(--muted)}.query-options summary strong{color:var(--text);font-weight:500;margin:0 16px 0 6px}.query-options summary span{margin-right:15px;display:inline-block;line-height:20px}.options-content{display:flex;gap:20px;padding-top:12px}.options-content label{display:flex;align-items:center;gap:10px}.query-footer{display:flex;gap:8px;flex-wrap:wrap;padding-top:6px}.result-panel{min-height:190px;border:1px solid var(--border);background:var(--surface);border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}.empty-state{font-size:26px;color:var(--muted)}.result-meta{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;padding:12px 4px}.meta-right{margin-left:auto}.status-dot{width:6px;height:6px;background:#73bf69;border-radius:50%}.sidebar-open{display:none}.sidebar-hidden .sidebar{display:none}.sidebar-hidden main{margin-left:0}.sidebar-hidden .sidebar-open{display:flex}.explanation{color:var(--muted);font-size:12px;line-height:1.7}.extra-filter{padding:8px;background:var(--raised);display:flex;gap:8px}.extra-filter input{width:150px}#code-editor{padding:12px;background:var(--raised);border-radius:6px}#code-editor label{font-size:12px}textarea{display:block;resize:vertical;width:100%;min-height:88px;margin-top:8px;font-family:Consolas,monospace;color:#92c4ff}.chart-wrap{width:100%;padding:18px 20px}.chart-title{display:flex;align-items:center;justify-content:space-between;font-size:13px}.chart-title small{font-size:11px;color:var(--muted)}.chart{width:100%;height:210px;display:block;margin-top:10px}.chart text{fill:var(--muted);font-size:10px}.chart .grid{stroke:var(--border);stroke-width:1}.chart-legend{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.chart-legend:before{content:"";height:3px;width:18px;background:#73bf69}.split-view .query-content{display:grid;grid-template-columns:1fr 1fr;gap:10px}.split-view .result-panel{align-self:start;min-height:370px}.split-view .query-footer button{font-size:12px}.split-view .query-heading em,.split-view .query-options summary span{display:none}.split-view #additional-queries{grid-column:1}.split-view .result-meta{grid-column:2}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);padding:12px 20px;background:var(--raised);color:var(--text);border:1px solid var(--border);border-left:3px solid #73bf69;border-radius:6px;box-shadow:0 8px 30px #0003;z-index:60;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}dialog{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;width:480px;max-width:calc(100% - 32px);padding:22px;box-shadow:0 20px 100px #0006}dialog::backdrop{background:#0008}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.modal-header h2{font-size:18px;margin:0;font-weight:500}#modal-content{line-height:1.8;color:var(--muted);font-size:13px}.modal-footer{display:flex;justify-content:flex-end;margin-top:22px}.modal-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.modal-list button{justify-content:flex-start}#search-input{width:100%}.query-copy{display:flex;gap:10px;align-items:center;padding:12px;border:1px solid var(--border);background:var(--surface);border-radius:8px;margin-bottom:10px}.query-copy code{color:var(--muted);overflow-wrap:anywhere}.query-copy button{margin-left:auto}[hidden]{display:none!important}
.nav-chevron{display:flex;align-items:center;transition:transform .2s}.nav-link .nav-chevron svg{width:16px;height:16px}.nav-link[aria-expanded=true] .nav-chevron{transform:rotate(180deg)}.nav-submenu{margin:2px 0 8px 21px;padding:2px 0 2px 13px;border-left:1px solid var(--border)}.nav-sublink{display:flex;width:100%;justify-content:flex-start;gap:10px;border:0;background:transparent;color:var(--muted);text-align:left;white-space:normal;font-size:13px;min-height:34px;padding:7px 10px}.nav-sublink:hover{background:var(--raised);color:var(--text)}.nav-sublink.active{color:#80adff;background:#3670d51a}.submenu-dot{width:4px;height:4px;flex-shrink:0;border-radius:50%;background:currentColor}.breadcrumb>span[data-icon] svg,.chevron svg,.query-heading>span[data-icon] svg{width:16px;height:16px}.sidebar nav{min-height:0;flex:1}.brand,.sidebar-footer{flex-shrink:0}.sidebar-bottom{flex-shrink:0;padding-top:16px;padding-bottom:20px}
.nav-link{display:flex}.nav-link>svg{width:19px;height:19px;display:block;flex-shrink:0}.topbar{justify-content:flex-start}.topbar>.sidebar-open{flex-shrink:0}.topbar>.breadcrumb{margin-right:auto}.topbar>.header-actions{flex-shrink:0}
@media(min-width:1700px){.sidebar{width:360px}main{margin-left:360px}.outline{width:190px}body{font-size:16px}.nav-link{font-size:16px;min-height:40px}.search-button{width:340px}.query-heading em,.query-options,.small,.text-button,.explain,.metric-row label{font-size:14px}.result-panel{min-height:190px}}
@media(max-width:1200px){.search-button{width:180px}.breadcrumb .datasource-name{max-width:220px}.header-actions{gap:3px}.outline{width:140px}.query-body{padding:10px 5px}.run-label{display:none}.query-heading{gap:13px}.query-heading em{max-width:180px}.toolbar-group{flex-wrap:wrap}.split-view .query-content{display:block}.invite{font-size:0}.invite svg{font-size:14px}}
@media(max-width:900px){.sidebar{width:240px}.sidebar nav{padding:10px}.nav-link{font-size:13px}main{margin-left:240px}.breadcrumb .datasource-name{display:none}.search-button{width:150px}.header-actions>.divider,.header-actions>button[data-modal="Help & documentation"]{display:none}.outline{display:none}.workspace{padding:14px}.query-heading em{max-width:150px}.banner{font-size:12px;gap:10px;padding:12px 15px}.banner strong{max-width:320px}.query-heading-actions .icon-button{display:none}}
@media(max-width:650px){.sidebar{display:none;width:260px;box-shadow:20px 0 60px #0004}.mobile-nav .sidebar{display:flex}main{margin-left:0}.sidebar-open{display:flex}.topbar{padding:0 12px;gap:8px;height:55px}.breadcrumb{margin-right:auto;font-size:14px}.search-button{width:auto;padding:8px}.search-button>span:not([data-icon]),.search-button kbd,.header-actions .invite,.header-actions>button[data-modal="Create new"]{display:none}.banner{flex-wrap:wrap}.banner strong{flex:1;font-size:11px}.banner button{font-size:11px}.banner>span svg{width:20px}.banner .banner-close{font-size:22px}.workspace{padding:12px}.toolbar{gap:10px;margin-bottom:12px}.toolbar-group{gap:6px}.toolbar-group button,.toolbar-group select{font-size:12px}.source-select{max-width:230px}.toolbar-group>button[data-modal="Go queryless"]{display:none}.query-heading{gap:12px}.query-heading em{display:none}.query-heading-actions .text-button{font-size:11px}.metric-row{gap:12px}.filter-label{max-width:100%}.field-group>*{max-width:140px}.field-group input{width:110px}.query-body{padding:10px 0}.builder-toolbar{gap:10px}.small{font-size:10px}.explain{font-size:11px}.query-footer button{font-size:11px;padding:7px 9px}.query-options summary span{font-size:10px;margin-right:7px}.options-content{flex-wrap:wrap}.options-content input{width:130px}.result-panel{min-height:200px}.result-meta{font-size:10px}.meta-right{display:none}.chart-wrap{padding:14px 10px}.chart-title{font-size:11px}.chart-title small{font-size:9px}.chart{height:180px}}
/* NetFlow address chord and ASN routing analysis */
.flow-analysis-panel{margin-top:20px;overflow:hidden}.flow-analysis-panel .panel-heading label{display:flex;align-items:center;gap:10px;font-size:12px}.flow-analysis-panel h3{margin-top:0}.flow-diagram-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px;padding:20px}.flow-diagram-layout aside{min-width:0;padding-top:20px}.flow-diagram svg{display:block;width:100%;height:auto}.flow-diagram text{fill:var(--text);font-size:12px}.flow-ribbon path{opacity:.3;transition:opacity .15s}.flow-sankey-link path{opacity:.28;transition:opacity .15s}.flow-diagram [role=button]{cursor:pointer;outline:none}.flow-diagram [role=button]:hover path,.flow-diagram [role=button]:focus path,.flow-diagram .analysis-selected path{opacity:.85;stroke:var(--text);stroke-width:1}.flow-diagram [role=button]:focus rect,.flow-diagram .analysis-selected rect{stroke:var(--text);stroke-width:2}.flow-address-node path{opacity:.9}.flow-analysis-detail{padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:6px;margin-bottom:20px;overflow-wrap:anywhere}.flow-analysis-panel>#flow-asn-detail{margin:0 20px}.flow-sankey-scroll{overflow-x:auto;padding:20px}.flow-sankey-scroll .flow-diagram{min-width:1000px}.flow-stage-title{font-weight:600}.flow-diagram-empty{padding:60px 20px;text-align:center}.flow-analysis-panel .flow-rankings{padding-top:18px}@media(max-width:1000px){.flow-diagram-layout{grid-template-columns:1fr}.flow-diagram-layout aside{padding-top:0}}@media(max-width:600px){.flow-analysis-panel .panel-heading{flex-wrap:wrap;gap:12px}.flow-diagram-layout{padding:12px;gap:12px}}
/* Alert rule builder and evaluation history */
.alert-builder-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin-bottom:24px}.alert-rule-form{display:grid;gap:18px}.alert-rule-form label{display:grid;gap:8px;font-size:12px;color:var(--muted)}.alert-rule-form input,.alert-rule-form select,.alert-rule-form textarea{width:100%;min-width:0}.alert-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.alert-state{display:inline-flex;align-items:center;padding:6px 10px;border-radius:4px;font-size:12px;font-weight:600;white-space:nowrap}.alert-normal,.alert-resolved{background:#73bf6925;color:#459e45}.alert-pending{background:#e5b76530;color:#ba861d}.alert-firing{background:#f2495c;color:white}.alert-paused{background:var(--raised);color:var(--muted)}.alert-sim-result{padding:20px;border:1px solid var(--border);border-radius:6px;overflow-wrap:anywhere}.alert-sim-result strong{display:block;margin-top:12px}#alert-workspace .panel-heading label{display:flex;gap:10px;align-items:center}#alert-workspace .stats-grid{margin-bottom:24px}@media(max-width:1000px){.alert-builder-grid{grid-template-columns:1fr}}@media(max-width:600px){.alert-form-row{grid-template-columns:1fr}#alert-workspace .panel-heading{flex-wrap:wrap;gap:12px}}
.notification-preview{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.8 Consolas,monospace;color:var(--text);padding:20px;margin:0}.alert-rule-form .checkbox-label{display:flex;align-items:center}.alert-rule-form .checkbox-label input{width:auto}.alert-rule-form small{line-height:1.6}