:root{
  color-scheme:dark;
  --void:#020504;
  --panel:#07100b;
  --panel2:#0b1710;
  --green:#46ee91;
  --green2:#1fbd69;
  --mint:#b3ffd0;
  --amber:#d79955;
  --text:#e9f5ed;
  --muted:#82958a;
  --line:rgba(70,238,145,.22);
  --screen:#06120c;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:var(--void);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{overflow:hidden}
a{color:inherit}
button{font:inherit}
.lab-shell{position:relative;width:100vw;height:100dvh;min-height:660px;overflow:hidden;background:#010302;isolation:isolate}
.lab-shell::after{content:"";position:absolute;inset:0;z-index:20;pointer-events:none;background:radial-gradient(circle at 50% 47%,transparent 0 34%,rgba(0,0,0,.15) 58%,rgba(0,0,0,.64) 100%),linear-gradient(180deg,rgba(0,0,0,.12),transparent 17%,transparent 80%,rgba(0,0,0,.32))}
.lab-art{position:absolute;z-index:0;inset:-1.5%;width:103%;height:103%;object-fit:cover;object-position:center;filter:saturate(.92) contrast(1.04) brightness(.92);animation:roomDrift 36s ease-in-out infinite alternate;transform-origin:center}
.lab-topbar{position:absolute;z-index:50;top:0;left:0;right:0;height:64px;padding:0 clamp(18px,3vw,48px);display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,rgba(1,4,2,.94),rgba(1,4,2,.68),transparent);border-bottom:1px solid rgba(70,238,145,.08);pointer-events:none}
.brand,.station-state{pointer-events:auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-copy{display:flex;flex-direction:column;gap:4px}
.brand-copy b{font:700 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.24em}
.brand-copy small{color:#6f8176;font:600 7px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em}
.creeper-mark{position:relative;display:grid;grid-template-columns:repeat(3,7px);grid-template-rows:repeat(3,7px);gap:2px;width:25px;height:25px;filter:drop-shadow(0 0 8px rgba(70,238,145,.22))}
.creeper-mark i{background:var(--green)}
.creeper-mark i:nth-child(1){grid-column:1;grid-row:1}.creeper-mark i:nth-child(2){grid-column:3;grid-row:1}.creeper-mark i:nth-child(3){grid-column:2;grid-row:2/4}.creeper-mark i:nth-child(4){grid-column:1/4;grid-row:3;clip-path:polygon(0 0,34% 0,34% 35%,66% 35%,66% 0,100% 0,100% 100%,66% 100%,66% 65%,34% 65%,34% 100%,0 100%)}
.station-state{display:flex;align-items:center;gap:10px;color:#71847a;font:700 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}
.station-state b{color:#b7c8bd;font-weight:600}
.online-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px rgba(70,238,145,.8);animation:pulse 2s ease-in-out infinite}

.room-nav{position:absolute;z-index:40;top:17%;width:clamp(150px,14vw,235px);display:flex;flex-direction:column;gap:8px}
.room-nav-left{left:clamp(8px,2vw,34px)}.room-nav-right{right:clamp(8px,2vw,34px)}
.nav-label{padding:0 12px 6px;color:#5f7167;font:700 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em}
.room-nav a{position:relative;display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;gap:2px 7px;padding:10px 10px 10px 8px;text-decoration:none;background:linear-gradient(90deg,rgba(4,13,8,.93),rgba(8,22,13,.77));border:1px solid rgba(70,238,145,.16);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));box-shadow:inset 0 0 18px rgba(70,238,145,.025),0 8px 24px rgba(0,0,0,.22);transition:transform .2s ease,border-color .2s ease,background .2s ease}
.room-nav a::after{content:"";position:absolute;top:20%;bottom:20%;width:2px;background:var(--green);opacity:.35;box-shadow:0 0 8px rgba(70,238,145,.5)}
.room-nav-left a::after{left:0}.room-nav-right a::after{right:0}
.room-nav a:hover,.room-nav a:focus-visible{transform:translateY(-2px);border-color:rgba(70,238,145,.48);background:linear-gradient(90deg,rgba(7,25,14,.95),rgba(10,30,17,.84));outline:none}
.room-nav b{grid-row:1/3;color:#527060;font:600 8px ui-monospace,SFMono-Regular,Menlo,monospace}
.room-nav span:not(.nav-label){color:#d8e7dd;font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.09em}
.room-nav em{color:#64776c;font:500 7px ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal;letter-spacing:.04em}

.screen-rig{position:absolute;z-index:30;left:50%;top:50%;width:min(64vw,1040px);height:min(73vh,760px);transform:translate(-50%,-45%);display:flex;flex-direction:column;align-items:center;pointer-events:none}
.screen-frame{position:relative;width:100%;flex:1;min-height:0;padding:14px;background:linear-gradient(145deg,#17251d,#07100b 24%,#111c15 62%,#050a07);clip-path:polygon(3% 0,97% 0,100% 5%,100% 95%,97% 100%,3% 100%,0 95%,0 5%);box-shadow:0 24px 70px rgba(0,0,0,.72),0 0 0 1px rgba(70,238,145,.12),inset 0 0 34px rgba(70,238,145,.04);pointer-events:auto}
.screen-frame::before{content:"";position:absolute;inset:5px;clip-path:inherit;border:1px solid rgba(215,153,85,.18);pointer-events:none}
.screen-frame::after{content:"";position:absolute;left:12%;right:12%;bottom:5px;height:2px;background:linear-gradient(90deg,transparent,rgba(70,238,145,.38),transparent);box-shadow:0 0 10px rgba(70,238,145,.18)}
.screen-header{height:58px;padding:9px 16px 7px;display:flex;justify-content:space-between;align-items:center;border:1px solid rgba(70,238,145,.13);border-bottom:0;background:linear-gradient(180deg,rgba(8,25,14,.96),rgba(4,14,8,.88))}
.screen-header>div:first-child{display:flex;flex-direction:column;gap:4px}
.screen-code{color:#5e806c;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em}
.screen-header strong{font:600 17px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.27em;color:#dbf9e5}
.screen-health{display:flex;gap:16px;color:#5c7466;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.11em}
.screen-health b{color:var(--green)}
.screen-viewport{height:calc(100% - 87px);border-left:1px solid rgba(70,238,145,.13);border-right:1px solid rgba(70,238,145,.13);background:radial-gradient(circle at 75% 18%,rgba(31,189,105,.065),transparent 26%),linear-gradient(180deg,#06110b,#040a07);overflow:hidden;position:relative}
.screen-viewport::before{content:"";position:absolute;z-index:9;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0 4px,rgba(180,255,208,.012) 5px);mix-blend-mode:screen}
.screen-scroll{height:100%;overflow-y:auto;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:rgba(70,238,145,.35) transparent}
.screen-scroll::-webkit-scrollbar{width:7px}.screen-scroll::-webkit-scrollbar-thumb{background:rgba(70,238,145,.25);border-radius:10px}
.screen-section{min-height:100%;padding:clamp(32px,5vh,68px) clamp(28px,5vw,72px);border-bottom:1px solid rgba(70,238,145,.1)}
.screen-intro{display:flex;flex-direction:column;justify-content:center}
.screen-eyebrow,.screen-section-head span{color:var(--green);font:700 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.24em}
.screen-intro h1{max-width:780px;margin:14px 0 17px;font-size:clamp(40px,5.1vw,74px);line-height:.94;letter-spacing:-.048em;font-weight:680}
.screen-intro h1 span{color:var(--green)}
.screen-lede{max-width:760px;margin:0;color:#9caf9f;font-size:clamp(13px,1.15vw,17px);line-height:1.68}
.screen-status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}
.screen-status-grid article{padding:13px 14px;border:1px solid rgba(70,238,145,.14);background:rgba(7,22,13,.62)}
.screen-status-grid span,.screen-status-grid small{display:block;color:#63766b;font:600 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}
.screen-status-grid strong{display:block;margin:6px 0 4px;color:#d9e8de;font-size:12px}
.screen-section-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:24px}
.screen-section-head h2{margin:7px 0 0;font-size:clamp(28px,3vw,48px);letter-spacing:-.035em}
.screen-section-head>small{color:#5f7466;font:600 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.project-card{min-height:165px;padding:18px;text-decoration:none;border:1px solid rgba(70,238,145,.15);background:linear-gradient(145deg,rgba(7,23,13,.9),rgba(3,10,6,.9));transition:transform .2s ease,border-color .2s ease,background .2s ease}
.project-card:hover,.project-card:focus-visible{transform:translateY(-2px);border-color:rgba(70,238,145,.48);background:linear-gradient(145deg,rgba(10,35,18,.95),rgba(3,12,7,.94));outline:none}
.project-nebu{background:radial-gradient(circle at 90% 5%,rgba(70,238,145,.12),transparent 35%),linear-gradient(145deg,rgba(9,31,17,.96),rgba(3,11,7,.94))}
.card-index{color:#4f7a60;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em}
.project-card h3{margin:11px 0 7px;font-size:18px}
.project-card p{margin:0;color:#819487;font-size:11px;line-height:1.55}
.project-card em{display:block;margin-top:15px;color:#9ae8b7;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal;letter-spacing:.13em}
.station-map{position:relative;height:330px;max-width:720px;margin:auto;border:1px solid rgba(70,238,145,.13);background:radial-gradient(circle at 50% 50%,rgba(70,238,145,.05),transparent 42%),repeating-linear-gradient(0deg,transparent 0 31px,rgba(70,238,145,.03) 32px),repeating-linear-gradient(90deg,transparent 0 31px,rgba(70,238,145,.03) 32px)}
.map-node{position:absolute;z-index:3;min-width:100px;padding:11px 13px;text-align:center;border:1px solid rgba(70,238,145,.3);background:#07120c;color:#cde3d4;font:700 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.09em;box-shadow:0 0 20px rgba(70,238,145,.04)}
.map-node small{color:#63a87a;font-size:6px}.main-node{left:50%;top:50%;transform:translate(-50%,-50%);border-color:rgba(70,238,145,.7);box-shadow:0 0 25px rgba(70,238,145,.1)}.ai-node{right:7%;top:18%}.sim-node{right:8%;bottom:15%}.culture-node{left:8%;top:18%}.workshop-node{left:8%;bottom:15%}
.map-line{position:absolute;z-index:1;left:50%;top:50%;width:34%;height:1px;background:linear-gradient(90deg,rgba(70,238,145,.48),rgba(70,238,145,.08));transform-origin:left}.line-a{transform:rotate(-29deg)}.line-b{transform:rotate(29deg)}.line-c{transform:rotate(151deg)}.line-d{transform:rotate(209deg)}
.diagnostic-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:720px}
.diagnostic-grid div{display:flex;justify-content:space-between;gap:20px;padding:14px;border:1px solid rgba(70,238,145,.12);background:rgba(7,20,12,.65);font:700 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}
.diagnostic-grid span{color:#73877a}.diagnostic-grid b{color:var(--green)}
.screen-footer{height:29px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(70,238,145,.13);border-top:0;background:#050d08;color:#5f7567;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em}
.screen-footer span:nth-child(2){color:#92d7aa}

.console-deck{position:relative;width:83%;height:74px;margin-top:-2px;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 70px 10px 58px;background:linear-gradient(180deg,#121d16,#060a07 65%,#030503);border-top:1px solid rgba(70,238,145,.17);clip-path:polygon(3% 0,97% 0,100% 100%,0 100%);box-shadow:0 18px 40px rgba(0,0,0,.65),inset 0 1px rgba(255,255,255,.025);pointer-events:auto}
.deck-label{position:absolute;left:24px;top:10px;color:#526258;font:700 6px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;writing-mode:vertical-rl}
.console-deck button{height:37px;min-width:104px;padding:0 13px;border:1px solid rgba(70,238,145,.18);background:linear-gradient(180deg,#0c1710,#050a07);color:#93a59a;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;cursor:pointer;box-shadow:inset 0 0 12px rgba(70,238,145,.02);transition:border-color .2s ease,color .2s ease,transform .1s ease}
.console-deck button:hover,.console-deck button:focus-visible{border-color:rgba(70,238,145,.48);color:#d7ecde;outline:none}.console-deck button:active{transform:translateY(1px)}
.console-deck button.active{border-color:rgba(70,238,145,.65);color:var(--mint);box-shadow:inset 0 0 16px rgba(70,238,145,.08),0 0 10px rgba(70,238,145,.05)}
.console-deck button i{display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:#4d6657;vertical-align:1px}.console-deck button.active i{background:var(--green);box-shadow:0 0 7px var(--green)}
.console-deck .console-reset{min-width:70px;border-color:rgba(215,153,85,.22);color:#a98667}
.console-dial{position:absolute;right:18px;width:43px;height:43px;border-radius:50%;border:1px solid rgba(215,153,85,.3);background:radial-gradient(circle,#17201a 0 31%,#080d09 33% 55%,#1b241d 57% 64%,#060906 66%);box-shadow:inset 0 0 13px rgba(0,0,0,.8)}
.console-dial span{position:absolute;left:50%;top:3px;width:2px;height:13px;background:#d79955;transform:translateX(-50%);box-shadow:0 0 7px rgba(215,153,85,.35)}

.room-caption{position:absolute;z-index:25;left:2.5%;bottom:2.2%;display:flex;flex-direction:column;color:#45564b;font:700 7px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em}.room-caption b{margin-top:4px;color:#6e8175;font-weight:700}
@keyframes pulse{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes roomDrift{0%{transform:scale(1.01) translate3d(-.2%,0,0)}100%{transform:scale(1.02) translate3d(.35%,-.2%,0)}}

@media (orientation:portrait) and (min-width:700px){
  .screen-rig{width:min(74vw,900px);height:min(72vh,980px);transform:translate(-50%,-44%)}
  .room-nav{top:auto;bottom:4%;width:21vw}.room-nav a{min-height:50px}.room-nav a:nth-of-type(n+3){display:none}
  .screen-status-grid{grid-template-columns:1fr}.screen-status-grid article:nth-child(n+3){display:none}
  .console-deck{width:92%;padding-left:45px;padding-right:58px}.console-deck button{min-width:82px}
}
@media (max-width:980px){
  .screen-rig{width:72vw}
  .room-nav{width:12.5vw}.room-nav a{grid-template-columns:1fr;padding:10px 7px}.room-nav b,.room-nav em,.nav-label{display:none}.room-nav span:not(.nav-label){font-size:7px;line-height:1.25}
  .console-deck button{min-width:78px;padding:0 8px}.console-deck{padding-left:45px;padding-right:55px}
}
@media (max-width:700px){
  body{overflow:auto}
  .lab-shell{height:100dvh;min-height:680px}
  .lab-art{inset:-5%;width:110%;height:110%;object-position:center}
  .brand-copy small{display:none}.station-state span:nth-child(2){display:none}
  .room-nav{top:auto;bottom:9px;width:auto;display:flex;flex-direction:row;gap:5px}
  .room-nav-left{left:8px}.room-nav-right{right:8px}
  .room-nav a{width:46px;height:38px;display:grid;place-items:center;padding:5px;clip-path:none;border-radius:3px}.room-nav a span:not(.nav-label){font-size:0}.room-nav a span:not(.nav-label)::first-letter{font-size:7px}.room-nav a b{display:block;grid-row:auto;font-size:7px}.room-nav a em{display:none}.nav-label{display:none}
  .screen-rig{top:49%;width:94vw;height:75vh;transform:translate(-50%,-46%)}
  .screen-frame{padding:9px}.screen-header{height:50px;padding-inline:10px}.screen-code{font-size:6px}.screen-header strong{font-size:13px}.screen-health span:first-child{display:none}
  .screen-viewport{height:calc(100% - 77px)}
  .screen-section{padding:28px 19px}.screen-intro h1{font-size:38px}.screen-lede{font-size:12px}.screen-status-grid{grid-template-columns:1fr}.screen-status-grid article:nth-child(n+2){display:none}
  .project-grid{grid-template-columns:1fr}.project-card{min-height:130px}.project-card p{font-size:10px}
  .station-map{height:300px}.map-node{min-width:74px;padding:8px;font-size:7px}
  .diagnostic-grid{grid-template-columns:1fr}
  .console-deck{width:95%;height:62px;padding:12px 48px 8px 34px;gap:5px}.console-deck button{min-width:0;flex:1;height:34px;padding:0 4px;font-size:6px}.console-deck button i{display:none}.console-reset{display:none}.deck-label{display:none}.console-dial{right:7px;width:34px;height:34px}
  .room-caption{display:none}
}
@media (max-width:430px){
  .lab-topbar{height:56px;padding-inline:12px}.station-state b{display:none}
  .screen-rig{width:97vw;height:77vh}.screen-header strong{letter-spacing:.18em}.screen-health{display:none}
  .console-deck button:nth-of-type(4){display:none}
}
@media (prefers-reduced-motion:reduce){.lab-art,.online-dot{animation:none}.screen-scroll{scroll-behavior:auto}}


/* --- TalonLab detailed observation-lab integration --- */
.lab-stage{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  background:#010302;
}
.exterior-stack{
  position:absolute;
  inset:-2%;
  overflow:hidden;
  background:#020605;
}
.exterior-layer{
  position:absolute;
  inset:-3%;
  width:106%;
  height:106%;
  object-fit:cover;
  object-position:center;
  opacity:0;
  transform:scale(1.025) translate3d(0,0,0);
  transition:opacity 2.8s ease;
  animation:exteriorDrift 84s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
.exterior-balanced{opacity:1}
.lab-shell[data-exterior="balanced"] .exterior-balanced{opacity:1}
.lab-shell[data-exterior="balanced"] .exterior-station,
.lab-shell[data-exterior="balanced"] .exterior-planet{opacity:0}
.lab-shell[data-exterior="station"] .exterior-station{opacity:1}
.lab-shell[data-exterior="station"] .exterior-balanced,
.lab-shell[data-exterior="station"] .exterior-planet{opacity:0}
.lab-shell[data-exterior="planet"] .exterior-planet{opacity:1}
.lab-shell[data-exterior="planet"] .exterior-balanced,
.lab-shell[data-exterior="planet"] .exterior-station{opacity:0}
.detailed-room-shell{
  z-index:2;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.96) contrast(1.025) brightness(.95);
  animation:none;
}
.console-art{display:none}

/* The live display now sits inside the physical monitor in the artwork. */
.screen-rig{
  z-index:34;
  left:34.05%;
  top:25.7%;
  width:31.95%;
  height:26.7%;
  transform:none;
  display:block;
  pointer-events:none;
}
.screen-frame{
  width:100%;
  height:100%;
  min-height:0;
  padding:0;
  background:rgba(2,9,6,.965);
  border:1px solid rgba(70,238,145,.14);
  clip-path:none;
  box-shadow:inset 0 0 32px rgba(29,143,79,.07),0 0 18px rgba(0,0,0,.42);
  pointer-events:auto;
  overflow:hidden;
}
.screen-frame::before,.screen-frame::after{display:none}
.screen-header{
  height:16%;
  min-height:32px;
  padding:5px 10px 4px;
  border:0;
  border-bottom:1px solid rgba(70,238,145,.11);
  background:linear-gradient(180deg,rgba(5,18,10,.96),rgba(3,11,7,.9));
}
.screen-code{font-size:clamp(5px,.38vw,7px);letter-spacing:.13em}
.screen-header strong{font-size:clamp(10px,.82vw,15px);letter-spacing:.22em}
.screen-health{font-size:clamp(5px,.34vw,7px);gap:9px}
.screen-viewport{
  height:75%;
  border:0;
  background:radial-gradient(circle at 72% 20%,rgba(31,189,105,.06),transparent 30%),linear-gradient(180deg,#06110b,#030906);
}
.screen-footer{
  height:9%;
  min-height:17px;
  padding:0 9px;
  border:0;
  border-top:1px solid rgba(70,238,145,.1);
  font-size:clamp(5px,.34vw,7px);
}
.screen-section{
  min-height:100%;
  padding:clamp(13px,1.6vh,21px) clamp(14px,1.55vw,28px);
}
.screen-eyebrow,.screen-section-head span{font-size:clamp(5px,.36vw,7px);letter-spacing:.19em}
.screen-intro h1{
  max-width:95%;
  margin:7px 0 8px;
  font-size:clamp(22px,2.05vw,39px);
  line-height:.94;
}
.screen-lede{
  max-width:96%;
  font-size:clamp(7px,.61vw,11px);
  line-height:1.5;
}
.screen-status-grid{gap:5px;margin-top:10px}
.screen-status-grid article{padding:6px 7px}
.screen-status-grid span,.screen-status-grid small{font-size:clamp(4px,.29vw,6px)}
.screen-status-grid strong{margin:3px 0 2px;font-size:clamp(7px,.52vw,10px)}
.screen-section-head{margin-bottom:10px}
.screen-section-head h2{margin-top:4px;font-size:clamp(16px,1.45vw,28px)}
.screen-section-head>small{font-size:5px}
.project-grid{gap:5px}
.project-card{min-height:72px;padding:8px}
.card-index{font-size:5px}
.project-card h3{margin:5px 0 3px;font-size:clamp(9px,.72vw,13px)}
.project-card p{font-size:clamp(6px,.43vw,8px);line-height:1.35}
.project-card em{margin-top:6px;font-size:5px}
.station-map{height:88%;min-height:135px}
.map-node{min-width:62px;padding:6px 7px;font-size:5px}
.map-node small{font-size:4px}
.diagnostic-grid{gap:5px}
.diagnostic-grid div{padding:7px;font-size:5px}

/* Physical lower console remains visible; controls are transparent live hit areas. */
.console-deck{
  position:absolute;
  left:50%;
  top:111%;
  width:112%;
  height:22%;
  min-height:42px;
  margin:0;
  padding:5px 12% 4px 8%;
  transform:translateX(-50%);
  gap:4px;
  background:transparent;
  border:0;
  clip-path:none;
  box-shadow:none;
  pointer-events:auto;
}
.console-deck button{
  height:28px;
  min-width:0;
  flex:1;
  padding:0 5px;
  border-color:rgba(70,238,145,.13);
  background:rgba(2,8,5,.58);
  color:#81988a;
  font-size:clamp(5px,.34vw,7px);
  backdrop-filter:blur(2px);
}
.console-deck button.active{
  border-color:rgba(70,238,145,.55);
  background:rgba(4,18,9,.7);
}
.console-deck .console-reset{min-width:42px}
.deck-label{display:none}
.console-dial{
  right:2.5%;
  width:30px;
  height:30px;
  opacity:.28;
}

/* Side panels use the blank physical wall displays rather than floating dashboard cards. */
.room-nav{
  z-index:38;
  top:27.8%;
  width:12.3%;
  max-width:none;
  gap:2px;
  padding:5px;
  background:rgba(2,8,5,.78);
  border:1px solid rgba(70,238,145,.08);
  backdrop-filter:blur(3px);
}
.room-nav-left{left:2.8%}.room-nav-right{right:2.8%}
.nav-label{padding:0 4px 4px;font-size:5px}
.room-nav a{
  grid-template-columns:18px 1fr;
  min-height:34px;
  gap:1px 4px;
  padding:5px 5px;
  clip-path:none;
  background:rgba(5,16,9,.5);
  border-color:rgba(70,238,145,.08);
  box-shadow:none;
}
.room-nav b{font-size:5px}
.room-nav span:not(.nav-label){font-size:clamp(6px,.46vw,9px)}
.room-nav em{font-size:clamp(4px,.3vw,6px)}
.room-caption{z-index:28}
@keyframes exteriorDrift{
  0%{transform:scale(1.035) translate3d(-.45%,.1%,0)}
  100%{transform:scale(1.055) translate3d(.6%,-.35%,0)}
}

/* Tall desktop/tablet: use the isolated console as the primary physical object. */
@media (orientation:portrait) and (min-width:700px){
  .detailed-room-shell{opacity:.3;filter:brightness(.45) saturate(.75);object-fit:cover}
  .console-art{
    display:block;
    position:absolute;
    z-index:3;
    left:50%;
    top:16%;
    width:138vw;
    max-width:none;
    transform:translateX(-50%);
    opacity:.98;
  }
  .screen-rig{
    left:8%;
    top:20.2%;
    width:84%;
    height:22.5%;
    transform:none;
  }
  .room-nav{top:auto;bottom:3.5%;width:35%;padding:4px}
  .room-nav-left{left:4%}.room-nav-right{right:4%}
  .room-nav a{min-height:38px}
  .room-nav a:nth-of-type(n+3){display:none}
  .screen-status-grid{grid-template-columns:1fr 1fr}
  .screen-status-grid article:nth-child(3){display:none}
  .console-deck{top:111%;width:104%}
}

/* Tablet and phone are intentionally console-first, not miniature rooms. */
@media (max-width:700px){
  .detailed-room-shell{opacity:.2;filter:brightness(.38) saturate(.7);object-position:center}
  .console-art{
    display:block;
    position:absolute;
    z-index:3;
    left:50%;
    top:14%;
    width:170vw;
    max-width:none;
    transform:translateX(-50%);
  }
  .exterior-stack{inset:-8%}
  .screen-rig{
    left:4%;
    top:20%;
    width:92%;
    height:39%;
    transform:none;
  }
  .screen-header{height:13%}
  .screen-viewport{height:79%}
  .screen-footer{height:8%}
  .screen-intro h1{font-size:clamp(27px,8vw,40px)}
  .screen-lede{font-size:10px}
  .screen-status-grid{grid-template-columns:1fr}
  .screen-status-grid article:nth-child(n+2){display:none}
  .project-grid{grid-template-columns:1fr}
  .project-card{min-height:95px}
  .project-card p{font-size:9px}
  .station-map{min-height:220px}
  .diagnostic-grid{grid-template-columns:1fr}
  .console-deck{top:105%;width:100%;height:54px;padding-inline:3%;background:rgba(2,7,4,.38)}
  .console-deck button{height:32px;font-size:6px}
  .console-dial{display:none}
  .room-nav{
    top:auto;
    bottom:8px;
    width:auto;
    height:auto;
    padding:0;
    border:0;
    background:transparent;
    backdrop-filter:none;
  }
  .room-nav a{width:46px;height:38px;min-height:0;padding:4px;background:rgba(2,9,5,.86);border:1px solid rgba(70,238,145,.18)}
}
@media(max-width:430px){
  .console-art{width:205vw;top:15%}
  .screen-rig{top:21%;height:42%}
  .screen-section{padding:20px 14px}
  .screen-intro h1{font-size:30px}
  .screen-header strong{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .exterior-layer{animation:none;transition:none}
}


/* --- Physical-room integration pass: 2026-09-19 --- */
/* The generated room art owns the architecture. CSS only aligns live interface surfaces to it. */
.detailed-room-shell{
  z-index:3 !important;
  display:block !important;
  opacity:1 !important;
  filter:saturate(.94) contrast(1.045) brightness(.98);
  image-rendering:auto;
}

.console-art{
  display:none !important; /* isolated console source is being replaced; the room shell already contains the hardware */
}

.exterior-stack{
  z-index:1;
  filter:brightness(.78) saturate(.88) contrast(1.025);
}
.exterior-layer{
  transition:opacity 3.6s ease;
  will-change:opacity,transform;
}
.lab-shell.scroll-blend .exterior-layer{
  opacity:var(--blend,0) !important;
}

.lab-shell::after{
  z-index:22;
  background:
    radial-gradient(ellipse at 50% 43%,transparent 0 31%,rgba(0,0,0,.07) 54%,rgba(0,0,0,.40) 100%),
    linear-gradient(180deg,rgba(0,0,0,.08),transparent 21%,transparent 75%,rgba(0,0,0,.26));
}

.lab-topbar{
  height:58px;
  background:linear-gradient(180deg,rgba(1,4,2,.74),rgba(1,4,2,.18) 64%,transparent);
  border-bottom:0;
}

/* These are live labels mounted over the generated side-screen hardware. */
.room-nav{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  padding:0 !important;
}
.room-nav .nav-label{
  opacity:.62;
  text-shadow:0 2px 6px rgba(0,0,0,.95);
}
.room-nav a{
  background:linear-gradient(90deg,rgba(2,9,5,.58),rgba(3,13,7,.32)) !important;
  border-color:rgba(70,238,145,.09) !important;
  box-shadow:inset 0 0 12px rgba(0,0,0,.28) !important;
  backdrop-filter:blur(1.5px);
}
.room-nav a:hover,
.room-nav a:focus-visible{
  transform:translateY(-1px);
  background:linear-gradient(90deg,rgba(5,25,13,.86),rgba(4,19,10,.68)) !important;
  border-color:rgba(70,238,145,.42) !important;
  box-shadow:inset 0 0 15px rgba(70,238,145,.035),0 0 12px rgba(0,0,0,.30) !important;
}

/* The raster image supplies the monitor bezel: this is only the illuminated screen surface. */
.screen-frame{
  padding:0 !important;
  clip-path:none !important;
  background:rgba(2,9,6,.955) !important;
  border:1px solid rgba(70,238,145,.08) !important;
  box-shadow:inset 0 0 30px rgba(0,0,0,.66),0 0 8px rgba(0,0,0,.28) !important;
}
.screen-frame::before,
.screen-frame::after{
  display:none !important;
}
.screen-header{
  height:14.5%;
  min-height:42px;
  padding:7px 13px 6px;
  background:linear-gradient(180deg,rgba(5,21,12,.96),rgba(3,13,8,.90));
  border:0;
  border-bottom:1px solid rgba(70,238,145,.12);
}
.screen-viewport{
  height:78.5%;
  border:0;
  background:
    radial-gradient(circle at 72% 16%,rgba(35,178,94,.055),transparent 28%),
    linear-gradient(180deg,rgba(4,17,9,.98),rgba(2,9,6,.99));
}
.screen-footer{
  height:7%;
  min-height:20px;
  border:0;
  border-top:1px solid rgba(70,238,145,.10);
  background:rgba(2,9,6,.97);
}
.screen-section{
  padding:clamp(21px,3.8vh,48px) clamp(22px,3.3vw,52px);
}
.screen-intro h1{
  font-size:clamp(34px,4.15vw,64px);
}

/* Buttons remain HTML, but sit over the physical lower control bank. */
.console-deck{
  background:rgba(2,8,5,.22) !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  backdrop-filter:blur(.6px);
}
.console-deck button{
  background:linear-gradient(180deg,rgba(8,20,12,.72),rgba(3,9,5,.82));
  border-color:rgba(70,238,145,.14);
}
.console-deck .console-dial{
  opacity:.28;
}

/* On narrower layouts keep the physical room as the visual source until dedicated portrait art is cut. */
@media (max-width:980px), (orientation:portrait){
  .detailed-room-shell{
    opacity:.72 !important;
  }
  .console-art{
    display:none !important;
  }
}


/* --- Room travel / observation-window motion --- */
.exterior-stack{
  transform:translate3d(var(--window-pan-x,0%),var(--window-pan-y,0%),0) scale(1.018);
  transition:transform .22s linear,filter .35s ease;
}
.room-nav a.route-active{
  border-color:rgba(70,238,145,.72) !important;
  color:#dfffea;
  box-shadow:inset 0 0 22px rgba(70,238,145,.08),0 0 16px rgba(70,238,145,.09) !important;
}
.lab-stage,
.screen-rig,
.lab-topbar,
.room-nav,
.room-caption{
  transition:opacity .24s ease,filter .24s ease,transform .24s ease;
}
.lab-shell.lab-leaving .screen-rig,
.lab-shell.lab-leaving .room-nav:not(:has(.route-active)),
.lab-shell.lab-leaving .room-caption{
  opacity:.28;
  filter:blur(.8px);
}
.lab-shell.lab-leaving .lab-stage{
  filter:brightness(.72);
}
.lab-shell.lab-leaving .lab-topbar{
  opacity:.48;
}
@media (prefers-reduced-motion:reduce){
  .exterior-stack{transform:none;transition:none}
  .lab-stage,.screen-rig,.lab-topbar,.room-nav,.room-caption{transition:none}
}


/* --- Feedback pass: larger console + seamless wide exterior rail --- */
.exterior-fallback{display:none}
.exterior-loop{
  position:absolute;
  inset:-3% -4%;
  z-index:1;
  overflow:hidden;
  background:#020605;
  filter:brightness(.82) saturate(.92) contrast(1.025);
}
.exterior-loop-track{
  position:absolute;
  inset:0 auto 0 0;
  width:400%;
  height:100%;
  display:flex;
  animation:talonWindowRail 150s linear infinite;
  will-change:transform;
}
.exterior-loop-track img{
  width:25%;
  height:100%;
  flex:0 0 25%;
  object-fit:cover;
  object-position:center;
}
.exterior-loop-track img.mirror{transform:scaleX(-1)}
@keyframes talonWindowRail{
  from{transform:translate3d(-50%,0,0)}
  to{transform:translate3d(0,0,0)}
}

/* Bring the primary display back up to workstation scale. */
.screen-rig{
  left:31.25%;
  top:22.4%;
  width:37.5%;
  height:31.6%;
}
.screen-header{height:14%;min-height:38px}
.screen-viewport{height:79%}
.screen-footer{height:7%}
.screen-intro h1{
  font-size:clamp(36px,4.55vw,72px);
  max-width:98%;
}
.screen-lede{font-size:clamp(8px,.70vw,13px)}
.screen-status-grid{margin-top:14px}
.console-deck{
  top:109%;
  width:108%;
}

/* Give the room art a touch more local contrast while the higher-res shell is prepared. */
.detailed-room-shell{
  filter:saturate(.98) contrast(1.075) brightness(.985);
}

/* Side navigation sits farther into the physical wall panels now the screen is larger. */
.room-nav{top:28.6%;width:11.2%}
.room-nav-left{left:3.4%}
.room-nav-right{right:3.4%}

@media (max-width:1180px){
  .screen-rig{left:28%;width:44%;top:23%;height:32%}
  .room-nav{width:13%}
}
@media (max-width:980px), (orientation:portrait){
  .screen-rig{left:8%;width:84%;top:20.5%;height:34%}
  .room-nav{width:34%}
}
@media (max-width:700px){
  .screen-rig{left:3%;width:94%;top:19%;height:43%}
  .exterior-loop{inset:-6% -10%}
  .exterior-loop-track{animation-duration:190s}
}
@media (prefers-reduced-motion:reduce){
  .exterior-loop-track{animation:none;transform:translate3d(-25%,0,0)}
}