/* The selectors in this file are limited to the scene explorer and its caption. */
.hero-band #visionDemo.sx-explorer {
  --sx-accent: #8af0da;
  --sx-muted: #abc0c0;
  aspect-ratio: auto;
  color: #eff6f3;
  background: #10191b;
  border: 1px solid #263638;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 24px 60px -42px #163b4499;
  font-family: var(--sans);
  text-align: left;
}
#visionDemo.sx-explorer::before { display: none; }
#visionDemo .sx-topline { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 24px; border-bottom: 1px solid #ffffff12; }
#visionDemo .sx-brand { display: flex; align-items: center; gap: 9px; font-size: 18px; font-weight: 600; letter-spacing: -.03em; }
#visionDemo .sx-brand-mark { width: 16px; height: 16px; border: 1px solid var(--sx-accent); border-radius: 4px; display: inline-grid; place-items: center; }
#visionDemo .sx-brand-mark::after { content: ''; width: 6px; height: 6px; border-radius: 1px; background: var(--sx-accent); }
#visionDemo .sx-engine { margin-left: 10px; color: #93aaac; font: 10px var(--mono); letter-spacing: .14em; }
#visionDemo .sx-mode { font-size: 11px; color: #bbcdca; line-height: 1.4; }
#visionDemo .sx-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: stretch; }
#visionDemo .sx-visual { min-width: 0; background: #172124; display: flex; flex-direction: column; }
#visionDemo .sx-scene-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 19px 24px; background: #172124; }
#visionDemo .sx-eyebrow { color: var(--sx-accent); font: 10px var(--mono); letter-spacing: .1em; }
#visionDemo .sx-scene-label { display: block; margin-bottom: 5px; }
#visionDemo .sx-scene-title { font-family: var(--sans); color: #f4f9f6; font-size: 17px; font-weight: 500; line-height: 1.4; letter-spacing: -.025em; }
#visionDemo .sx-count { flex: none; padding: 6px 9px; border: 1px solid #91b5ae3d; border-radius: 5px; font: 10px var(--mono); color: #bbcdca; }
#visionDemo .sx-canvas { position: relative; width: 100%; flex: none; overflow: hidden; isolation: isolate; background: #c2c0b6; }
.hero-band #visionDemo .sx-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; border-radius: 0; filter: none; background: #c2c0b6; }
#visionDemo .sx-contours, #visionDemo .sx-connections { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
#visionDemo .sx-contours { z-index: 2; }
#visionDemo .sx-connections { z-index: 1; }
#visionDemo [hidden] { display: none !important; }
#visionDemo .sx-connections line { stroke: #e9fff4; stroke-width: 1.2px; stroke-dasharray: 5 4; filter: drop-shadow(0 1px 2px #122c26); }
#visionDemo .sx-connections circle { fill: #edfff2; stroke: #163a31; stroke-width: .2px; }
#visionDemo .sx-contour { fill: #73ffd908; stroke: #a7ffdfbd; stroke-width: 1px; stroke-linejoin: round; filter: drop-shadow(0 1px 1px #10241d80); transition: fill .16s, stroke .16s; }
#visionDemo .sx-contour.sx-selected { stroke: #beffe5; stroke-width: 2px; fill: #a0f7d616; }
#visionDemo .sx-contour.sx-status-empty, #visionDemo .sx-contour.sx-status-low { stroke: #ffcc8ccf; fill: #ffc57b06; }
#visionDemo .sx-contour.sx-status-empty.sx-selected, #visionDemo .sx-contour.sx-status-low.sx-selected { stroke: #ffe0b3; fill: #ffc57b17; }
#visionDemo .sx-empty-zone { fill: #eb9d4220; stroke: #ffbd70; stroke-width: 1.5px; stroke-dasharray: 6 4; }
#visionDemo .sx-empty-zone.sx-selected { fill: #eb9d422e; stroke: #ffdaa7; stroke-width: 2px; }
#visionDemo .sx-hotspots { position: absolute; inset: 0; z-index: 3; }
#visionDemo .sx-hotspot { position: absolute; display: block; padding: 0; margin: 0; min-width: 0; min-height: 0; cursor: pointer; background: transparent; border: 0; border-radius: 0; }
#visionDemo .sx-hotspot:focus-visible { outline: 2px solid #f5fff8; outline-offset: 3px; z-index: 6; }
#visionDemo .sx-map-label { position: absolute; top: var(--sx-label-top); left: var(--sx-label-left); display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid #a7dfcc8c; border-radius: 4px; background: #102b27eb; color: #f0fff5; box-shadow: 0 2px 8px #112b2426; white-space: nowrap; transform: translateY(-100%); transition: background .16s, color .16s; pointer-events: auto; }
#visionDemo .sx-map-label--end { transform: translate(-100%, -100%); }
#visionDemo .sx-map-label > span { color: #9ff2d5; font: 9px var(--mono); }
#visionDemo .sx-map-label b { font-size: 11px; font-weight: 500; line-height: 1.3; }
#visionDemo .sx-label-status { display: none; margin-left: 2px; border-left: 1px solid currentColor; padding-left: 6px; font-size: 10px; font-style: normal; line-height: 1.3; }
#visionDemo[data-stage="2"] .sx-hotspot[aria-pressed="true"] .sx-label-status { display: inline; }
#visionDemo .sx-hotspot[aria-pressed="true"] { z-index: 5; }
#visionDemo .sx-hotspot[aria-pressed="true"] .sx-map-label, #visionDemo .sx-hotspot:hover .sx-map-label { background: #c0fbdc; color: #14362b; border-color: #e3ffed; }
#visionDemo .sx-hotspot[aria-pressed="true"] .sx-map-label > span, #visionDemo .sx-hotspot:hover .sx-map-label > span { color: #376b56; }
#visionDemo .sx-hotspot.sx-status-low .sx-map-label, #visionDemo .sx-hotspot.sx-status-empty .sx-map-label { background: #4a301eee; border-color: #ffbd70ac; color: #fff0d5; }
#visionDemo .sx-hotspot.sx-status-low .sx-map-label > span, #visionDemo .sx-hotspot.sx-status-empty .sx-map-label > span { color: #ffcc8c; }
#visionDemo .sx-hotspot.sx-status-low[aria-pressed="true"] .sx-map-label, #visionDemo .sx-hotspot.sx-status-empty[aria-pressed="true"] .sx-map-label, #visionDemo .sx-hotspot.sx-status-low:hover .sx-map-label, #visionDemo .sx-hotspot.sx-status-empty:hover .sx-map-label { background: #ffe0b3; border-color: #fff0db; color: #4b321b; }
#visionDemo .sx-hotspot.sx-status-low[aria-pressed="true"] .sx-map-label > span, #visionDemo .sx-hotspot.sx-status-empty[aria-pressed="true"] .sx-map-label > span, #visionDemo .sx-hotspot.sx-status-low:hover .sx-map-label > span, #visionDemo .sx-hotspot.sx-status-empty:hover .sx-map-label > span { color: #805833; }
#visionDemo .sx-image-error { position: absolute; inset: 10% 8%; display: grid; place-items: center; font-size: 14px; color: #20322c; text-align: center; }
#visionDemo.sx-image-unavailable .sx-hotspots, #visionDemo.sx-image-unavailable .sx-contours, #visionDemo.sx-image-unavailable .sx-connections { display: none; }
#visionDemo .sx-scene-foot { display: flex; align-items: center; gap: 9px; margin-top: auto; padding: 14px 24px; border-top: 1px solid #ffffff0d; min-height: 54px; }
#visionDemo .sx-note-dot { width: 5px; height: 5px; flex: none; background: var(--sx-accent); border-radius: 50%; }
#visionDemo .sx-scene-note { margin: 0; font-size: 11px; line-height: 1.6; color: #becfcd; }
#visionDemo .sx-view-number { margin-left: auto; padding-left: 15px; flex: none; color: #99afaf; font: 10px var(--mono); }
#visionDemo .sx-panel { min-width: 0; padding: 23px 23px 24px; border-left: 1px solid #ffffff12; background: linear-gradient(140deg, #1b2b2b, #111b1d 65%); }
#visionDemo .sx-panel:focus-visible { outline: 2px solid var(--sx-accent); outline-offset: -4px; }
#visionDemo .sx-panel-kicker { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #9cb6b3; margin-bottom: 22px; font: 10px var(--mono); letter-spacing: .08em; }
#visionDemo .sx-panel-kicker > span:last-child { font: 19px var(--sans); color: var(--sx-accent); }
#visionDemo .sx-panel-content > h3 { margin: 0; color: #f0f8f3; font-family: var(--sans); font-size: 24px; line-height: 1.4; font-weight: 500; letter-spacing: -.035em; }
#visionDemo .sx-panel-description { margin: 13px 0 0; color: #b7c9c5; font-size: 13px; line-height: 1.8; }
#visionDemo .sx-inventory-heading h3 { margin: 0; color: #f0f8f3; font-family: var(--sans); font-size: 20px; font-weight: 500; line-height: 1.4; letter-spacing: -.025em; }
#visionDemo .sx-inventory-heading p { margin: 7px 0 15px; color: #a7bfbb; font-size: 12px; line-height: 1.6; }
#visionDemo .sx-inventory { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
#visionDemo .sx-inventory.sx-group-inventory { grid-template-columns: 1fr; gap: 5px; }
#visionDemo .sx-object-item { display: flex; align-items: center; gap: 7px; min-width: 0; min-height: 41px; padding: 9px 8px; border: 1px solid #9bb5af26; border-radius: 5px; background: #abc8be05; color: #c9d8d2; text-align: left; font-family: var(--sans); font-size: 12px; line-height: 1.4; cursor: pointer; transition: background .16s, color .16s, border-color .16s; }
#visionDemo .sx-object-index { flex: none; font: 9px var(--mono); color: #88a69d; }
#visionDemo .sx-item-arrow { margin-left: auto; color: #88b1a6; font-size: 13px; }
#visionDemo .sx-object-item[aria-pressed="true"], #visionDemo .sx-object-item:hover { color: #edfff2; background: #94e4bb18; border-color: #99e6c286; }
#visionDemo .sx-object-item[aria-pressed="true"] .sx-object-index, #visionDemo .sx-object-item[aria-pressed="true"] .sx-item-arrow { color: #c0fbdc; }
#visionDemo .sx-object-item.sx-status-low[aria-pressed="true"], #visionDemo .sx-object-item.sx-status-empty[aria-pressed="true"], #visionDemo .sx-object-item.sx-status-low:hover, #visionDemo .sx-object-item.sx-status-empty:hover { background: #f1b77110; border-color: #ffd0917a; }
#visionDemo .sx-status-chip { display: inline-flex; align-items: center; gap: 5px; flex: none; margin-left: auto; color: #a5e9c7; font-size: 10px; line-height: 1.3; font-weight: 400; }
#visionDemo .sx-status-chip i, #visionDemo .sx-status-dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; flex: none; }
#visionDemo .sx-status-low .sx-status-chip, #visionDemo .sx-status-empty .sx-status-chip { color: #f1c28b; }
#visionDemo .sx-detail-status { display: flex; align-items: center; gap: 6px; margin: -3px 0 16px; color: #a5e9c7; font-size: 12px; }
#visionDemo .sx-status-low .sx-detail-status, #visionDemo .sx-status-empty .sx-detail-status { color: #f1c28b; }
#visionDemo .sx-object-item:focus-visible { outline: 2px solid var(--sx-accent); outline-offset: 2px; }
#visionDemo .sx-detail-slot { margin-top: 21px; padding-top: 20px; border-top: 1px solid #bfd8cc25; }
#visionDemo .sx-detail-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 14px; }
#visionDemo .sx-detail-index { display: grid; place-items: center; width: 24px; height: 24px; flex: none; color: #b7f4d2; background: #a3e2c113; border: 1px solid #b0e8c54a; border-radius: 4px; font: 10px var(--mono); }
#visionDemo .sx-detail-heading h4 { margin: 0; color: #edf9f0; font-size: 18px; font-weight: 500; line-height: 1.4; }
#visionDemo .sx-detail-list { margin: 0; display: grid; gap: 12px; }
#visionDemo .sx-detail-list > div { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 10px; font-size: 12px; line-height: 1.7; }
#visionDemo .sx-detail-list dt { color: #92b0a6; }
#visionDemo .sx-detail-list dd { margin: 0; color: #d1e0d7; }
html[lang="en"] #visionDemo .sx-detail-list > div { grid-template-columns: 1fr; gap: 3px; }
#visionDemo .sx-source-note, #visionDemo .sx-insight { margin-top: 25px; padding-top: 20px; border-top: 1px solid #bfd8cc25; }
#visionDemo .sx-source-note p { color: #d1e0d7; font-size: 13px; line-height: 1.8; margin: 10px 0 0; }
#visionDemo .sx-facts { margin: 11px 0 0; }
#visionDemo .sx-facts > div { padding: 10px 0; border-bottom: 1px solid #bed8cd13; font-size: 12px; line-height: 1.65; }
#visionDemo .sx-facts dt { color: #92b0a6; margin-bottom: 4px; }
#visionDemo .sx-facts dd { margin: 0; color: #e0eae3; }
#visionDemo .sx-facts > div:last-child { border-bottom: 0; }
#visionDemo .sx-uncertain { margin-top: 19px; padding: 12px 13px; border-left: 2px solid #adbb97; background: #cbd6b006; }
#visionDemo .sx-uncertain > span { font-size: 11px; color: #cad4b9; }
#visionDemo .sx-uncertain > p { margin: 6px 0 0; font-size: 12px; color: #aebfb2; line-height: 1.75; }
#visionDemo .sx-verdicts { display: grid; gap: 1px; margin-top: 17px; }
#visionDemo .sx-verdict { display: block; width: 100%; padding: 11px 0; background: transparent; border: 0; border-bottom: 1px solid #c9ded31f; color: #e0eae3; text-align: left; cursor: pointer; }
#visionDemo .sx-verdict:hover { background: #abc7b907; }
#visionDemo .sx-verdict[aria-pressed="true"] { background: #abc7b90d; box-shadow: inset 2px 0 #a5e9c7; padding-left: 9px; }
#visionDemo .sx-verdict.sx-status-low[aria-pressed="true"], #visionDemo .sx-verdict.sx-status-empty[aria-pressed="true"] { box-shadow: inset 2px 0 #f1c28b; }
#visionDemo .sx-verdict:focus-visible { outline: 2px solid var(--sx-accent); outline-offset: 3px; }
#visionDemo .sx-verdict-top { display: flex; align-items: center; gap: 12px; }
#visionDemo .sx-verdict-top b { font-size: 13px; font-weight: 500; line-height: 1.5; }
#visionDemo .sx-verdict-evidence { display: block; margin-top: 5px; color: #a9bfb1; font-size: 12px; line-height: 1.65; }
#visionDemo .sx-verdict:not([aria-pressed="true"]) .sx-verdict-evidence { display: none; }
#visionDemo .sx-checklist { margin-top: 20px; }
#visionDemo .sx-pending-note { padding: 8px 10px; margin: 0 0 8px; background: #e5b1750a; border: 1px solid #e5b1752e; border-radius: 4px; color: #d7c7ab; font-size: 11px; line-height: 1.6; }
#visionDemo .sx-check-item { display: flex; align-items: flex-start; gap: 11px; padding: 12px 0; border-bottom: 1px solid #c9ded31f; }
#visionDemo .sx-checkbox { width: 12px; height: 12px; flex: none; margin-top: 4px; border: 1px solid #b4c8ba8a; border-radius: 2px; }
#visionDemo .sx-check-item > div { flex: 1; min-width: 0; }
#visionDemo .sx-check-heading { display: flex; align-items: center; gap: 8px; }
#visionDemo .sx-check-heading h4 { font-size: 14px; font-weight: 500; line-height: 1.5; color: #e6f0e8; margin: 0; }
#visionDemo .sx-check-item p { margin: 7px 0 0; color: #b3c7b7; font-size: 12px; line-height: 1.8; }
#visionDemo .sx-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #ffffff17; background: #10191b; }
#visionDemo .sx-tabs > button { position: relative; display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 78px; padding: 17px 23px; color: #b2c4c0; background: transparent; border: 0; text-align: left; cursor: pointer; }
#visionDemo .sx-tabs > button + button { border-left: 1px solid #ffffff10; }
#visionDemo .sx-tabs > button::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--sx-accent); opacity: 0; }
#visionDemo .sx-tabs > button[aria-selected="true"] { background: #244036; color: #f3fff5; }
#visionDemo .sx-tabs > button[aria-selected="true"]::after { opacity: 1; }
#visionDemo .sx-tabs > button:hover { background: #243b34; }
#visionDemo .sx-tabs > button:focus-visible { outline: 2px solid var(--sx-accent); outline-offset: -4px; }
#visionDemo .sx-tab-number { flex: none; color: #8db4a3; font: 11px var(--mono); }
#visionDemo .sx-tabs > button[aria-selected="true"] .sx-tab-number { color: #bbf3cc; }
#visionDemo .sx-tab-copy { min-width: 0; }
#visionDemo .sx-tab-copy b { display: block; font-family: var(--sans); font-size: 13px; font-weight: 500; line-height: 1.35; }
#visionDemo .sx-tab-copy small { display: block; margin-top: 5px; color: #8da99f; font: 9px var(--mono); letter-spacing: .06em; }
#visionDemo .sx-tab-arrow { margin-left: auto; color: #94cfb4; font-size: 17px; }
#visionDemo .sx-announcement { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.hero-band .mview-cap { display: flex; justify-content: space-between; gap: 8px 20px; flex-wrap: wrap; margin-top: 12px; font-family: var(--sans); font-size: 11px; color: #677570; line-height: 1.6; letter-spacing: .01em; text-align: left; }
.hero-band .mview-cap .sx-caption-note { color: #78867f; }
@media (max-width: 1100px) {
  #visionDemo .sx-body { grid-template-columns: minmax(0, 1fr) 290px; }
  #visionDemo .sx-panel { padding: 19px; }
  #visionDemo .sx-scene-heading { padding: 18px 19px; }
  #visionDemo .sx-tabs > button { padding: 17px 18px; gap: 9px; }
  #visionDemo .sx-tab-arrow { display: none; }
  #visionDemo .sx-inventory { grid-template-columns: 1fr; gap: 4px; }
  #visionDemo .sx-object-item { min-height: 34px; padding: 7px 10px; }
}
@media (max-width: 850px) {
  #visionDemo .sx-body { grid-template-columns: 1fr; }
  #visionDemo .sx-panel { border-left: 0; border-top: 1px solid #ffffff12; padding: 23px; }
  #visionDemo .sx-panel-kicker { margin-bottom: 16px; }
  #visionDemo .sx-panel-content { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
  #visionDemo .sx-inventory-heading { grid-column: 1; }
  #visionDemo .sx-inventory { grid-column: 1; grid-template-columns: 1fr 1fr; gap: 6px; }
  #visionDemo .sx-object-item { min-height: 42px; padding: 9px; }
  #visionDemo .sx-detail-slot { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; padding-top: 0; padding-left: 24px; border-top: 0; border-left: 1px solid #bfd8cc25; }
  #visionDemo .sx-panel-content > h3, #visionDemo .sx-panel-description { grid-column: 1; }
  #visionDemo .sx-insight, #visionDemo .sx-source-note { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; padding-top: 0; border-top: 0; }
  #visionDemo .sx-verdicts, #visionDemo .sx-checklist { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
  #visionDemo .sx-uncertain { grid-column: 1 / -1; }
  #visionDemo .sx-scene-note { font-size: 12px; }
  #visionDemo .sx-mode { font-size: 12px; }
}
@media (max-width: 560px) {
  .hero-band #visionDemo.sx-explorer { border-radius: 16px; }
  #visionDemo .sx-topline { padding: 15px 16px; gap: 8px; }
  #visionDemo .sx-brand { font-size: 17px; gap: 7px; }
  #visionDemo .sx-engine { display: none; }
  #visionDemo .sx-mode { font-size: 10px; max-width: 145px; text-align: right; }
  #visionDemo .sx-scene-heading { padding: 15px 16px; gap: 12px; }
  #visionDemo .sx-scene-title { font-size: 15px; }
  #visionDemo .sx-count { padding: 5px 7px; font-size: 9px; }
  #visionDemo .sx-scene-label { font-size: 9px; }
  #visionDemo .sx-map-label { padding: 4px 5px; gap: 0; }
  #visionDemo .sx-map-label b { display: none; }
  #visionDemo .sx-map-label > span { font-size: 10px; line-height: 1.2; }
  #visionDemo .sx-hotspot[aria-pressed="true"] .sx-map-label { gap: 4px; }
  #visionDemo .sx-hotspot[aria-pressed="true"] .sx-map-label b { display: block; font-size: 10px; }
  #visionDemo .sx-label-status, #visionDemo[data-stage="2"] .sx-hotspot[aria-pressed="true"] .sx-label-status { display: none; }
  #visionDemo .sx-scene-foot { padding: 12px 16px; min-height: 54px; }
  #visionDemo .sx-scene-note { font-size: 12px; }
  #visionDemo .sx-view-number { display: none; }
  #visionDemo .sx-panel { padding: 20px 16px 22px; }
  #visionDemo .sx-panel-kicker { margin-bottom: 16px; }
  #visionDemo .sx-panel-content { display: block; }
  #visionDemo .sx-inventory-heading h3 { font-size: 19px; }
  #visionDemo .sx-inventory-heading p { margin-bottom: 13px; }
  #visionDemo .sx-inventory { display: grid; grid-template-columns: 1fr 1fr; }
  #visionDemo .sx-inventory.sx-group-inventory { grid-template-columns: 1fr 1fr; gap: 6px; }
  #visionDemo .sx-group-inventory .sx-object-item { display: grid; grid-template-columns: 17px minmax(0, 1fr); gap: 4px; }
  #visionDemo .sx-group-inventory .sx-status-chip { grid-column: 2; margin-left: 0; font-size: 11px; }
  #visionDemo .sx-object-item { padding: 10px 9px; font-size: 12px; }
  #visionDemo .sx-object-index { font-size: 10px; }
  #visionDemo .sx-detail-slot { margin-top: 19px; padding-top: 19px; padding-left: 0; border-left: 0; border-top: 1px solid #bfd8cc25; }
  #visionDemo .sx-detail-list > div { font-size: 12px; }
  #visionDemo .sx-panel-content > h3 { font-size: 22px; }
  #visionDemo .sx-panel-description { font-size: 13px; }
  #visionDemo .sx-insight, #visionDemo .sx-source-note { margin-top: 21px; padding-top: 18px; border-top: 1px solid #bfd8cc25; }
  #visionDemo .sx-verdicts, #visionDemo .sx-checklist { margin-top: 20px; }
  #visionDemo .sx-tabs > button { display: block; min-height: 92px; padding: 12px 8px; }
  #visionDemo .sx-tab-number { display: block; font-size: 10px; margin-bottom: 7px; }
  #visionDemo .sx-tab-copy b { font-size: 12px; line-height: 1.45; }
  #visionDemo .sx-tab-copy small { font-size: 8px; }
  .hero-band .mview-cap { font-size: 11px; padding-inline: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  #visionDemo .sx-contour, #visionDemo .sx-map-label, #visionDemo .sx-object-item { transition: none; }
}