/* Internal affairs: scoped to the lab invitation and its native modal. */
.pipe-card {
  background:#dffb94;
  color:#21362b;
  padding:22px;
}
.pipe-eyebrow,.pipe-micro,.pipe-card-bottom>span,.pipe-scene-top,.pipe-gate-call,.pipe-crosshair,.pipe-telemetry,.pipe-travel,.pipe-console>p,.pipe-result-score {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
}
.pipe-eyebrow {
  display:flex;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
  font-size:9px;
  letter-spacing:.045em;
  margin-bottom:18px;
}
.pipe-eyebrow>span:last-child {
  border:1px solid #63784b66;
  border-radius:20px;
  padding:3px 7px;
  font-size:8px;
}
.pipe-card-layout {
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:space-between;
}
.pipe-card h3 {
  font-size:clamp(26px,2.4vw,34px);
  letter-spacing:-.055em;
  margin:0 0 8px;
}
.pipe-card-lede {
  font-size:12px;
  line-height:1.5;
  max-width:200px;
}
.pipe-card-description {
  font-size:12px;
  line-height:1.7;
  max-width:360px;
  margin:16px 0 19px;
}
.pipe-portal {
  flex:0 0 120px;
  height:140px;
  position:relative;
  overflow:hidden;
  background:#101d1d;
  border-radius:70px 70px 14px 14px;
  box-shadow:inset 0 0 25px #000;
}
.pipe-portal i {
  position:absolute;
  border:1px solid #dffb94a0;
  border-radius:50%;
  width:112px;
  height:112px;
  left:4px;
  top:8px;
  box-shadow:0 0 10px #dffb9420;
}
.pipe-portal i:nth-child(2) {
  inset:22px 18px;
  width:84px;
  height:84px;
}
.pipe-portal i:nth-child(3) {
  inset:34px 30px;
  width:60px;
  height:60px;
}
.pipe-portal i:nth-child(4) {
  inset:43px 39px;
  width:42px;
  height:42px;
}
.pipe-portal i:nth-child(5) {
  inset:50px 46px;
  width:28px;
  height:28px;
}
.pipe-portal b {
  position:absolute;
  bottom:10px;
  width:100%;
  text-align:center;
  color:#dffb94;
  font:9px/1.3 ui-monospace,monospace;
  letter-spacing:.1em;
}
.pipe-portal>span {
  position:absolute;
  width:8px;
  height:15px;
  background:#f1b7cf;
  top:48px;
  left:78px;
  border-radius:3px;
  transform:rotate(30deg);
  box-shadow:0 0 12px #f1b7cf88;
}
.pipe-card-bottom {
  display:flex;
  align-items:center;
  gap:15px;
  flex-wrap:wrap;
}
.pipe-card-bottom>span {
  font-size:8px;
  line-height:1.7;
}
.pipe-enter,.pipe-control {
  font:600 12px/1.2 "DM Sans",Arial,sans-serif;
  border:1px solid #dffb9460;
  border-radius:5px;
  min-height:44px;
  padding:12px 18px;
  cursor:pointer;
  touch-action:manipulation;
}
.pipe-enter {
  background:#dffb94;
  color:#17251c;
}
.pipe-card .pipe-enter {
  background:#21362b;
  color:#dffb94;
  border-color:#21362b;
}
.pipe-enter:hover {
  background:#f1b7cf;
  color:#17251c;
}
.pipe-control {
  background:#152223;
  color:#dce7d6;
}
.pipe-control:hover,.pipe-control[aria-pressed="true"] {
  background:#dffb94;
  color:#17251c;
  border-color:#dffb94;
}
.pipe-card :focus-visible,.pipe-dialog :focus-visible {
  outline:3px solid #f1b7cf;
  outline-offset:3px;
}
.pipe-card :focus-visible {
  outline-color:#21362b;
}
body.pipe-is-open{overflow:hidden;}
dialog.pipe-dialog{inset:0;margin:0;padding:0;width:100%;height:100%;max-width:none;max-height:none;border:0;border-radius:0;background:#06040d;color:#fff2fc;box-shadow:none;overflow:hidden;color-scheme:dark;}
.pipe-game-shell{position:relative;height:100%;min-height:360px;isolation:isolate;overflow:hidden;}
.pipe-viewport,#pipe-canvas,#pipe-fallback,.pipe-vignette{position:absolute;inset:0;width:100%;height:100%;}
#pipe-canvas,#pipe-fallback{display:block;}#pipe-fallback[hidden]{display:none;}
.pipe-vignette{pointer-events:none;background:linear-gradient(180deg,#06040dbb 0%,#06040d00 27% 62%,#06040dc9 100%),linear-gradient(90deg,#06040d55,transparent 50%);}
.pipe-header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px clamp(20px,4vw,64px);z-index:3;}
.pipe-micro{font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em;color:#dacfe3;}
.pipe-header h2{font:500 clamp(23px,2.6vw,34px)/1.1 "Space Grotesk",Arial,sans-serif;letter-spacing:-.055em;margin:3px 0 0;}.pipe-header h2 span{color:#dffb94;}
.pipe-header-controls{display:flex;gap:7px;}
.pipe-dialog .pipe-control{background:#120f20a8;border-color:#f1b7cf4d;backdrop-filter:blur(12px);color:#fff0fc;font-size:11px;}.pipe-dialog .pipe-control:hover,.pipe-dialog .pipe-control[aria-pressed="true"]{background:#f1b7cf;color:#1c1420;}
.pipe-dialog :focus-visible{outline:3px solid #dffb94;outline-offset:4px;}
.pipe-scene-top{position:absolute;top:117px;left:clamp(20px,4vw,64px);right:clamp(20px,4vw,64px);display:flex;justify-content:space-between;gap:14px;font:9px/1.5 ui-monospace,monospace;letter-spacing:.13em;color:#d3fdee;}
.pipe-scene-top i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#62ffd1;box-shadow:0 0 10px #62ffd1;margin-right:8px;vertical-align:middle;}
.pipe-brief{position:absolute;left:clamp(20px,5vw,80px);bottom:clamp(95px,14%,180px);max-width:min(560px,51%);pointer-events:none;filter:drop-shadow(0 2px 14px #06040dc0);}
.pipe-brief h3{font:500 clamp(42px,6vw,88px)/.98 "Space Grotesk",Arial,sans-serif;letter-spacing:-.065em;margin:13px 0 18px;}.pipe-brief em{font-family:Georgia,serif;font-weight:400;color:var(--ride-accent,#f1b7cf);letter-spacing:-.055em;}.pipe-brief p{font-size:14px;line-height:1.7;color:#f5eafa;max-width:330px;margin:0;}.pipe-brief .pipe-micro{color:var(--ride-accent,#f1b7cf);font-size:9px;}
.pipe-readout{position:absolute;right:clamp(20px,5vw,80px);bottom:clamp(96px,14%,180px);display:grid;text-align:right;font:9px/1.7 ui-monospace,monospace;letter-spacing:.1em;color:#e0d0e7;text-shadow:0 2px 20px #06040d;}.pipe-readout strong{font:500 clamp(50px,8vw,112px)/1 "Space Grotesk",Arial,sans-serif;letter-spacing:-.08em;color:var(--ride-accent,#f1b7cf);margin:9px 0;}.pipe-readout b{font-weight:400;}
.pipe-console{position:absolute;left:clamp(20px,4vw,64px);right:clamp(20px,4vw,64px);bottom:22px;z-index:2;}.pipe-timeline{height:2px;background:#f1b7cf33;margin-bottom:15px;}.pipe-timeline span{height:100%;display:block;width:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#ff4edb,#56eaff,#dffb94);box-shadow:0 0 12px #f1b7cf80;}.pipe-footer-line{display:flex;justify-content:space-between;align-items:center;gap:20px;font:9px/1.6 ui-monospace,monospace;letter-spacing:.075em;color:#e1d5e6;}.pipe-footer-line>span:first-child{color:#dffb94;}.pipe-footer-line>span:last-child{white-space:nowrap;}.pipe-footer-line #pipe-instructions{text-align:center;font-size:8px;color:#bfb1cb;}
.pipe-loading,.pipe-result{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px;background:#06040d99;backdrop-filter:blur(5px);}.pipe-loading[hidden],.pipe-result[hidden]{display:none;}.pipe-loading h3,.pipe-result h3{font:500 clamp(40px,6.8vw,88px)/.98 "Space Grotesk",Arial,sans-serif;letter-spacing:-.065em;margin:15px 0 22px;}.pipe-loading h3 em,.pipe-result h3 em{font-family:Georgia,serif;font-weight:400;color:#f1b7cf;}.pipe-loading p,.pipe-result p{font-size:14px;line-height:1.7;max-width:410px;color:#e0d4e7;margin:0 0 25px;}.pipe-result{background:#06040d66;backdrop-filter:blur(2px);}.pipe-result>div{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}.pipe-result>.pipe-micro:last-child{margin-top:24px;font-size:9px;}.pipe-dialog .pipe-enter{background:#f1b7cf;color:#241628;border-color:#f1b7cf;}.pipe-dialog .pipe-enter:hover{background:#dffb94;border-color:#dffb94;}
.pipe-dialog[data-pipe-phase="loading"] .pipe-brief,.pipe-dialog[data-pipe-phase="loading"] .pipe-readout,.pipe-dialog[data-pipe-phase="finished"] .pipe-brief,.pipe-dialog[data-pipe-phase="finished"] .pipe-readout{visibility:hidden;}
.pipe-dialog[data-pipe-paused="true"] .pipe-scene-top>span:first-child{color:#f1b7cf;}
.pipe-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0;margin:-1px;}
.pipe-portal{background:radial-gradient(ellipse at 50% 44%,#24103e,#090917 75%);}.pipe-portal i{border-color:#ff8de0a0;box-shadow:0 0 8px #ff2bd640,inset 0 0 7px #3ce7ff40;}.pipe-portal i:nth-child(even){border-color:#63e9ff;}.pipe-portal b{color:#dcfff4;}
@media(max-width:700px){
  .pipe-header{padding:16px;align-items:flex-start;gap:12px;}.pipe-header .pipe-micro{font-size:8px;letter-spacing:.07em;}.pipe-header h2{font-size:26px;white-space:nowrap;}.pipe-header-controls{gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:136px;}.pipe-header-controls .pipe-control{font-size:10px;padding:8px 10px;min-height:40px;}.pipe-header-controls #pipe-exit{min-width:122px;}
  .pipe-scene-top{top:122px;left:18px;right:18px;font-size:8px;gap:12px;}.pipe-scene-top>span:first-child{max-width:190px;}
  .pipe-brief{left:22px;right:22px;bottom:135px;max-width:none;}.pipe-brief h3{font-size:48px;max-width:330px;margin:10px 0 13px;}.pipe-brief p{font-size:12px;max-width:290px;line-height:1.65;}.pipe-brief .pipe-micro{font-size:8px;max-width:285px;display:block;}
  .pipe-readout{right:22px;bottom:auto;top:185px;font-size:7px;}.pipe-readout strong{font-size:47px;margin:5px 0;}.pipe-readout>span:first-child{font-size:7px;}.pipe-readout>span:last-child{max-width:135px;}
  .pipe-console{left:22px;right:22px;bottom:19px;}.pipe-footer-line{font-size:8px;gap:10px;flex-wrap:wrap;}.pipe-footer-line #pipe-instructions{order:3;flex-basis:100%;text-align:left;font-size:8px;line-height:1.6;max-width:285px;}.pipe-footer-line>span:last-child{margin-left:auto;}
  .pipe-result h3{font-size:49px;}.pipe-result p{font-size:13px;max-width:300px;}.pipe-result>.pipe-micro:first-child{font-size:8px;}.pipe-loading h3{font-size:49px;}
}
@media(max-width:360px){.pipe-header h2{font-size:23px;}.pipe-header-controls{max-width:112px;}.pipe-header-controls .pipe-control{font-size:9px;padding:8px;}.pipe-header-controls #pipe-exit{min-width:106px;}.pipe-brief h3{font-size:42px;}.pipe-result h3{font-size:42px;}.pipe-scene-top>span:first-child{max-width:160px;}}
@media(max-height:650px){.pipe-brief{bottom:85px;}.pipe-brief h3{font-size:clamp(34px,5vw,55px);margin-bottom:10px;}.pipe-brief p{font-size:11px;max-width:285px;}.pipe-readout{top:165px;bottom:auto;}.pipe-readout strong{font-size:45px;}.pipe-console{bottom:12px;}.pipe-footer-line #pipe-instructions{display:none;}.pipe-result h3{font-size:42px;}.pipe-result p{font-size:12px;}.pipe-result>.pipe-micro:last-child{margin-top:15px;}}
@media(prefers-reduced-motion:reduce){.pipe-loading,.pipe-result{backdrop-filter:none;}}
/* Local contrast under the captions; the central optical tunnel stays exposed. */
.pipe-vignette{background:radial-gradient(ellipse at 7% 78%,#06040de0 0%,#06040d88 23%,transparent 53%),linear-gradient(180deg,#06040dbb 0%,#06040d00 27% 62%,#06040dc9 100%),linear-gradient(90deg,#06040d33,transparent 50%);}

/* A single control row keeps the narrow header clear of chapter telemetry. */
@media(max-width:700px){
 .pipe-header{display:block;}
 .pipe-header-controls{max-width:none;margin-top:14px;flex-wrap:nowrap;justify-content:flex-start;}
 .pipe-header-controls #pipe-exit{min-width:0;}
 .pipe-scene-top{top:142px;}
 .pipe-readout{top:200px;}
}

/* A window into the ride: the light itself is the invitation. */
.lab-grid { grid-template-columns:minmax(300px,.85fr) minmax(0,1.5fr); }
.lab-grid .connection-card { padding:28px; grid-row:auto; }
.lab-grid .pipe-card {
  min-height:570px;
  padding:0;
  background:#071013;
  color:#f1f0df;
  isolation:isolate;
  border-color:#90c7b54a;
}
#pipe-preview { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.pipe-card::after {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(90deg,#071013eb 0%,#07101388 42%,#07101300 80%),linear-gradient(0deg,#071013 0%,transparent 32%);
}
.pipe-invitation { padding:40px; position:relative; }
.pipe-card .pipe-invitation h3 { font-size:clamp(52px,5.8vw,82px); line-height:.96; letter-spacing:-.035em; margin:0 0 25px; }
.pipe-invitation h3 span { color:#dffb94; }
.pipe-card .pipe-card-lede { font-size:19px; max-width:none; color:#dffb94; }
.pipe-card .pipe-card-description { font-size:14px; max-width:245px; line-height:1.7; margin:14px 0 28px; color:#d4ded7; }
.pipe-card .pipe-enter { background:#dffb94; color:#17261d; padding:16px 25px; border-radius:30px; font-size:14px; }
.pipe-card .pipe-enter:hover { background:#efffc0; }
.pipe-card :focus-visible { outline:3px solid #fff; outline-offset:5px; }
.pipe-preview-caption { position:absolute; bottom:25px; left:40px; right:30px; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; color:#bdcec9; font-size:12px; }
@media(max-width:1000px) {
  .lab-grid { grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr); }
  .pipe-invitation { padding:30px; }
  .pipe-preview-caption { left:30px; }
}
@media(max-width:760px) {
  .lab-grid { grid-template-columns:1fr; }
  .lab-grid .pipe-card { min-height:540px; grid-row:1; }
  .pipe-card .pipe-invitation h3 { font-size:64px; }
  .pipe-card .pipe-card-description { max-width:230px; }
}
.lab-grid .connection-art { flex:0 0 210px; height:210px; min-height:210px; margin-block:12px; }
.lab-grid .connection-card .handshake { margin-block:12px; padding-block:12px; }
.lab-grid .connection-card .toy-status { min-height:0; margin-block:14px; }

@media(max-width:760px) { .pipe-card::after { background:linear-gradient(90deg,#071013e6,#07101380 70%,#07101333),linear-gradient(0deg,#071013,transparent 30%); } }

/* Chapter lines land, then recede so the journey owns the frame. */
.pipe-brief { transition:opacity 650ms ease,transform 650ms ease; }
.pipe-dialog[data-caption-quiet="true"] .pipe-brief { opacity:0; transform:translateY(10px); }
.pipe-dialog[data-caption-quiet="true"] .pipe-readout { opacity:.6; }
.pipe-readout { transition:opacity 650ms ease; }
@media(prefers-reduced-motion:reduce) { .pipe-brief,.pipe-readout { transition:none; } }
