:root {
  color-scheme: dark;
  --void: #03070d;
  --deep: #07101d;
  --night: #0a1727;
  --glass: rgba(13, 29, 46, .66);
  --glass-solid: #0d1c2c;
  --glass-bright: rgba(181, 225, 247, .1);
  --ice: #e8f8ff;
  --mist: #aac7d8;
  --muted: #718b9d;
  --line: rgba(190, 229, 249, .25);
  --line-bright: rgba(221, 247, 255, .58);
  --cyan: #88d9ff;
  --blue: #4c9fe0;
  --lilac: #bbb8ec;
  --ivory: #f2efda;
  --warning: #ffd6a0;
  --display: "Forum", "Iowan Old Style", "Baskerville", serif;
  --text: "Manrope", "Avenir Next", sans-serif;
  --mono: "IBM Plex Mono", "SFMono-Regular", monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
}

* { box-sizing: border-box; }

html { min-width: 320px; background: var(--void); scroll-behavior: smooth; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--void);
  color: var(--ice);
  font-family: var(--text);
  font-size: 16px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 50;
  pointer-events: none;
  opacity: .12;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.26'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

button, textarea, input { font: inherit; }
button, a, label { -webkit-tap-highlight-color: transparent; }
button, a { color: inherit; }
button { cursor: pointer; }

button:focus-visible,
a:focus-visible,
textarea:focus-visible,
input:focus-visible {
  outline: 2px solid var(--ice);
  outline-offset: 3px;
}

.wordmark:visited { color: var(--ice); }
.download-action:visited { color: var(--lilac); }

.meta-shell { min-height: 100svh; background: var(--void); }

.topbar {
  position: relative;
  z-index: 10;
  height: 72px;
  display: grid;
  grid-template-columns: 190px 1fr 190px;
  align-items: center;
  gap: var(--space-5);
  padding: 0 clamp(20px, 3vw, 48px);
  border-bottom: 1px solid var(--line);
  background: rgba(3, 8, 15, .72);
  backdrop-filter: blur(20px) saturate(125%);
}

.wordmark {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: max-content;
  color: var(--ice);
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .16em;
  text-decoration: none;
}

.wordmark-glyph { color: var(--cyan); font-size: 20px; text-shadow: 0 0 16px var(--cyan); }
.wordmark small { color: var(--muted); font-size: 10px; }

.route-line {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.route-line span { white-space: nowrap; }
.route-line span.is-active { color: var(--ice); text-shadow: 0 0 14px rgba(136, 217, 255, .7); }
.route-line i { width: clamp(18px, 3vw, 52px); height: 1px; background: var(--line); }

.plain-action,
.examples-action,
.random-question-action,
.catalogue-actions button {
  min-height: 44px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--line-bright);
  background: none;
  color: var(--mist);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.topbar-actions { justify-self: end; display: flex; align-items: center; gap: 18px; }
.topbar-actions .plain-action { padding-inline: 6px; }
.plain-action { justify-self: end; }
.plain-action:hover, .examples-action:hover, .random-question-action:hover, .catalogue-actions button:hover { color: var(--ice); border-color: var(--cyan); }

.language-switch {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .12em;
}

.language-switch button {
  min-width: 32px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  letter-spacing: inherit;
  cursor: pointer;
}

.language-switch button[aria-pressed="true"] { color: var(--ice); text-shadow: 0 0 14px rgba(136, 217, 255, .72); }
.language-switch button:hover, .language-switch button:focus-visible { color: var(--white); outline: none; }

.question-scene,
.process-scene,
.result-hero {
  position: relative;
  min-height: calc(100svh - 72px);
  isolation: isolate;
  overflow: hidden;
}

.world-stage { position: absolute; inset: 0; z-index: -2; overflow: hidden; background: var(--deep); }
.result-hero .world-stage.is-interactive { z-index: 0; }

.sky-wash {
  position: absolute;
  inset: 0 0 43%;
  background:
    radial-gradient(ellipse at 68% 52%, rgba(221, 247, 255, .42) 0, rgba(103, 185, 232, .18) 16%, transparent 42%),
    radial-gradient(ellipse at 18% 20%, rgba(161, 180, 231, .2), transparent 33%),
    linear-gradient(180deg, #06101d 0%, #0a2b45 56%, #8bbbd0 100%);
}

.sky-wash::before,
.sky-wash::after {
  content: "";
  position: absolute;
  height: 22%;
  border: 1px solid rgba(232, 248, 255, .2);
  background: linear-gradient(110deg, transparent, rgba(232, 248, 255, .16), transparent);
  filter: blur(10px);
  transform: skewX(-18deg);
}

.sky-wash::before { left: -8%; right: 48%; top: 28%; }
.sky-wash::after { left: 55%; right: -12%; top: 12%; }

.horizon {
  position: absolute;
  z-index: 2;
  top: 56.8%;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--ice);
  box-shadow: 0 0 8px var(--ice), 0 0 30px var(--cyan), 0 0 90px rgba(136, 217, 255, .62);
}

.mirror-plane {
  position: absolute;
  z-index: 1;
  left: -25%;
  right: -25%;
  bottom: -36%;
  height: 86%;
  transform: perspective(560px) rotateX(61deg);
  transform-origin: 50% 0;
  background:
    linear-gradient(rgba(193, 231, 250, .08) 1px, transparent 1px) 0 0 / 56px 56px,
    linear-gradient(90deg, rgba(193, 231, 250, .08) 1px, transparent 1px) 0 0 / 56px 56px,
    conic-gradient(from 90deg, rgba(180, 223, 244, .23) 25%, rgba(3, 12, 22, .08) 0 50%, rgba(180, 223, 244, .23) 0 75%, rgba(3, 12, 22, .08) 0) 0 0 / 112px 112px,
    linear-gradient(180deg, #5c879e 0%, #08131f 70%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.9), #000 72%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), #000 72%);
  box-shadow: inset 0 24px 80px rgba(224, 247, 255, .16);
}

.mirror-plane::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(233, 250, 255, .2) 48%, transparent 64%);
  filter: blur(8px);
}

.far-gate {
  position: absolute;
  z-index: 3;
  left: 68%;
  top: 42%;
  width: 140px;
  height: 150px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(232, 248, 255, .42);
  box-shadow: inset 0 0 28px rgba(157, 221, 252, .18), 0 0 36px rgba(133, 210, 247, .15);
  opacity: .55;
}

.far-gate::before,
.far-gate::after { content: ""; position: absolute; background: var(--line-bright); }
.far-gate::before { left: 50%; top: -28px; width: 1px; height: 205px; }
.far-gate::after { left: -28px; top: 50%; width: 195px; height: 1px; }
.far-gate i { position: absolute; inset: 14px; border: 1px solid rgba(232, 248, 255, .16); }
.far-gate i:nth-child(2) { inset: 32px; transform: rotate(45deg); }
.far-gate i:nth-child(3) { inset: 54px 38px; background: rgba(232, 248, 255, .35); box-shadow: 0 0 24px var(--ice); }

.assembled-sign {
  position: absolute;
  z-index: 4;
  left: 68%;
  top: 42%;
  width: clamp(250px, 28vw, 440px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 0 22px rgba(144, 220, 255, .42));
  animation: sign-breathe 6s ease-in-out infinite;
}

.halo { position: absolute; inset: 11%; border: 1px solid rgba(232, 248, 255, .62); border-radius: 50%; }
.halo-a { box-shadow: inset 0 0 28px rgba(175, 226, 251, .16), 0 0 24px rgba(136, 217, 255, .24); }
.halo-b { inset: 24%; border-color: rgba(244, 239, 218, .7); transform: rotate(45deg); border-radius: 1px; }
.halo-c { inset: 34%; border-color: rgba(187, 184, 236, .58); }
.halo-a::before,
.halo-a::after { content: ""; position: absolute; background: var(--ice); box-shadow: 0 0 12px var(--ice); }
.halo-a::before { left: 50%; top: -12%; width: 1px; height: 124%; }
.halo-a::after { top: 50%; left: -12%; width: 124%; height: 1px; }

.axis { position: absolute; left: 50%; top: -4%; bottom: -6%; width: 1px; background: linear-gradient(transparent, var(--ice) 20% 80%, transparent); }
.diamond { position: absolute; left: 50%; top: 50%; width: 42%; aspect-ratio: 1; border: 1px solid rgba(232, 248, 255, .42); transform: translate(-50%, -50%) rotate(45deg); }
.diamond-b { width: 16%; border-color: var(--ice); box-shadow: inset 0 0 22px rgba(136, 217, 255, .28), 0 0 20px rgba(136, 217, 255, .32); }

.wing {
  position: absolute;
  top: 33%;
  width: 42%;
  height: 36%;
  border: 1px solid rgba(232, 248, 255, .38);
  background: linear-gradient(130deg, rgba(229, 249, 255, .32), rgba(126, 190, 224, .04) 65%);
  backdrop-filter: blur(3px);
  opacity: .82;
}

.wing::after { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(232, 248, 255, .24); }
.wing-left { right: 64%; clip-path: polygon(100% 12%, 78% 0, 0 31%, 35% 51%, 7% 100%, 82% 72%); }
.wing-right { left: 64%; transform: scaleX(-1); clip-path: polygon(100% 12%, 78% 0, 0 31%, 35% 51%, 7% 100%, 82% 72%); }

.sign-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 25%;
  aspect-ratio: 1;
  display: grid;
  place-content: center;
  text-align: center;
  transform: translate(-50%, -50%);
  border: 1px solid var(--ice);
  background: rgba(225, 246, 255, .12);
  box-shadow: inset 0 0 24px rgba(222, 247, 255, .3), 0 0 38px rgba(136, 217, 255, .25);
}

.sign-core span { font-family: var(--display); font-size: clamp(30px, 4vw, 54px); line-height: .8; }
.sign-core small { margin-top: 6px; color: var(--mist); font-family: var(--mono); font-size: 7px; letter-spacing: .14em; text-transform: uppercase; }

.orbit-nodes i {
  position: absolute;
  left: calc(50% - 3px);
  top: calc(50% - 3px);
  width: 6px;
  height: 6px;
  transform: rotate(var(--angle)) translateY(-43%) translateY(-155px);
  border: 1px solid var(--ice);
  background: var(--cyan);
  box-shadow: 0 0 10px var(--ice);
}

.scene-coordinate {
  position: absolute;
  z-index: 4;
  margin: 0;
  color: rgba(223, 245, 255, .54);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.coordinate-b { right: 3vw; bottom: 48px; }

/* Reactive depth field: one spatial instrument, not a flat illustration. */
:root {
  --scene-rx: 0deg;
  --scene-ry: 0deg;
  --light-x: 50%;
  --beacon-look: 90deg;
  --table-dodge-x: 0px;
  --table-dodge-y: 0px;
}

.world-stage {
  perspective: 1300px;
  perspective-origin: 68% 42%;
  background:
    radial-gradient(circle at var(--light-x) 54%, rgba(117, 198, 237, .08), transparent 34%),
    var(--deep);
}

.world-stage::before,
.world-stage::after {
  content: "";
  position: absolute;
  z-index: 2;
  pointer-events: none;
}

.world-stage::before {
  inset: 0;
  background:
    linear-gradient(90deg, transparent 49.92%, rgba(225, 248, 255, .13) 50%, transparent 50.08%),
    radial-gradient(ellipse at 68% 43%, rgba(224, 248, 255, var(--light-dim)), transparent 31%);
  mix-blend-mode: screen;
}

.world-stage::after {
  left: 68%;
  top: 56.8%;
  width: 44vw;
  height: 34vh;
  transform: translateX(-50%) perspective(700px) rotateX(72deg);
  transform-origin: 50% 0;
  background: radial-gradient(ellipse, rgba(210, 243, 255, var(--light-mid)), transparent 64%);
  filter: blur(18px);
}

.field-particles { position: absolute; z-index: 3; inset: 0; pointer-events: none; overflow: hidden; }
.field-particles i {
  position: absolute;
  left: var(--particle-x);
  top: var(--particle-y);
  width: var(--particle-size);
  height: var(--particle-size);
  background: rgba(226, 248, 255, .9);
  box-shadow: 0 0 8px rgba(136, 217, 255, .8);
  opacity: .22;
  animation: particle-drift 5.4s var(--particle-delay) ease-in-out infinite;
}

.sky-wash {
  background:
    radial-gradient(ellipse at var(--light-x) 52%, rgba(221, 247, 255, .42) 0, rgba(103, 185, 232, .18) 16%, transparent 42%),
    radial-gradient(ellipse at 18% 20%, rgba(161, 180, 231, .14), transparent 33%),
    linear-gradient(180deg, #030814 0%, #09233a 56%, #78aabd 100%);
}

.stage-camera {
  position: absolute;
  z-index: 4;
  inset: -4%;
  transform: rotateX(var(--scene-rx)) rotateY(var(--scene-ry));
  transform-style: preserve-3d;
  transform-origin: 68% 42%;
  transition: transform 180ms cubic-bezier(.2, .7, .2, 1);
  will-change: transform;
}

.depth-lattice {
  position: absolute;
  z-index: 1;
  inset: 9% 3% 37%;
  opacity: .14;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 18% 82%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 18% 82%, transparent);
}

.depth-lattice::before,
.depth-lattice::after,
.depth-lattice i {
  content: "";
  position: absolute;
  border: 1px solid rgba(214, 243, 255, .18);
  transform: skewY(-8deg);
}

.depth-lattice::before { inset: 9% 1% 17%; }
.depth-lattice::after { inset: 19% 9% 8%; transform: skewY(7deg); }
.depth-lattice i:nth-child(1) { inset: 28% 18% 0; }
.depth-lattice i:nth-child(2) { left: 12%; top: -12%; bottom: -5%; width: 1px; }
.depth-lattice i:nth-child(3) { left: 43%; top: -5%; bottom: 2%; width: 1px; transform: skewX(16deg); }
.depth-lattice i:nth-child(4) { right: 10%; top: -10%; bottom: -8%; width: 1px; transform: skewX(-12deg); }

.depth-frame {
  position: absolute;
  left: 68%;
  top: 42%;
  aspect-ratio: 1;
  border: 1px solid rgba(224, 247, 255, .2);
  transform-style: preserve-3d;
  pointer-events: none;
}

.depth-frame::before,
.depth-frame::after,
.depth-frame i {
  content: "";
  position: absolute;
  inset: 10%;
  border: 1px solid rgba(215, 243, 255, .15);
}

.depth-frame::after { inset: 27%; transform: rotate(45deg); }
.depth-frame i:nth-child(1) { inset: 42% -18%; border-width: 1px 0 0; }
.depth-frame i:nth-child(2) { inset: -18% 50%; border-width: 0 0 0 1px; }
.frame-far { width: min(58vw, 760px); transform: translate3d(-50%, -50%, -360px) rotateZ(45deg); opacity: .12; }
.frame-mid { width: min(44vw, 590px); transform: translate3d(-50%, -50%, -150px) rotateZ(45deg); opacity: .2; }

.depth-pylon {
  position: absolute;
  top: 13%;
  width: clamp(72px, 8vw, 130px);
  height: 54%;
  border: 1px solid rgba(218, 245, 255, .24);
  background: linear-gradient(112deg, rgba(221, 247, 255, .11), rgba(80, 155, 196, .015) 50%, rgba(221, 247, 255, .08));
  box-shadow: inset 0 0 50px rgba(189, 231, 249, .05);
  transform-style: preserve-3d;
  opacity: .58;
}

.depth-pylon::before,
.depth-pylon::after { content: ""; position: absolute; inset: 10%; border: 1px solid rgba(224, 247, 255, .11); }
.depth-pylon::after { inset: 28% -28%; transform: rotate(45deg); }
.pylon-left { left: 50%; transform: translateZ(-40px) rotateY(62deg) skewY(-8deg); }
.pylon-right { right: 8%; transform: translateZ(-90px) rotateY(-56deg) skewY(8deg); }

.far-gate {
  transform: translate3d(-50%, -50%, -260px) rotateY(-7deg);
  transform-style: preserve-3d;
  opacity: var(--light-high);
}

.assembled-sign {
  transform: translate3d(-50%, -50%, 120px) rotateX(-1deg);
  transform-style: preserve-3d;
  filter: drop-shadow(0 0 30px rgba(144, 220, 255, var(--light-mid)));
  animation: none;
}

.sign-body {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  animation: sign-body-breathe 6s ease-in-out infinite;
}

.light-volume {
  position: absolute;
  z-index: -2;
  left: 50%;
  top: 50%;
  width: 132%;
  height: 132%;
  transform: translate3d(-50%, -50%, -100px) rotateZ(45deg);
  background: radial-gradient(circle, rgba(219, 247, 255, var(--light-mid)), transparent 62%);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  filter: blur(12px);
}

.knowledge-beam {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: -36%;
  width: var(--beam-width);
  height: 174%;
  transform: translate3d(-50%, 0, -55px);
  background: linear-gradient(90deg, transparent, rgba(226, 249, 255, var(--light-dim)), transparent);
  filter: blur(8px);
  opacity: var(--beam-opacity);
}

.halo,
.diamond,
.axis,
.wing,
.sign-core,
.orbit-nodes,
.prism { transform-style: preserve-3d; }

.halo-a { transform: translateZ(-82px) rotateX(9deg); }
.halo-b { transform: translateZ(12px) rotateZ(45deg) rotateY(7deg); }
.halo-c { transform: translateZ(82px) rotateX(-7deg); box-shadow: 0 0 22px rgba(232, 248, 255, var(--light-mid)); }
.diamond-a { transform: translate3d(-50%, -50%, 38px) rotateZ(45deg) rotateY(-7deg); }
.diamond-b { transform: translate3d(-50%, -50%, 110px) rotateZ(45deg); }
.axis { transform: translateZ(96px); }

.wing {
  width: var(--agent-spread);
  opacity: var(--agent-opacity);
  box-shadow: inset 0 0 38px rgba(212, 243, 255, .06), 0 0 18px rgba(136, 217, 255, .07);
}

.wing-left { right: 62%; transform-origin: 100% 50%; transform: translateZ(-24px) rotateY(48deg) rotateX(-5deg); }
.wing-right { left: 62%; transform-origin: 0 50%; transform: translateZ(-24px) scaleX(-1) rotateY(48deg) rotateX(-5deg); }

.prism {
  position: absolute;
  left: 50%;
  width: 18%;
  height: 31%;
  border: 1px solid rgba(231, 249, 255, .48);
  background: linear-gradient(115deg, rgba(229, 248, 255, .2), rgba(105, 181, 220, .025) 70%);
  clip-path: polygon(50% 0, 100% 82%, 50% 100%, 0 82%);
  box-shadow: inset 0 0 24px rgba(222, 246, 255, .08);
}

.prism-north { top: -2%; transform: translate3d(-50%, 0, 46px) rotateX(-18deg); }
.prism-south { bottom: -2%; transform: translate3d(-50%, 0, 30px) rotateX(18deg) rotateZ(180deg); opacity: .7; }

.sign-core {
  transform: translate3d(-50%, -50%, 150px) rotateY(-3deg);
  background: linear-gradient(145deg, rgba(228, 248, 255, .23), rgba(105, 179, 216, .07));
  box-shadow:
    inset 0 0 24px rgba(222, 247, 255, var(--light-mid)),
    0 0 38px rgba(136, 217, 255, var(--light-high)),
    12px 12px 0 rgba(139, 210, 243, .045);
}

.orbit-nodes i { transform: rotate(var(--angle)) translateY(-43%) translateY(-155px) translateZ(118px); }

.sign-reflection {
  position: absolute;
  left: 68%;
  top: 58%;
  width: clamp(210px, 24vw, 380px);
  aspect-ratio: 1;
  transform: translate3d(-50%, 0, -70px) rotateX(75deg) rotateZ(45deg);
  border: 1px solid rgba(226, 248, 255, .26);
  opacity: var(--reflection-opacity);
  filter: blur(.4px);
}

.sign-reflection i,
.sign-reflection b { position: absolute; inset: 22%; border: 1px solid rgba(226, 248, 255, .22); }
.sign-reflection b { inset: 39%; background: rgba(220, 246, 255, .1); box-shadow: 0 0 32px rgba(136, 217, 255, .2); }

/* A distant instrument between abyss and orbit: it scans the field, never the interface. */
.far-beacon {
  position: absolute;
  z-index: 2;
  left: 10%;
  top: 38%;
  width: clamp(96px, 9vw, 142px);
  height: clamp(250px, 42vh, 400px);
  transform: translate3d(-50%, -50%, -260px) rotateY(8deg);
  transform-style: preserve-3d;
  pointer-events: none;
  opacity: .82;
  filter: drop-shadow(0 0 20px rgba(108, 218, 255, .23));
}

.beacon-spine { position: absolute; inset: 18% 17% 0; transform-style: preserve-3d; clip-path: polygon(34% 0, 66% 0, 100% 100%, 0 100%); border: 1px solid rgba(223, 248, 255, .62); background: linear-gradient(90deg, rgba(225, 249, 255, .06), rgba(185, 231, 252, .32) 48% 52%, rgba(225, 249, 255, .045)); box-shadow: inset 0 0 22px rgba(136, 217, 255, .22), 0 0 16px rgba(98, 215, 255, .12); }
.beacon-spine::before,
.beacon-spine::after { content: ""; position: absolute; inset: 9% 22%; border-right: 1px solid rgba(229, 248, 255, .18); border-left: 1px solid rgba(229, 248, 255, .18); }
.beacon-spine::after { inset: 42% -45% auto; height: 1px; border: 0; background: rgba(229, 248, 255, .34); box-shadow: 0 24px rgba(229, 248, 255, .2), 0 48px rgba(229, 248, 255, .12); }
.beacon-spine i { position: absolute; left: 15%; right: 15%; height: 1px; background: rgba(229, 248, 255, .2); }
.beacon-spine i:nth-child(1) { top: 27%; transform: rotate(16deg); }
.beacon-spine i:nth-child(2) { top: 52%; transform: rotate(-16deg); }
.beacon-spine i:nth-child(3) { top: 76%; transform: rotate(13deg); }

.beacon-lantern { position: absolute; z-index: 3; left: 50%; top: 13%; width: 74%; height: 18%; transform: translate3d(-50%, -50%, 20px); border: 1px solid rgba(237, 251, 255, .72); background: rgba(187, 231, 252, .09); box-shadow: inset 0 0 18px rgba(224, 248, 255, .25), 0 0 24px rgba(111, 224, 255, .34); }
.beacon-lantern::before,
.beacon-lantern::after { content: ""; position: absolute; inset: 16% 12%; border: 1px solid rgba(229, 249, 255, .35); }
.beacon-lantern::after { inset: 30% 38%; background: var(--ice); box-shadow: 0 0 12px var(--ice), -7px 0 18px rgba(0, 243, 255, .7), 7px 0 18px rgba(255, 65, 232, .46); }
.beacon-lantern i,
.beacon-lantern b { position: absolute; left: 50%; top: -46%; bottom: -46%; width: 1px; background: rgba(232, 248, 255, .3); }
.beacon-lantern b { top: 50%; left: -30%; right: -30%; bottom: auto; width: auto; height: 1px; }

.beacon-beam { position: absolute; z-index: 2; left: 50%; top: 12%; width: 1px; height: 1px; transform: translateZ(-12px); transform-style: preserve-3d; }
.beacon-beam i,
.beacon-beam b { position: absolute; left: 0; top: -9px; width: clamp(280px, 48vw, 760px); height: 22px; transform-origin: 0 50%; clip-path: polygon(0 43%, 100% 0, 100% 100%, 0 57%); background: linear-gradient(90deg, rgba(236, 251, 255, .54), rgba(156, 227, 255, .16) 42%, transparent 96%); mix-blend-mode: screen; filter: blur(2px); animation: beacon-scan 7.8s ease-in-out infinite alternate; }
.beacon-beam b { top: -20px; height: 42px; background: linear-gradient(90deg, rgba(151, 244, 255, .18), rgba(255, 72, 229, .08) 38%, transparent 85%); filter: blur(11px) saturate(1.5); animation-duration: 8.4s; }
:root[data-beacon-tracking="true"] .beacon-beam i,
:root[data-beacon-tracking="true"] .beacon-beam b { animation: none; transform: rotateY(var(--beacon-look)) rotateZ(-2deg) scaleX(.98); opacity: .68; transition: transform 90ms linear, opacity 180ms ease; }
.far-beacon > span { position: absolute; left: -92%; right: -92%; bottom: -5%; height: 13%; transform: perspective(180px) rotateX(72deg); border: 1px solid rgba(222, 247, 255, .18); border-radius: 50%; box-shadow: 0 0 30px rgba(84, 209, 255, .16); }

/* Main dramatic object: the same table carries question, debate and answer states. */
.hero-round-table {
  --table-depth: 100px;
  position: absolute;
  z-index: 5;
  left: 69%;
  top: 39%;
  width: clamp(370px, 36vw, 550px);
  aspect-ratio: 1;
  transform: translate3d(-50%, -50%, var(--table-depth));
  transform-style: preserve-3d;
  filter: drop-shadow(0 30px 40px rgba(0, 2, 8, .7));
  transition: transform 460ms cubic-bezier(.16, .72, .18, 1), filter 260ms ease;
}

.table-variant-a.intro-screen .hero-round-table,
.table-variant-b.intro-screen .hero-round-table,
.table-variant-c.intro-screen .hero-round-table {
  --table-home-x: -22vw;
  --table-home-y: -6vh;
  left: 50%;
  top: 48%;
  transform: translate3d(
    calc(-50% + var(--table-home-x) + var(--table-dodge-x)),
    calc(-50% + var(--table-home-y) + var(--table-dodge-y)),
    var(--table-depth)
  );
  will-change: transform;
}

.table-light-column {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: -58%;
  width: clamp(34px, 7vw, 102px);
  height: 110%;
  transform: translateX(-50%) translateZ(-74px);
  background: linear-gradient(90deg, transparent, rgba(185, 231, 252, .08), rgba(242, 239, 218, .2), rgba(185, 231, 252, .08), transparent);
  filter: blur(9px);
  opacity: calc(.22 + var(--knowledge-level) * .62);
  -webkit-mask-image: linear-gradient(transparent, #000 21% 82%, transparent);
  mask-image: linear-gradient(transparent, #000 21% 82%, transparent);
  transition: height 620ms ease, opacity 420ms ease, filter 420ms ease;
}

.table-light-column i { position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: rgba(237, 251, 255, .86); box-shadow: 0 0 13px var(--cyan), 0 0 42px rgba(136, 217, 255, .8); }

.table-crown {
  position: absolute;
  z-index: 0;
  inset: 10%;
  transform: translateZ(-110px);
  border: 1px solid rgba(214, 244, 255, .16);
  border-radius: 50%;
  opacity: .62;
  animation: crown-turn 24s linear infinite;
  transition: transform 680ms cubic-bezier(.2, .8, .2, 1), opacity 420ms ease;
}

.table-crown::before,
.table-crown::after,
.table-crown i,
.table-crown b { content: ""; position: absolute; border: 1px solid rgba(218, 246, 255, .14); border-radius: 50%; }
.table-crown::before { inset: -9%; border-style: dashed; }
.table-crown::after { inset: 8%; border-color: rgba(255, 214, 160, .18); }
.table-crown i:nth-child(1) { inset: 18%; }
.table-crown i:nth-child(2) { inset: 30%; border-style: dotted; }
.table-crown i:nth-child(3) { inset: 41%; box-shadow: 0 0 28px rgba(136, 217, 255, .12); }
.table-crown b { left: 50%; top: -12%; bottom: -12%; width: 1px; border-width: 0 0 0 1px; border-radius: 0; }

.table-aureole,
.table-aureole::before,
.table-aureole::after,
.table-aureole i {
  position: absolute;
  border: 1px solid rgba(221, 247, 255, .18);
  border-radius: 50%;
}

.table-aureole { inset: 2%; transform: translateZ(-90px) rotateX(60deg); box-shadow: 0 0 46px rgba(136, 217, 255, .08); transition: transform 760ms cubic-bezier(.2, .8, .2, 1), box-shadow 520ms ease; }
.table-aureole::before, .table-aureole::after { content: ""; }
.table-aureole::before { inset: 10%; }
.table-aureole::after { inset: 24%; border-color: rgba(255, 214, 160, .2); }
.table-aureole i:nth-child(1) { inset: 37%; }
.table-aureole i:nth-child(2) { left: 50%; top: -8%; bottom: -8%; width: 1px; border-width: 0 0 0 1px; border-radius: 0; }
.table-aureole i:nth-child(3) { top: 50%; left: -8%; right: -8%; height: 1px; border-width: 1px 0 0; border-radius: 0; }

.hero-table-shadow {
  position: absolute;
  left: 50%;
  top: 58%;
  width: 64%;
  height: 34%;
  transform: translate3d(-50%, -50%, -85px) rotateX(70deg);
  border-radius: 50%;
  background: rgba(0, 2, 7, .82);
  box-shadow: 0 28px 60px #000, 0 0 66px rgba(136, 217, 255, .12);
  filter: blur(5px);
  transition: transform 620ms cubic-bezier(.2, .8, .2, 1), opacity 420ms ease, filter 420ms ease;
}

.hero-table-reflection {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 66%;
  width: 52%;
  height: 31%;
  transform: translate3d(-50%, 0, -120px) rotateX(72deg);
  border: 1px solid rgba(222, 247, 255, .2);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(200, 237, 255, .1), transparent 66%);
  box-shadow: 0 0 50px rgba(136, 217, 255, .08);
  opacity: calc(.2 + var(--reflection-opacity));
  filter: blur(.5px);
  transition: transform 760ms cubic-bezier(.2, .8, .2, 1), opacity 420ms ease;
}

.hero-table-reflection i,
.hero-table-reflection b { position: absolute; border: 1px solid rgba(218, 246, 255, .14); border-radius: 50%; }
.hero-table-reflection i:nth-child(1) { inset: 13%; }
.hero-table-reflection i:nth-child(2) { inset: 31%; }
.hero-table-reflection b { left: 49%; top: 5%; bottom: 5%; width: 2%; border: 0; background: rgba(233, 250, 255, .34); box-shadow: 0 0 22px var(--cyan); filter: blur(2px); }

.debate-signals { position: absolute; z-index: 2; inset: 0; transform-style: preserve-3d; pointer-events: none; }
.argument-signal {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 37%;
  height: 1px;
  transform: rotate(var(--signal-angle)) translateZ(38px);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, rgba(241, 250, 255, .65), rgba(136, 217, 255, .08) 74%, transparent);
  opacity: .08;
}

.argument-signal::after { content: ""; position: absolute; right: 8%; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--mist); border-right: 1px solid var(--mist); transform: rotate(45deg); }
.argument-signal b { position: absolute; left: 0; top: -2px; width: 5px; height: 5px; border-radius: 50%; background: var(--ivory); box-shadow: 0 0 12px var(--cyan); opacity: 0; }
.scene-seated .argument-signal.is-live { opacity: .22; }
.scene-phase-1 .argument-signal.is-live,
.scene-phase-2 .argument-signal.is-live,
.scene-phase-3 .argument-signal.is-live,
.scene-phase-4 .argument-signal.is-live { opacity: .58; box-shadow: 0 0 8px rgba(136, 217, 255, .25); }
.scene-phase-1 .argument-signal.is-live b,
.scene-phase-2 .argument-signal.is-live b,
.scene-phase-3 .argument-signal.is-live b,
.scene-phase-4 .argument-signal.is-live b { opacity: 1; animation: signal-travel 1.8s var(--signal-delay) linear infinite; }
.scene-answer .argument-signal.is-live { opacity: calc(.34 + var(--knowledge-level) * .5); box-shadow: 0 0 10px rgba(136, 217, 255, .34); }

.hero-table-disk {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54%;
  aspect-ratio: 1;
  transform: translate3d(-50%, -50%, 24px) rotateX(59deg) rotateZ(45deg);
  transform-style: preserve-3d;
  border: 1px solid rgba(232, 248, 255, .85);
  border-radius: 50%;
  background:
    radial-gradient(circle at 42% 34%, rgba(255, 226, 179, .28), transparent 16%),
    conic-gradient(from 45deg, rgba(231, 249, 255, .24), rgba(9, 29, 47, .9), rgba(231, 249, 255, .08), rgba(3, 15, 27, .95), rgba(231, 249, 255, .24));
  box-shadow:
    inset 0 0 42px rgba(220, 245, 255, .19),
    0 22px 0 rgba(4, 13, 23, .92),
    0 25px 1px rgba(207, 239, 252, .28),
    0 38px 54px rgba(0, 1, 5, .72);
  transition: transform 680ms cubic-bezier(.18, .82, .18, 1), box-shadow 520ms ease, filter 520ms ease;
}

.hero-table-disk > i { position: absolute; inset: 14%; border: 1px solid rgba(231, 247, 255, .22); border-radius: 50%; }
.hero-table-disk > i:nth-child(2) { inset: 29%; }
.hero-table-disk > i:nth-child(3) { inset: 45%; background: rgba(242, 239, 218, .9); box-shadow: 0 0 20px var(--warning), 0 0 56px rgba(255, 214, 160, .44); }
.hero-table-disk > s { position: absolute; inset: 6%; border: 1px dashed rgba(231, 247, 255, .18); border-radius: 50%; text-decoration: none; animation: crown-turn 32s linear infinite reverse; }

.table-pedestal {
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 52%;
  width: 15%;
  height: 31%;
  transform: translate3d(-50%, 0, -18px);
  clip-path: polygon(34% 0, 66% 0, 84% 100%, 16% 100%);
  border: 1px solid rgba(221, 247, 255, .3);
  background: linear-gradient(90deg, rgba(3, 11, 20, .94), rgba(130, 197, 229, .18) 48% 52%, rgba(3, 11, 20, .94));
  box-shadow: inset 0 0 24px rgba(136, 217, 255, .08), 0 24px 32px rgba(0, 2, 8, .5);
}

.table-pedestal::before { content: ""; position: absolute; left: 18%; right: 18%; top: 8%; bottom: 9%; border-right: 1px solid rgba(226, 248, 255, .14); border-left: 1px solid rgba(226, 248, 255, .14); }
.table-pedestal::after { content: ""; position: absolute; left: -25%; right: -25%; bottom: 0; height: 12%; border: 1px solid rgba(225, 248, 255, .28); border-radius: 50%; background: rgba(4, 12, 21, .92); box-shadow: 0 0 18px rgba(136, 217, 255, .1); }
.table-pedestal i,
.table-pedestal b { position: absolute; left: 20%; right: 20%; height: 1px; background: rgba(225, 248, 255, .18); }
.table-pedestal i { top: 36%; }
.table-pedestal b { top: 67%; }

.hero-table-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 31%;
  min-height: 0;
  aspect-ratio: 1;
  display: grid;
  place-content: center;
  text-align: center;
  transform: translate3d(-50%, -50%, 28px) rotateZ(-45deg) rotateX(-40deg);
  border: 1px solid rgba(232, 248, 255, .22);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(5, 15, 26, .72), rgba(5, 15, 26, .14) 68%, transparent 70%);
  box-shadow: inset 0 0 24px rgba(136, 217, 255, calc(.05 + var(--knowledge-level) * .16)), 0 0 20px rgba(136, 217, 255, .08);
}

.hero-table-core span { color: var(--ivory); font-family: var(--display); font-size: 25px; line-height: .8; text-shadow: 0 0 15px rgba(136, 217, 255, .46); }
.hero-table-core small { max-width: 76px; margin-top: 6px; color: var(--warning); font-family: var(--mono); font-size: 5px; letter-spacing: .07em; line-height: 1.25; text-transform: uppercase; }

.hero-table-seats { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform 720ms cubic-bezier(.2, .8, .2, 1); }
.hero-table-seat {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 1px;
  transform: rotate(var(--seat-angle)) translateY(calc(clamp(154px, 18vw, 244px) * -1)) rotate(var(--seat-inverse));
  transform-style: preserve-3d;
}

.seat-presence {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 54px;
  height: 76px;
  transform: translate(calc(-50% + var(--presence-x)), calc(-50% + var(--presence-y))) scale(.88);
  opacity: 0;
  filter: drop-shadow(0 0 12px rgba(136, 217, 255, .46));
  transition: opacity 240ms ease, transform 320ms ease;
}

.hero-table-seat.is-occupied .seat-presence { opacity: .58; transform: translate(calc(-50% + var(--presence-x)), calc(-50% + var(--presence-y))) scale(1); animation: presence-breathe 4.8s var(--arrival-delay) ease-in-out infinite; }
.seat-presence > u { position: absolute; inset: 0; text-decoration: none; }
.seat-presence > u::before { content: ""; position: absolute; left: 50%; top: 7%; width: 18px; height: 22px; transform: translateX(-50%); border: 1px solid rgba(229, 249, 255, .75); border-radius: 46% 46% 42% 42%; background: radial-gradient(circle at 50% 32%, rgba(232, 248, 255, .42), rgba(136, 217, 255, .08) 52%, transparent 54%); box-shadow: 0 0 14px rgba(136, 217, 255, .34); }
.seat-presence > u::after { content: ""; position: absolute; left: 50%; bottom: 4%; width: 42px; height: 48px; transform: translateX(-50%); clip-path: polygon(38% 0, 62% 0, 100% 100%, 0 100%); border: 1px solid rgba(220, 247, 255, .42); background: repeating-linear-gradient(90deg, rgba(220, 247, 255, .17) 0 1px, transparent 1px 7px), linear-gradient(180deg, rgba(151, 216, 246, .18), transparent); }
.seat-presence > u > i { position: absolute; left: 50%; top: 22%; bottom: 5%; width: 1px; background: rgba(235, 250, 255, .78); box-shadow: 0 0 10px var(--cyan); }

.hero-table-seat > .seat-card {
  width: clamp(82px, 8vw, 112px);
  min-height: 62px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 1px 7px;
  padding: 7px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(190, 229, 249, .34);
  background: linear-gradient(145deg, rgba(10, 25, 41, .94), rgba(3, 11, 21, .96));
  box-shadow: 8px 8px 0 rgba(107, 176, 211, .04), inset 0 0 24px rgba(136, 217, 255, .025);
  color: inherit;
  font-style: normal;
  text-align: left;
}

.hero-table-seat .seat-card { position: relative; }
.seat-card > em { position: absolute; right: 5px; top: 3px; color: rgba(170, 205, 224, .42); font-family: var(--mono); font-size: 5px; font-style: normal; letter-spacing: .08em; }

.hero-table-seat b { grid-row: 1 / 3; width: 34px; height: 46px; display: grid; place-items: center; border-right: 1px solid var(--line); color: var(--ivory); font-family: var(--display); font-size: 22px; font-weight: 400; }
.hero-table-seat span { overflow: hidden; color: var(--ice); font-family: var(--display); font-size: 14px; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.hero-table-seat small { overflow: hidden; color: var(--muted); font-family: var(--mono); font-size: 5px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.hero-table-seat.is-empty > .seat-card { border-style: dashed; opacity: .34; }
.hero-table-seat.is-empty span { color: var(--muted); font-family: var(--mono); font-size: 6px; text-transform: uppercase; }
.hero-table-seat.is-speaking > .seat-card { border-color: var(--warning); box-shadow: 0 0 26px rgba(255, 214, 160, .2), 8px 8px 0 rgba(255, 214, 160, .045); animation: seat-speaking 640ms ease-in-out infinite alternate; }
.hero-table-seat.is-leading > .seat-card { border-color: var(--ice); box-shadow: 0 0 34px rgba(136, 217, 255, .26), 8px 8px 0 rgba(136, 217, 255, .07); }
.hero-table-seat.is-leading b { color: var(--cyan); text-shadow: 0 0 14px var(--cyan); }
.world-stage.is-interactive .seat-card { cursor: pointer; }
.world-stage.is-interactive .seat-card:hover,
.world-stage.is-interactive .seat-card:focus-visible { border-color: var(--warning); box-shadow: 0 0 30px rgba(255, 214, 160, .24), 8px 8px 0 rgba(255, 214, 160, .06); }

.scene-empty .hero-table-seat { display: none; }
.scene-empty .hero-table-core small { display: none; }

.hero-utterance {
  position: absolute;
  z-index: 8;
  left: 50%;
  top: 8%;
  width: min(330px, 76%);
  padding: 13px 15px;
  transform: translateX(-50%) translateZ(170px);
  border: 1px solid var(--line-bright);
  background: rgba(5, 15, 26, .92);
  box-shadow: 12px 12px 0 rgba(111, 181, 216, .055), 0 0 24px rgba(136, 217, 255, .08);
}

.hero-utterance::after { content: ""; position: absolute; left: 50%; bottom: -25px; width: 1px; height: 24px; background: var(--line-bright); }
.hero-utterance span { color: var(--warning); font-family: var(--mono); font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }
.hero-utterance p { display: -webkit-box; overflow: hidden; margin: 6px 0 0; color: var(--mist); font-size: 10px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.hidden-seats { position: absolute; left: 50%; bottom: 3%; margin: 0; transform: translateX(-50%); color: var(--muted); font-family: var(--mono); font-size: 6px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }

.journey-scenes {
  position: absolute;
  z-index: 7;
  top: 24px;
  left: clamp(20px, 3vw, 48px);
  display: grid;
  grid-template-columns: repeat(4, minmax(96px, 1fr));
  width: min(560px, calc(100% - 280px));
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(190, 229, 249, .18);
  list-style: none;
}

.journey-scenes li { position: relative; min-height: 62px; display: grid; grid-template-columns: 22px 1fr; gap: 1px 5px; padding: 10px 12px 0 0; opacity: .28; }
.journey-scenes li::before { content: ""; position: absolute; left: 0; top: -1px; width: 0; height: 1px; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
.journey-scenes li.is-current, .journey-scenes li.is-done { opacity: 1; }
.journey-scenes li.is-current::before, .journey-scenes li.is-done::before { width: 100%; }
.journey-scenes span { grid-row: 1 / 3; color: var(--cyan); font-family: var(--mono); font-size: 7px; }
.journey-scenes b { color: var(--ice); font-family: var(--mono); font-size: 7px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }
.journey-scenes small { color: var(--muted); font-size: 7px; line-height: 1.25; }

.prototype-switcher {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: 16px;
  min-height: 48px;
  display: grid;
  grid-template-columns: 48px minmax(170px, auto) 48px;
  align-items: center;
  transform: translateX(-50%);
  border: 1px solid rgba(232, 248, 255, .72);
  background: rgba(3, 9, 17, .94);
  box-shadow: 0 16px 42px rgba(0, 0, 0, .62);
  backdrop-filter: blur(18px);
}

.prototype-switcher a { min-width: 48px; min-height: 48px; display: grid; place-items: center; color: var(--cyan); font-size: 18px; text-decoration: none; }
.prototype-switcher a:first-child { border-right: 1px solid var(--line); }
.prototype-switcher a:last-child { border-left: 1px solid var(--line); }
.prototype-switcher span { padding: 0 16px; color: var(--mist); font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.prototype-switcher b { margin-right: 8px; color: var(--ice); font-family: var(--display); font-size: 18px; font-weight: 400; }

/* Three structural readings of the same four-scene journey. */
.table-variant-a .question-console { width: min(520px, calc(100% - 40px)); }
.table-variant-a .process-copy { width: min(500px, calc(100% - 40px)); }
.table-variant-b .hero-round-table { left: 50%; top: 36%; width: clamp(400px, 44vw, 610px); }
.table-variant-b .question-console { left: 50%; bottom: 30px; width: min(760px, calc(100% - 40px)); transform: translateX(-50%) perspective(1800px) translateZ(70px); }
.table-variant-b .question-console:focus-within { transform: translateX(-50%) perspective(1800px) translateZ(88px); }
.table-variant-b .journey-scenes { left: 50%; width: min(720px, calc(100% - 80px)); transform: translateX(-50%); }
.table-variant-b .process-copy { top: 15%; width: min(390px, 42vw); }
.table-variant-b .process-copy h1 { font-size: clamp(38px, 4vw, 58px); }
.table-variant-c .hero-round-table { left: 29%; top: 43%; width: clamp(390px, 38vw, 540px); }
.table-variant-c .question-console { left: auto; right: clamp(20px, 5vw, 78px); bottom: 54px; width: min(500px, 47vw); }
.table-variant-c .result-hero .answer-oracle { left: auto; right: clamp(20px, 5vw, 78px); top: 24px; bottom: auto; width: min(560px, 54vw); max-height: calc(100svh - 120px); overflow-y: auto; padding: clamp(26px, 3.2vw, 42px); scrollbar-color: var(--cyan) var(--deep); }
.table-variant-c .result-hero .answer-oracle h1 { font-size: clamp(34px, 3.6vw, 52px); }
.table-variant-c .process-copy { left: auto; right: clamp(20px, 5vw, 78px); top: 17%; width: min(500px, 48vw); border-right: 1px solid var(--line-bright); border-left: 0; background: linear-gradient(270deg, rgba(3, 9, 17, .82), rgba(3, 9, 17, .34)); }
.table-variant-c .process-copy h1 { font-size: clamp(38px, 4.4vw, 62px); }
.table-variant-c .hero-table-disk { background: radial-gradient(circle at 42% 34%, rgba(255, 211, 153, .4), transparent 17%), conic-gradient(from 45deg, rgba(231, 249, 255, .18), rgba(18, 34, 47, .94), rgba(255, 214, 160, .12), rgba(4, 15, 26, .96), rgba(231, 249, 255, .18)); }
.table-variant-c .journey-scenes { left: auto; right: 3vw; width: min(520px, 48vw); }

@keyframes seat-speaking { from { transform: translate(-50%, -50%) translateY(0); } to { transform: translate(-50%, -50%) translateY(-5px); } }

.question-console,
.answer-oracle {
  transform: perspective(1800px) translateZ(70px) rotateY(1.25deg);
  transform-origin: 0 50%;
  transform-style: preserve-3d;
  box-shadow:
    16px 16px 0 rgba(93, 161, 199, .085),
    32px 32px 0 rgba(107, 171, 205, .04),
    inset 0 0 70px rgba(157, 219, 247, .045),
    0 34px 80px rgba(0, 3, 8, .34);
  transition: transform 240ms ease, border-color 180ms ease;
}

.question-console:focus-within { transform: perspective(1800px) translateZ(88px) rotateY(.45deg); border-color: rgba(229, 249, 255, .78); }
.question-console::before { transform: translateZ(-38px); box-shadow: 14px 14px 0 rgba(114, 184, 219, .055); }
.answer-oracle { transform: perspective(1800px) translateZ(90px) rotateY(1.6deg); }

.catalogue-backdrop { perspective: none; }
.catalogue {
  position: relative;
  /* Keep interactive controls on one hit-test plane; depth stays in the shadows. */
  transform: none;
  transform-style: flat;
  box-shadow: 24px 24px 0 rgba(124, 191, 226, .065), 48px 48px 0 rgba(104, 166, 199, .025), inset 0 0 90px rgba(136, 217, 255, .035), 0 42px 100px rgba(0, 2, 8, .5);
}

.catalogue::before,
.catalogue::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(221, 247, 255, .11);
}

.catalogue::before { inset: 14px; }
.catalogue::after { inset: 28px; }

@keyframes sign-body-breathe {
  0%, 100% { transform: translateZ(0) scale(1); opacity: .86; }
  50% { transform: translateZ(16px) scale(1.018); opacity: 1; }
}

.question-console {
  position: absolute;
  z-index: 5;
  left: clamp(20px, 6vw, 96px);
  bottom: clamp(40px, 8vh, 100px);
  width: min(690px, calc(100% - 40px));
  padding: clamp(24px, 4vw, 48px);
  border: 1px solid var(--line-bright);
  background: linear-gradient(145deg, rgba(9, 22, 36, .88), rgba(6, 16, 28, .65));
  box-shadow: 18px 18px 0 rgba(78, 139, 177, .08), 36px 36px 0 rgba(138, 190, 220, .035), inset 0 0 60px rgba(157, 219, 247, .04);
  backdrop-filter: blur(24px) saturate(130%);
}

.question-console::before,
.question-console::after { content: ""; position: absolute; pointer-events: none; }
.question-console::before { inset: 12px; border: 1px solid rgba(232, 248, 255, .08); }
.question-console::after { top: -9px; right: 32px; width: 72px; height: 16px; border: 1px solid var(--line-bright); background: rgba(176, 224, 248, .1); }

.micro { margin: 0 0 var(--space-3); color: var(--mist); font-family: var(--mono); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.micro span { color: var(--cyan); }

.question-console h1,
.catalogue-head h2,
.examples-drawer h2,
.method-dialog h2,
.content-heading h2 {
  font-family: var(--display);
  font-weight: 400;
}

.question-console h1 { margin: 0 0 var(--space-6); color: var(--ivory); font-size: clamp(42px, 5vw, 72px); line-height: .92; letter-spacing: -.025em; }

.question-field { display: block; }
.question-field > span { min-height: 28px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); color: var(--mist); font-family: var(--mono); font-size: 8px; font-style: normal; letter-spacing: .13em; text-transform: uppercase; }
.question-field > span i { color: var(--muted); font-style: normal; font-variant-numeric: tabular-nums; }

#question {
  width: 100%;
  min-height: 118px;
  resize: vertical;
  padding: 20px 0 16px;
  border: 0;
  border-bottom: 1px solid var(--line-bright);
  border-radius: 0;
  background: transparent;
  color: var(--ice);
  font-family: var(--display);
  font-size: clamp(26px, 2.4vw, 38px);
  line-height: 1.1;
}

#question::placeholder { color: rgba(170, 199, 216, .52); }
#question:focus { outline: 0; border-bottom-color: var(--cyan); box-shadow: 0 12px 22px -20px var(--cyan); }
#question[aria-invalid="true"] { border-bottom-color: var(--warning); }
.input-error { margin: 10px 0 0; color: var(--warning); font-size: 12px; }

.selection-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; margin-top: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.participant-button { min-height: 64px; display: grid; grid-template-columns: 76px minmax(0, 1fr) 28px; align-items: center; gap: 12px; padding: 0 14px 0 0; border: 0; border-right: 1px solid var(--line); background: transparent; text-align: left; }
.participant-button > span { color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.participant-button strong { overflow: hidden; font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.participant-button i { color: var(--cyan); font-style: normal; }
.participant-button:hover strong { color: var(--cyan); }
.selection-count { min-width: 80px; display: grid; place-items: center; color: var(--muted); font-family: var(--mono); font-size: 10px; font-variant-numeric: tabular-nums; }
.selection-count b { color: var(--ice); font-weight: 500; }

.question-actions { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-top: 24px; }
.question-starters { min-width: 0; display: grid; gap: 5px; }
.question-starters > span { color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }
.question-starters > div { display: flex; align-items: center; gap: 18px; }
.random-question-action { min-height: 44px; padding: 0; border: 0; border-bottom: 1px solid var(--line-bright); background: none; color: var(--mist); font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.random-question-action i { margin-left: 5px; color: var(--cyan); font-size: 13px; font-style: normal; }
.run-button,
.confirm-selection {
  min-width: 210px;
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  padding: 0 18px;
  border: 1px solid var(--ice);
  border-radius: 0;
  background: rgba(226, 247, 255, .92);
  color: #07111d;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  box-shadow: 0 0 24px rgba(155, 221, 251, .18);
  transition: background-color 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}
.run-button:hover, .confirm-selection:hover { background: transparent; color: var(--ice); box-shadow: 0 0 34px rgba(136, 217, 255, .28); }
.run-button:active, .confirm-selection:active { transform: translateY(2px); }

.local-note { position: absolute; z-index: 5; right: 3vw; bottom: 22px; margin: 0; color: rgba(223, 245, 255, .46); font-family: var(--mono); font-size: 8px; letter-spacing: .11em; text-transform: uppercase; }

.catalogue-backdrop,
.examples-backdrop,
.dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(1, 5, 11, .82);
  backdrop-filter: blur(14px);
}

.catalogue {
  width: min(1440px, 100%);
  height: min(900px, calc(100svh - 48px));
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
  border: 1px solid var(--line-bright);
  background: rgba(7, 17, 29, .96);
  box-shadow: 24px 24px 0 rgba(124, 191, 226, .06), inset 0 0 90px rgba(136, 217, 255, .035);
}

.catalogue-head,
.examples-drawer > header { min-height: 116px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 30px; border-bottom: 1px solid var(--line); }
.catalogue-head h2, .examples-drawer h2 { margin: 0; color: var(--ivory); font-size: clamp(38px, 4vw, 58px); line-height: .92; }
.icon-action { width: 48px; height: 48px; flex: 0 0 auto; border: 1px solid var(--line-bright); border-radius: 0; background: transparent; color: var(--ice); font-family: var(--display); font-size: 30px; }
.icon-action:hover { background: var(--ice); color: var(--void); }

.catalogue-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; border-bottom: 1px solid var(--line); }
.search-field { min-height: 64px; display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: center; padding: 0 30px; border-right: 1px solid var(--line); }
.search-field span { color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.search-field input { height: 46px; border: 0; background: transparent; color: var(--ice); font-size: 16px; }
.search-field input:focus { outline: 0; }
.search-field input::placeholder { color: var(--muted); }
.catalogue-actions { display: flex; align-items: center; gap: 22px; padding: 0 30px; }

.era-tabs { min-height: 54px; display: flex; align-items: stretch; overflow-x: auto; border-bottom: 1px solid var(--line); }
.era-tabs button { min-width: max-content; min-height: 54px; padding: 0 22px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.era-tabs button span { margin-left: 8px; color: var(--mist); }
.era-tabs button.is-active { background: rgba(154, 216, 246, .1); color: var(--ice); box-shadow: inset 0 -2px var(--cyan); }

.catalogue-list { min-height: 0; overflow-y: auto; scrollbar-color: var(--cyan) var(--deep); }
.era-group { border-bottom: 1px solid var(--line); }
.era-group > header { position: sticky; top: 0; z-index: 2; min-height: 46px; display: flex; justify-content: space-between; align-items: center; padding: 0 30px; background: rgba(6, 16, 28, .94); color: var(--mist); font-family: var(--mono); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; backdrop-filter: blur(12px); }
.person-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.person-option { position: relative; width: 100%; min-height: 96px; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: start; gap: 13px; padding: 17px 18px; border: 0; border-right: 1px solid var(--line); border-top: 1px solid rgba(190, 229, 249, .12); border-radius: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background-color 160ms ease, box-shadow 160ms ease; appearance: none; }
.person-option:nth-child(3n) { border-right: 0; }
.person-option:hover { background: rgba(140, 205, 236, .07); }
.person-option:focus-visible { z-index: 1; outline: 1px solid var(--ice); outline-offset: -3px; background: rgba(140, 205, 236, .09); }
.person-option.is-selected { background: linear-gradient(135deg, rgba(184, 230, 250, .16), rgba(110, 159, 196, .06)); box-shadow: inset 0 0 24px rgba(150, 217, 248, .06); }
.person-mark { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line-bright); color: var(--cyan); font-family: var(--mono); font-size: 13px; }
.is-selected .person-mark { background: var(--ice); color: var(--deep); box-shadow: 0 0 16px rgba(136, 217, 255, .26); }
.person-copy { min-width: 0; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; }
.person-copy b { overflow: hidden; font-family: var(--display); font-size: 20px; font-weight: 400; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.person-copy small { color: var(--muted); font-family: var(--mono); font-size: 8px; white-space: nowrap; }
.person-copy em { grid-column: 1 / -1; overflow: hidden; color: var(--mist); font-size: 10px; font-style: normal; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.person-copy u { grid-column: 1 / -1; margin-top: 7px; color: var(--cyan); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; line-height: 1.35; text-decoration: none; text-transform: uppercase; }
.person-state { align-self: center; color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.is-selected .person-state { color: var(--ice); }
.catalogue-empty { padding: 60px 30px; color: var(--mist); font-family: var(--display); font-size: 28px; }

.catalogue-foot { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 10px 20px 10px 30px; border-top: 1px solid var(--line-bright); background: rgba(10, 25, 40, .94); }
.catalogue-foot p { max-width: 760px; margin: 0; color: var(--mist); font-size: 11px; }
.catalogue-foot p strong { color: var(--ice); font-family: var(--display); font-size: 24px; font-weight: 400; }
.confirm-selection { min-width: 170px; }

.examples-drawer { width: min(1180px, 100%); max-height: min(860px, calc(100svh - 48px)); overflow-y: auto; border: 1px solid var(--line-bright); background: rgba(7, 17, 29, .97); box-shadow: 24px 24px 0 rgba(124, 191, 226, .06); }
.example-grid { display: grid; grid-template-columns: 1fr 1fr; }
.example-grid button { min-height: 104px; display: grid; grid-template-columns: 36px 1fr 28px; gap: 14px; align-items: start; padding: 22px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; text-align: left; }
.example-grid button:nth-child(2n) { border-right: 0; }
.example-grid button:hover { background: rgba(146, 211, 241, .08); }
.example-grid span, .example-grid i { color: var(--cyan); font-family: var(--mono); font-size: 9px; font-style: normal; }
.example-grid strong { font-family: var(--display); font-size: 21px; font-weight: 400; line-height: 1.18; }

.process-copy { position: absolute; z-index: 5; left: clamp(20px, 6vw, 96px); top: 12%; width: min(620px, calc(100% - 40px)); padding: 30px; border-left: 1px solid var(--line-bright); background: linear-gradient(90deg, rgba(3, 9, 17, .72), transparent); }
.process-copy h1 { margin: 0 0 22px; font-family: var(--display); font-size: clamp(42px, 5.2vw, 80px); font-weight: 400; line-height: .94; }
.process-copy > p:last-child { max-width: 520px; color: var(--mist); font-size: 13px; }
.process-steps { position: absolute; z-index: 5; left: clamp(20px, 6vw, 96px); right: clamp(20px, 6vw, 96px); bottom: 30px; display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; border: 1px solid var(--line); list-style: none; background: rgba(5, 14, 25, .62); backdrop-filter: blur(18px); }
.process-steps li { min-height: 92px; display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 8px; padding: 16px; border-right: 1px solid var(--line); opacity: .3; }
.process-steps li:last-child { border-right: 0; }
.process-steps li.is-active, .process-steps li.is-done { opacity: 1; }
.process-steps span { color: var(--cyan); font-family: var(--mono); font-size: 9px; }
.process-steps strong { font-family: var(--display); font-size: 19px; font-weight: 400; }
.process-steps i { grid-column: 1 / -1; height: 2px; background: var(--line); }
.process-steps i::after { content: ""; display: block; width: 0; height: 100%; background: var(--ice); box-shadow: 0 0 10px var(--cyan); transition: width 320ms ease; }
.process-steps li.is-done i::after { width: 100%; }
.process-steps li.is-active i::after { width: 58%; }

.result-hero { min-height: calc(100svh - 72px); }
.answer-oracle { position: absolute; z-index: 5; left: clamp(20px, 5vw, 78px); bottom: clamp(32px, 7vh, 88px); width: min(900px, calc(100% - 40px)); padding: clamp(28px, 4vw, 54px); border: 1px solid var(--line-bright); background: linear-gradient(135deg, rgba(5, 15, 27, .9), rgba(11, 29, 46, .64)); box-shadow: 20px 20px 0 rgba(116, 183, 219, .07), inset 0 0 70px rgba(136, 217, 255, .035); backdrop-filter: blur(24px); }
.answer-oracle h1 { margin: 0 0 26px; color: var(--ivory); font-family: var(--display); font-size: clamp(36px, 4.5vw, 68px); font-weight: 400; line-height: .98; letter-spacing: -.02em; text-wrap: balance; overflow-wrap: anywhere; }
.answer-oracle > p:nth-of-type(2) { max-width: 760px; margin: 0; color: var(--mist); font-size: clamp(16px, 1.25vw, 18px); line-height: 1.62; }
.answer-meta { display: flex; justify-content: space-between; gap: 24px; margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.answer-meta b { margin-left: 8px; color: var(--ice); font-family: var(--display); font-size: 19px; font-weight: 400; }

.caveat-line { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 24px; padding: 18px clamp(20px, 5vw, 78px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--night); }
.caveat-line span { color: var(--warning); font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.caveat-line p { max-width: 980px; margin: 0; color: var(--mist); font-size: 15px; }

.content-section { position: relative; padding: clamp(64px, 9vw, 128px) clamp(20px, 5vw, 78px); border-bottom: 1px solid var(--line); background: linear-gradient(135deg, rgba(11, 25, 40, .96), var(--void) 72%); }
.content-section::before { content: ""; position: absolute; top: 0; right: 8%; width: 22%; height: 1px; background: var(--ice); box-shadow: 0 0 20px var(--cyan); }
.content-heading { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 22px; align-items: end; max-width: 1500px; margin: 0 auto 48px; }
.content-heading > span { color: var(--cyan); font-family: var(--display); font-size: 52px; line-height: .8; text-shadow: 0 0 20px rgba(136, 217, 255, .38); }
.content-heading p { margin: 0 0 5px; color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .14em; text-transform: uppercase; }
.content-heading h2 { margin: 0; color: var(--ivory); font-size: clamp(38px, 4.5vw, 68px); line-height: .95; }

.context-section {
  background:
    linear-gradient(90deg, rgba(136, 217, 255, .035) 1px, transparent 1px) 0 0 / 64px 100%,
    radial-gradient(circle at 18% 40%, rgba(136, 217, 255, .1), transparent 28%),
    linear-gradient(145deg, #07121f, #030912 82%);
}
.situation-context { max-width: 1500px; margin: 0 auto; border: 1px solid var(--line-bright); background: rgba(3, 12, 21, .82); box-shadow: 18px 18px 0 rgba(119, 194, 232, .045); }
.context-brief { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 18px 34px; align-items: start; padding: clamp(24px, 4vw, 48px); border-bottom: 1px solid var(--line); }
.context-brief > span,
.context-grid article > span { color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .13em; text-transform: uppercase; }
.context-brief p { margin: 0; color: var(--ivory); font-family: var(--display); font-size: clamp(24px, 3vw, 42px); line-height: 1.08; }
.context-brief small { grid-column: 2; max-width: 920px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.context-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.context-grid article { min-height: 210px; padding: 24px; border-right: 1px solid var(--line); }
.context-grid article:last-child { border-right: 0; }
.context-grid ul { display: grid; gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }
.context-grid li { position: relative; padding-left: 18px; color: var(--mist); font-size: 14px; line-height: 1.48; }
.context-grid li::before { content: "◇"; position: absolute; left: 0; top: 1px; color: var(--warning); font-size: 9px; }

.position-table, .knowledge-table { max-width: 1500px; margin: 0 auto; border-bottom: 1px solid var(--line); }
.position-row { display: grid; grid-template-columns: 50px 210px minmax(0, 1fr) 94px; gap: 24px; align-items: start; padding: 22px 0; border-top: 1px solid var(--line); }
.row-number { color: var(--cyan); font-family: var(--mono); font-size: 9px; }
.person-id h3 { margin: 0; font-family: var(--display); font-size: 22px; font-weight: 400; line-height: 1.1; }
.person-id p { margin: 5px 0 0; color: var(--muted); font-family: var(--mono); font-size: 8px; }
.person-id span { display: block; margin-top: 12px; color: var(--warning); font-family: var(--mono); font-size: 7px; line-height: 1.45; letter-spacing: .08em; text-transform: uppercase; }
.position-argument { display: grid; gap: 12px; max-width: 980px; }
.theory-name { width: fit-content; padding: 4px 8px; border: 1px solid rgba(136, 217, 255, .34); color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.position-thesis { max-width: 900px; margin: 0; color: var(--mist); font-size: 16px; line-height: 1.62; }
.position-argument > strong { color: var(--ivory); font-family: var(--display); font-size: 23px; font-weight: 400; line-height: 1.3; }
.position-argument > small,
.position-argument > em { color: var(--muted); font-family: var(--mono); font-size: 7px; font-style: normal; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
.position-argument > em { color: var(--warning); }
.theory-falsifier { max-width: 880px; display: grid; grid-template-columns: 110px 1fr; gap: 14px; margin: 2px 0; padding: 10px 0; border-top: 1px solid rgba(190, 229, 249, .14); border-bottom: 1px solid rgba(190, 229, 249, .14); color: var(--muted); font-size: 12px; line-height: 1.5; }
.theory-falsifier span { color: var(--warning); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.position-sources, .knowledge-sources { display: flex; flex-wrap: wrap; gap: 7px 14px; }
.position-sources a, .knowledge-sources a { min-height: 44px; display: inline-flex; align-items: center; color: var(--cyan); font-family: var(--mono); font-size: 8px; line-height: 1.35; letter-spacing: .04em; text-decoration: none; border-bottom: 1px solid rgba(136, 217, 255, .32); }
.position-sources a:hover, .position-sources a:focus-visible, .knowledge-sources a:hover, .knowledge-sources a:focus-visible { color: var(--ice); border-color: var(--ice); }
.fallback-source { opacity: .72; }
.weight-cell { text-align: right; font-variant-numeric: tabular-nums; }
.weight-cell strong { display: block; font-family: var(--display); font-size: 28px; font-weight: 400; }
.weight-cell i { display: block; height: 3px; margin-top: 8px; background: var(--line); }
.weight-cell i::after { content: ""; display: block; width: var(--weight); height: 100%; background: var(--ice); box-shadow: 0 0 8px var(--cyan); }
.list-disclosure { max-width: 1500px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 24px auto 0; padding: 18px 0; border-top: 1px solid var(--line); }
.list-disclosure p { margin: 0; color: var(--muted); font-family: var(--mono); font-size: 8px; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
.list-disclosure button { min-height: 44px; padding: 0 18px; border: 1px solid rgba(136, 217, 255, .38); background: rgba(5, 14, 24, .66); color: var(--ice); font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.list-disclosure button:hover, .list-disclosure button:focus-visible { border-color: var(--warning); color: var(--warning); }

.map-section {
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 52%, rgba(119, 197, 234, .11), transparent 34%),
    linear-gradient(145deg, #040912, #0a1c2e 110%);
}

.argument-map {
  position: relative;
  max-width: 1500px;
  margin: 0 auto;
  perspective: 1700px;
}

.map-paths {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
  transform: rotateX(.9deg);
  transform-origin: 50% 100%;
}

.map-path {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-rows: minmax(108px, auto) 40px minmax(112px, auto) 40px minmax(252px, 1fr) 46px;
  padding: 18px;
  background: rgba(4, 12, 22, .93);
}

.map-path::before {
  content: "";
  position: absolute;
  left: calc(50% - .5px);
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(transparent, rgba(218, 246, 255, .18), transparent);
}

.map-node {
  position: relative;
  z-index: 1;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(17, 36, 55, .94), rgba(5, 15, 26, .96));
  box-shadow: 9px 9px 0 rgba(114, 182, 218, .035), inset 0 0 34px rgba(139, 210, 242, .025);
}

.map-node > span,
.map-node > small,
.map-objection span,
.map-decision > span,
.map-hidden,
.map-disclosure {
  font-family: var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}

.source-node { min-height: 108px; padding: 14px; }
.source-node > span { display: block; color: var(--cyan); font-size: 8px; }
.source-node strong { display: block; margin-top: 8px; font-family: var(--display); font-size: 18px; font-weight: 400; line-height: 1.08; }
.source-node small { display: block; margin-top: 8px; color: var(--muted); font-size: 7px; }

.map-edge {
  position: relative;
  z-index: 1;
  width: 1px;
  height: 40px;
  justify-self: center;
  background: var(--line-bright);
  box-shadow: 0 0 10px rgba(136, 217, 255, .26);
}

.map-edge::after { content: ""; position: absolute; left: -3px; bottom: 0; width: 7px; height: 7px; border-right: 1px solid var(--ice); border-bottom: 1px solid var(--ice); transform: rotate(45deg); }
.map-edge span { position: absolute; left: 9px; top: 12px; width: max-content; color: var(--muted); font-family: var(--mono); font-size: 6px; font-style: normal; letter-spacing: .08em; text-transform: uppercase; }
.map-edge.is-secondary { opacity: .72; }

.claim-node { min-height: 112px; padding: 14px; }
.claim-node > span { display: block; color: var(--warning); font-family: var(--mono); font-size: 7px; letter-spacing: .09em; text-transform: uppercase; }
.claim-node > p { margin: 8px 0; color: var(--mist); font-size: 12px; line-height: 1.45; }
.claim-node > small { color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .06em; text-transform: uppercase; }

.agent-node { min-height: 252px; padding: 18px; }
.agent-node > span { display: block; color: var(--muted); font-size: 7px; }
.is-leading .agent-node { border-color: var(--line-bright); box-shadow: 10px 10px 0 rgba(113, 182, 218, .06), inset 0 0 50px rgba(136, 217, 255, .05), 0 0 26px rgba(136, 217, 255, .06); }
.is-leading .agent-node > span { color: var(--cyan); }
.agent-node > strong { display: block; margin-top: 9px; color: var(--ivory); font-family: var(--display); font-size: 28px; font-weight: 400; line-height: 1; }
.agent-node > p { min-height: 72px; margin: 12px 0 16px; color: var(--mist); font-size: 12px; line-height: 1.5; }
.agent-node dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.agent-node dl div { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 9px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.agent-node dt { color: var(--muted); font-family: var(--mono); font-size: 6px; letter-spacing: .06em; text-transform: uppercase; }
.agent-node dd { margin: 0; font-family: var(--display); font-size: 18px; font-variant-numeric: tabular-nums; }
.agent-node > b { display: block; margin-top: 12px; color: var(--cyan); font-family: var(--mono); font-size: 7px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }

.map-objection {
  position: relative;
  z-index: 1;
  min-height: 46px;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: repeating-linear-gradient(135deg, rgba(157, 215, 241, .045) 0 1px, transparent 1px 7px);
  color: var(--mist);
  font-style: normal;
}

.map-objection span { font-size: 7px; }
.map-objection.is-empty { opacity: .46; }
.map-hidden { margin: 18px 0 0; color: var(--muted); font-size: 8px; text-align: center; }

.map-convergence {
  position: relative;
  height: 76px;
  margin: 0 8%;
  border-bottom: 1px solid var(--line-bright);
}

.map-convergence::before,
.map-convergence::after,
.map-convergence i { content: ""; position: absolute; bottom: -1px; height: 76px; border-bottom: 1px solid var(--line-bright); }
.map-convergence::before { left: 0; width: 50%; transform: skewX(50deg); transform-origin: 100% 100%; }
.map-convergence::after { right: 0; width: 50%; transform: skewX(-50deg); transform-origin: 0 100%; }
.map-convergence i:nth-child(1) { left: 25%; width: 25%; transform: skewX(28deg); transform-origin: 100% 100%; }
.map-convergence i:nth-child(2) { right: 25%; width: 25%; transform: skewX(-28deg); transform-origin: 0 100%; }
.map-convergence i:nth-child(3) { left: 50%; width: 1px; border: 0; background: var(--ice); box-shadow: 0 0 14px var(--cyan); }

.map-decision {
  position: relative;
  z-index: 2;
  width: min(920px, 88%);
  margin: 0 auto;
  padding: clamp(22px, 3vw, 38px);
  border: 1px solid var(--line-bright);
  background: linear-gradient(145deg, rgba(17, 39, 59, .96), rgba(5, 16, 28, .97));
  box-shadow: 16px 16px 0 rgba(115, 183, 218, .06), 0 0 52px rgba(136, 217, 255, .07), inset 0 0 60px rgba(136, 217, 255, .035);
  transform: translateZ(54px) rotateX(-1.2deg);
}

.map-decision > span { color: var(--cyan); font-size: 8px; }
.map-decision h3 { margin: 12px 0 22px; color: var(--ivory); font-family: var(--display); font-size: clamp(28px, 3vw, 44px); font-weight: 400; line-height: 1.05; }
.map-decision > div { display: flex; justify-content: space-between; gap: 20px; padding-top: 12px; border-top: 1px solid var(--line); }
.map-decision b, .map-decision small { color: var(--mist); font-family: var(--mono); font-size: 8px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }
.map-decision b { color: var(--ice); }
.map-disclosure { max-width: 920px; margin: 30px auto 0; color: var(--warning); font-size: 8px; line-height: 1.6; text-align: center; }

.dialogue-section { background: linear-gradient(150deg, #050a12, #0b1e31 120%); }
.debate-room { max-width: 1500px; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 30px; align-items: start; margin: 0 auto; }

.cycle-system {
  grid-column: 1 / -1;
  overflow: hidden;
  border: 1px solid var(--line-bright);
  background:
    radial-gradient(circle at 50% 57%, rgba(255, 214, 160, .09), transparent 27%),
    linear-gradient(145deg, rgba(10, 29, 45, .96), rgba(2, 8, 16, .99));
  box-shadow: inset 0 0 90px rgba(136, 217, 255, .04);
}

.cycle-timeline { display: flex; min-height: 66px; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-color: var(--cyan) var(--deep); }
.cycle-timeline button { flex: 1 0 78px; min-width: 78px; min-height: 66px; display: grid; align-content: center; gap: 4px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); cursor: pointer; }
.cycle-timeline button span { font-family: var(--mono); font-size: 9px; letter-spacing: .14em; }
.cycle-timeline button small { overflow: hidden; padding: 0 7px; font-family: var(--display); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.cycle-timeline button:hover,
.cycle-timeline button.is-active { background: rgba(136, 217, 255, .08); color: var(--ice); }
.cycle-timeline button.is-active { box-shadow: inset 0 -2px var(--cyan); }

.cycle-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 420px); gap: 30px; align-items: end; padding: 24px 28px 14px; }
.cycle-head span,
.cycle-result > span,
.cycle-handoff span { color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .14em; text-transform: uppercase; }
.cycle-head h3 { margin: 7px 0 0; font-family: var(--display); font-size: clamp(26px, 3vw, 42px); font-weight: 400; }
.cycle-head p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.cycle-handoff { max-width: 860px; margin: 0 auto 10px; padding: 12px 18px; border: 1px solid rgba(136, 217, 255, .17); background: rgba(4, 15, 27, .74); color: var(--mist); font-family: var(--display); font-size: 18px; line-height: 1.35; text-align: center; }
.cycle-handoff span { display: block; margin-bottom: 7px; }

.cycle-table-room { position: relative; width: min(760px, 82vw); height: 580px; margin: 0 auto; }
.cycle-table-room::before { content: ""; position: absolute; left: 50%; top: 50%; width: 88%; height: 54%; transform: translate(-50%, -50%) rotateX(68deg); border: 1px solid rgba(215, 242, 255, .1); border-radius: 50%; box-shadow: 0 40px 70px rgba(0, 0, 0, .48); }
.cycle-table-surface { position: absolute; left: 50%; top: 50%; width: 390px; height: 390px; transform: translate(-50%, -50%) rotateX(62deg) rotateZ(45deg); border: 1px solid rgba(225, 246, 255, .62); border-radius: 50%; background: radial-gradient(circle, rgba(255, 221, 170, .17), rgba(24, 53, 71, .74) 38%, rgba(2, 9, 17, .98) 72%); box-shadow: inset 0 0 70px rgba(164, 224, 250, .15), 0 34px 0 rgba(1, 6, 12, .88), 0 38px 1px rgba(191, 232, 249, .18), 0 52px 72px rgba(0, 0, 0, .72); }
.cycle-table-surface > i { position: absolute; inset: 13%; border: 1px solid rgba(220, 245, 255, .18); border-radius: 50%; }
.cycle-table-surface > i:nth-child(2) { inset: 27%; border-style: dashed; }
.cycle-table-surface > i:nth-child(3) { inset: 42%; background: rgba(255, 214, 160, .12); box-shadow: 0 0 32px rgba(255, 214, 160, .2); }
.cycle-center { position: absolute; z-index: 6; left: 50%; top: 50%; width: 160px; height: 84px; display: grid; place-items: center; align-content: center; gap: 4px; transform: translate(-50%, -50%); border: 1px solid rgba(255, 221, 170, .66); border-radius: 50%; background: rgba(5, 15, 23, .96); color: var(--ivory); cursor: pointer; box-shadow: 0 0 34px rgba(255, 214, 160, .18); }
.cycle-center span { font-family: var(--display); font-size: 28px; }
.cycle-center small,
.cycle-center b { font-family: var(--mono); font-size: 7px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }
.cycle-center small { color: var(--muted); }
.cycle-center b { margin-top: 5px; color: var(--warning); }
.cycle-center:hover { border-color: var(--warning); box-shadow: 0 0 46px rgba(255, 214, 160, .3); }
.cycle-center.has-live-line { width: min(360px, 54%); height: 176px; padding: 18px 22px; place-items: start; align-content: center; border-radius: 0; text-align: left; }
.cycle-center.has-live-line strong { color: var(--warning); font-family: var(--display); font-size: 22px; font-weight: 400; }
.cycle-center.has-live-line p { display: -webkit-box; overflow: hidden; margin: 3px 0 1px; color: var(--ice); font-size: 12px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }

.cycle-seat { position: absolute; z-index: 4; left: 50%; top: 50%; width: 176px; min-height: 86px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px; transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-238px) rotate(var(--inverse-angle)); border: 1px solid var(--line); background: rgba(4, 14, 25, .94); color: var(--mist); text-align: left; cursor: pointer; box-shadow: 7px 7px 0 rgba(94, 172, 209, .035); transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease; }
.cycle-seat:hover,
.cycle-seat:focus-visible { z-index: 8; border-color: var(--ice); background: rgba(8, 25, 41, .99); box-shadow: 0 0 30px rgba(136, 217, 255, .16); }
.cycle-avatar { width: 38px; height: 54px; display: grid; place-items: center; border-right: 1px solid var(--line); color: var(--ice); font-family: var(--display); font-size: 23px; }
.cycle-card-copy { min-width: 0; display: grid; gap: 4px; }
.cycle-card-copy b { overflow: hidden; color: var(--ice); font-family: var(--display); font-size: 15px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.cycle-card-copy small,
.cycle-metrics small { color: var(--muted); font-family: var(--mono); font-size: 6px; letter-spacing: .06em; text-transform: uppercase; }
.cycle-card-copy em { position: absolute; left: 0; top: calc(100% + 7px); width: 240px; max-height: 0; overflow: hidden; padding: 0 10px; border: 0 solid var(--line-bright); background: rgba(2, 9, 17, .98); color: var(--mist); font-family: var(--body); font-size: 12px; font-style: normal; line-height: 1.45; opacity: 0; pointer-events: none; transition: opacity 160ms ease, max-height 180ms ease, padding 180ms ease, border-width 180ms ease; }
.cycle-seat:hover .cycle-card-copy em,
.cycle-seat:focus-visible .cycle-card-copy em { max-height: 150px; padding: 10px; border-width: 1px; opacity: 1; }
.cycle-metrics { display: grid; justify-items: end; gap: 4px; }
.cycle-metrics strong { color: var(--cyan); font-family: var(--mono); font-size: 11px; }
.cycle-seat.is-carried { border-style: dashed; }
.cycle-seat.is-cycle-winner { border-color: rgba(255, 214, 160, .88); background: linear-gradient(135deg, rgba(255, 214, 160, .16), rgba(4, 14, 25, .96) 55%); box-shadow: 0 0 34px rgba(255, 214, 160, .22), 7px 7px 0 rgba(255, 214, 160, .07); }
.cycle-seat.is-cycle-winner .cycle-avatar,
.cycle-seat.is-cycle-winner .cycle-metrics strong { color: var(--warning); text-shadow: 0 0 12px rgba(255, 214, 160, .54); }
.cycle-seat.is-speaking { z-index: 9; border-color: var(--warning); box-shadow: 0 0 42px rgba(255, 214, 160, .32), 7px 7px 0 rgba(255, 214, 160, .09); }
.cycle-result { display: grid; grid-template-columns: 120px 170px minmax(0, 1fr); gap: 18px; align-items: start; padding: 18px 28px 24px; border-top: 1px solid var(--line); }
.cycle-result strong { color: var(--warning); font-family: var(--display); font-size: 21px; font-weight: 400; }
.cycle-result p { margin: 0; color: var(--mist); line-height: 1.55; }
.cycle-result small { grid-column: 3; color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.cycle-playback-controls { min-height: 82px; display: grid; grid-template-columns: 190px minmax(0, 1fr) 190px; gap: 16px; align-items: center; padding: 14px 28px; border-top: 1px solid var(--line); background: rgba(2, 9, 17, .72); }
.cycle-playback-controls button { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; border: 1px solid var(--line-bright); background: rgba(7, 21, 34, .82); color: var(--ice); font-family: var(--mono); font-size: 8px; letter-spacing: .11em; text-transform: uppercase; cursor: pointer; }
.cycle-playback-controls button:hover { border-color: var(--warning); color: var(--warning); }
.cycle-playback-controls p { margin: 0; color: var(--muted); font-size: 12px; }
.cycle-playback-controls .next-cycle-button { grid-column: 3; border-color: rgba(255, 214, 160, .54); color: var(--warning); }

.transcript-dialog { width: min(880px, calc(100vw - 32px)); max-height: min(820px, calc(100svh - 32px)); display: grid; grid-template-rows: auto minmax(0, 1fr); border: 1px solid var(--line-bright); background: rgba(3, 11, 20, .98); box-shadow: 0 30px 100px rgba(0, 0, 0, .72); }
.transcript-dialog > header { min-height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.transcript-dialog h2 { margin: 4px 0 0; font-family: var(--display); font-size: clamp(25px, 4vw, 42px); font-weight: 400; }
.transcript-scroll { overflow-y: auto; scrollbar-color: var(--cyan) var(--deep); }
.transcript-scroll .chat-round { border-top: 0; }

.round-table {
  position: sticky;
  top: 24px;
  min-width: 0;
  border: 1px solid var(--line-bright);
  background:
    linear-gradient(90deg, transparent 49.8%, rgba(229, 247, 255, .08) 50%, transparent 50.2%),
    linear-gradient(rgba(229, 247, 255, .08) 1px, transparent 1px) 0 0 / 100% 52px,
    rgba(5, 15, 26, .9);
  box-shadow: 14px 14px 0 rgba(100, 169, 205, .05), inset 0 0 58px rgba(137, 205, 237, .035);
  overflow: hidden;
}

.table-room {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  perspective: 900px;
  transform-style: preserve-3d;
}

.table-room::before,
.table-room::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 84%;
  height: 84%;
  transform: translate(-50%, -50%) rotate(45deg);
  border: 1px solid rgba(220, 244, 255, .12);
}

.table-room::after { width: 58%; height: 58%; transform: translate(-50%, -50%) rotate(45deg); }

.table-shadow {
  position: absolute;
  left: 50%;
  top: 58%;
  width: 66%;
  height: 32%;
  transform: translate(-50%, -50%) rotateX(68deg);
  border-radius: 50%;
  background: rgba(0, 2, 7, .75);
  box-shadow: 0 22px 48px rgba(0, 0, 0, .65), 0 0 44px rgba(136, 217, 255, .09);
  filter: blur(3px);
}

.table-surface {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54%;
  aspect-ratio: 1;
  transform: translate3d(-50%, -50%, 42px) rotateX(58deg) rotateZ(45deg);
  border: 1px solid rgba(232, 248, 255, .72);
  border-radius: 50%;
  background:
    radial-gradient(circle at 40% 34%, rgba(255, 225, 181, .22), transparent 18%),
    conic-gradient(from 45deg, rgba(226, 247, 255, .16), rgba(10, 31, 48, .84), rgba(226, 247, 255, .09), rgba(5, 18, 30, .92), rgba(226, 247, 255, .16));
  box-shadow: inset 0 0 30px rgba(220, 245, 255, .15), 0 18px 0 rgba(5, 14, 24, .78), 0 21px 1px rgba(207, 239, 252, .22), 0 32px 42px rgba(0, 1, 5, .6);
  transform-style: preserve-3d;
}

.table-surface > i { position: absolute; inset: 16%; border: 1px solid rgba(231, 247, 255, .2); border-radius: 50%; }
.table-surface > i:nth-child(2) { inset: 32%; }
.table-surface > i:nth-child(3) { inset: 47%; background: var(--ivory); box-shadow: 0 0 22px var(--warning), 0 0 48px rgba(255, 214, 160, .5); }

.table-lamp {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  transform: translate3d(-50%, -50%, 54px) rotateZ(-45deg) rotateX(-58deg);
  color: var(--ivory);
}

.table-lamp span { font-family: var(--display); font-size: 30px; line-height: .8; }
.table-lamp small { margin-top: 4px; color: var(--warning); font-family: var(--mono); font-size: 6px; letter-spacing: .08em; text-transform: uppercase; }

.table-seat {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 1px;
  transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-42%) translateY(-126px) rotate(var(--inverse-angle));
}

.table-seat > i {
  width: 76px;
  min-height: 48px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  transform: translate(-50%, -50%);
  border: 1px solid var(--line);
  background: rgba(5, 15, 26, .92);
  box-shadow: 5px 5px 0 rgba(111, 181, 216, .04);
  font-style: normal;
}

.table-seat b { width: 32px; height: 46px; display: grid; place-items: center; border-right: 1px solid var(--line); color: var(--mist); font-family: var(--display); font-size: 19px; font-weight: 400; }
.table-seat span { overflow: hidden; color: var(--mist); font-family: var(--mono); font-size: 6px; text-overflow: ellipsis; white-space: nowrap; }
.table-seat.is-leading > i { border-color: var(--line-bright); box-shadow: 0 0 20px rgba(136, 217, 255, .12), 5px 5px 0 rgba(111, 181, 216, .06); }
.table-seat.is-leading b { color: var(--ice); text-shadow: 0 0 12px var(--cyan); }

.table-caption { position: relative; z-index: 3; padding: 16px 18px 19px; border-top: 1px solid var(--line); background: rgba(6, 16, 28, .9); }
.table-caption span { color: var(--warning); font-family: var(--mono); font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }
.table-caption p { margin: 8px 0 0; color: var(--mist); font-size: 12px; line-height: 1.5; }

.debate-room .dialogue-disclosure { max-width: none; margin: 0; }
.dialogue-disclosure { max-width: 1500px; margin: 0 auto; border: 1px solid var(--line-bright); }
.dialogue-disclosure > summary { min-height: 68px; display: grid; grid-template-columns: 1fr auto 36px; align-items: center; gap: 20px; padding: 0 22px; cursor: pointer; list-style: none; }
.dialogue-disclosure > summary::-webkit-details-marker { display: none; }
.dialogue-disclosure > summary span { font-family: var(--display); font-size: 22px; }
.dialogue-disclosure > summary strong { color: var(--muted); font-family: var(--mono); font-size: 8px; font-weight: 400; letter-spacing: .1em; text-transform: uppercase; }
.dialogue-disclosure > summary i { color: var(--cyan); font-family: var(--display); font-size: 24px; font-style: normal; text-align: center; transition: transform 180ms ease; }
.dialogue-disclosure[open] > summary i { transform: rotate(45deg); }
.dialogue { max-height: min(1100px, 82svh); overflow-y: auto; border-top: 1px solid var(--line); scrollbar-color: var(--cyan) var(--deep); }
.chat-round { border-bottom: 1px solid var(--line-bright); }
.chat-round > header { min-height: 72px; display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--line); background: rgba(5, 15, 26, .92); }
.chat-round > header > span { color: var(--cyan); font-family: var(--display); font-size: 28px; line-height: 1; }
.chat-round > header h3 { margin: 0; color: var(--ivory); font-family: var(--display); font-size: 24px; font-weight: 400; line-height: 1; }
.chat-round > header p { margin: 4px 0 0; color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.chat-stream { margin: 0; padding: 20px 18px 28px; list-style: none; background: linear-gradient(90deg, rgba(8, 23, 37, .86), rgba(4, 12, 22, .96)); }
.chat-message { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; }
.chat-message:last-child { margin-bottom: 0; }
.chat-message.from-right { flex-direction: row-reverse; }
.chat-avatar { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--line-bright); background: rgba(217, 244, 255, .07); color: var(--ivory); font-family: var(--display); font-size: 21px; box-shadow: 5px 5px 0 rgba(107, 176, 211, .04); }
.chat-bubble { width: min(82%, 720px); padding: 15px 16px 13px; border: 1px solid var(--line); background: rgba(12, 29, 45, .86); box-shadow: 8px 8px 0 rgba(88, 155, 190, .035); }
.from-right .chat-bubble { background: rgba(8, 21, 35, .94); }
.type-objection .chat-bubble { border-top-color: rgba(255, 214, 160, .6); }
.type-revision .chat-bubble { border-top-color: var(--cyan); }
.chat-bubble > header { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 9px; padding-bottom: 9px; border-bottom: 1px solid rgba(190, 229, 249, .14); }
.chat-bubble > header strong { color: var(--ivory); font-family: var(--display); font-size: 19px; font-weight: 400; }
.chat-bubble > header span { color: var(--cyan); font-family: var(--mono); font-size: 7px; }
.chat-bubble > header i { color: var(--muted); font-family: var(--mono); font-size: 6px; font-style: normal; }
.chat-bubble > p { margin: 12px 0; color: var(--mist); font-size: 15px; line-height: 1.62; }
.chat-bubble > footer { padding-top: 9px; border-top: 1px solid rgba(190, 229, 249, .14); color: var(--muted); font-family: var(--mono); font-size: 7px; letter-spacing: .07em; text-transform: uppercase; }
.chat-bubble > footer b { margin-left: 5px; color: var(--ice); font-weight: 400; }
.dialogue-round { display: grid; grid-template-columns: 190px minmax(0, 1fr); border-bottom: 1px solid var(--line); }
.dialogue-round > header { padding: 24px; border-right: 1px solid var(--line); }
.dialogue-round > header span { color: var(--cyan); font-family: var(--mono); font-size: 9px; }
.dialogue-round > header h3 { margin: 10px 0; font-family: var(--display); font-size: 26px; font-weight: 400; line-height: 1; }
.dialogue-round > header p { margin: 0; color: var(--muted); font-size: 10px; }
.dialogue-round ol { margin: 0; padding: 0; list-style: none; }
.dialogue-line { display: grid; grid-template-columns: 190px minmax(0, 1fr) 126px; gap: 20px; padding: 20px 24px; border-bottom: 1px solid rgba(190, 229, 249, .12); }
.dialogue-line:last-child { border-bottom: 0; }
.speaker { display: flex; flex-direction: column; gap: 3px; }
.speaker strong { font-family: var(--display); font-size: 19px; font-weight: 400; }
.speaker span { color: var(--cyan); font-family: var(--mono); font-size: 8px; }
.dialogue-line > p { max-width: 840px; margin: 0; color: var(--mist); font-size: 15px; line-height: 1.65; }
.dialogue-line > small { color: var(--muted); font-family: var(--mono); font-size: 7px; text-align: right; text-transform: uppercase; }
.dialogue-line.type-revision { background: rgba(150, 210, 239, .035); }

.convergence-grid { max-width: 1500px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); gap: 64px; margin: 0 auto; }
.convergence-grid > p { margin: 0; color: var(--ivory); font-family: var(--display); font-size: clamp(28px, 3.5vw, 52px); line-height: 1.05; }
.convergence-grid details { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.convergence-grid summary { min-height: 52px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; color: var(--mist); font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.convergence-grid summary span { color: var(--cyan); }
.convergence-grid ul { max-height: 520px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.convergence-grid li { min-height: 48px; display: flex; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid rgba(190, 229, 249, .14); }
.convergence-grid li strong { color: var(--cyan); font-family: var(--mono); font-size: 7px; text-transform: uppercase; }
.synthesis-trace { margin-top: 14px; }
.synthesis-trace > div { display: grid; }
.synthesis-trace article { padding: 14px 0; border-top: 1px solid rgba(190, 229, 249, .14); }
.synthesis-trace article > span { color: var(--cyan); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.synthesis-trace article p { margin: 8px 0; color: var(--mist); font-size: 13px; line-height: 1.5; }
.synthesis-trace article small { color: var(--muted); font-size: 11px; line-height: 1.45; }

.stress-test-panel { max-width: 1500px; margin: 0 auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stress-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.stress-grid article { min-height: 230px; padding: 28px; border-right: 1px solid var(--line); }
.stress-grid article:last-child { border-right: 0; }
.stress-grid span, .stress-grid small, .audit-strip span { color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .09em; text-transform: uppercase; }
.stress-grid h3 { margin: 28px 0 14px; color: var(--ivory); font-family: var(--display); font-size: 23px; font-weight: 400; line-height: 1.05; }
.stress-grid p { margin: 0 0 24px; color: var(--mist); font-size: 13px; line-height: 1.55; }
.stress-grid small { color: var(--muted); }
.audit-strip { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); background: rgba(3, 10, 18, .54); }
.audit-strip > div { min-height: 130px; display: grid; grid-template-columns: 160px 90px minmax(0, 1fr); gap: 18px; align-items: center; padding: 24px 28px; }
.audit-strip > div + div { border-left: 1px solid var(--line); }
.audit-strip strong { color: var(--ivory); font-family: var(--display); font-size: 28px; font-weight: 400; }
.audit-strip p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }

.limits-grid { max-width: 1500px; display: grid; grid-template-columns: 1fr 1fr; margin: 0 auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.limits-grid article { min-height: 180px; padding: 26px 0; }
.limits-grid article + article { padding-left: 32px; border-left: 1px solid var(--line); }
.limits-grid span { color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.limits-grid p { max-width: 680px; margin: 18px 0 0; color: var(--mist); font-size: 17px; line-height: 1.55; }

.formula-line { max-width: 1500px; margin: 0 auto 18px; color: var(--muted); font-family: var(--mono); font-size: 9px; }
.source-audit { max-width: 1500px; display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 24px; margin: 0 auto 18px; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.source-audit > span { color: var(--cyan); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.source-audit p { margin: 0; color: var(--muted); font-size: 13px; }
.source-audit p b { color: var(--ice); font-weight: 500; }
.source-audit.is-partial > span { color: var(--warning); }
.knowledge-row { display: grid; grid-template-columns: 200px minmax(0, 1fr) 140px; gap: 24px; padding: 22px 0; border-top: 1px solid var(--line); }
.knowledge-origin { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; color: var(--muted); font-family: var(--mono); font-size: 8px; text-transform: uppercase; }
.knowledge-origin b { padding: 3px 6px; border: 1px solid var(--cyan); color: var(--cyan); font-weight: 500; }
.knowledge-copy h3 { max-width: 860px; margin: 0; font-family: var(--display); font-size: 19px; font-weight: 400; }
.knowledge-copy p { max-width: 860px; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.knowledge-sources { margin-top: 10px; }
.knowledge-score { text-align: right; font-variant-numeric: tabular-nums; }
.knowledge-score strong { display: block; font-family: var(--display); font-size: 30px; font-weight: 400; }
.knowledge-score span { display: block; color: var(--muted); font-family: var(--mono); font-size: 7px; text-transform: uppercase; }
.knowledge-score > i { display: block; height: 3px; margin-top: 10px; background: var(--line); }
.knowledge-score > i b { display: block; height: 100%; background: var(--ice); box-shadow: 0 0 8px var(--cyan); }
.knowledge-row.is-value .knowledge-score > i { background: repeating-linear-gradient(90deg, var(--mist) 0 1px, transparent 1px 5px); }

.result-actions { min-height: 150px; display: flex; justify-content: flex-end; align-items: center; gap: 28px; padding: 30px clamp(20px, 5vw, 78px); background: var(--void); }
.artifact-id { margin: 0 auto 0 0; color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.artifact-id span { display: block; margin-bottom: 8px; }
.artifact-id code { color: var(--ice); font: inherit; letter-spacing: .14em; }
.download-action { min-height: 44px; display: inline-flex; align-items: center; border-bottom: 1px solid var(--line-bright); color: var(--mist); font-family: var(--mono); font-size: 9px; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }
.download-action:hover { color: var(--ice); border-color: var(--cyan); }
.result-actions .run-button { min-width: 220px; }

.method-dialog { position: relative; width: min(680px, 100%); max-height: calc(100svh - 48px); overflow-y: auto; padding: 48px; border: 1px solid var(--line-bright); background: rgba(7, 17, 29, .97); box-shadow: 24px 24px 0 rgba(124, 191, 226, .06); }
.dialog-close { position: absolute; top: 18px; right: 18px; }
.method-dialog h2 { margin: 0 56px 28px 0; color: var(--ivory); font-size: 52px; line-height: .95; }
.method-dialog ol { margin: 0; padding: 0; border-bottom: 1px solid var(--line); list-style: none; }
.method-dialog li { display: grid; grid-template-columns: 42px 1fr; gap: 14px; padding: 16px 0; border-top: 1px solid var(--line); }
.method-dialog li > span { color: var(--cyan); font-family: var(--mono); font-size: 9px; }
.method-dialog li strong { font-family: var(--display); font-size: 19px; font-weight: 400; }
.method-dialog li p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.dialog-note { margin: 22px 0 0; color: var(--mist); font-size: 11px; }

.history-dialog { width: min(920px, 100%); max-height: calc(100svh - 48px); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; border: 1px solid var(--line-bright); background: rgba(7, 17, 29, .98); box-shadow: 24px 24px 0 rgba(124, 191, 226, .06); }
.history-dialog > header { min-height: 112px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 30px; border-bottom: 1px solid var(--line); }
.history-dialog h2 { margin: 0; color: var(--ivory); font-size: clamp(38px, 5vw, 58px); line-height: .95; }
.history-list { margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.history-list li { border-bottom: 1px solid var(--line); }
.history-list button { width: 100%; min-height: 112px; display: grid; grid-template-columns: 110px minmax(180px, .8fr) minmax(260px, 1.3fr) 160px; gap: 20px; align-items: center; padding: 20px 30px; border: 0; background: transparent; color: var(--ice); text-align: left; }
.history-list button:hover { background: rgba(136, 217, 255, .055); }
.history-list .is-incompatible button { cursor: not-allowed; opacity: .48; }
.history-list .is-incompatible button:hover { background: transparent; }
.history-list span, .history-list small, .history-dialog > footer { color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: .07em; text-transform: uppercase; }
.history-list strong { font-family: var(--display); font-size: 20px; font-weight: 400; line-height: 1.1; }
.history-list p { margin: 0; color: var(--mist); font-size: 11px; line-height: 1.45; }
.history-dialog > footer { padding: 20px 30px; border-top: 1px solid var(--line); }
.history-empty { min-height: 260px; display: grid; place-items: center; margin: 0; padding: 40px; color: var(--muted); text-align: center; }

.question-console,
.answer-oracle {
  box-shadow:
    16px 16px 0 rgba(93, 161, 199, .085),
    32px 32px 0 rgba(107, 171, 205, .04),
    inset 0 0 70px rgba(157, 219, 247, .045),
    0 34px 80px rgba(0, 3, 8, .34);
}

.catalogue {
  box-shadow:
    24px 24px 0 rgba(124, 191, 226, .065),
    48px 48px 0 rgba(104, 166, 199, .025),
    inset 0 0 90px rgba(136, 217, 255, .035),
    0 42px 100px rgba(0, 2, 8, .5);
}

.result-hero .assembled-sign,
.result-hero .far-gate,
.result-hero .depth-frame,
.result-hero .sign-reflection { left: 79%; }

.result-hero .answer-oracle { width: min(860px, calc(100% - 40px)); }

@keyframes particle-drift {
  0%, 100% { transform: translate3d(0, 0, 0); opacity: .12; }
  50% { transform: translate3d(6px, -14px, 0); opacity: .62; }
}

@keyframes crown-turn { to { rotate: 1turn; } }

@keyframes beacon-scan {
  0% { transform: rotateY(180deg) rotateZ(-2deg) scaleX(.86); opacity: .3; }
  48% { opacity: .76; }
  100% { transform: rotateY(0deg) rotateZ(-2deg) scaleX(1.04); opacity: .46; }
}

@keyframes signal-travel {
  0% { left: 2%; opacity: 0; }
  16%, 82% { opacity: 1; }
  100% { left: 88%; opacity: 0; }
}

@keyframes presence-breathe {
  0%, 100% { opacity: .48; filter: drop-shadow(0 0 10px rgba(136, 217, 255, .34)); }
  50% { opacity: .72; filter: drop-shadow(0 0 18px rgba(198, 239, 255, .62)); }
}

@keyframes sign-breathe {
  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: .86; }
  50% { transform: translate(-50%, -50%) scale(1.018); opacity: 1; }
}

@media (max-width: 980px) {
  .topbar { grid-template-columns: 1fr auto; }
  .route-line { display: none; }
  .assembled-sign, .far-gate { left: 72%; top: 35%; }
  .question-console { left: 28px; bottom: 54px; }
  .person-grid { grid-template-columns: 1fr 1fr; }
  .person-option:nth-child(3n) { border-right: 1px solid var(--line); }
  .person-option:nth-child(2n) { border-right: 0; }
  .catalogue { height: calc(100svh - 32px); }
  .catalogue-backdrop, .examples-backdrop, .dialog-backdrop { padding: 16px; }
  .process-steps { grid-template-columns: 1fr 1fr; }
  .process-steps li { border-bottom: 1px solid var(--line); }
  .position-row { grid-template-columns: 42px 170px minmax(0, 1fr) 78px; }
  .dialogue-line { grid-template-columns: 150px minmax(0, 1fr); }
  .dialogue-line > small { grid-column: 2; text-align: left; }
  .map-paths { grid-template-columns: 1fr 1fr; }
  .debate-room { grid-template-columns: 280px minmax(0, 1fr); gap: 20px; }
  .table-seat { transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-42%) translateY(-106px) rotate(var(--inverse-angle)); }
  .table-seat > i { width: 66px; }
  .frame-far { width: 70vw; }
  .frame-mid { width: 56vw; }
  .pylon-left { left: 45%; }
  .pylon-right { right: 0; }
  .far-beacon { left: 9%; top: 38%; width: 94px; height: 280px; }
  .hero-round-table { left: 71%; top: 35%; width: 400px; }
  .hero-table-seat { transform: rotate(var(--seat-angle)) translateY(-168px) rotate(var(--seat-inverse)); }
  .hero-table-seat > i { width: 84px; }
  .seat-presence { width: 46px; height: 66px; }
  .journey-scenes { width: min(500px, calc(100% - 250px)); }
  .table-variant-a .question-console { width: min(480px, calc(100% - 40px)); }
  .table-variant-b .hero-round-table { left: 50%; width: 440px; }
  .table-variant-c .hero-round-table { left: 28.5%; width: 370px; }
  .table-variant-c .hero-table-seat { transform: rotate(var(--seat-angle)) translateY(-145px) rotate(var(--seat-inverse)); }
  .table-variant-c .question-console { right: 28px; width: min(420px, 48vw); }
  .table-variant-c .question-actions { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .table-variant-c .question-starters > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-variant-c .examples-action, .table-variant-c .random-question-action { width: 100%; }
  .table-variant-c .run-button { width: 100%; min-width: 0; }
  .table-variant-c .result-hero .answer-oracle { right: 28px; width: min(420px, 48vw); }
  .table-variant-c .process-copy { width: min(420px, 46vw); }
}

@media (max-width: 640px) {
  .topbar { height: 64px; padding: 0 16px; }
  .wordmark { font-size: 11px; }
  .topbar-actions { gap: 9px; }
  .language-switch { gap: 1px; }
  .language-switch button { min-width: 27px; }
  .plain-action { font-size: 7px; }
  .question-scene, .process-scene { min-height: max(760px, calc(100svh - 64px)); }
  .world-stage .sky-wash { bottom: 46%; }
  .assembled-sign, .far-gate { left: 50%; top: 27%; }
  .assembled-sign { width: 250px; }
  .far-gate { width: 92px; height: 110px; }
  .horizon { top: 45%; }
  .mirror-plane { height: 70%; bottom: -24%; }
  .world-stage { perspective-origin: 50% 27%; }
  .stage-camera { transform: none; transform-origin: 50% 27%; }
  .depth-frame { left: 50%; top: 27%; }
  .frame-far { width: 420px; }
  .frame-mid { width: 320px; }
  .depth-pylon { display: none; }
  .far-beacon { left: 8%; top: 27%; width: 58px; height: 166px; opacity: .54; }
  .beacon-beam i, .beacon-beam b { width: 240px; }
  .sign-reflection { left: 50%; top: 46%; width: 210px; }
  .orbit-nodes i { transform: rotate(var(--angle)) translateY(-43%) translateY(-103px) translateZ(80px); }
  .scene-coordinate { display: none; }
  .question-console { left: 14px; right: 14px; bottom: 18px; width: auto; padding: 22px 18px; transform: none; box-shadow: 10px 10px 0 rgba(78, 139, 177, .08), 0 26px 60px rgba(0, 3, 8, .34); }
  .question-console:focus-within { transform: none; }
  .question-console h1 { margin-bottom: 18px; font-size: 42px; }
  #question { min-height: 106px; font-size: 25px; }
  .selection-line { margin-top: 12px; }
  .participant-button { grid-template-columns: 62px minmax(0, 1fr) 20px; min-height: 56px; gap: 8px; }
  .selection-count { min-width: 58px; }
  .question-actions { align-items: end; gap: 12px; margin-top: 13px; }
  .question-starters { flex: 1; gap: 2px; }
  .question-starters > span { font-size: 6px; }
  .question-starters > div { gap: 8px; }
  .examples-action, .random-question-action { flex: 1; min-width: 0; text-align: left; font-size: 7px; line-height: 1.25; }
  .random-question-action i { display: none; }
  .run-button { min-width: 168px; min-height: 50px; gap: 12px; }
  .local-note { display: none; }

  .catalogue-backdrop, .examples-backdrop, .dialog-backdrop { padding: 0; }
  .catalogue { width: 100%; height: 100svh; border: 0; }
  .catalogue-head, .examples-drawer > header { min-height: 92px; padding: 18px; }
  .catalogue-head h2, .examples-drawer h2 { font-size: 38px; }
  .catalogue-tools { grid-template-columns: 1fr; }
  .search-field { min-height: 58px; padding: 0 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .catalogue-actions { min-height: 52px; justify-content: space-between; padding: 0 18px; }
  .era-tabs button { padding: 0 16px; }
  .era-group > header { padding: 0 18px; }
  .person-grid { grid-template-columns: 1fr; }
  .person-option, .person-option:nth-child(2n), .person-option:nth-child(3n) { min-height: 82px; padding: 14px 18px; border-right: 0; }
  .person-copy b { font-size: 19px; }
  .catalogue-foot { min-height: 76px; padding: 10px 14px 10px 18px; }
  .catalogue-foot p { max-width: 52%; font-size: 9px; }
  .confirm-selection { min-width: 130px; }
  .examples-drawer { width: 100%; max-height: 100svh; min-height: 100svh; border: 0; }
  .example-grid { grid-template-columns: 1fr; }
  .example-grid button, .example-grid button:nth-child(2n) { min-height: 94px; border-right: 0; }

  .process-copy { left: 14px; right: 14px; top: 46%; width: auto; padding: 18px; }
  .process-copy h1 { font-size: 38px; }
  .process-steps { left: 14px; right: 14px; bottom: 14px; grid-template-columns: 1fr 1fr; }
  .process-steps li { min-height: 66px; padding: 10px; }
  .process-steps strong { font-size: 15px; }

  .result-hero { min-height: 880px; }
  .answer-oracle { left: 14px; right: 14px; bottom: 18px; width: auto; padding: 24px 18px; transform: none; box-shadow: 10px 10px 0 rgba(116, 183, 219, .07), 0 26px 60px rgba(0, 3, 8, .34); }
  .result-hero .assembled-sign,
  .result-hero .far-gate,
  .result-hero .depth-frame,
  .result-hero .sign-reflection { left: 50%; }
  .result-hero .answer-oracle { width: auto; }
  .answer-oracle h1 { font-size: 34px; }
  .answer-oracle > p:nth-of-type(2) { font-size: 16px; }
  .answer-meta { flex-direction: column; gap: 8px; }
  .caveat-line { grid-template-columns: 1fr; gap: 7px; padding: 16px 18px; }
  .content-section { padding: 64px 18px; }
  .content-heading { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; margin-bottom: 34px; }
  .content-heading > span { font-size: 40px; }
  .content-heading h2 { font-size: 40px; }
  .context-brief { grid-template-columns: 1fr; gap: 12px; padding: 24px 18px; }
  .context-brief small { grid-column: 1; }
  .context-grid { grid-template-columns: 1fr; }
  .context-grid article { min-height: 0; padding: 22px 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .context-grid article:last-child { border-bottom: 0; }
  .position-row { grid-template-columns: 34px minmax(0, 1fr) 64px; gap: 10px; }
  .list-disclosure { align-items: stretch; flex-direction: column; }
  .list-disclosure button { width: 100%; }
  .person-id { grid-column: 2; }
  .position-argument { grid-column: 2 / -1; }
  .position-thesis { font-size: 15px; }
  .weight-cell { grid-column: 3; grid-row: 1; }
  .map-paths { grid-template-columns: 1fr; }
  .map-path { grid-template-rows: auto 42px auto 44px; }
  .agent-node > p { min-height: 0; }
  .map-convergence { height: 52px; }
  .map-decision { width: 100%; transform: none; }
  .map-decision > div { flex-direction: column; gap: 6px; }
  .dialogue-disclosure > summary { grid-template-columns: 1fr 28px; }
  .dialogue-disclosure > summary strong { grid-column: 1; grid-row: 2; padding-bottom: 12px; }
  .dialogue-disclosure > summary i { grid-column: 2; grid-row: 1 / 3; }
  .debate-room { grid-template-columns: 1fr; gap: 18px; }
  .cycle-head { grid-template-columns: 1fr; gap: 10px; padding: 20px 16px 10px; }
  .cycle-head h3 { font-size: 30px; }
  .cycle-handoff { margin: 8px 12px 0; font-size: 15px; }
  .cycle-table-room { width: 100%; height: 430px; }
  .cycle-table-room::before { width: 96%; }
  .cycle-table-surface { width: 228px; height: 228px; }
  .cycle-center { width: 108px; height: 66px; }
  .cycle-center.has-live-line { width: min(250px, 66%); height: 156px; padding: 12px 14px; }
  .cycle-center.has-live-line strong { font-size: 18px; }
  .cycle-center.has-live-line p { font-size: 10px; -webkit-line-clamp: 6; }
  .cycle-center span { font-size: 22px; }
  .cycle-center b { font-size: 6px; }
  .cycle-seat { width: 100px; min-height: 66px; grid-template-columns: 24px minmax(0, 1fr); gap: 5px; padding: 6px; transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-160px) rotate(var(--inverse-angle)); }
  .cycle-avatar { width: 24px; height: 42px; font-size: 17px; }
  .cycle-card-copy b { font-size: 12px; }
  .cycle-card-copy small { font-size: 5px; }
  .cycle-card-copy em { display: none; }
  .cycle-metrics { grid-column: 1 / -1; display: flex; justify-content: space-between; width: 100%; }
  .cycle-metrics strong { font-size: 8px; }
  .cycle-result { grid-template-columns: 92px minmax(0, 1fr); gap: 10px; padding: 16px; }
  .cycle-result p,
  .cycle-result small { grid-column: 1 / -1; }
  .cycle-playback-controls { grid-template-columns: 1fr 1fr; gap: 9px; padding: 12px 16px; }
  .cycle-playback-controls p { grid-column: 1 / -1; grid-row: 2; }
  .cycle-playback-controls .next-cycle-button { grid-column: 2; }
  .transcript-dialog { width: 100%; max-height: 100svh; height: 100svh; border: 0; }
  .transcript-dialog > header { min-height: 88px; padding: 14px 16px; }
  .transcript-dialog h2 { font-size: 30px; }
  .round-table { position: relative; top: auto; }
  .table-room { max-width: 330px; margin: 0 auto; }
  .chat-stream { padding: 16px 12px 22px; }
  .chat-bubble { width: calc(100% - 54px); }
  .chat-bubble > p { font-size: 14px; }
  .dialogue-round { grid-template-columns: 1fr; }
  .dialogue-round > header { padding: 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .dialogue-line { grid-template-columns: 1fr; padding: 18px; }
  .dialogue-line > small { grid-column: 1; }
  .convergence-grid { grid-template-columns: 1fr; gap: 36px; }
  .limits-grid { grid-template-columns: 1fr; }
  .limits-grid article + article { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
  .stress-grid, .audit-strip { grid-template-columns: 1fr; }
  .stress-grid article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .stress-grid article:last-child { border-bottom: 0; }
  .audit-strip > div { min-height: 0; grid-template-columns: 1fr auto; padding: 20px 18px; }
  .audit-strip > div + div { border-top: 1px solid var(--line); border-left: 0; }
  .audit-strip p { grid-column: 1 / -1; }
  .knowledge-row { grid-template-columns: 1fr 72px; gap: 12px; }
  .knowledge-origin { grid-column: 1; }
  .knowledge-copy { grid-column: 1 / -1; }
  .knowledge-score { grid-column: 2; grid-row: 1; }
  .result-actions { flex-direction: column-reverse; align-items: stretch; padding: 32px 18px; }
  .result-actions .run-button { width: 100%; }
  .artifact-id { margin: 0; text-align: center; }
  .download-action { justify-content: center; }
  .method-dialog { width: 100%; max-height: 100svh; min-height: 100svh; padding: 34px 18px; border: 0; }
  .method-dialog h2 { font-size: 42px; }
  .history-dialog { width: 100%; height: 100svh; max-height: 100svh; border: 0; }
  .history-dialog > header { min-height: 90px; padding: 18px; }
  .history-list button { min-height: 140px; grid-template-columns: 1fr auto; gap: 8px 16px; padding: 18px; }
  .history-list p { grid-column: 1 / -1; }
  .catalogue { transform: none; }
  .hero-round-table,
  .table-variant-b .hero-round-table,
  .table-variant-c .hero-round-table { left: 50%; top: 31%; width: 300px; transform: translate3d(-50%, -50%, 50px); }
  .hero-table-seat { transform: rotate(var(--seat-angle)) translateY(-116px) rotate(var(--seat-inverse)); }
  .hero-table-seat > .seat-card { width: 72px; min-height: 50px; grid-template-columns: 26px minmax(0, 1fr); padding: 5px; }
  .seat-presence { width: 38px; height: 56px; }
  .hero-table-seat b { width: 26px; height: 38px; font-size: 18px; }
  .hero-table-seat span { font-size: 12px; }
  .hero-table-seat small { display: none; }
  .hero-table-core { min-height: 56px; }
  .hero-table-core span { font-size: 27px; }
  .hero-table-core small { font-size: 5px; }
  .hero-utterance { top: -7%; width: 72%; padding: 9px 10px; }
  .hero-utterance p { font-size: 8px; -webkit-line-clamp: 2; }
  .table-crown { inset: 14%; }
  .table-pedestal { width: 17%; height: 27%; }
  .field-particles i:nth-child(n+9) { display: none; }
  .hidden-seats { bottom: -2%; }
  .journey-scenes,
  .table-variant-b .journey-scenes,
  .table-variant-c .journey-scenes { top: 8px; left: 14px; right: 14px; width: auto; grid-template-columns: repeat(4, 1fr); transform: none; }
  .journey-scenes li { min-height: 44px; grid-template-columns: 1fr; padding: 8px 4px 0 0; }
  .journey-scenes span { grid-row: auto; }
  .journey-scenes small { display: none; }
  .table-variant-b .question-console,
  .table-variant-c .question-console { left: 14px; right: 14px; bottom: 18px; width: auto; transform: none; }
  .table-variant-c .result-hero .answer-oracle { left: 14px; right: 14px; top: auto; bottom: 18px; width: auto; max-height: none; }
  .table-variant-b .question-console:focus-within { transform: none; }
  .prototype-switcher { bottom: 8px; grid-template-columns: 44px minmax(150px, auto) 44px; }
  .prototype-switcher a { min-width: 44px; min-height: 44px; }
}

@media (max-width: 480px) {
  .question-actions { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .question-starters > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .examples-action, .random-question-action { width: 100%; }
  .run-button { width: 100%; min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
