.xvds {
  --xs-bg: #0A0A0B; --xs-card: #141417; --xs-raised: #1B1B1E;
  --xs-line: #27272A; --xs-line-2: #3F3F46;
  --xs-text: #FAFAFA; --xs-muted: #A1A1AA;
  --xs-acc: var(--pillar-accent, #50A2FF); --xs-acc-rgb: var(--pillar-accent-rgb, 80, 162, 255);
  --xs-crit: var(--sev-crit, #F87171);
  align-items: center;
}
.xvds .rp-lede { max-width: 36ch; }
.xvds__fig { margin: 0; min-width: 0; }
.xvds__card {
  background: var(--xs-card); border: 1px solid var(--xs-line); border-radius: 24px;
  padding: clamp(1rem, 2.4vw, 1.5rem); color: var(--xs-text);
}
.xvds__stage { position: relative; border-radius: 16px 16px 0 0; overflow: hidden; background: var(--xs-bg); border: 1px solid var(--xs-line); border-bottom: 0; }
.xvds__svg { display: block; width: 100%; height: auto; }
.xvds__svg .s-zone { fill: var(--xs-acc); }
.xvds__svg .s-ground { stroke: #3F3F46; stroke-width: 1.5; }
.xvds__svg .s-wall { fill: #141417; stroke: #3F3F46; stroke-width: 1.5; stroke-linejoin: round; }
.xvds__svg .s-void { fill: #0E0E10; }
.xvds__svg .s-kit { fill: #1B1B1E; stroke: #3F3F46; stroke-width: 1.25; }
.xvds__svg .s-kit2 { fill: #27272A; stroke: #52525B; stroke-width: 1; }
.xvds__svg .s-load { fill: #3A3A40; stroke: #71717A; stroke-width: 1; }
.xvds__svg .s-curtain rect { fill: rgba(161, 161, 170, 0.08); stroke: rgba(161, 161, 170, 0.28); stroke-width: 1; }
.xvds__svg .s-steel { stroke: #8A9097; stroke-width: 3; stroke-linecap: round; fill: none; }
.xvds__svg .s-lab { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em; fill: #A1A1AA; }

.xvds__svg .s-board, .xvdt-svg .s-board { fill: #1B1B1E; stroke: #52525B; stroke-width: 1.25; }
.xvds__svg .s-face, .xvdt-svg .s-face { fill: #060607; }
.xvds__svg .s-page use, .xvdt-svg .s-page use { fill: none; stroke-linecap: round; }
.xvds__svg .s-page, .xvdt-svg .s-page { stroke: #F4F4F5; }
.xvds__svg .s-page--crit, .xvdt-svg .s-page--crit { stroke: var(--sev-crit, #F87171); }
.xvds__svg .s-glow, .xvdt-svg .s-glow { opacity: 0.3; }
.xvds__svg .s-frame, .xvdt-svg .s-frame { fill: none; stroke: var(--sev-crit, #F87171); stroke-width: 2; }

.xvds__svg .s-person .s-body, .xvdt-svg .s-person .s-body { fill: #52525B; transition: fill 400ms var(--ease-out, ease); }
.xvds__svg .s-person .s-arm, .xvdt-svg .s-person .s-arm { fill: none; stroke: #52525B; stroke-width: 6; stroke-linecap: round; transition: stroke 400ms var(--ease-out, ease); }
.xvds__svg .s-person .s-head, .xvdt-svg .s-person .s-head { fill: #71717A; transition: fill 400ms var(--ease-out, ease); }
.xvds__svg .s-person .s-band, .xvdt-svg .s-person .s-band { fill: none; stroke: #A1A1AA; stroke-width: 2.4; stroke-linecap: round; }
.xvds__svg .s-person .s-cup, .xvdt-svg .s-person .s-cup { fill: #3F3F46; stroke: #A1A1AA; stroke-width: 1.2; }
.xvds__svg .s-person .s-eye, .xvdt-svg .s-person .s-eye { fill: #18181B; }
.xvds__svg .s-person.is-aware .s-body, .xvdt-svg .s-person.is-aware .s-body { fill: #D4D4D8; }
.xvds__svg .s-person.is-aware .s-arm, .xvdt-svg .s-person.is-aware .s-arm { stroke: #D4D4D8; }
.xvds__svg .s-person.is-aware .s-head, .xvdt-svg .s-person.is-aware .s-head { fill: #F4F4F5; }
.xvds__svg .s-person.is-aware .s-band, .xvdt-svg .s-person.is-aware .s-band,
.xvds__svg .s-person.is-aware .s-cup, .xvdt-svg .s-person.is-aware .s-cup { stroke: #FAFAFA; }
.xvds__svg .s-sight, .xvdt-svg .s-sight { stroke: var(--xs-acc, var(--pillar-accent, #50A2FF)); stroke-width: 1.5; stroke-dasharray: 2 5; stroke-linecap: round; opacity: 0.55; transition: opacity 400ms var(--ease-out, ease); }
.xvds__svg .s-sight.is-hot, .xvdt-svg .s-sight.is-hot { opacity: 1; }

.xvds__now {
  display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; margin: 0; padding: 0.625rem 0.875rem;
  border: 1px solid var(--xs-line); border-radius: 0 0 16px 16px; background: var(--xs-raised);
  font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.04em; color: var(--xs-muted);
}
.xvds__now-k { display: inline-flex; align-items: center; gap: 0.4rem; white-space: nowrap; }
.xvds__now-k::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--xs-acc); }
.xvds__now-k b { font-weight: 500; color: var(--xs-text); }
.xvds__now-v { display: inline-flex; align-items: baseline; gap: 0.625rem; min-width: 0; text-align: right; }
.xvds__now-v b { font-weight: 500; font-size: 0.8125rem; color: var(--xs-text); white-space: nowrap; }
.xvds__now-v b.is-crit { color: var(--xs-crit); }

.xvds__beats { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.xvds__beats li { display: grid; gap: 0.25rem; align-content: start; min-width: 0; }
.xvds__bar { display: block; height: 2px; border-radius: 2px; background: var(--xs-line-2); overflow: hidden; margin-bottom: 0.5rem; }
.xvds__bar i { display: block; height: 100%; width: 100%; background: var(--xs-acc); transform-origin: 0 50%; transform: scaleX(var(--p, 1)); }
.xvds__n { font-family: var(--font-mono); font-size: 0.75rem; color: var(--xs-muted); }
.xvds__beats b { font-family: var(--font-heading); font-size: 1rem; font-weight: 600; line-height: 1.3; color: var(--xs-text); transition: color var(--dur-base, 240ms) var(--ease-out, ease); }
.xvds__sub { font-size: 0.8125rem; line-height: 1.45; color: var(--xs-muted); }
.xvds__beats li.is-next b { color: var(--xs-muted); }
.xvds__beats li.is-now .xvds__n { color: var(--xs-acc); }

.xvds__foot { display: flex; align-items: center; gap: 0.875rem; margin-top: 1rem; }
.xvds__foot:not(:has(> :not([hidden]))) { display: none; }
.xvds__toggle, .xvdt__toggle {
  appearance: none; flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; cursor: pointer;
  color: #FAFAFA; background: rgba(20, 20, 23, 0.8); border: 1px solid #3F3F46; border-radius: 50%;
  transition: border-color var(--dur-fast, 160ms) var(--ease-out, ease), background-color var(--dur-fast, 160ms) var(--ease-out, ease);
}
.xvds__toggle:hover, .xvdt__toggle:hover { border-color: var(--pillar-accent, #50A2FF); background: rgba(27, 27, 30, 0.95); }
.xvds__toggle:focus-visible, .xvdt__toggle:focus-visible { outline: 2px solid #50A2FF; outline-offset: 3px; }
.xvds__toggle svg, .xvdt__toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.xvds__toggle .i-play, .xvdt__toggle .i-play { display: none; fill: currentColor; stroke: none; }
.xvds.is-paused .xvds__toggle .i-play, .xvdt.is-paused .xvdt__toggle .i-play { display: block; }
.xvds.is-paused .xvds__toggle .i-pause, .xvdt.is-paused .xvdt__toggle .i-pause { display: none; }
.xvds__toggle[hidden], .xvdt__toggle[hidden] { display: none; }

.xvds__sr, .xvdt__sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

@media (max-width: 599px) {
  .xvds__card { border-radius: 20px; }
  .xvds__svg .s-lab { font-size: 15px; }
  .xvds__now { padding: 0.5rem 0.625rem; font-size: 0.625rem; flex-wrap: wrap; }
  .xvds__now-v b { font-size: 0.75rem; }
  .xvds__beats { grid-template-columns: minmax(0, 1fr); gap: 0.625rem; }
  .xvds__beats li { grid-template-columns: 1.75rem minmax(0, 1fr); column-gap: 0.5rem; row-gap: 0.1rem; }
  .xvds__bar { grid-column: 1 / -1; margin-bottom: 0.25rem; }
  .xvds__n { grid-row: 2 / span 2; padding-top: 0.15rem; }
  .xvds__beats b, .xvds__sub { grid-column: 2; }
}

.xvd3-lab {
  position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; white-space: nowrap;
  padding: 0.25rem 0.5rem; border: 1px dashed rgba(var(--pillar-accent-rgb, 80, 162, 255), 0.7); border-radius: 6px;
  background: rgba(20, 20, 23, 0.88); color: var(--color-text-primary, #FAFAFA);
  font: 500 0.75rem/1.2 var(--font-mono); letter-spacing: 0.03em;
  opacity: 0; transition: opacity 300ms var(--ease-out, ease); will-change: transform;
}
.xvd3-lab.is-on { opacity: 1; }
@media (max-width: 600px) { .xvd3-lab { font-size: 0.6875rem; padding: 0.2rem 0.4rem; } }

.va-alt .va-lab { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em; fill: #D4D4D8; }
.va-alt .va-lab--k { fill: #A1A1AA; }
.va-alt .va-strut { stroke: #71717A; stroke-width: 4; stroke-linecap: round; }
.va-alt .va-rod { stroke: #8A9097; stroke-width: 2; fill: none; }
.va-alt .va-bracket { fill: #8A9097; }
.va-alt .va-housing { fill: #5D636C; stroke: #71717A; }
.va-alt .va-bezel { fill: #2B2E33; stroke: #52525B; }
.va-alt .va-facel { stroke: #F4F4F5; stroke-width: 1.5; stroke-dasharray: 1.5 2.5; opacity: 0.8; }
.va-alt .va-gland { fill: #3A3D43; stroke: #8A9097; }
.va-alt .va-cable { fill: none; stroke: #52525B; stroke-width: 2.5; stroke-linecap: round; }
.va-alt .va-lead { fill: none; stroke: #52525B; stroke-width: 1; }
.va-alt .va-pt { fill: var(--pillar-accent, #50A2FF); }
.va-alt .va-halo { fill: none; stroke: var(--pillar-accent, #50A2FF); stroke-opacity: 0.45; }
.va-alt .va-wall { fill: #1B1B1E; stroke: #3F3F46; stroke-width: 1.25; }
.va-alt .va-void { fill: #0E0E10; }
.va-alt .va-curtain rect { fill: rgba(161, 161, 170, 0.08); stroke: rgba(161, 161, 170, 0.28); }
.va-alt .va-belt { fill: #27272A; stroke: #52525B; }
.va-alt .va-leg { fill: #1B1B1E; stroke: #3F3F46; }
.va-alt .va-load { fill: #3A3A40; stroke: #71717A; }
.va-alt .va-pole { fill: #6B7480; }
.va-alt .va-foot { fill: #3F3F46; }
.va-alt .va-hood { fill: #8D949D; }
.va-alt .va-ground { stroke: #3F3F46; stroke-width: 1.5; }
.va-alt .va-split { stroke: #27272A; stroke-dasharray: 3 4; }
.va-alt .s-board { fill: #2B2E33; stroke: #52525B; stroke-width: 1.25; }
.va-alt .s-board--out { fill: #6B7480; stroke: #8D949D; }
.va-alt .s-face { fill: #060607; }
.va-alt .s-page use { fill: none; stroke-linecap: round; }
.va-alt .s-page { stroke: #F4F4F5; }
.va-alt .s-page--crit { stroke: var(--sev-crit, #F87171); }
.va-alt .s-page--warn { stroke: var(--sev-warn, #F59E0B); }
.va-alt .s-glow { opacity: 0.3; }
.va-alt .s-frame { fill: none; stroke-width: 1.5; }
.va-alt .s-frame--crit { stroke: var(--sev-crit, #F87171); }
.va-alt .s-frame--warn { stroke: var(--sev-warn, #F59E0B); }
.va-alt .va-flow { fill: none; stroke: var(--pillar-accent, #50A2FF); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.va-alt .va-flow--dash { stroke-dasharray: 7 6; }
.va-alt .va-slab { fill: #1B1B1E; stroke: #52525B; }
.va-alt .va-strip { fill: var(--pillar-accent, #50A2FF); }
.va-alt .va-pipe { fill: #6B7480; }
.va-alt .va-flange { fill: #8A9097; }
.va-alt .va-pool { fill: rgba(148, 163, 184, 0.55); }
.va-alt .va-crit { fill: var(--sev-crit, #F87171); }
.va-alt .va-crit-halo { fill: none; stroke: var(--sev-crit, #F87171); stroke-opacity: 0.5; }

.xvdt {
  --xs-acc: var(--pillar-accent, #50A2FF); --xs-acc-rgb: var(--pillar-accent-rgb, 80, 162, 255);
  margin: clamp(2.5rem, 5vw, 4rem) 0 0; color: #FAFAFA;
  background: #141417; border: 1px solid #27272A; border-radius: 24px; padding: clamp(1.125rem, 2.6vw, 1.75rem);
}
.xvdt__eyebrow { margin: 0; display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.04em; color: #A1A1AA; }
.xvdt__eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; flex: none; background: var(--xs-acc); box-shadow: 0 0 0 3px rgba(var(--xs-acc-rgb), 0.18); }
.xvdt__title { margin: 0.375rem 0 0; font-family: var(--font-heading); font-size: clamp(1.25rem, 2.4vw, 1.625rem); font-weight: 600; line-height: 1.25; }
.xvdt__body { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.4vw, 1.5rem); margin-top: 1.25rem; }
.xvdt-p { min-width: 0; display: grid; align-content: start; gap: 0.75rem; padding: 1rem; background: #0A0A0B; border: 1px solid #27272A; border-radius: 16px; }
.xvdt-p--floor { border-color: rgba(var(--xs-acc-rgb), 0.45); }
.xvdt-p__k { margin: 0; display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-heading); font-size: 1rem; font-weight: 600; color: #FAFAFA; }
.xvdt-p__k i { width: 9px; height: 9px; border-radius: 50%; background: #A1A1AA; }
.xvdt-p--floor .xvdt-p__k i { background: var(--xs-acc); }
.xvdt-svg { display: block; width: 100%; height: auto; border-radius: 10px; }
.xvdt-svg .s-ground { stroke: #3F3F46; stroke-width: 1.5; }
.xvdt-svg .s-kit { fill: #1B1B1E; stroke: #3F3F46; stroke-width: 1.25; }
.xvdt-svg .s-kit2 { fill: #27272A; stroke: #52525B; stroke-width: 1; }
.xvdt-svg .s-wall { fill: #1B1B1E; stroke: #3F3F46; stroke-width: 1; }
.xvdt-svg .s-steel { stroke: #8A9097; stroke-width: 2.5; stroke-linecap: round; fill: none; }
.xvdt-svg .s-mon { fill: #1B1B1E; stroke: #71717A; stroke-width: 1.25; }
.xvdt-svg .s-scr { fill: #0E0E10; }
.xvdt-svg .s-calm rect { fill: #3F3F46; }
.xvdt-svg .s-spark { fill: none; stroke: var(--xs-acc); stroke-width: 1.5; stroke-linejoin: round; opacity: 0.8; }
.xvdt-svg .s-alert-card { fill: rgba(var(--sev-crit-rgb, 248, 113, 113), 0.16); stroke: var(--sev-crit, #F87171); stroke-width: 1.25; }
.xvdt-svg .s-alert text { font-family: var(--font-mono); font-size: 9px; font-weight: 600; letter-spacing: 0.08em; fill: var(--sev-crit, #F87171); }
.xvdt-svg .s-alert-line { fill: #52525B; }
.xvdt-svg .s-locker { fill: #1B1B1E; stroke: #52525B; stroke-width: 1.25; }
.xvdt-svg .s-vent { stroke: #3F3F46; stroke-width: 1.5; stroke-linecap: round; }
.xvdt-svg .s-cut { fill: #0B0B0D; stroke: #52525B; stroke-width: 1; stroke-dasharray: 3 3; }
.xvdt-svg .s-phone { fill: #27272A; stroke: #71717A; stroke-width: 1; }
.xvdt-svg .s-phone-scr { fill: #18181B; transition: fill 200ms var(--ease-out, ease); }
.xvdt-svg .s-phone-scr.is-lit { fill: #D4D4D8; }
.xvdt-svg .s-phone-bar { fill: var(--sev-crit, #F87171); }
.xvdt-svg .s-buzz { fill: none; stroke: #A1A1AA; stroke-width: 1.25; stroke-linecap: round; }
.xvdt-svg .s-lab { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.04em; fill: #A1A1AA; }
.xvdt-rows { list-style: none; margin: 0; padding: 0.625rem 0 0; display: grid; gap: 0.3rem; border-top: 1px solid #27272A; font-family: var(--font-mono); font-size: 0.75rem; }
.xvdt-rows li { display: flex; justify-content: space-between; gap: 0.75rem; color: #A1A1AA; }
.xvdt-rows b { font-weight: 500; color: #D4D4D8; text-align: right; transition: opacity var(--dur-base, 240ms) var(--ease-out, ease); }
.xvdt-rows b.is-crit { color: var(--sev-crit, #F87171); }
.xvdt.is-js .xvdt-rows li:not(.is-on) b { opacity: 0.18; }
.xvdt__cap { margin: 1.25rem 0 0; display: flex; align-items: flex-start; gap: 1rem; }
.xvdt__line { margin: 0; flex: 1; font-size: 0.9375rem; line-height: 1.55; color: #A1A1AA; max-width: 72ch; }
@media (max-width: 760px) {
  .xvdt__body { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599px) {
  .xvdt { border-radius: 20px; }
  .xvdt-p { padding: 0.75rem; }
  .xvdt-svg .s-lab { font-size: 14px; }
}

.xvd-bound { margin-top: clamp(1.5rem, 3vw, 2rem); max-width: 72ch; }