/* RELAY 10 · one-screen cinematic workspace. Deliberately sparse HUD, all detailed
   controls in opt-in overlays. Responsive desktop first; zero page scroll. */
:root{--teal:#078d80;--mint:#bce5d8;--ink:#143f48;--chrome:66px}
html,body{background:#eaf1f1}
.topbar{background:#fffefc;box-shadow:0 2px 18px #183f4910}.brand-glyph{background:linear-gradient(145deg,#034b4e,#087f78)}
.brand small{letter-spacing:1.1px}
#ground-screen .ground-title{display:none}
#ground-screen .situation,#ground-screen .decision-float,#ground-screen .live-telemetry{opacity:0;pointer-events:none;transform:translateY(-9px) scale(.985);transition:opacity .22s,transform .22s}
#ground-screen.insight-open .situation,#ground-screen.insight-open .decision-float,#ground-screen.insight-open .live-telemetry{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
#ground-screen .situation{left:67px;top:115px;width:230px;padding:13px;z-index:10}
#ground-screen .decision-float{top:110px;right:18px;width:300px;z-index:10}
#ground-screen .live-telemetry{bottom:90px;left:68px;width:267px;z-index:10}
#ground-screen .event-live{display:none}
#ground-screen .worldlabel{top:18px;left:55px;background:#ffffffee;box-shadow:0 4px 20px #164d4918}
#ground-screen .worldfooter{bottom:17px;left:14px;padding:7px 10px;background:#ffffffda}
#ground-screen .view-switch{top:12px;z-index:5;box-shadow:0 4px 14px #183f4930}
.v10-toolrail{left:11px;top:29%;display:flex;flex-direction:column;gap:5px;padding:6px;background:#ffffffed;border:1px solid #d8e9e6;border-radius:13px;box-shadow:0 9px 30px #163f492e;z-index:9}
.v10-toolrail button{border:0;background:transparent;color:#27716d;width:35px;height:35px;border-radius:9px;font:800 20px 'Segoe UI',sans-serif;transition:.15s}
.v10-toolrail button:hover,.v10-toolrail button:focus-visible{background:#daf4eb;color:#046a65;transform:scale(1.04)}
.v10-scene-hud{top:13px;right:15px;display:flex;gap:9px;align-items:center;background:#fffffff0;backdrop-filter:blur(10px);border:1px solid #d5e7e4;box-shadow:0 4px 22px #154b511b;border-radius:12px;padding:9px 13px;color:#53777a;font-size:10px;font-weight:700;z-index:6;max-width:34vw;flex-wrap:wrap}
.v10-scene-hud i{height:14px;width:1px;background:#dce9e7}.v10-scene-hud strong{font:900 16px Manrope,'Segoe UI';color:#087f74}
.v10-heartbeat{color:#a0aeb3;font-size:14px}.v10-heartbeat.v10-beat{color:#0aac8c;animation:v10beat .55s cubic-bezier(.15,1,.3,1)}@keyframes v10beat{45%{transform:scale(1.75);text-shadow:0 0 17px #37d9b4}}
.v10-compact-impact{bottom:86px;left:50%;transform:translateX(-50%);min-width:385px;background:#ffffffeb;backdrop-filter:blur(12px);padding:9px 14px 7px;border:1px solid #e0e9e5;border-radius:12px;display:flex;align-items:center;gap:15px;flex-wrap:wrap;z-index:5;box-shadow:0 12px 36px #194c4f23;color:#7d9493;font-size:10px}
.v10-compact-impact b{font-size:13px;color:#205b5b;margin-left:3px;font-variant-numeric:tabular-nums}
.v10-compact-impact .cost-positive{color:#04866b}.v10-compact-impact .cost-negative{color:#be6649}
.v10-cargo-track{height:3px;width:100%;border-radius:7px;background:#e5edeb;overflow:hidden}.v10-cargo-track i{display:block;width:0;height:100%;background:#12b58f;transition:width .2s}
.v10-alert-stack{left:62px;top:19px;width:280px;z-index:8;display:flex;flex-direction:column;gap:7px;pointer-events:none}
.v10-notification{display:flex;gap:9px;background:#ffffffee;border:1px solid #cce9df;border-left:4px solid #19a88f;border-radius:10px;padding:10px 11px;box-shadow:0 8px 28px #16454430;animation:v10enter .35s cubic-bezier(.16,1,.3,1),v10exit .5s ease 3.85s both}
.v10-notification.danger{border-color:#efd8c5;border-left-color:#df8464}.notify-symbol{font-size:23px;color:#159d89}.v10-notification.danger .notify-symbol{color:#ce745b}
.v10-notification b{font-size:11px;display:block;color:#254c53}.v10-notification small{display:block;color:#69828a;line-height:1.35;margin-top:3px;font-size:9px}
@keyframes v10enter{from{transform:translateX(-28px) scale(.94);opacity:0}to{transform:translateX(0) scale(1);opacity:1}}
@keyframes v10exit{to{opacity:0;transform:translateY(-18px)}}
.v10-activity{right:14px;bottom:80px;width:272px;background:#ffffffea;border:1px solid #cfe3dc;border-radius:14px;overflow:hidden;box-shadow:0 12px 30px #15464a26;z-index:8;backdrop-filter:blur(13px)}
.v10-activity button{width:100%;display:flex;align-items:center;gap:7px;padding:10px 13px;border:0;background:transparent;font:800 10px 'Segoe UI',sans-serif;letter-spacing:.6px;color:#24545c}
.v10-activity button b{margin-left:auto;background:#daf2e9;padding:3px 7px;border-radius:8px;color:#087d6c}
.v10-activity-stream{max-height:64px;overflow:hidden;padding:0 10px;transition:max-height .2s}.v10-activity.expanded .v10-activity-stream{max-height:240px;overflow:auto;scrollbar-width:thin;padding-bottom:8px}
.v10-event-row{display:flex;align-items:flex-start;gap:8px;padding:7px 3px;border-top:1px solid #e5edeb;animation:v10enter .2s ease}
.v10-event-row>span{font-size:15px;color:#0d957e}.v10-event-row>div{min-width:0;flex:1}.v10-event-row b{display:block;font:700 10px 'Segoe UI';color:#39656a}.v10-event-row small{display:block;font-size:9px;color:#7b9495;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v10-event-row time{font-size:9px;color:#95aba7}
.v10-insight-toggle{right:15px;top:80px;z-index:7}.v10-insight-toggle button{border:1px solid #d3e4df;background:#ffffffed;border-radius:10px;color:#096f69;font-weight:800;font-size:11px;padding:10px 12px;box-shadow:0 6px 18px #1946481e}
.v10-insight-toggle button[aria-pressed=true]{background:#dcf3e9}
.v10-flash-number{animation:v10num .55s cubic-bezier(.1,1,.2,1)}@keyframes v10num{35%{transform:scale(1.22);color:#0bbd91}to{transform:scale(1)}}
#ground-screen .ground-dock{bottom:10px}.dock-main{padding:6px 11px;gap:4px}.dock-btn{min-width:57px}.dock-btn span{font-size:17px}
/* Math visuals: real numerical outputs rendered with an intelligible live computational trace. */
.tower-heading{height:92px}.tower-layout{height:calc(100% - 92px)}.tower-heading h1{font-size:26px}
.tower-main{gap:7px}.tower-side{gap:8px}.event-cards{height:88px;flex-shrink:0}.event-card{padding:10px}.event-card h4{margin:3px 0}.event-card p{max-height:30px;overflow:hidden}
.outcome{padding:13px;flex:1;min-height:145px}.outcome-head h2{font-size:16px;margin-bottom:4px}.outcome-head p{font-size:11px}.outcome-grid{margin-top:8px}.outcome-half{padding:11px}.outcome-bottom{padding-top:6px}
.v10-math-heading{font-size:10px;letter-spacing:1px;color:#4b8482;font-weight:900;display:flex;justify-content:space-between;align-items:center;padding:1px 3px}.v10-math-heading b{font-size:9px;padding:4px 9px;background:#e1f3ed;color:#177a6e;border-radius:8px}
.model-strip{height:191px;flex-shrink:0;gap:8px}.modeltile{padding:9px 10px;min-width:0;position:relative;display:flex;align-items:flex-start;flex-direction:column;gap:3px;background:#fff;border:1px solid #d9e9e6;border-radius:12px;box-shadow:0 3px 17px #1b5b5910;text-align:left}
.modeltile>span{font-size:9px;color:#0f9d85}.modeltile>b{font-size:12px}.modeltile>small:not(.v10-math-headline){font-size:9px;max-height:16px;overflow:hidden}.modeltile>i{position:absolute;right:11px;top:10px}
.v10-mathcanvas{width:100%;height:94px;display:block;border-radius:8px;margin-top:2px;background:#eff7f4;pointer-events:none}
.modeltile>.v10-math-headline{display:block;font-size:9px;color:#257c71;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.v10-math-caption{color:#8ea5a1;font-size:9px;line-height:1.2;margin-top:0}
/* Customer: multi-flight globe is free of floating data stickers from the back. */
.v10-globe-legend{left:50%;bottom:70px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;z-index:5;background:#ffffffdf;border:1px solid #d8e6e3;padding:9px 12px;border-radius:12px;box-shadow:0 8px 25px #13554e12;backdrop-filter:blur(10px);font-size:10px;color:#4e7778;white-space:nowrap}
.v10-globe-legend>b{color:#176e6a;letter-spacing:.6px;font-size:9px}.v10-globe-legend .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#16a98c;margin-right:3px}.v10-globe-legend .dot.warning{background:#e98736}.v10-globe-legend .dot.cold{background:#179ed0}.v10-globe-legend .dot.risk{background:#e57363}.v10-globe-legend small{font-size:8px;color:#8caaaa;max-width:190px;white-space:normal;line-height:1.2}
.globe-caption{bottom:14px;left:50%;transform:translateX(-50%);width:max-content}
.portfolio .shipment-card{transition:background .18s,border-color .18s,transform .18s}.portfolio .shipment-card.active{border-left:4px solid #0eaf8b}.portfolio .shipment-card:hover{transform:translateX(2px)}
@media(max-width:1360px){.v10-scene-hud{right:8px;max-width:340px;font-size:9px}.v10-compact-impact{min-width:320px}.v10-activity{width:220px;right:8px}.v10-mathcanvas{height:84px}.model-strip{height:171px}.v10-math-heading{font-size:9px}}
@media(max-width:1080px){.v10-scene-hud{max-width:220px;top:58px}.v10-alert-stack{left:56px}.v10-insight-toggle{top:64px;right:240px}.v10-globe-legend{bottom:60px;gap:4px;font-size:9px}.v10-globe-legend small{display:none}.model-strip{height:165px}}
@media(max-width:760px){.v10-toolrail{left:4px;top:38%;padding:2px}.v10-toolrail button{width:27px;height:29px;font-size:15px}.v10-scene-hud{top:4px;right:3px;padding:4px 6px;font-size:8px;max-width:160px;gap:3px}.v10-scene-hud span:nth-last-child(1),.v10-scene-hud span:nth-last-child(3){display:none}.v10-compact-impact{min-width:0;width:190px;bottom:61px;padding:5px 8px;gap:5px;font-size:8px;justify-content:space-between}.v10-compact-impact b{font-size:10px}.v10-activity{right:4px;bottom:125px;width:154px}.v10-alert-stack{left:36px;top:4px;width:150px}.v10-insight-toggle{top:40px;right:5px}.v10-insight-toggle button{font-size:8px;padding:6px}.v10-activity button{padding:6px;font-size:8px}.v10-activity-stream{max-height:35px}.v10-activity.expanded .v10-activity-stream{max-height:110px}.v10-event-row{padding:4px 1px}.v10-event-row small{font-size:7px}.v10-notification{padding:5px}.v10-notification b{font-size:8px}.v10-notification small{font-size:7px}.v10-globe-legend{left:50%;bottom:75px;max-width:180px;overflow:hidden;gap:4px}.v10-globe-legend b{display:none}.v10-math-heading{display:none}.model-strip{height:113px;gap:3px}.modeltile{padding:4px}.v10-mathcanvas{height:54px}.modeltile>b{font-size:8px}.modeltile>small{display:none!important}.tower-heading{height:92px}.tower-layout{height:calc(100% - 92px)}.v10-math-caption{display:none}}

.world canvas.v10-kinetic{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.customer-top{top:16px;left:50%;transform:translateX(-50%);width:330px;text-align:center;pointer-events:none;background:#ffffffa8;padding:5px 12px;border-radius:12px;backdrop-filter:blur(8px)}
.customer-top h1{font-size:20px;letter-spacing:-.5px;margin:2px 0}.customer-top p{display:none}

/* The v11 page uses this existing asset route so running servers can serve layout updates. */
.v11-toast { top: 76px; bottom: auto; }
.twin-workspace {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100dvh;
}
.twin-workspace .topbar {
  height: auto;
  min-height: var(--chrome);
  gap: 8px 16px;
  padding-block: 8px;
}
.twin-workspace .workspace { height: auto; min-height: 0; }
.twin-workspace .tower.active { overflow: auto; }
.twin-workspace #ground-screen.active {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  container-type: size;
}
.twin-workspace .worlds {
  position: relative;
  gap: 8px;
  padding: 8px;
  background: #eaf1f1;
}
.twin-workspace .world {
  border: 1px solid #cedfdf;
  border-radius: 12px;
}
.twin-workspace #ground-screen .worldlabel { top: 12px; left: 12px; }
.twin-workspace #ground-screen .worldfooter { bottom: 12px; left: 12px; }

.shared-simulation {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 0;
  margin-left: auto;
}
.shared-simulation .simulation-actions,
.shared-simulation .simulation-status { justify-content: flex-end; }
.shared-simulation .evidence-link { text-decoration: none; }

.simulation-controls {
  --control-panel-clearance: 58px;
  position: relative;
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding: 10px 16px;
  background: #fff;
  border-top: 1px solid var(--line);
}
.simulation-actions,
.simulation-status,
.playback-state,
.simulation-speed,
.simulation-clock {
  display: flex;
  align-items: center;
  gap: 8px;
}
.simulation-actions { flex-wrap: wrap; gap: 5px; }
:is(.simulation-actions, .simulation-controls) .btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 10px;
  white-space: nowrap;
}
.simulation-controls .control-icon,
.simulation-actions .control-icon {
  font: 700 1.1em/1 system-ui, sans-serif;
  color: #327674;
}
.simulation-controls #injectBtn .control-icon { color: #a06509; }
.simulation-controls .btn[aria-expanded="true"] {
  background: #e1f3ed;
  color: #086d63;
}
.simulation-status {
  flex-wrap: wrap;
  gap: 8px 12px;
  color: #4f6f74;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.playback-state { font-weight: 800; }
.playback-state .pulse { margin-inline: 3px; }
.simulation-speed select {
  padding: 5px 6px;
  border: 1px solid #d7e5e7;
  border-radius: 7px;
  color: #194c50;
  background: #fff;
  font-weight: 750;
}
.simulation-status #achieved { display: inline; }
.simulation-clock { white-space: nowrap; }
.simulation-clock b { color: #24565b; }
.control-anchor { position: relative; }
.simulation-controls .control-popover {
  position: absolute;
  z-index: 1;
  top: auto;
  bottom: calc(100% + 12px);
  left: 0;
  width: min(320px, calc(100vw - 24px));
  max-height: min(65dvh, 38rem, calc(100cqh - var(--control-panel-clearance)));
  overflow: auto;
  background: #fff;
  box-shadow: 0 12px 34px #173f492b;
}
.incident-pop .scenario-control {
  margin-top: 10px;
}
.incident-pop .scenario-label {
  display: block;
  margin-bottom: 5px;
  color: #345f61;
  font-size: 12px;
  font-weight: 700;
}
.incident-pop .scenario-control .btn {
  margin-top: 8px;
}
.incident-group {
  margin-top: 12px;
}
.incident-group h3 {
  margin: 0 0 6px;
  color: #24565b;
  font-size: 12px;
}
.incident-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}
.incident-options button {
  min-height: 36px;
  padding: 6px 8px;
  border: 1px solid #d9e6e6;
  border-radius: 7px;
  background: #f6f9f8;
  color: #285b5c;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
}
.incident-options button:hover {
  background: #e1f3ed;
}
.view-options {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 10px 0;
}
.view-options button {
  border: 1px solid #d9e6e6;
  border-radius: 7px;
  padding: 7px 9px;
  background: #fff;
  color: #355e62;
  font-size: 11px;
  font-weight: 750;
}
.view-options button[aria-pressed="true"] {
  background: #e1f3ed;
  color: #086d63;
  border-color: #b8dfd4;
}

@media (max-width: 1050px) {
  .twin-workspace .topbar { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  .v11-toast { top: 154px; }
  .twin-workspace .topbar { min-height: 0; gap: 6px; }
  .twin-workspace .bottomline { height: auto; min-height: 28px; padding: 4px 8px; }
  .twin-workspace .worlds { grid-template-columns: 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); }
  .twin-workspace #ground-screen .worldlabel { top: 7px; left: 8px; }
  .twin-workspace #ground-screen .worldfooter { bottom: 7px; left: 8px; }
  .simulation-controls { gap: 6px 8px; padding: 8px; }
  :is(.simulation-actions, .simulation-controls) .btn { padding: 7px 8px; }
  .simulation-status { gap: 6px 10px; }
  .control-anchor { position: static; }
  .simulation-controls .control-popover {
    left: 8px;
    bottom: calc(100% + 6px);
  }
}
@media (max-width: 420px) {
  .simulation-controls { --control-panel-clearance: 90px; }
}
@media (max-width: 760px) and (max-height: 730px) {
  .twin-workspace .worlds { grid-template-rows: repeat(2, minmax(180px, 1fr)); overflow: auto; }
  .twin-workspace .world canvas { touch-action: pan-y; }
}