/* ui447: high-legibility command glyphs and state-driven telemetry instruments. */
:root {
  --ui447-signal: #73c5d7;
  --ui447-signal-bright: #e0f7fa;
  --ui447-signal-deep: #234d58;
  --ui447-ink: #93a8b0;
  --ui447-ink-strong: #dbe8eb;
  --ui447-panel: #081219;
  --ui447-plate: #0c1920;
  --ui447-warn: #b8a46f;
  --ui447-ease: cubic-bezier(0.2, 0.78, 0.2, 1);
}

/* Navigation glyphs use a contained instrument plate so each symbol stays readable at 24px. */
html body #portal-root#portal-root#portal-root#portal-root main.portal-shell svg.cockpit-vector-icon,
html body #root#root#root#root#root#root#root#root main.geo-admin-shell svg.cockpit-vector-icon {
  box-sizing: border-box !important;
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--ui447-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  fill: none !important;
  stroke: none !important;
  filter: none !important;
  shape-rendering: geometricPrecision !important;
  transform-origin: center !important;
  transition: color 180ms ease, transform 240ms var(--ui447-ease) !important;
}

html body #portal-root#portal-root#portal-root#portal-root main.portal-shell .client-nav-group button svg.cockpit-vector-icon {
  flex: 0 0 28px !important;
  margin-inline: 0 4px !important;
  -webkit-text-fill-color: var(--ui447-ink) !important;
}

html body #root#root#root#root#root#root#root#root main.geo-admin-shell .geo-nav button svg.cockpit-vector-icon {
  flex: 0 0 28px !important;
  color: var(--ui447-ink) !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon :is(path, rect, circle, line, polyline, polygon) {
  vector-effect: non-scaling-stroke !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-plate {
  fill: rgba(12, 25, 32, 0.9) !important;
  stroke: rgba(147, 168, 176, 0.34) !important;
  stroke-width: 1 !important;
  transition: fill 180ms ease, stroke 180ms ease !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-main {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 0.96 !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-fill {
  fill: color-mix(in srgb, currentColor 14%, transparent) !important;
  stroke: currentColor !important;
  stroke-width: 1.45 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 0.96 !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-rail {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1 !important;
  stroke-linecap: square !important;
  stroke-linejoin: miter !important;
  opacity: 0.46 !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-signal {
  fill: none !important;
  stroke: var(--ui447-signal) !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
}

html body :is(#portal-root, #root) svg.cockpit-vector-icon .glyph-node {
  fill: var(--ui447-signal-bright) !important;
  stroke: var(--ui447-signal-deep) !important;
  stroke-width: 0.8 !important;
  opacity: 1 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
}

html body #portal-root#portal-root#portal-root#portal-root main.portal-shell .client-nav-group button:is(:hover, :focus-visible) svg.cockpit-vector-icon,
html body #root#root#root#root#root#root#root#root main.geo-admin-shell .geo-nav button:is(:hover, :focus-visible) svg.cockpit-vector-icon {
  color: var(--ui447-ink-strong) !important;
  transform: translateX(2px) !important;
}

html body :is(#portal-root, #root) :is(button, a):is(:hover, :focus-visible) svg.cockpit-vector-icon .glyph-plate {
  fill: rgba(18, 38, 47, 0.96) !important;
  stroke: rgba(115, 197, 215, 0.56) !important;
}

html body #portal-root#portal-root#portal-root#portal-root main.portal-shell .client-nav-group button.active svg.cockpit-vector-icon,
html body #root#root#root#root#root#root#root#root main.geo-admin-shell .geo-nav button.active svg.cockpit-vector-icon {
  color: var(--ui447-signal-bright) !important;
  -webkit-text-fill-color: var(--ui447-signal-bright) !important;
  animation: ui447GlyphAcquire 420ms var(--ui447-ease) both !important;
}

html body #portal-root main.portal-shell .client-nav-group button.active svg.cockpit-vector-icon .glyph-plate,
html body #root main.geo-admin-shell .geo-nav button.active svg.cockpit-vector-icon .glyph-plate {
  fill: rgba(22, 61, 70, 0.86) !important;
  stroke: rgba(115, 197, 215, 0.86) !important;
}

html body #portal-root main.portal-shell .client-nav-group button.active svg.cockpit-vector-icon .glyph-signal,
html body #root main.geo-admin-shell .geo-nav button.active svg.cockpit-vector-icon .glyph-signal {
  stroke: var(--ui447-signal-bright) !important;
  stroke-dasharray: 52 !important;
  animation: ui447SignalTrace 520ms var(--ui447-ease) 60ms both !important;
}

html body #portal-root main.portal-shell .client-nav-group button.active svg.cockpit-vector-icon .glyph-node,
html body #root main.geo-admin-shell .geo-nav button.active svg.cockpit-vector-icon .glyph-node {
  animation: ui447NodeAcquire 300ms var(--ui447-ease) 230ms both !important;
}

/* Telemetry instruments use a quiet plotting plane, command brackets and a single arrival trace. */
html body #portal-root#portal-root#portal-root#portal-root main.portal-shell svg.cockpit-data-vector {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background: rgba(5, 14, 19, 0.46) !important;
  shape-rendering: geometricPrecision !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector :is(path, polygon, polyline, circle, line, rect) {
  vector-effect: non-scaling-stroke !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-frame {
  fill: rgba(6, 16, 21, 0.5) !important;
  stroke: rgba(147, 168, 176, 0.18) !important;
  stroke-width: 0.8 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-corners {
  fill: none !important;
  stroke: rgba(115, 197, 215, 0.72) !important;
  stroke-width: 1.25 !important;
  stroke-linecap: square !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-axis {
  fill: none !important;
  stroke: rgba(147, 168, 176, 0.34) !important;
  stroke-width: 0.9 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-ticks {
  fill: none !important;
  stroke: rgba(224, 247, 250, 0.52) !important;
  stroke-width: 0.9 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-grid path {
  fill: none !important;
  stroke: rgba(147, 168, 176, 0.105) !important;
  stroke-width: 0.65 !important;
  stroke-dasharray: 1.2 2.8 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-reference {
  fill: none !important;
  stroke: rgba(115, 197, 215, 0.28) !important;
  stroke-width: 0.9 !important;
  stroke-dasharray: 5 5 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-area {
  fill: url(#trendArea447) !important;
  stroke: none !important;
  opacity: 0 !important;
  animation: ui447PlotArea 560ms var(--ui447-ease) 160ms forwards !important;
}

html body #portal-root main.portal-shell svg.executive-vector-chart .vector-area {
  fill: url(#executiveArea447) !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector :is(.trend-line-shadow, .vector-line-shadow) {
  fill: none !important;
  stroke: rgba(115, 197, 215, 0.12) !important;
  stroke-width: 7 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector :is(.trend-line-main, .vector-line.brand) {
  fill: none !important;
  stroke: url(#trendSignal447) !important;
  stroke-width: 2.3 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body #portal-root main.portal-shell svg.executive-vector-chart .vector-line.brand {
  stroke: var(--ui447-signal) !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-line.competitor {
  fill: none !important;
  stroke: var(--ui447-warn) !important;
  stroke-width: 1.45 !important;
  stroke-dasharray: 4 3 !important;
  opacity: 0.78 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector :is(.trend-line-main, .vector-line.brand, .vector-line-shadow) {
  stroke-dasharray: 1 !important;
  stroke-dashoffset: 1 !important;
  animation: ui447PlotTrace 820ms var(--ui447-ease) 120ms forwards !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector :is(.trend-dot, .vector-node) {
  fill: var(--ui447-panel) !important;
  stroke: var(--ui447-signal) !important;
  stroke-width: 1.25 !important;
  opacity: 0.88 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: ui447NodeAcquire 260ms var(--ui447-ease) 540ms both !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-node.competitor {
  stroke: var(--ui447-warn) !important;
  opacity: 0.62 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-terminal-ring {
  fill: rgba(8, 18, 25, 0.9) !important;
  stroke: var(--ui447-signal) !important;
  stroke-width: 1.25 !important;
  stroke-dasharray: 2.5 1.5 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: ui447TerminalLock 460ms var(--ui447-ease) 660ms both !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-lock {
  fill: none !important;
  stroke: var(--ui447-signal-bright) !important;
  stroke-width: 1 !important;
  opacity: 0 !important;
  animation: ui447LockMark 300ms var(--ui447-ease) 760ms forwards !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-terminal {
  fill: var(--ui447-signal-bright) !important;
  stroke: #15353e !important;
  stroke-width: 0.8 !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: ui447NodeAcquire 260ms var(--ui447-ease) 760ms both !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-terminal.competitor {
  fill: #ddd2b2 !important;
  stroke: #403824 !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-sweep {
  fill: none !important;
  stroke: rgba(224, 247, 250, 0.62) !important;
  stroke-width: 1 !important;
  stroke-dasharray: 1 !important;
  stroke-dashoffset: 1 !important;
  opacity: 0 !important;
  animation: ui447Sweep 700ms var(--ui447-ease) 80ms both !important;
}

html body #portal-root main.portal-shell svg.cockpit-data-vector stop.signal-stop { stop-color: var(--ui447-signal) !important; stop-opacity: 0.28 !important; }
html body #portal-root main.portal-shell svg.cockpit-data-vector stop.signal-stop-muted { stop-color: #536a72 !important; stop-opacity: 0.5 !important; }
html body #portal-root main.portal-shell svg.cockpit-data-vector stop.signal-stop-bright { stop-color: var(--ui447-signal-bright) !important; stop-opacity: 1 !important; }
html body #portal-root main.portal-shell svg.cockpit-data-vector stop.signal-stop-fade { stop-color: var(--ui447-signal) !important; stop-opacity: 0 !important; }

@keyframes ui447GlyphAcquire {
  0% { opacity: 0.35; transform: translateX(-3px) scale(0.92); }
  72% { opacity: 1; transform: translateX(1px) scale(1.04); }
  100% { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes ui447SignalTrace {
  from { stroke-dashoffset: 52; }
  to { stroke-dashoffset: 0; }
}

@keyframes ui447NodeAcquire {
  0% { opacity: 0; transform: scale(0.25); }
  72% { opacity: 1; transform: scale(1.2); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes ui447PlotTrace { to { stroke-dashoffset: 0; } }
@keyframes ui447PlotArea { from { opacity: 0; transform: translateY(3px); } to { opacity: 0.34; transform: translateY(0); } }
@keyframes ui447TerminalLock { from { opacity: 0; transform: rotate(-55deg) scale(0.4); } to { opacity: 1; transform: rotate(0) scale(1); } }
@keyframes ui447LockMark { from { opacity: 0; } to { opacity: 0.94; } }
@keyframes ui447Sweep { 0% { opacity: 0; stroke-dashoffset: 1; } 24% { opacity: 0.9; } 100% { opacity: 0; stroke-dashoffset: 0; } }

@media (max-width: 820px) {
  html body #portal-root main.portal-shell svg.cockpit-vector-icon,
  html body #root main.geo-admin-shell svg.cockpit-vector-icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(#portal-root, #root) svg.cockpit-vector-icon,
  html body :is(#portal-root, #root) svg.cockpit-vector-icon *,
  html body :is(#portal-root, #root) svg.cockpit-data-vector * {
    animation: none !important;
    transform: none !important;
    transition-duration: 0.01ms !important;
  }

  html body #portal-root main.portal-shell svg.cockpit-data-vector :is(.trend-line-main, .vector-line.brand, .vector-line-shadow) { stroke-dashoffset: 0 !important; }
  html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-area { opacity: 0.34 !important; }
  html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-lock { opacity: 0.94 !important; }
  html body #portal-root main.portal-shell svg.cockpit-data-vector .vector-sweep { opacity: 0 !important; }
}