/* SEE reel v2: a continuous evidence thread in Advance Basis's public-surface kit. */

.see-main {
  position: relative;
  z-index: 2;
  width: min(1240px, 100%);
  margin: 0 auto;
  padding: 112px 24px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.see-stage-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
}

.see-stage {
  --see-mint: #5fe6b8;
  --see-mint-soft: rgba(95, 230, 184, 0.12);
  --see-mint-line: rgba(95, 230, 184, 0.38);
  --see-pine: #2c5d53;
  --see-copper: #cc8350;
  --see-copper-soft: rgba(204, 131, 80, 0.14);
  --see-blue: #8ab8ff;
  --see-rose: #ff8092;
  --see-amber: #e8c06a;
  --see-paper: #f2efe8;
  --see-paper-ink: #202628;
  --route-pct: 0%;
  position: relative;
  width: min(100%, calc((100vh - 204px) * 16 / 9));
  aspect-ratio: 16 / 9;
  overflow: hidden;
  container-type: inline-size;
  background-color: #0c0e14;
  background-image:
    linear-gradient(rgba(140, 160, 152, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 160, 152, 0.045) 1px, transparent 1px);
  background-size: 38px 38px;
  border: 1px solid var(--rule2);
  border-radius: 8px;
  color: var(--ink);
  font-family: 'Hanken Grotesk', sans-serif;
  box-shadow: 0 22px 64px rgba(0, 0, 0, 0.24);
  isolation: isolate;
}

.see-stage::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.22);
}

.see-progress {
  position: absolute;
  inset: 0 auto auto 0;
  z-index: 70;
  width: 0;
  height: 2px;
  background: var(--see-mint);
  transition: width 90ms linear;
}

.see-stage-meta {
  position: absolute;
  top: 16px;
  left: 20px;
  right: 150px;
  z-index: 24;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font: 500 9px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.58);
}

.see-stage-scene {
  color: rgba(95, 230, 184, 0.72);
}

.see-exit {
  position: absolute;
  top: 11px;
  right: 12px;
  z-index: 80;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(232, 234, 240, 0.18);
  border-radius: 50%;
  background: rgba(12, 14, 20, 0.72);
  color: rgba(232, 234, 240, 0.6);
  transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease;
}

.see-exit span,
.see-exit span::after {
  width: 11px;
  height: 1px;
  display: block;
  background: currentColor;
  transform: rotate(45deg);
}

.see-exit span::after {
  content: '';
  transform: rotate(90deg);
}

.see-exit:hover,
.see-exit:focus-visible {
  border-color: rgba(95, 230, 184, 0.6);
  background: rgba(16, 19, 28, 0.94);
  color: var(--see-mint);
  outline: 0;
}

.see-route {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 14px;
  z-index: 25;
}

.see-route-track {
  position: relative;
  height: 1px;
  background: rgba(232, 234, 240, 0.12);
}

.see-route-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--route-pct);
  background: var(--see-mint-line);
  transition: width 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.see-route-cursor {
  position: absolute;
  top: 50%;
  left: var(--route-pct);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--see-mint);
  box-shadow: 0 0 13px rgba(95, 230, 184, 0.6);
  transform: translate(-50%, -50%);
  transition: left 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.see-route-steps {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-top: 7px;
  font: 500 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.34);
}

.see-route-steps span {
  position: relative;
  text-align: center;
  transition: color 240ms ease;
}

.see-route-steps span:first-child { text-align: left; }
.see-route-steps span:last-child { text-align: right; }
.see-route-steps span.is-complete { color: rgba(95, 230, 184, 0.48); }
.see-route-steps span.is-current { color: var(--see-mint); }

.see-ctrls {
  position: absolute;
  top: 10px;
  right: 52px;
  z-index: 50;
  display: flex;
  gap: 5px;
  opacity: 0.5;
  transition: opacity 180ms ease;
}

.see-ctrls:hover,
.see-ctrls:focus-within { opacity: 1; }
.see-ctrls.hidden { display: none; }

.see-ctrl {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(232, 234, 240, 0.18);
  border-radius: 50%;
  background: rgba(12, 14, 20, 0.72);
  color: rgba(232, 234, 240, 0.66);
  cursor: pointer;
  transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease;
}

.see-ctrl:hover,
.see-ctrl:focus-visible {
  border-color: rgba(95, 230, 184, 0.6);
  background: rgba(16, 19, 28, 0.94);
  color: var(--see-mint);
  outline: 0;
}

.see-ctrl-prev > span,
.see-ctrl-next > span {
  width: 7px;
  height: 7px;
  border-top: 1.5px solid currentColor;
  border-left: 1.5px solid currentColor;
  transform: rotate(-45deg) translate(1px, 1px);
}

.see-ctrl-next > span { transform: rotate(135deg) translate(1px, 1px); }

.see-ctrl-play .ic-pause {
  width: 8px;
  height: 10px;
  border-left: 2px solid currentColor;
  border-right: 2px solid currentColor;
}

.see-ctrl-play .ic-play {
  display: none;
  width: 0;
  height: 0;
  margin-left: 2px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid currentColor;
}

.see-ctrl-play.is-paused .ic-pause { display: none; }
.see-ctrl-play.is-paused .ic-play { display: block; }
.see-ctrls.no-pause .see-ctrl-play { display: none; }

.see-intro,
.see-replay {
  position: absolute;
  inset: 0;
  z-index: 60;
  width: 100%;
  display: grid;
  place-items: center;
  border: 0;
  background: rgba(12, 14, 20, 0.95);
  color: var(--ink);
  cursor: pointer;
  font-family: inherit;
  transition: opacity 360ms ease;
}

.see-intro.hidden,
.see-replay.hidden {
  opacity: 0;
  pointer-events: none;
}

.see-poster-lockup { display: block; }

.play-glyph {
  width: 70px;
  height: 70px;
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
  border: 1px solid var(--see-pine);
  border-radius: 50%;
  transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}

.play-glyph::after {
  content: '';
  width: 0;
  height: 0;
  margin-left: 4px;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 15px solid var(--see-mint);
}

.see-replay .play-glyph::after {
  width: 20px;
  height: 20px;
  margin: 0;
  border: 2px solid var(--see-mint);
  border-top-color: transparent;
  border-radius: 50%;
  transform: rotate(45deg);
}

.see-intro:hover .play-glyph,
.see-intro:focus-visible .play-glyph,
.see-replay:hover .play-glyph,
.see-replay:focus-visible .play-glyph {
  border-color: var(--see-mint);
  box-shadow: 0 0 30px rgba(95, 230, 184, 0.2);
  transform: scale(1.04);
}

.see-intro:focus-visible,
.see-replay:focus-visible { outline: 0; }

.intro-label {
  display: block;
  font: 600 12px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
}

.intro-sub {
  display: block;
  margin-top: 10px;
  font: 500 10px/1.5 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-align: center;
  color: rgba(167, 172, 189, 0.68);
}

.see-root {
  position: absolute;
  inset: 42px 0 40px;
}

.see-slide {
  position: absolute;
  inset: 0;
  padding: 2.4% 5.2%;
  min-width: 0;
  display: grid;
  place-items: center;
  opacity: 0;
  transform: translateX(4%) scale(0.985);
  filter: blur(5px);
  transition:
    opacity 440ms ease,
    transform 540ms cubic-bezier(0.2, 0.8, 0.2, 1),
    filter 360ms ease;
  will-change: opacity, transform, filter;
}

.see-slide.from-prev { transform: translateX(-4%) scale(0.985); }
.see-slide.active { opacity: 1; transform: none; filter: none; }
.see-slide.exiting {
  transition:
    opacity 190ms ease,
    transform 420ms cubic-bezier(0.2, 0.8, 0.2, 1),
    filter 190ms ease;
}
.see-slide.exiting.to-prev { opacity: 0; transform: translateX(-6%) scale(0.99); filter: blur(4px); }
.see-slide.exiting.to-next { opacity: 0; transform: translateX(6%) scale(0.99); filter: blur(4px); }
.see-stage.is-paused .see-slide,
.see-stage.is-paused .see-slide * { animation-play-state: paused !important; }

.see-scene {
  width: min(100%, 1040px);
  max-width: 100%;
  min-width: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.see-scene.is-centered { align-items: center; text-align: center; }

.see-kicker {
  margin-bottom: 10px;
  font: 600 10px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-copper);
}

.see-kicker.is-mint { color: var(--see-mint); }
.see-kicker.is-blue { color: var(--see-blue); }

.see-scene-title {
  max-width: 760px;
  font-size: 46px;
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: 0;
  color: var(--ink);
  text-wrap: balance;
}

.see-scene-title .mint { color: var(--see-mint); }
.see-scene-title .copper { color: var(--see-copper); }

.see-caption {
  margin-top: 16px;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0;
  color: var(--ink);
  text-align: center;
  text-wrap: balance;
}

.see-caption .mint { color: var(--see-mint); }
.see-caption .copper { color: var(--see-copper); }

.see-micro {
  margin-top: 7px;
  font: 500 9px/1.5 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.56);
  text-align: center;
}

.see-panel {
  min-width: 0;
  background: rgba(16, 19, 28, 0.88);
  border: 1px solid rgba(232, 234, 240, 0.13);
  border-radius: 7px;
  overflow: hidden;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
}

.see-intake-grid > *,
.see-discovery-grid > *,
.see-retain-flow > *,
.see-verification-grid > *,
.see-synthesis-grid > *,
.see-artifact-workspace > *,
.see-paper-body > * {
  min-width: 0;
}

.see-request-text,
.see-angle b,
.see-angle small,
.see-query-card,
.see-candidate,
.see-verify-claim p,
.see-excerpt,
.see-verifier-note,
.see-trace-claim,
.see-trace-source,
.see-caption {
  overflow-wrap: anywhere;
}

.see-panel-head {
  min-height: 34px;
  padding: 9px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(232, 234, 240, 0.1);
  font: 600 9px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.7);
}

.see-panel-head .head-left { display: flex; align-items: center; gap: 8px; }
.see-panel-head .signal { width: 6px; height: 6px; border-radius: 50%; background: var(--see-mint); }
.see-panel-head .status { color: var(--see-mint); }
.see-panel-body { padding: 14px; }

.see-stagger,
.see-reveal {
  opacity: 0;
  transform: translateY(7px);
}

.see-slide.active .see-stagger,
.see-slide.active .see-reveal { animation: see-rise 420ms ease forwards; }

.see-slide.active .delay-1 { animation-delay: 260ms; }
.see-slide.active .delay-2 { animation-delay: 620ms; }
.see-slide.active .delay-3 { animation-delay: 980ms; }
.see-slide.active .delay-4 { animation-delay: 1400ms; }
.see-slide.active .delay-5 { animation-delay: 1900ms; }
.see-slide.active .delay-proof { animation-delay: 2650ms; }

@keyframes see-rise {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: none; }
}

/* Opening and closing brand scenes. */
.see-hero { align-items: center; text-align: center; }
.see-coalesce { display: block; margin: 0 auto; }

.see-hero-mark {
  display: grid;
  grid-template-columns: repeat(3, 34px);
  gap: 6px;
  margin-top: 14px;
}

.see-hero-mark span { height: 24px; background: var(--see-copper); }
.see-hero-mark span:nth-child(1) { opacity: 0.4; }
.see-hero-mark span:nth-child(2) { opacity: 0.68; }

.see-slide.active .see-hero-mark span { animation: see-breathe 2.2s ease-in-out infinite; }
.see-slide.active .see-hero-mark span:nth-child(2) { animation-delay: 180ms; }
.see-slide.active .see-hero-mark span:nth-child(3) { animation-delay: 360ms; }

@keyframes see-breathe {
  0%, 100% { transform: scaleY(1); }
  50% { transform: scaleY(0.76); }
}

.see-transform-row {
  width: min(620px, 90%);
  margin-top: 22px;
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
  align-items: center;
  gap: 8px;
  font: 600 9px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.62);
}

.see-transform-row i { height: 1px; background: rgba(95, 230, 184, 0.22); }
.see-transform-row span:last-child { color: var(--see-mint); }

/* Proof thesis scene. */
.see-proof-bridge {
  position: relative;
  width: min(760px, 92%);
  height: 104px;
  margin: 24px auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
}

.see-proof-bridge::before {
  content: '';
  position: absolute;
  left: 15%;
  right: 15%;
  top: 50%;
  height: 1px;
  background: rgba(232, 234, 240, 0.15);
}

.see-proof-node {
  position: relative;
  z-index: 1;
  width: 126px;
  min-height: 70px;
  padding: 12px;
  display: grid;
  place-items: center;
  justify-self: start;
  border: 1px solid rgba(232, 234, 240, 0.18);
  border-radius: 6px;
  background: #10131c;
  font: 600 10px/1.3 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.72);
}

.see-proof-node.is-evidence {
  justify-self: end;
  border-color: var(--see-pine);
  color: var(--see-mint);
}

.see-proof-packet {
  position: absolute;
  z-index: 2;
  top: calc(50% - 4px);
  left: 16%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--see-mint);
  box-shadow: 0 0 14px rgba(95, 230, 184, 0.55);
}

.see-slide.active .see-proof-packet { animation: see-proof-travel 2.2s ease 600ms forwards; }

@keyframes see-proof-travel {
  from { left: 16%; }
  to { left: 83%; }
}

/* Intake scene. */
.see-intake-grid {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.85fr);
  gap: 14px;
  align-items: stretch;
}

.see-request-text {
  min-height: 70px;
  font-size: 15px;
  line-height: 1.45;
  color: var(--ink);
}

.see-caret {
  display: inline-block;
  width: 7px;
  height: 15px;
  margin-left: 2px;
  vertical-align: text-bottom;
  background: var(--see-mint);
  animation: see-caret 1s steps(1) infinite;
}

@keyframes see-caret { 50% { opacity: 0; } }

.see-input-sources {
  margin-top: 12px;
  padding-top: 11px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  border-top: 1px solid rgba(232, 234, 240, 0.1);
}

.see-file {
  min-width: 0;
  display: grid;
  grid-template-columns: 25px 1fr;
  gap: 8px;
  align-items: center;
  font: 500 9px/1.25 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: rgba(167, 172, 189, 0.72);
}

.see-file-icon {
  width: 22px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(138, 184, 255, 0.42);
  border-radius: 3px;
  color: var(--see-blue);
  font-size: 7px;
}

.see-file b { display: block; overflow: hidden; color: var(--ink); font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.see-file small { color: rgba(167, 172, 189, 0.5); }

.see-angle-list { display: flex; flex-direction: column; gap: 7px; }

.see-angle {
  min-height: 43px;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 8px;
  align-items: start;
  border: 1px solid rgba(232, 234, 240, 0.1);
  border-radius: 5px;
  background: rgba(232, 234, 240, 0.025);
}

.see-angle-check {
  width: 14px;
  height: 14px;
  display: grid;
  place-items: center;
  border: 1px solid var(--see-pine);
  border-radius: 3px;
  color: var(--see-mint);
  font-size: 9px;
}

.see-angle b {
  display: block;
  font-size: 11px;
  line-height: 1.15;
  color: var(--ink);
}

.see-angle small {
  display: block;
  margin-top: 3px;
  font: 500 8px/1.25 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: rgba(167, 172, 189, 0.54);
}

/* Discovery scene. */
.see-discovery-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 250px;
  gap: 14px;
  align-items: center;
}

.see-query-card {
  padding: 13px;
  border-left: 2px solid var(--see-mint);
  background: rgba(16, 19, 28, 0.86);
  font-size: 12px;
  line-height: 1.35;
  color: var(--ink);
}

.see-query-card small {
  display: block;
  margin-bottom: 6px;
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-mint);
}

.see-discovery-svg { width: 100%; height: auto; overflow: visible; }
.see-discovery-svg .lane { fill: none; stroke-width: 1; }
.see-discovery-svg .lane.is-a { stroke: rgba(95, 230, 184, 0.36); }
.see-discovery-svg .lane.is-b { stroke: rgba(204, 131, 80, 0.36); }
.see-discovery-svg .packet { opacity: 0; }
.see-slide.active .see-discovery-svg .packet { animation: see-packet 2.6s linear infinite; }
.see-slide.active .see-discovery-svg .packet.p2 { animation-delay: 480ms; }
.see-slide.active .see-discovery-svg .packet.p3 { animation-delay: 960ms; }
.see-slide.active .see-discovery-svg .packet.p4 { animation-delay: 1440ms; }

@keyframes see-packet {
  0% { opacity: 0; offset-distance: 0%; }
  10%, 82% { opacity: 1; }
  100% { opacity: 0; offset-distance: 100%; }
}

.see-candidate-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }

.see-candidate {
  min-height: 45px;
  padding: 8px;
  border: 1px solid rgba(232, 234, 240, 0.1);
  border-radius: 4px;
  background: rgba(16, 19, 28, 0.78);
  font: 500 8px/1.25 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: rgba(167, 172, 189, 0.62);
}

.see-candidate b { display: block; margin-bottom: 4px; color: var(--ink); font-weight: 600; }
.see-candidate.is-primary { border-color: rgba(95, 230, 184, 0.28); }
.see-candidate.is-counter { border-color: rgba(204, 131, 80, 0.28); }

.see-metric {
  margin-top: 12px;
  font: 600 32px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: var(--ink);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.see-metric small {
  margin-left: 7px;
  font-size: 9px;
  font-weight: 500;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.56);
}

/* Retention and compression scene. */
.see-retain-flow {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 126px minmax(0, 1fr);
  gap: 13px;
  align-items: center;
}

.see-source-stack,
.see-note-stack { display: flex; flex-direction: column; gap: 7px; }

.see-source-row,
.see-note-row {
  min-height: 42px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(232, 234, 240, 0.1);
  border-radius: 4px;
  background: rgba(16, 19, 28, 0.82);
}

.see-source-row.is-set-aside { opacity: 0.4; }
.see-source-row .source-id,
.see-note-row .source-id {
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: var(--see-blue);
}

.see-source-lines,
.see-note-lines { display: flex; flex-direction: column; gap: 4px; }
.see-source-lines i,
.see-note-lines i { height: 3px; border-radius: 2px; background: rgba(232, 234, 240, 0.16); }
.see-source-lines i:last-child { width: 68%; }
.see-note-lines i.is-quote { width: 78%; background: rgba(95, 230, 184, 0.48); }

.see-source-state {
  font: 600 7px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-mint);
}
.see-source-row.is-set-aside .see-source-state { color: rgba(167, 172, 189, 0.54); }

.see-policy-gate {
  position: relative;
  min-height: 184px;
  padding: 14px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-left: 1px solid rgba(95, 230, 184, 0.2);
  border-right: 1px solid rgba(95, 230, 184, 0.2);
  font: 600 8px/1.2 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  color: rgba(167, 172, 189, 0.62);
}

.see-policy-gate b { color: var(--see-mint); }
.see-policy-gate i { width: 1px; height: 16px; background: rgba(95, 230, 184, 0.26); }

.see-note-row {
  grid-template-columns: 28px 1fr 68px;
  border-color: rgba(95, 230, 184, 0.18);
}

.see-quote-pin {
  padding: 4px;
  border: 1px solid var(--see-pine);
  border-radius: 3px;
  font: 600 7px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  color: var(--see-mint);
}

/* Two-layer verification scene. */
.see-verify-claim {
  width: min(780px, 94%);
  margin: 0 auto 12px;
  padding: 11px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(138, 184, 255, 0.28);
  border-radius: 5px;
  background: rgba(16, 19, 28, 0.9);
  text-align: left;
}

.see-verify-claim .claim-id {
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: var(--see-blue);
}

.see-verify-claim p { font-size: 13px; line-height: 1.3; color: var(--ink); }
.see-verify-claim .claim-state { font: 600 8px/1 'IBM Plex Mono', monospace; letter-spacing: 0; color: var(--see-mint); text-transform: uppercase; }

.see-verification-grid {
  width: min(880px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
}

.see-verification-grid .see-panel { min-height: 154px; }

.see-excerpt {
  font: 500 10px/1.5 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: rgba(232, 234, 240, 0.68);
}

.see-excerpt mark {
  padding: 1px 2px;
  background: rgba(95, 230, 184, 0.18);
  color: var(--ink);
}

.see-evidence-status,
.see-semantic-status {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-mint);
}

.see-verifier-note {
  font-size: 12px;
  line-height: 1.35;
  color: var(--ink);
}

.see-verifier-model {
  display: inline-flex;
  margin-top: 11px;
  padding: 5px 7px;
  border: 1px solid rgba(138, 184, 255, 0.32);
  border-radius: 3px;
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-blue);
}

.see-conjunction {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--see-mint);
}

.see-conjunction i { width: 1px; flex: 1; min-height: 24px; background: rgba(95, 230, 184, 0.26); }
.see-conjunction b { font: 700 16px/1 'IBM Plex Mono', monospace; }
.see-conjunction span { writing-mode: vertical-rl; font: 600 7px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; }

.see-quarantine {
  width: min(780px, 94%);
  margin: 9px auto 0;
  padding: 7px 10px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  border-left: 2px solid var(--see-copper);
  background: var(--see-copper-soft);
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(232, 234, 240, 0.62);
}

.see-quarantine .reason { color: var(--see-copper); }

/* Trust pivot. */
.see-trust-locks {
  width: min(560px, 88%);
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr 52px 1fr;
  gap: 10px;
  align-items: center;
}

.see-trust-lock {
  min-height: 62px;
  padding: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid rgba(95, 230, 184, 0.2);
  border-radius: 5px;
  background: rgba(16, 19, 28, 0.8);
  font: 600 9px/1.25 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--see-mint);
}

.see-lock-icon {
  position: relative;
  width: 16px;
  height: 13px;
  border: 1.5px solid currentColor;
  border-radius: 3px;
}

.see-lock-icon::before {
  content: '';
  position: absolute;
  left: 3px;
  top: -8px;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
}

.see-trust-plus { font: 600 18px/1 'IBM Plex Mono', monospace; color: rgba(167, 172, 189, 0.5); }

/* Synthesis scene. */
.see-synthesis-grid {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) 48px minmax(0, 1.22fr);
  gap: 12px;
  align-items: center;
}

.see-ledger-stack { display: flex; flex-direction: column; gap: 7px; }

.see-ledger-item {
  padding: 8px 9px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(95, 230, 184, 0.16);
  border-radius: 4px;
  background: rgba(16, 19, 28, 0.78);
  font: 600 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: var(--see-mint);
}

.see-ledger-item i { height: 3px; border-radius: 2px; background: rgba(232, 234, 240, 0.18); }
.see-ledger-item.is-unknown { border-color: rgba(232, 192, 106, 0.2); color: var(--see-amber); }

.see-write-flow { display: grid; place-items: center; color: var(--see-mint); }
.see-write-flow::before { content: ''; width: 100%; height: 1px; background: rgba(95, 230, 184, 0.25); }
.see-write-flow span { margin-top: 7px; font: 600 7px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; }

.see-report-panel .see-panel-body { padding: 16px; }

.see-report-colophon {
  padding-bottom: 9px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid rgba(232, 234, 240, 0.1);
  font: 500 8px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: rgba(167, 172, 189, 0.62);
}

.see-report-colophon svg { width: 12px; height: 12px; }
.see-report-colophon rect { fill: var(--see-copper); }
.see-report-colophon b { color: var(--ink); font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 10px; }
.see-report-title { margin-bottom: 11px; font-size: 16px; font-weight: 700; color: var(--ink); }

.see-report-line {
  height: 4px;
  margin: 6px 0;
  border-radius: 2px;
  background: rgba(232, 234, 240, 0.17);
  transform: scaleX(0);
  transform-origin: left;
}

.see-slide.active .see-report-line { animation: see-line-grow 460ms ease forwards; }
.see-slide.active .see-report-line:nth-of-type(2) { animation-delay: 340ms; }
.see-slide.active .see-report-line:nth-of-type(3) { animation-delay: 560ms; }
.see-slide.active .see-report-line:nth-of-type(4) { animation-delay: 780ms; }
.see-slide.active .see-report-line:nth-of-type(5) { animation-delay: 1000ms; }

@keyframes see-line-grow { to { transform: scaleX(1); } }

.see-report-cite {
  display: inline-flex;
  padding: 3px 5px;
  border: 1px solid var(--see-pine);
  border-radius: 3px;
  font: 600 7px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  color: var(--see-mint);
}

.see-report-statuses { display: flex; gap: 6px; margin-top: 11px; }
.see-report-statuses span { padding: 4px 6px; border: 1px solid rgba(232, 234, 240, 0.13); border-radius: 3px; font: 600 7px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; color: rgba(167, 172, 189, 0.64); }
.see-report-statuses .is-confidence { border-color: var(--see-pine); color: var(--see-mint); }
.see-report-statuses .is-unknown { border-color: rgba(232, 192, 106, 0.28); color: var(--see-amber); }

/* Delivered artifact scene. */
.see-artifact-workspace {
  width: min(940px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  gap: 12px;
  align-items: stretch;
}

.see-paper {
  min-height: 282px;
  padding: 18px 20px;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  border-radius: 4px;
  background: var(--see-paper);
  color: var(--see-paper-ink);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.38);
  text-align: left;
}

.see-paper-head {
  padding-bottom: 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #dad5c8;
  font: 600 7px/1 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #8a8478;
}

.see-paper-head span { display: flex; align-items: center; gap: 5px; }
.see-paper-head svg { width: 10px; height: 10px; }
.see-paper-head rect { fill: #b5612a; }
.see-paper-title { margin: 13px 0 4px; font-size: 20px; line-height: 1.15; font-weight: 700; letter-spacing: 0; }
.see-paper-meta { font: 500 7px/1 'IBM Plex Mono', monospace; letter-spacing: 0; color: #8a8478; text-transform: uppercase; }

.see-paper-body { margin-top: 14px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr); gap: 16px; }
.see-paper-section b { display: block; margin-bottom: 8px; font-size: 10px; }
.see-paper-line { height: 4px; margin: 6px 0; border-radius: 2px; background: #c7c1b4; }
.see-paper-line.w82 { width: 82%; }
.see-paper-line.w64 { width: 64%; }
.see-paper-line.is-highlight { width: 88%; background: rgba(12, 143, 106, 0.34); }
.see-paper-cite { display: inline-flex; margin-top: 4px; padding: 2px 4px; border: 1px solid rgba(12, 143, 106, 0.5); border-radius: 2px; font: 600 6px/1 'IBM Plex Mono', monospace; letter-spacing: 0; color: #0c8f6a; }

.see-paper-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.see-paper-metric { padding: 8px; border: 1px solid #dad5c8; border-radius: 3px; }
.see-paper-metric b { margin: 0 0 4px; font-size: 15px; color: #1e6f5c; }
.see-paper-metric span { font: 600 6px/1.2 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; color: #8a8478; }
.see-paper-foot { padding-top: 8px; display: flex; justify-content: space-between; border-top: 1px solid #dad5c8; font: 500 6px/1 'IBM Plex Mono', monospace; letter-spacing: 0; color: #8a8478; }

.see-trace-drawer { text-align: left; }
.see-trace-drawer .see-panel-body { display: flex; flex-direction: column; gap: 10px; }
.see-trace-claim { font-size: 12px; line-height: 1.3; color: var(--ink); }
.see-trace-source { padding: 9px; border-left: 2px solid var(--see-mint); background: rgba(95, 230, 184, 0.06); font: 500 9px/1.45 'IBM Plex Mono', monospace; letter-spacing: 0; color: rgba(232, 234, 240, 0.68); }
.see-trace-source mark { background: rgba(95, 230, 184, 0.18); color: var(--ink); }
.see-trace-verdict { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; font: 600 8px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; color: rgba(167, 172, 189, 0.62); }
.see-trace-verdict b { color: var(--see-mint); }

.see-output-row { margin-top: 10px; display: flex; justify-content: center; gap: 7px; }
.see-output-row span { min-width: 44px; padding: 5px 8px; border: 1px solid rgba(232, 234, 240, 0.14); border-radius: 3px; font: 600 8px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; color: rgba(167, 172, 189, 0.68); }

.see-close { align-items: center; text-align: center; }
.see-close .see-coalesce { margin-bottom: 2px; }
.see-close-slogan { margin-top: 4px; font: 600 10px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; color: var(--see-copper); }
.see-close-cta { margin-top: 24px; display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 0 17px; border: 1px solid var(--see-mint); border-radius: 5px; background: var(--see-mint); color: #08120e; font: 700 10px/1 'IBM Plex Mono', monospace; letter-spacing: 0; text-transform: uppercase; transition: background-color 160ms ease, color 160ms ease; }
.see-close-cta:hover, .see-close-cta:focus-visible { background: transparent; color: var(--see-mint); outline: 0; }

.see-sub {
  font: 500 9px/1.4 'IBM Plex Mono', monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  color: rgba(138, 148, 162, 0.72);
  text-align: center;
}

.see-storyboard .see-slide,
.see-storyboard .see-slide *,
.see-storyboard .see-route-fill,
.see-storyboard .see-route-cursor {
  animation: none !important;
  transition: none !important;
}

.see-storyboard .see-stagger,
.see-storyboard .see-reveal,
.see-storyboard .see-candidate,
.see-storyboard .see-source-row,
.see-storyboard .see-note-row,
.see-storyboard .see-report-line {
  opacity: 1 !important;
  transform: none !important;
}

.see-storyboard .see-discovery-svg .packet {
  opacity: 1 !important;
  offset-distance: 62% !important;
}

@container (max-width: 760px) {
  .see-stage-meta { right: 132px; }
  .see-scene-title { font-size: 34px; }
  .see-caption { font-size: 14px; margin-top: 11px; }
  .see-micro { font-size: 7px; }
  .see-panel-head { min-height: 28px; padding: 7px 9px; font-size: 7px; }
  .see-panel-body { padding: 10px; }
  .see-request-text { min-height: 54px; font-size: 12px; }
  .see-file { grid-template-columns: 20px 1fr; font-size: 7px; }
  .see-file-icon { width: 18px; height: 21px; }
  .see-angle { min-height: 35px; padding: 6px; grid-template-columns: 14px 1fr; }
  .see-angle b { font-size: 9px; }
  .see-angle small { font-size: 6px; }
  .see-discovery-grid { grid-template-columns: 112px 1fr 190px; gap: 8px; }
  .see-query-card { padding: 9px; font-size: 9px; }
  .see-candidate { min-height: 34px; padding: 5px; font-size: 6px; }
  .see-metric { margin-top: 8px; font-size: 24px; }
  .see-retain-flow { grid-template-columns: 1fr 90px 1fr; gap: 8px; }
  .see-source-row, .see-note-row { min-height: 33px; padding: 6px; grid-template-columns: 22px 1fr auto; }
  .see-note-row { grid-template-columns: 22px 1fr 52px; }
  .see-policy-gate { min-height: 145px; font-size: 6px; }
  .see-verify-claim { padding: 8px 10px; }
  .see-verify-claim p { font-size: 10px; }
  .see-verification-grid .see-panel { min-height: 120px; }
  .see-excerpt { font-size: 7px; }
  .see-verifier-note { font-size: 9px; }
  .see-quarantine { font-size: 6px; }
  .see-paper { min-height: 218px; padding: 12px 14px; }
  .see-paper-title { font-size: 15px; }
  .see-paper-body { margin-top: 10px; gap: 10px; }
  .see-trace-claim { font-size: 9px; }
  .see-trace-source { padding: 7px; font-size: 7px; }
}

@container (max-width: 520px) {
  .see-stage-meta { top: 11px; left: 13px; right: 116px; font-size: 7px; }
  .see-stage-id { display: none; }
  .see-stage-scene { margin-left: auto; }
  .see-exit { top: 7px; right: 8px; width: 27px; height: 27px; }
  .see-ctrls { top: 7px; right: 42px; }
  .see-ctrl { width: 27px; height: 27px; }
  .see-route { left: 13px; right: 13px; bottom: 9px; }
  .see-route-steps { margin-top: 5px; font-size: 6px; }
  .see-root { inset: 34px 0 29px; }
  .see-slide { padding: 3% 4%; }
  .see-scene { width: calc(100cqw - 32px); max-width: calc(100cqw - 32px); }
  .see-kicker { margin-bottom: 6px; font-size: 7px; }
  .see-scene-title { font-size: 23px; }
  .see-caption { font-size: 11px; }
  .see-proof-bridge { width: 100%; height: 84px; }
  .see-proof-node { width: 90px; min-height: 50px; padding: 7px; font-size: 7px; }
  .see-proof-bridge::before { left: 12%; right: 12%; }
  .see-proof-packet { left: 13%; }
  .see-intake-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 6px; }
  .see-input-sources { grid-template-columns: 1fr; gap: 4px; margin-top: 6px; padding-top: 6px; }
  .see-angle-list { gap: 4px; }
  .see-angle:nth-child(3) { display: none; }
  .see-discovery-grid { grid-template-columns: 78px minmax(0, 1fr) 112px; gap: 5px; }
  .see-query-card { font-size: 7px; }
  .see-candidate-stack { gap: 3px; }
  .see-candidate { min-height: 27px; font-size: 5px; }
  .see-candidate:nth-child(n+5) { display: none; }
  .see-retain-flow { grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1fr); gap: 5px; }
  .see-source-row, .see-note-row { min-height: 28px; padding: 4px; grid-template-columns: 17px 1fr; }
  .see-source-row .see-source-state, .see-note-row .see-quote-pin { display: none; }
  .see-source-row:nth-child(n+4), .see-note-row:nth-child(n+4) { display: none; }
  .see-policy-gate { min-height: 92px; padding: 5px 2px; font-size: 5px; }
  .see-policy-gate i { height: 7px; }
  .see-verify-claim { margin-bottom: 5px; grid-template-columns: auto 1fr; }
  .see-verify-claim .claim-state { display: none; }
  .see-verification-grid { grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr); gap: 4px; }
  .see-verification-grid .see-panel { min-height: 93px; }
  .see-evidence-status, .see-semantic-status { margin-top: 6px; font-size: 5px; }
  .see-verifier-model { margin-top: 6px; padding: 3px; font-size: 5px; }
  .see-conjunction span { display: none; }
  .see-quarantine { margin-top: 4px; padding: 5px; grid-template-columns: auto 1fr; }
  .see-quarantine .reason { display: none; }
  .see-trust-locks { margin-top: 18px; grid-template-columns: 1fr 24px 1fr; }
  .see-trust-lock { min-height: 48px; padding: 7px; font-size: 6px; }
  .see-synthesis-grid { grid-template-columns: minmax(0, 0.72fr) 24px minmax(0, 1.28fr); gap: 5px; }
  .see-ledger-item { padding: 5px; font-size: 5px; }
  .see-report-panel .see-panel-body { padding: 8px; }
  .see-report-title { font-size: 11px; }
  .see-report-statuses span { padding: 3px; font-size: 5px; }
  .see-artifact-workspace { grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr); gap: 5px; }
  .see-paper { min-height: 158px; padding: 8px 9px; }
  .see-paper-title { margin-top: 7px; font-size: 11px; }
  .see-paper-body { margin-top: 6px; grid-template-columns: minmax(0, 1fr) minmax(0, 0.65fr); gap: 6px; }
  .see-paper-metric { padding: 4px; }
  .see-paper-metric b { font-size: 9px; }
  .see-trace-drawer .see-panel-body { gap: 5px; }
  .see-trace-source { font-size: 5px; }
  .see-output-row { margin-top: 5px; }
  .see-output-row span { min-width: 33px; padding: 4px; font-size: 6px; }
}

@media (max-width: 720px) {
  .see-main { padding: 94px 12px 30px; }
  .see-stage {
    width: 100%;
    height: min(68vh, 520px);
    min-height: 360px;
    aspect-ratio: auto;
    background-size: 30px 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .see-slide,
  .see-slide *,
  .see-route-fill,
  .see-route-cursor,
  .see-progress {
    animation: none !important;
    transition: none !important;
  }

  .see-stagger,
  .see-reveal,
  .see-candidate,
  .see-source-row,
  .see-note-row,
  .see-report-line {
    opacity: 1 !important;
    transform: none !important;
  }
}