@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

*{box-sizing:border-box}
:root{
  --bg:#050b13;
  --panel:#0b1724;
  --panel-2:#0f2232;
  --line:rgba(166,199,236,.17);
  --line-strong:rgba(194,219,252,.28);
  --text:#eef7ff;
  --soft:#b2c3d8;
  --muted:#75879d;
  --green:#16f08c;
  --cyan:#18c7ff;
  --amber:#ffad18;
  --violet:#a873ff;
  --red:#ff5148;
  --blue:#348cff;
}
html{min-height:100%;overflow-x:hidden}
body{
  margin:0;
  min-height:100%;
  overflow-x:hidden;
  color:var(--text);
  font-family:Inter,system-ui,sans-serif;
  background:
    radial-gradient(circle at 7% 5%,rgba(0,255,188,.15),transparent 31%),
    radial-gradient(circle at 67% 0%,rgba(53,112,255,.15),transparent 36%),
    radial-gradient(circle at 96% 8%,rgba(155,84,255,.12),transparent 34%),
    linear-gradient(145deg,#08151f 0%,#07111d 44%,#050911 100%);
}
h1,h2,h3,p{margin:0}
button,input,select{font:inherit}
button{
  cursor:pointer;
  border:1px solid var(--line);
  border-radius:7px;
  background:rgba(255,255,255,.045);
  color:var(--text);
  font-size:14px;
  font-weight:400;
  line-height:1;
  white-space:nowrap;
}
button:hover{border-color:rgba(24,199,255,.55);background:rgba(24,199,255,.08)}
.dashboard-shell{
  width:100%;
  max-width:2048px;
  margin:0 auto;
  padding:0 24px 28px;
}
body.preload .dashboard-shell{
  visibility:hidden;
}
.command-bar{
  position:relative;
  display:grid;
  grid-template-columns:420px minmax(660px,1fr) auto;
  align-items:center;
  gap:24px;
  min-height:100px;
  padding:18px 0;
}
.brand-block{display:flex;align-items:center;gap:16px;min-width:0}
.brand-mark{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  color:#16ffc5;
  font-size:18px;
  font-weight:800;
  clip-path:polygon(50% 0,93% 24%,93% 76%,50% 100%,7% 76%,7% 24%);
  background:linear-gradient(135deg,rgba(22,240,140,.16),rgba(24,199,255,.08));
  border:2px solid #16ffc5;
  box-shadow:0 0 30px rgba(22,240,140,.22);
}
.brand-block h1{
  font-size:27px;
  line-height:1.02;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:700;
}
.brand-block p{margin-top:6px;color:#aebed0;font-size:14px}
.metric-strip{
  display:grid;
  grid-template-columns:108px minmax(330px,1fr) 155px 118px 132px 116px;
  min-height:72px;
  border:1px solid var(--line-strong);
  border-radius:10px;
  overflow:hidden;
  background:rgba(7,16,27,.74);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.metric-chip{
  position:relative;
  display:grid;
  align-content:center;
  gap:4px;
  min-width:0;
  padding:12px 18px;
  border-right:1px solid rgba(199,221,251,.14);
}
.metric-chip:last-child{border-right:0}
.metric-chip span{
  color:#97a8bd;
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.metric-chip strong{
  overflow:hidden;
  color:#f6fbff;
  font-size:19px;
  font-weight:650;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.metric-chip small{color:#9caec3;font-size:15px}
.metric-chip.wide small{
  display:grid;
  grid-template-columns:repeat(4,max-content);
  gap:26px;
}
.route-stages{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.route-stages span{font-weight:500}
.route-stages em{color:#8799ad;font-style:normal}
.route-stages .done{color:#e9f7ef}
.route-stages .active{color:var(--cyan);text-shadow:0 0 12px rgba(24,199,255,.34)}
.route-stages .waiting{color:#c3cad5}
.status-chip strong{color:var(--green)}
.pulse-chip{place-items:center;padding:0}
.pulse-chip svg{width:64px;height:24px}
.pulse-chip path{fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 7px rgba(22,240,140,.5))}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.route-btn{
  min-height:52px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset;
}
.route-btn span{font-weight:500}
.route-btn.pause{border-color:rgba(255,173,24,.8);background:rgba(255,173,24,.13);color:#ffca69;box-shadow:0 0 24px rgba(255,173,24,.14)}
.route-btn.stop{border-color:rgba(255,81,72,.8);background:rgba(255,81,72,.1);color:#ff9c95}
.route-btn.stop span,.route-btn.resume span{
  width:15px;
  height:15px;
  display:inline-block;
  background:currentColor;
}
.route-btn.resume{border-color:rgba(52,140,255,.8);background:rgba(52,140,255,.11);color:#76adff}
.route-btn.resume span{clip-path:polygon(0 0,100% 50%,0 100%)}
.route-btn.new-run{border-color:rgba(22,240,140,.72);background:rgba(22,240,140,.12);color:#a9ffd4}
.route-btn.utility{border-color:rgba(185,205,231,.35);background:rgba(255,255,255,.035);color:#e7eef8}
.route-btn.more{min-width:126px;border-color:rgba(185,205,231,.3);background:rgba(255,255,255,.035);color:#d8e4f4}
.more-menu{position:relative}
.more-popover{
  position:absolute;
  top:62px;
  right:0;
  z-index:30;
  width:186px;
  padding:10px;
  border:1px solid rgba(255,81,72,.34);
  border-radius:8px;
  background:rgba(8,15,24,.98);
  box-shadow:0 22px 48px rgba(0,0,0,.42);
}
.more-popover[hidden]{display:none}
.more-popover button{
  width:100%;
  min-height:40px;
  display:flex;
  align-items:center;
  gap:9px;
  border:0;
  background:transparent;
  color:#ff7d72;
  text-align:left;
}
.more-popover b{font-size:20px}
.run-console{
  display:grid;
  grid-template-columns:360px 430px 330px 310px 370px;
  gap:18px;
  align-items:stretch;
  min-height:318px;
  padding:16px 22px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(12,28,42,.84),rgba(7,16,26,.82));
  box-shadow:0 18px 60px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.04);
}
.run-console>div,.run-console>aside,.run-console>article{min-width:0}
.run-console h2,.panel h2{
  color:#e5f1ff;
  font-size:15px;
  font-weight:650;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.console-file,.route-builder,.expected-output{
  padding-right:18px;
  border-right:1px solid rgba(199,221,251,.12);
}
.console-file{
  display:grid;
  grid-template-rows:auto auto 1fr;
  align-content:start;
}
.console-file .start-agent{
  margin-top:26px;
  padding-right:0;
  border-right:0;
}
.source-card{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:13px;
  align-items:center;
  min-height:96px;
  margin-top:24px;
  padding:14px;
  border:1px solid rgba(80,144,190,.42);
  border-radius:10px;
  background:rgba(12,27,40,.72);
}
.doc-icon{
  width:44px;
  height:54px;
  border-radius:6px;
  background:linear-gradient(180deg,#d7e1ed,#9fb1c3);
  position:relative;
}
.doc-icon:before,.doc-icon:after{content:"";position:absolute;background:#647488;border-radius:1px}
.doc-icon:before{width:18px;height:2px;left:11px;top:25px;box-shadow:0 7px 0 #647488,0 14px 0 #647488}
.doc-icon:after{right:0;top:0;border-top:12px solid #78889b;border-left:12px solid transparent;background:transparent}
.source-copy strong{display:block;font-size:18px;font-weight:650}
.source-copy span{display:block;margin-top:4px;color:#c3d1e2;font-size:16px}
.source-copy span i{display:inline-block;width:4px;height:4px;margin:0 8px;border-radius:50%;background:#758da4;vertical-align:middle}
.source-copy small{display:flex;align-items:center;gap:7px;margin-top:8px;color:var(--green);font-size:15px}
.source-copy small b{width:15px;height:15px;border-radius:50%;border:1px solid var(--green);position:relative}
.source-copy small b:after{content:"";position:absolute;left:4px;top:2px;width:5px;height:8px;border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg)}
.source-card button{align-self:end;min-height:34px;padding:0 16px;color:#eef6ff}
.start-agent-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:16px}
.start-agent-card{
  min-height:90px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:8px;
  border:1px solid var(--line-strong);
  border-radius:8px;
  background:rgba(255,255,255,.035);
}
.start-agent-card.selected{border-color:var(--green);background:rgba(22,240,140,.14);box-shadow:0 0 28px rgba(22,240,140,.15)}
.start-agent-card img{width:50px;height:50px;border-radius:50%;border:2px solid var(--accent)}
.start-agent-card strong{font-size:17px;font-weight:600}
.route-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:21px}
.route-options button{min-height:36px;padding:0 17px;color:#e7eef8;font-size:15px}
.route-options button:first-child{grid-column:1/-1}
.route-options .selected{border-color:var(--green);background:rgba(22,240,140,.13);color:#65ffb5}
.expected-output ul{display:grid;gap:10px;list-style:none;margin:24px 0 12px;padding:0}
.expected-output li{position:relative;padding-left:24px;color:#d6e6f6;font-size:16px}
.expected-output li:before{
  content:"";
  position:absolute;
  left:0;
  top:1px;
  width:16px;
  height:16px;
  border-radius:50%;
  border:1px solid var(--green);
}
.expected-output li:after{
  content:"";
  position:absolute;
  left:5px;
  top:4px;
  width:5px;
  height:8px;
  border:solid var(--green);
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.expected-output span{color:#e9f3ff;font-size:16px}
.start-route-card{
  position:relative;
  min-height:152px;
  padding:23px 24px;
  border:1px solid rgba(22,240,140,.55);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(22,240,140,.16),rgba(7,19,28,.72));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 0 34px rgba(22,240,140,.12);
}
.start-route-card h2{font-size:23px;color:#e8fff6}
.start-route-card p{margin-top:16px;color:#d9efe5;font-size:14px}
.start-route-card strong{display:block;margin-top:6px;color:#aaffd3;font-size:14px}
.route-control-card h2{font-size:20px}
.route-control-card .route-state{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:16px;
  color:#e8fff6;
  font-size:16px;
}
.route-control-card .route-state i{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 14px rgba(22,240,140,.5);
}
.route-control-card small{
  display:block;
  margin-top:10px;
  min-height:22px;
  color:#bed2c8;
  font-size:15px;
  line-height:1.35;
}
.route-control-buttons{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:18px;
  min-width:0;
}
.route-control-buttons.stacked{
  grid-template-columns:1fr;
}
.route-control-buttons .route-btn{
  width:100%;
  min-width:0;
  min-height:42px;
  padding:0 12px;
  gap:8px;
  font-size:13px;
}
.route-control-buttons .route-btn span{
  flex:0 0 auto;
}
.route-control-card .more-menu{margin-top:12px}
.route-control-card .wide-more{
  width:100%;
  min-height:36px;
  justify-content:space-between;
}
.route-control-card .more-popover{top:42px;width:100%}
.play-button{
  position:absolute;
  top:32px;
  right:22px;
  width:60px;
  height:60px;
  border:3px solid var(--green);
  border-radius:50%;
  background:rgba(22,240,140,.08);
  box-shadow:0 0 34px rgba(22,240,140,.2);
}
.play-button:before{
  content:"";
  position:absolute;
  left:24px;
  top:17px;
  width:0;
  height:0;
  border-top:14px solid transparent;
  border-bottom:14px solid transparent;
  border-left:19px solid var(--green);
}
.save-template{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:24px;
  padding-top:15px;
  border-top:1px solid rgba(199,221,251,.12);
  color:#dffbed;
  font-size:13px;
  font-weight:600;
}
.save-template:before{
  content:"";
  width:14px;
  height:18px;
  border:2px solid var(--green);
  border-radius:2px;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%);
}
.agent-flow{position:relative;margin-top:18px}
.agent-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:26px;
}
.agent-card{
  --accent:var(--green);
  position:relative;
  min-height:516px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:15px 14px 14px;
  border:1px solid color-mix(in srgb,var(--accent) 70%,transparent);
  border-radius:14px;
  background:
    radial-gradient(circle at 10% 5%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 38%),
    linear-gradient(180deg,rgba(12,28,40,.92),rgba(7,15,24,.96));
  box-shadow:0 22px 68px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.045);
}
.agent-card.nora{--accent:var(--green)}
.agent-card.moxie{--accent:var(--cyan);box-shadow:0 30px 85px rgba(0,0,0,.38),0 0 42px rgba(24,199,255,.2)}
.agent-card.rex{--accent:var(--amber)}
.agent-card.willa{--accent:var(--violet)}
.agent-card.waiting{filter:saturate(.88);background:radial-gradient(circle at 10% 5%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 40%),linear-gradient(180deg,rgba(12,24,36,.86),rgba(7,14,23,.96))}
.agent-head{
  display:grid;
  grid-template-columns:66px minmax(0,1fr) auto;
  gap:13px;
  align-items:center;
  min-height:78px;
}
.avatar{
  width:62px;
  height:62px;
  padding:3px;
  border:2px solid var(--accent);
  border-radius:50%;
  box-shadow:0 0 34px color-mix(in srgb,var(--accent) 32%,transparent);
}
.avatar img{width:100%;height:100%;display:block;border-radius:50%;object-fit:cover}
.agent-title h3{
  color:#f8fbff;
  font-size:24px;
  font-weight:700;
  line-height:1;
  text-transform:uppercase;
}
.agent-title .role{margin-top:6px;color:color-mix(in srgb,var(--accent) 80%,white 8%);font-size:14px;font-weight:650}
.agent-title .description{margin-top:6px;color:#c7d5e6;font-size:13px;line-height:1.38}
.agent-status{
  align-self:start;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:36px;
  padding:0 14px;
  border:1px solid var(--accent);
  border-radius:8px;
  background:rgba(0,0,0,.18);
  color:color-mix(in srgb,var(--accent) 82%,white 10%);
  font-size:14px;
  font-weight:650;
  text-transform:uppercase;
}
.agent-section{
  margin-top:9px;
  padding:9px 0;
  border-top:1px solid rgba(199,221,251,.14);
}
.agent-section:first-of-type{border-top:0}
.section-label{
  display:block;
  margin-bottom:8px;
  color:#8fa3ba;
  font-size:12px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.metric-box{
  display:grid;
  grid-template-columns:1fr 52px 1fr;
  gap:14px;
  align-items:center;
  min-height:82px;
  padding:13px;
  border:1px solid rgba(199,221,251,.13);
  border-radius:9px;
  background:rgba(0,0,0,.15);
}
.metric-box .label{display:block;color:#8fa3ba;font-size:12px;text-transform:uppercase}
.metric-box strong{display:block;margin-top:5px;color:var(--accent);font-size:21px;font-family:JetBrains Mono,monospace}
.metric-box small{color:#c6d5e5;font-size:13px}
.metric-check{
  width:34px;
  height:34px;
  border:3px solid var(--green);
  border-radius:50%;
  position:relative;
}
.metric-check:after{
  content:"";
  position:absolute;
  left:10px;
  top:5px;
  width:8px;
  height:16px;
  border:solid var(--green);
  border-width:0 4px 4px 0;
  transform:rotate(45deg);
}
.task-box{
  min-height:98px;
  padding:13px;
  border:1px solid rgba(199,221,251,.13);
  border-radius:9px;
  background:rgba(0,0,0,.15);
}
.task-top{display:flex;align-items:start;justify-content:space-between;gap:16px}
.task-top strong{font-size:15px}
.task-top strong,.waiting-box strong,.handoff-box strong,.checkpoint-list strong{font-weight:600}
.task-top b{font-size:19px}
.progress-bar{height:6px;margin-top:12px;border-radius:999px;background:rgba(211,229,255,.14);overflow:hidden}
.progress-bar span{display:block;width:62%;height:100%;background:linear-gradient(90deg,var(--cyan),#6aa7ff);border-radius:inherit}
.mini-metrics{display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px}
.mini-metrics div{padding-left:14px;border-left:1px solid rgba(199,221,251,.13)}
.mini-metrics div:first-child{padding-left:0;border-left:0}
.mini-metrics span{display:block;color:#8fa3ba;font-size:12px;text-transform:uppercase}
.mini-metrics strong{display:block;margin-top:5px;font-size:15px;font-family:JetBrains Mono,monospace}
.waiting-box{
  min-height:94px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 28px;
  gap:16px;
  align-items:center;
  padding:14px;
  border:1px solid rgba(199,221,251,.12);
  border-radius:9px;
  background:rgba(0,0,0,.16);
}
.waiting-box strong{display:block;margin-top:6px;font-size:15px}
.waiting-box small{display:block;margin-top:5px;color:#c4d2e2;font-size:14px}
.hourglass{width:20px;height:24px;border-top:2px solid #8fa3ba;border-bottom:2px solid #8fa3ba;position:relative}
.hourglass:before,.hourglass:after{content:"";position:absolute;left:8px;width:5px;height:10px;border-left:2px solid #8fa3ba;border-right:2px solid #8fa3ba}
.hourglass:before{top:1px;transform:skewX(-20deg)}.hourglass:after{bottom:1px;transform:skewX(20deg)}
.checkpoint-list,.activity-list{display:grid;gap:6px}
.checkpoint-list .row,.activity-list .row{
  display:grid;
  grid-template-columns:18px minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  color:#d9e8f6;
  font-size:12px;
}
.checkpoint-list .row{grid-template-columns:18px minmax(0,1fr) auto auto}
.checkpoint-list .row i,.activity-list .row i{
  width:14px;
  height:14px;
  border-radius:50%;
  border:1px solid var(--accent);
  position:relative;
}
.checkpoint-list .row.done i:after,.activity-list .row.done i:after{
  content:"";
  position:absolute;
  left:4px;
  top:2px;
  width:4px;
  height:7px;
  border:solid var(--accent);
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.checkpoint-list .row.current i:after{
  content:"";
  position:absolute;
  left:4px;
  top:4px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px var(--accent);
}
.checkpoint-list .row time,.activity-list .row time,.checkpoint-list .row em,.activity-list .row em{color:#9aaec3;font-style:normal}
.resume-safe{color:#b7fbe1}
.handoff-box{
  display:grid;
  grid-template-columns:minmax(0,1fr) 26px;
  align-items:center;
  min-height:56px;
  margin-top:auto;
  padding:11px 13px;
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);
  border-radius:9px;
  background:rgba(0,0,0,.13);
}
.handoff-box span{display:block;color:#98aabd;font-size:12px;text-transform:uppercase}
.handoff-box strong{display:block;margin-top:4px;color:#f3f8ff;font-size:14px;font-weight:400;line-height:1.22}
.handoff-arrow{color:var(--accent);font-size:31px;font-weight:500;line-height:1}
.agent-actions{
  display:grid;
  gap:8px;
  margin-top:11px;
}
.agent-actions.four{grid-template-columns:1.35fr 1fr 1fr 38px}
.agent-actions.five{grid-template-columns:.86fr .8fr 1fr 1fr 38px}
.agent-actions button{
  min-height:34px;
  min-width:0;
  padding:0 10px;
  color:#edf6ff;
  border-color:rgba(189,215,248,.23);
  background:rgba(255,255,255,.035);
  font-weight:400;
  overflow:hidden;
  text-overflow:ellipsis;
}
.agent-actions .primary{border-color:var(--accent);background:rgba(0,0,0,.08);color:#f6fbff}
.agent-actions .danger-action{border-color:rgba(255,81,72,.62);color:#ff877e}
.agent-actions .kebab{font-size:20px;padding:0}
.flow-arrow{
  position:absolute;
  top:50%;
  z-index:10;
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  padding:0;
  border:2px solid var(--accent);
  border-radius:50%;
  background:rgba(8,18,28,.96);
  color:var(--accent);
  font-size:27px;
  transform:translate(-50%,-50%);
  box-shadow:0 0 22px color-mix(in srgb,var(--accent) 30%,transparent);
}
.flow-arrow-1{--accent:var(--cyan);left:25%}
.flow-arrow-2{--accent:var(--cyan);left:50%}
.flow-arrow-3{--accent:var(--violet);left:75%}
.bottom-row{
  display:grid;
  grid-template-columns:.94fr 2.16fr;
  gap:12px;
  margin-top:16px;
  align-items:stretch;
}
.panel{
  min-height:282px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:13px;
  background:linear-gradient(180deg,rgba(12,28,42,.86),rgba(7,16,26,.9));
  box-shadow:0 18px 58px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.04);
}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.panel-head button{border:0;background:transparent;color:#8eb7ff;padding:0;font-size:14px;font-weight:400}
.run-log{display:grid;gap:12px;max-height:226px;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(132,154,183,.24) transparent}
.log-panel.expanded .run-log{max-height:340px}
.artifacts-panel.expanded .artifact-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.artifacts-panel.expanded .artifact-card{min-height:236px}
.run-log::-webkit-scrollbar{width:6px}.run-log::-webkit-scrollbar-track{background:transparent}.run-log::-webkit-scrollbar-thumb{background:rgba(132,154,183,.24);border-radius:999px}
.log-line{
  display:grid;
  grid-template-columns:92px 25px minmax(0,1fr);
  gap:13px;
  align-items:center;
  color:#d3e4f5;
  font-size:14px;
}
.log-line time{color:#a6c8f1;font-family:JetBrains Mono,monospace;font-size:13px}
.log-line i{
  width:25px;
  height:25px;
  border:1px solid var(--accent);
  border-radius:50%;
  position:relative;
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 32%,transparent);
}
.log-line.play i:before,.log-line.info i:before,.log-line.warn i:before,.log-line.check i:before,.log-line.arrow i:before{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  color:var(--accent);
  font-size:12px;
  font-weight:700;
}
.log-line.play i:before{content:">"}
.log-line.info i:before{content:"i"}
.log-line.warn i:before{content:"!"}
.log-line.check i:before{content:"✓"}
.log-line.arrow i:before{content:">"}
.artifact-grid{display:grid;grid-template-columns:repeat(5,minmax(132px,1fr));gap:14px}
.artifact-card{
  --accent:var(--green);
  min-height:226px;
  display:flex;
  flex-direction:column;
  padding:14px;
  border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);
  border-radius:9px;
  background:
    radial-gradient(circle at 90% 0,color-mix(in srgb,var(--accent) 20%,transparent),transparent 34%),
    linear-gradient(180deg,color-mix(in srgb,var(--accent) 9%,rgba(9,20,31,.9)),rgba(7,15,24,.92));
}
.artifact-icon{
  width:42px;
  height:46px;
  display:grid;
  place-items:center;
  color:var(--accent);
  border:2px solid var(--accent);
  border-radius:5px;
  font-size:13px;
  font-weight:650;
}
.artifact-card strong{
  margin-top:12px;
  overflow-wrap:break-word;
  word-break:normal;
  font-size:13.5px;
  font-weight:400;
  line-height:1.28;
}
.artifact-card span{margin-top:8px;color:#b8c9db;font-size:13px;overflow-wrap:break-word;word-break:normal}
.artifact-card small{margin-top:5px;color:#d6e5f4;font-size:13px;line-height:1.32;overflow-wrap:break-word;word-break:normal}
.artifact-status{margin-top:12px;color:var(--accent);font-size:14px;font-weight:400}
.artifact-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:13px;border-top:1px solid rgba(199,221,251,.12)}
.artifact-actions button{min-height:31px;padding:0 7px;color:#dcecff;font-size:11px;font-weight:400}
.artifact-card.pending{filter:saturate(.75)}
.artifact-card.pending .artifact-actions button{opacity:.45}
.summary-body{display:grid;grid-template-columns:minmax(0,1fr) 136px;gap:10px;align-items:center;margin-top:24px}
.summary-list{display:grid;gap:11px;margin:0}
.summary-list div{display:grid;grid-template-columns:112px minmax(0,1fr);gap:9px}
.summary-list dt{color:#9bacbf;font-size:12px}
.summary-list dd{margin:0;color:#ddeafa;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-text{display:flex;align-items:center;gap:8px;color:var(--green)!important}
.live-text i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(22,240,140,.6)}
.progress-ring{position:relative;display:grid;justify-items:center;gap:9px;text-align:center}
.progress-ring svg{width:138px;height:138px;transform:rotate(-78deg)}
.progress-ring circle{fill:none;stroke-width:8}
.ring-track{stroke:rgba(211,229,255,.18)}
.ring-value{stroke:var(--green);stroke-linecap:round;stroke-dasharray:20 100}
.progress-ring div{position:absolute;top:44px;left:0;right:0}
.progress-ring strong{display:block;font-size:27px}
.progress-ring span,.progress-ring small{color:#a7b8ca;font-size:11px;text-transform:uppercase}
.health-body{
  position:relative;
  min-height:228px;
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:center;
  margin-top:22px;
}
.health-list{display:grid;gap:12px;margin:0}
.health-list div{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px}
.health-list dt{color:#9bacbf;font-size:13.5px}
.health-list dd{margin:0;color:#ddeafa;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.warn-dot,.ok-dot{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;vertical-align:middle}
.warn-dot{background:var(--amber);box-shadow:0 0 9px rgba(255,173,24,.45)}
.ok-dot{background:var(--green);box-shadow:0 0 9px rgba(22,240,140,.45)}
.health-note{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:2px;
  padding:12px 13px;
  border:1px solid rgba(166,199,236,.17);
  border-radius:8px;
  background:rgba(255,255,255,.025);
  color:#a8bbce;
  font-size:12px;
}
.health-note strong{display:block;margin-bottom:4px;color:var(--green);font-size:15px;font-weight:500;text-transform:none;letter-spacing:0}
.health-note span{display:block;color:#d6e5f4;font-size:13px;line-height:1.35}
.health-checkmark{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border:1px solid rgba(22,240,140,.72);
  border-radius:8px;
  position:relative;
  background:rgba(22,240,140,.06);
}
.health-checkmark:after{
  content:"";
  position:absolute;
  left:10px;
  top:5px;
  width:8px;
  height:15px;
  border:solid #8effc8;
  border-width:0 3px 3px 0;
  transform:rotate(45deg);
}
.health-body button{
  min-height:35px;
  padding:0 12px;
  font-weight:400;
}
.toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:60;
  max-width:360px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(9,19,30,.96);
  opacity:0;
  transform:translateY(8px);
  transition:.18s;
}
.toast.show{opacity:1;transform:translateY(0)}
.manual-verification-modal{
  position:fixed;
  inset:0;
  z-index:150;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(2,8,14,.78);
  backdrop-filter:blur(10px);
}
.manual-verification-modal[hidden]{display:none}
.manual-verification-card{
  width:min(540px,calc(100vw - 36px));
  padding:28px;
  border:1px solid rgba(255,190,49,.48);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(15,35,49,.99),rgba(7,18,29,.99));
  box-shadow:0 30px 100px rgba(0,0,0,.65),0 0 45px rgba(255,174,0,.09);
}
.manual-verification-pulse{display:grid;place-items:center;width:54px;height:54px;margin-bottom:15px;border-radius:50%;background:rgba(255,181,33,.12)}
.manual-verification-pulse span{width:18px;height:18px;border-radius:50%;background:#ffb521;box-shadow:0 0 0 0 rgba(255,181,33,.5);animation:verificationPulse 1.5s infinite}
@keyframes verificationPulse{70%{box-shadow:0 0 0 18px rgba(255,181,33,0)}100%{box-shadow:0 0 0 0 rgba(255,181,33,0)}}
.manual-verification-kicker{margin:0 0 5px;color:#ffbf3d;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.manual-verification-card h2{margin:0 0 10px;color:#f5f9ff;font-size:24px}
.manual-verification-card>p:not(.manual-verification-kicker){margin:0 0 18px;color:#b8c8d8;line-height:1.5}
.manual-verification-card dl{display:grid;gap:8px;margin:0 0 17px;padding:13px;border:1px solid rgba(166,199,236,.14);border-radius:10px;background:rgba(2,9,16,.32)}
.manual-verification-card dl div{display:grid;grid-template-columns:125px 1fr;gap:12px}
.manual-verification-card dt{color:#8398ac;font-size:12px}
.manual-verification-card dd{margin:0;color:#edf6ff;font-size:13px;overflow-wrap:anywhere}
.manual-verification-card code{color:#57f0bd;font-size:14px;user-select:all}
.manual-verification-card ol{margin:0 0 19px;padding-left:20px;color:#c8d5e2;font-size:13px;line-height:1.65}
.manual-verification-open{width:100%;min-height:46px;border-color:#ffb521;background:linear-gradient(180deg,#d98a00,#ad6600);color:#fff;font-weight:700}
.manual-verification-card small{display:block;margin-top:12px;color:#8297aa;line-height:1.45}
.action-modal{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(2,8,14,.58);
  backdrop-filter:blur(8px);
}
.action-modal[hidden]{display:none}
.action-modal-card{
  position:relative;
  width:min(460px,calc(100vw - 48px));
  padding:22px;
  border:1px solid rgba(166,199,236,.24);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(12,28,42,.98),rgba(7,16,26,.98));
  box-shadow:0 30px 90px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.05);
}
.modal-close{
  position:absolute;
  top:12px;
  right:12px;
  width:30px;
  height:30px;
  padding:0;
  font-size:18px;
}
.modal-content h2{
  margin:0 38px 16px 0;
  color:#edf6ff;
  font-size:16px;
  font-weight:600;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.modal-rows{
  display:grid;
  gap:10px;
  margin-bottom:18px;
}
.modal-row{
  display:grid;
  grid-template-columns:128px minmax(0,1fr);
  gap:14px;
  padding-bottom:9px;
  border-bottom:1px solid rgba(166,199,236,.1);
}
.modal-row span{
  color:#93a6ba;
  font-size:12px;
}
.modal-row strong{
  color:#e6f2ff;
  font-size:13px;
  font-weight:400;
  overflow-wrap:break-word;
}
.modal-content>button{
  min-height:34px;
  padding:0 14px;
}
@media(max-width:1720px){
  .dashboard-shell{
    max-width:none;
    padding:0 16px 18px;
  }
  .command-bar{
    grid-template-columns:280px minmax(0,1fr) auto;
    gap:14px;
  }
  .metric-strip{
    grid-template-columns:68px minmax(160px,1fr) 118px 74px 84px 64px;
  }
  .metric-chip{padding:10px 9px}
  .metric-chip span{font-size:11px}
  .metric-chip strong{font-size:18px}
  .metric-chip small{font-size:13px}
  .metric-chip.wide small{gap:12px}
  .top-actions{gap:8px}
  .top-actions .route-btn{min-height:44px;padding:0 13px;font-size:13px}
  .run-console{
    grid-template-columns:240px 280px minmax(215px,1fr) 200px 285px;
    gap:12px;
    min-height:286px;
    padding:14px;
  }
  .source-card{
    grid-template-columns:48px minmax(0,1fr);
  }
  .source-card button{
    grid-column:2;
    justify-self:start;
    align-self:start;
    margin-top:4px;
  }
  .route-options button{padding:0 12px;font-size:14px}
  .route-options button:last-child{grid-column:1/-1}
  .expected-output li{font-size:15px}
  .start-route-card{padding:18px}
  .agent-flow{margin-top:12px}
  .agent-card{padding:16px 14px}
  .agent-title h3{font-size:23px}
  .agent-title .description{font-size:14px}
  .checkpoint-list .row,.activity-list .row{font-size:13px}
  .handoff-box strong{font-size:15px}
  .agent-actions.four,.agent-actions.five{grid-template-columns:1fr 1fr}
  .agent-actions button{font-size:13px;min-height:33px}
  .agent-actions .kebab{font-size:18px}
  .panel{min-height:260px;padding:16px}
  .artifact-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
  .artifact-card{padding:12px}
  .artifact-actions button{font-size:12px}
}
@media(max-width:1280px){
  .command-bar,.run-console,.bottom-row{grid-template-columns:1fr}
  .command-bar,.run-console{grid-template-areas:none}
  .command-bar>* ,.run-console>*{grid-area:auto!important}
  .metric-strip{grid-template-columns:repeat(2,1fr)}
  .metric-chip:nth-child(2){grid-column:span 2}
  .top-actions{justify-content:flex-start;flex-wrap:wrap}
  .run-console>div,.run-console>aside{border-right:0;padding-right:0}
  .agent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .flow-arrow{display:none}
  .artifact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .dashboard-shell{padding:0 14px 22px}
  .metric-strip,.agent-grid,.artifact-grid,.summary-body,.start-agent-grid{grid-template-columns:1fr}
  .metric-chip:nth-child(2){grid-column:auto}
  .brand-block h1{font-size:21px}
  .agent-actions.four,.agent-actions.five{grid-template-columns:1fr 1fr}
}

/* Readability and balance pass */
button{font-size:13px}
.brand-block h1{font-size:30px;letter-spacing:.03em}
.brand-block p{font-size:13px}
.metric-chip:nth-child(5){display:none}
.metric-strip{
  grid-template-columns:118px minmax(320px,1fr) 168px 124px 112px;
  min-height:70px;
}
.metric-chip{padding:11px 16px}
.metric-chip span{font-size:10px}
.metric-chip strong{font-size:17px}
.metric-chip small{font-size:12px}
.route-stages{overflow:hidden;white-space:nowrap}
.route-stages span{flex:0 0 auto;font-size:11px;overflow:visible;text-overflow:clip}
.route-stages em{font-size:13px;flex:0 0 auto}
.run-console h2,.panel h2{font-size:15px}
.run-console{
  grid-template-columns:minmax(250px,.9fr) minmax(310px,1.1fr) minmax(260px,.95fr) minmax(210px,.78fr) minmax(280px,1fr);
  min-height:268px;
  gap:16px;
}
.source-card{min-height:88px;margin-top:18px}
.source-copy strong{font-size:16px}
.source-copy span{font-size:13px}
.source-copy small{font-size:12px}
.start-agent-grid{margin-top:14px}
.start-agent-card{min-height:74px;gap:6px}
.start-agent-card img{width:42px;height:42px}
.start-agent-card strong{font-size:13px}
.route-options{gap:8px}
.route-options button{min-height:33px;padding:0 12px;font-size:12px}
.route-options button:last-child{grid-column:1/-1}
.expected-output ul{gap:8px;margin:18px 0 10px}
.expected-output li{font-size:13.5px;line-height:1.25}
.expected-output span{display:flex;align-items:center;gap:10px;font-size:13px}
.expected-output span button{min-height:0;padding:0;border:0;background:transparent;color:#8eb7ff;font-size:12px}
.start-route-card{padding:18px;min-height:230px}
.start-route-card h2,.route-control-card h2{font-size:20px}
.route-control-card .route-state{font-size:14px;margin-top:14px}
.route-control-card small{font-size:13px;line-height:1.35}
.route-control-buttons .route-btn{min-height:38px;font-size:12px}
.agent-grid{gap:22px}
.agent-card{
  min-height:430px;
  padding:16px 14px 14px;
  border-width:1px;
}
.agent-head{
  grid-template-columns:56px minmax(0,1fr) auto;
  gap:12px;
  min-height:66px;
}
.avatar{width:54px;height:54px}
.agent-title h3{font-size:23px}
.agent-title .role{font-size:13px;margin-top:4px}
.agent-title .description{font-size:13px;line-height:1.35;max-width:24ch}
.agent-status{min-height:32px;padding:0 12px;font-size:12px}
.agent-rows{
  display:grid;
  gap:8px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(199,221,251,.12);
}
.agent-row{
  display:grid;
  grid-template-columns:82px minmax(0,1fr) auto;
  gap:10px;
  align-items:start;
  min-width:0;
  color:#d9e8f6;
}
.agent-row span{
  color:#8fa3ba;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.agent-row strong{
  min-width:0;
  color:#f1f7ff;
  font-size:13px;
  font-weight:500;
  line-height:1.28;
  overflow-wrap:anywhere;
}
.agent-row em{
  color:#98aabd;
  font-size:12px;
  font-style:normal;
  line-height:1.25;
}
.handoff-box{
  min-height:52px;
  padding:10px 12px;
  border-color:color-mix(in srgb,var(--accent) 26%,transparent);
  background:rgba(0,0,0,.08);
}
.handoff-box span{font-size:11px}
.handoff-box strong{font-size:13px;line-height:1.25}
.handoff-arrow{font-size:25px}
.agent-actions.compact{
  grid-template-columns:1fr 1fr 36px;
  gap:8px;
}
.agent-actions button{min-height:32px;padding:0 10px;font-size:12px}
.flow-arrow{
  width:32px;
  height:32px;
  border-width:1px;
  font-size:20px;
  box-shadow:0 0 14px color-mix(in srgb,var(--accent) 24%,transparent);
}
.bottom-row{grid-template-columns:.82fr 2fr;gap:14px}
.panel{min-height:252px;padding:16px}
.log-line{grid-template-columns:84px 22px minmax(0,1fr);gap:10px;font-size:13px}
.log-line time{font-size:12px}
.log-line i{width:22px;height:22px}
.artifact-grid{grid-template-columns:repeat(5,minmax(150px,1fr));gap:14px}
.artifact-card{min-height:220px;padding:15px}
.artifact-card strong{font-size:13px;font-weight:500}
.artifact-card span,.artifact-card small{font-size:12px}
.artifact-status{font-size:13px}
.artifact-actions{gap:8px}
.artifact-actions button{min-height:30px;font-size:12px;padding:0 8px}
.artifact-card.pending{opacity:.74;filter:saturate(.62)}
.health-list dt{font-size:12px}
.health-list dd{font-size:13px}
.health-note strong{font-size:13px}
.health-note span{font-size:12px}
@media(max-width:1720px){
  .command-bar{grid-template-columns:280px minmax(580px,1fr) auto;gap:14px}
  .metric-strip{grid-template-columns:88px minmax(220px,1fr) 132px 88px 78px}
  .metric-chip{padding:10px 10px}
  .metric-chip strong{font-size:16px}
  .metric-chip small{font-size:12px}
  .top-actions .route-btn{font-size:12px}
  .run-console{
    grid-template-columns:minmax(240px,.9fr) minmax(290px,1.08fr) minmax(250px,.94fr) minmax(200px,.76fr) minmax(278px,1fr);
    gap:12px;
    min-height:270px;
  }
  .agent-card{min-height:418px}
  .agent-title h3{font-size:22px}
  .agent-title .description{font-size:12.5px}
  .agent-row{grid-template-columns:76px minmax(0,1fr)}
  .agent-row em{grid-column:2}
  .artifact-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:1280px){
  .metric-chip:nth-child(5){display:grid}
}

/* Final compact readable layout pass */
.brand-mark{width:52px;height:52px;font-size:16px}
.brand-block{gap:14px}
.brand-block h1{font-size:31px;line-height:.98}
.brand-block p{font-size:13.5px;line-height:1.25}
.command-bar{min-height:88px;padding:14px 0}
.metric-strip{
  grid-template-columns:minmax(104px,.55fr) minmax(360px,1.8fr) minmax(150px,.85fr) minmax(112px,.6fr) minmax(102px,.55fr);
  min-height:66px;
}
.metric-chip{padding:10px 14px}
.metric-chip span{font-size:10px}
.metric-chip strong{font-size:17px}
.metric-chip small{font-size:12px}
.route-stages{gap:7px}
.route-stages span{font-size:12px}
.route-stages em{font-size:12px}
.top-actions{align-self:center}
.top-actions .route-btn{min-height:45px;padding:0 16px;font-size:12.5px}
.run-console{
  grid-template-columns:minmax(245px,.92fr) minmax(305px,1.12fr) minmax(250px,.9fr) minmax(210px,.76fr) minmax(280px,1fr);
  min-height:238px;
  gap:14px;
  padding:14px;
}
.run-console h2,.panel h2{font-size:15px}
.source-card{min-height:82px;margin-top:16px;padding:12px}
.doc-icon{width:38px;height:46px}
.source-copy strong{font-size:16px}
.source-copy span{font-size:13px;line-height:1.25}
.source-copy small{font-size:12px;margin-top:6px}
.source-card button{min-height:32px;font-size:12px}
.console-file .start-agent{margin-top:20px}
.start-agent-grid{gap:8px;margin-top:12px}
.start-agent-card{min-height:68px}
.start-agent-card img{width:38px;height:38px}
.start-agent-card strong{font-size:12.5px}
.route-options{margin-top:16px;gap:7px}
.route-options button{min-height:31px;font-size:12px;padding:0 10px}
.expected-output ul{margin:16px 0 8px;gap:7px}
.expected-output li{font-size:13px;line-height:1.2}
.expected-output li:before{top:0;width:14px;height:14px}
.expected-output li:after{left:5px;top:3px;width:4px;height:7px}
.expected-output span{font-size:12.5px}
.start-route-card{min-height:190px;padding:16px}
.start-route-card h2,.route-control-card h2{font-size:19px}
.route-control-card .route-state{font-size:13px;margin-top:12px}
.route-control-card small{font-size:12.5px;min-height:0;margin-top:8px}
.route-control-buttons{margin-top:14px}
.route-control-buttons .route-btn{min-height:36px;font-size:12px}
.route-control-card .wide-more{min-height:34px;font-size:12px}
.health-body{min-height:190px;margin-top:14px;gap:10px}
.health-list{gap:8px}
.health-list div{grid-template-columns:112px minmax(0,1fr)}
.health-list dt{font-size:12px}
.health-list dd{font-size:13px}
.health-note{padding:10px 11px}
.health-body button{min-height:33px;font-size:12px}
.agent-flow{margin-top:12px}
.agent-grid{gap:20px}
.agent-card{min-height:360px;padding:14px}
.agent-head{grid-template-columns:50px minmax(0,1fr) auto;gap:10px;min-height:60px}
.avatar{width:48px;height:48px}
.agent-title h3{font-size:22px}
.agent-title .role{font-size:12.5px}
.agent-title .description{font-size:13px;line-height:1.28;max-width:28ch}
.agent-status{min-height:30px;padding:0 10px;font-size:11.5px}
.agent-rows{gap:6px;margin-top:10px;padding-top:10px}
.agent-row{grid-template-columns:74px minmax(0,1fr);gap:8px}
.agent-row span{font-size:10.5px}
.agent-row strong{font-size:12.5px;line-height:1.22}
.agent-row em{grid-column:2;font-size:11.5px}
.handoff-box{min-height:46px;padding:8px 10px}
.handoff-box span{font-size:10.5px}
.handoff-box strong{font-size:12.5px;line-height:1.2}
.handoff-arrow{font-size:22px}
.agent-actions{margin-top:8px;gap:7px}
.agent-actions.compact{grid-template-columns:1fr 1fr 32px}
.agent-actions button{min-height:30px;font-size:12px;padding:0 8px}
.agent-actions .kebab{font-size:17px}
.flow-arrow{width:28px;height:28px;font-size:18px}
.bottom-row{grid-template-columns:.78fr 1.92fr;margin-top:12px}
.panel{min-height:235px;padding:15px}
.panel-head{margin-bottom:14px}
.run-log{max-height:190px}
.artifact-grid{grid-template-columns:repeat(5,minmax(145px,1fr));gap:13px}
.artifact-card{min-height:205px;padding:13px}
.artifact-card strong{font-size:12.5px}
.artifact-card span,.artifact-card small{font-size:12px}
.artifact-actions button{font-size:11.5px;min-height:29px}
@media(max-width:1720px){
  .command-bar{grid-template-columns:280px minmax(0,1fr) auto}
  .metric-strip{grid-template-columns:88px minmax(280px,1fr) 126px 86px 78px}
  .run-console{
    grid-template-columns:minmax(236px,.9fr) minmax(290px,1.1fr) minmax(240px,.9fr) minmax(198px,.74fr) minmax(274px,1fr);
    min-height:236px;
  }
  .agent-card{min-height:352px}
  .artifact-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:1280px){
  .metric-chip:nth-child(5){display:grid}
  .metric-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Final viewport-fit refinement */
.run-console{
  align-items:start;
  min-height:0;
  padding:12px 14px;
}
.console-file{
  grid-template-rows:auto auto auto;
}
.source-card{
  grid-template-columns:42px minmax(0,1fr);
  gap:10px;
  min-height:70px;
  margin-top:12px;
  padding:10px;
}
.doc-icon{width:34px;height:42px}
.source-card button{
  grid-column:2;
  justify-self:start;
  align-self:start;
  min-height:30px;
  margin-top:4px;
  padding:0 12px;
}
.source-copy strong{font-size:15px}
.source-copy span{font-size:12px;white-space:nowrap}
.source-copy small{font-size:12px;margin-top:5px}
.console-file .start-agent{margin-top:14px}
.start-agent-grid{margin-top:9px;gap:7px}
.start-agent-card{min-height:56px;gap:4px}
.start-agent-card img{width:32px;height:32px}
.start-agent-card strong{font-size:12px}
.route-options{margin-top:12px;gap:6px}
.route-options button{min-height:29px;font-size:12px}
.expected-output ul{margin-top:12px;gap:6px}
.expected-output li{font-size:13px}
.start-route-card{
  min-height:168px;
  padding:14px;
}
.route-control-card .route-state{margin-top:10px}
.route-control-card small{margin-top:7px}
.route-control-buttons{margin-top:11px}
.health-panel.panel{
  min-height:168px;
  padding:14px;
}
.health-body{
  min-height:0;
  margin-top:10px;
  gap:8px;
}
.health-list{gap:6px}
.health-note{padding:8px 10px}
.health-checkmark{width:26px;height:26px;flex-basis:26px}
.health-body button{min-height:31px}
.agent-card{
  min-height:322px;
  padding:12px 13px;
}
.agent-head{
  grid-template-columns:46px minmax(0,1fr) auto;
  min-height:54px;
}
.avatar{width:44px;height:44px}
.agent-title h3{font-size:21px}
.agent-title .role{font-size:12px}
.agent-title .description{
  font-size:12.5px;
  line-height:1.22;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.agent-status{min-height:28px;font-size:11px}
.agent-rows{
  margin-top:8px;
  padding-top:8px;
  gap:5px;
}
.agent-row strong{font-size:12px}
.agent-row em{font-size:11px}
.handoff-box{
  min-height:42px;
  padding:7px 9px;
}
.handoff-box strong{font-size:12px}
.agent-actions{margin-top:7px}
.agent-actions button{min-height:28px}
.bottom-row{margin-top:10px}
@media(max-width:1720px){
  .run-console{
    min-height:0;
    grid-template-columns:minmax(230px,.9fr) minmax(280px,1.1fr) minmax(235px,.9fr) minmax(190px,.72fr) minmax(268px,1fr);
  }
  .agent-card{min-height:318px}
}

/* Final micro-polish pass */
.command-bar{
  grid-template-columns:minmax(270px,330px) minmax(670px,1fr) auto;
  gap:18px;
}
.metric-strip{
  grid-template-columns:minmax(100px,.55fr) minmax(340px,1.65fr) minmax(148px,.85fr) minmax(110px,.62fr) minmax(96px,.55fr);
}
.metric-chip{padding:10px 15px}
.metric-chip strong{font-size:17px}
.route-stages{gap:8px}
.route-stages em{color:#7f91a6}
.metric-chip.wide small{
  grid-template-columns:repeat(4,minmax(0,max-content));
  gap:18px;
}
.top-actions{gap:10px}
.top-actions .route-btn{
  min-height:41px;
  padding:0 14px;
  gap:9px;
  border-radius:8px;
  font-size:13px;
}
.top-actions .route-btn.new-run{padding:0 16px}
.top-actions .route-btn.utility{padding:0 13px}

.source-card{
  grid-template-columns:42px minmax(0,1fr);
  column-gap:12px;
  padding-right:14px;
}
.source-copy span{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  color:#c7d6e6;
}
.source-copy span i{
  flex:0 0 4px;
  margin:0;
}
.source-copy small b{
  display:inline-grid;
  place-items:center;
  flex:0 0 15px;
  position:relative;
}
.source-copy small b:after{
  left:50%;
  top:50%;
  width:4px;
  height:7px;
  transform:translate(-50%,-58%) rotate(45deg);
}

.route-options{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
  gap:7px;
}
.route-options button{
  min-height:30px;
  border-color:rgba(185,205,231,.24);
  background:rgba(255,255,255,.028);
  color:#dbe8f7;
  font-size:12px;
  font-weight:500;
}
.route-options button:nth-child(1),
.route-options button:nth-child(2){
  grid-column:1/-1;
  min-height:34px;
  font-size:13px;
}
.route-options button:nth-child(2):not(.selected){
  border-color:rgba(22,240,140,.36);
  background:rgba(22,240,140,.055);
  color:#c9fbe5;
}
.route-options .selected{
  border-color:var(--green);
  background:linear-gradient(90deg,rgba(22,240,140,.2),rgba(22,240,140,.09));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 22px rgba(22,240,140,.12);
}

.route-control-buttons .route-btn{
  min-height:41px;
  padding:0 13px;
  font-size:13px;
}
.route-control-buttons .route-btn:only-child,
#startRouteBtn{
  width:auto;
  min-width:126px;
  justify-self:start;
}
.route-control-card .wide-more{
  min-height:34px;
  padding:0 13px;
}

.agent-flow::before{
  content:"";
  position:absolute;
  left:8px;
  right:8px;
  top:50%;
  height:1px;
  pointer-events:none;
  z-index:1;
  background:linear-gradient(90deg,transparent 0,rgba(139,168,203,.18) 18%,rgba(139,168,203,.22) 50%,rgba(139,168,203,.18) 82%,transparent 100%);
}
.agent-grid{
  position:relative;
  z-index:2;
}
.flow-arrow{
  z-index:3;
  width:27px;
  height:27px;
  border-width:1px;
  border-color:color-mix(in srgb,var(--accent) 58%,rgba(176,202,232,.3));
  background:rgba(7,15,24,.94);
  color:transparent;
  font-size:0;
  overflow:visible;
  box-shadow:0 0 0 4px rgba(5,11,19,.9),0 0 14px color-mix(in srgb,var(--accent) 20%,transparent);
}
.flow-arrow:after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:84px;
  height:1px;
  z-index:0;
  transform:translate(-50%,-50%);
  background:linear-gradient(90deg,transparent,rgba(145,174,210,.45),transparent);
}
.flow-arrow:before{
  content:">";
  position:relative;
  z-index:1;
  color:var(--accent);
  font-size:14px;
  font-weight:600;
  line-height:1;
}
.flow-arrow-1{left:25%}
.flow-arrow-2{left:50%}
.flow-arrow-3{left:75%}

.agent-card{padding-bottom:12px}
.agent-title .description{
  max-width:none;
  -webkit-line-clamp:unset;
  overflow:visible;
}
.agent-rows{gap:4px}
.agent-row{grid-template-columns:72px minmax(0,1fr)}
.handoff-box{
  min-height:39px;
  padding:6px 9px;
  border-radius:8px;
}
.handoff-box strong{line-height:1.18}
.handoff-arrow{font-size:19px}
.agent-actions.compact{
  grid-template-columns:minmax(76px,1fr) minmax(76px,1fr) 32px;
  align-items:center;
}
.agent-actions button{
  min-height:29px;
  border-radius:6px;
}

.log-line{
  grid-template-columns:86px 22px minmax(0,1fr);
  gap:11px;
  align-items:start;
  line-height:1.28;
}
.log-line time{padding-top:2px}
.log-line i{margin-top:0}
.artifact-grid{gap:14px}
.artifact-card{
  min-width:0;
  border-radius:8px;
}
.artifact-card.pending .artifact-actions button:disabled{
  opacity:.34;
  color:#8fa2b8;
}

@media(max-width:1720px){
  .command-bar{grid-template-columns:280px minmax(0,1fr) auto}
  .metric-strip{
    grid-template-columns:88px minmax(300px,1fr) minmax(132px,.72fr) 90px 82px;
  }
  .top-actions .route-btn{
    min-height:40px;
    padding:0 12px;
    font-size:12.5px;
  }
  .route-options button:nth-child(1),
  .route-options button:nth-child(2){
    min-height:32px;
    font-size:12.5px;
  }
}

/* Responsive polish pass */
.brand-block{
  display:grid;
  grid-template-columns:50px minmax(0,1fr);
  gap:13px;
  align-items:center;
}
.brand-mark{
  width:50px;
  height:50px;
  border-color:#1df8bf;
  color:#15f6bd;
  font-size:16px;
  box-shadow:0 0 22px rgba(22,240,140,.18);
}
.brand-block h1{
  white-space:nowrap;
  font-size:27px;
  line-height:1;
  letter-spacing:.025em;
}
.brand-block p{
  max-width:260px;
  margin-top:5px;
  font-size:12.5px;
  line-height:1.25;
}
.short-label{display:none}
.top-actions .route-btn{
  min-height:40px;
  padding:0 13px;
  gap:8px;
  font-size:13px;
}
.top-actions .route-btn.new-run{padding:0 15px}

.run-console{
  grid-template-columns:minmax(250px,.9fr) minmax(330px,1.1fr) minmax(210px,.66fr) minmax(250px,.88fr) minmax(286px,1fr);
  gap:14px;
}
.expected-output{
  padding-right:14px;
}
.expected-output ul{
  max-width:210px;
  margin-top:12px;
}
.expected-output li{
  white-space:nowrap;
}
.expected-output span{
  white-space:nowrap;
}
.start-route-card{
  min-width:0;
}
.route-control-card small{
  white-space:normal;
}
#startRouteBtn{
  min-width:132px;
}

.health-body{
  align-content:start;
}
.health-body>button[data-action="view-diagnostics"]{
  display:none;
}
.health-note{
  grid-template-columns:minmax(0,1fr) 32px;
  min-height:58px;
}
.health-checkmark{
  display:grid;
  place-items:center;
}
.health-checkmark:after{
  left:50%;
  top:50%;
  transform:translate(-50%,-60%) rotate(45deg);
}

.route-control-card .more-menu{
  z-index:40;
}
.route-actions-popover,
.route-control-card .route-actions-popover{
  top:auto;
  bottom:calc(100% + 8px);
  right:0;
  width:270px;
  padding:10px;
  border-color:rgba(175,204,238,.28);
  background:linear-gradient(180deg,rgba(10,20,31,.98),rgba(7,13,22,.99));
  box-shadow:0 20px 52px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.035) inset;
}
.popover-group{
  display:grid;
  gap:4px;
  padding:6px 0;
}
.popover-group:first-child{padding-top:0}
.popover-group+.popover-group{
  border-top:1px solid rgba(199,221,251,.11);
}
.popover-group>span{
  padding:4px 8px 3px;
  color:#8294aa;
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.route-actions-popover button,
.route-control-card .route-actions-popover button{
  min-height:34px;
  justify-content:flex-start;
  gap:8px;
  padding:0 9px;
  border:1px solid transparent;
  border-radius:6px;
  color:#dce8f7;
  font-size:12.5px;
  background:transparent;
}
.route-actions-popover button:hover{
  border-color:rgba(142,183,255,.25);
  background:rgba(142,183,255,.07);
}
.route-actions-popover .positive-action{color:#a9ffd4}
.route-actions-popover .warning-action{color:#ffd18a}
.route-actions-popover .destructive-action{
  color:#ff8a82;
  background:rgba(255,81,72,.065);
}
.route-actions-popover .destructive-action:hover{
  border-color:rgba(255,81,72,.42);
  background:rgba(255,81,72,.12);
}
.route-actions-popover b{
  font-size:16px;
  line-height:1;
}

@media(max-width:1500px){
  .dashboard-shell{padding-inline:18px}
  .command-bar{
    grid-template-columns:minmax(220px,255px) minmax(560px,1fr) auto;
    gap:12px;
  }
  .brand-block{
    grid-template-columns:46px minmax(0,1fr);
    gap:10px;
  }
  .brand-mark{
    width:46px;
    height:46px;
    font-size:14px;
  }
  .brand-block h1{font-size:24px}
  .brand-block p{font-size:12px}
  .metric-strip{
    grid-template-columns:88px minmax(270px,1.75fr) minmax(126px,.76fr) 86px;
  }
  .metric-chip:nth-child(6){display:none}
  .route-stage-labels,
  #routeStageLabels{
    display:none;
  }
  .metric-chip.wide small{display:none}
  .top-actions{
    gap:7px;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .top-actions .route-btn{
    min-height:38px;
    padding:0 10px;
    font-size:12px;
  }
  .top-actions .route-btn span:first-child{
    margin-right:0;
  }
  .long-label{display:none}
  .short-label{display:inline}
  .run-console{
    grid-template-columns:minmax(230px,.88fr) minmax(300px,1.1fr) minmax(190px,.62fr) minmax(250px,.92fr) minmax(270px,1fr);
    gap:12px;
  }
  .expected-output ul{max-width:190px}
  .route-control-card small{font-size:12px}
}

@media(max-width:1280px){
  .command-bar{
    grid-template-columns:minmax(220px,1fr) minmax(480px,2fr);
  }
  .top-actions{
    grid-column:1/-1;
    justify-content:flex-end;
  }
  .metric-strip{
    grid-template-columns:92px minmax(250px,1fr) minmax(130px,.75fr) 86px;
  }
  .run-console{
    grid-template-columns:1fr 1.25fr .85fr;
  }
  .start-route-card,
  .health-panel{
    grid-column:auto;
  }
  .route-actions-popover,
  .route-control-card .route-actions-popover{
    right:auto;
    left:0;
    max-width:min(270px,calc(100vw - 48px));
  }
}

/* Editable settings modal */
.action-modal-card:has(.settings-form){
  width:min(980px,calc(100vw - 42px));
  max-height:min(86vh,820px);
  overflow:auto;
}
.settings-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.settings-head p{
  margin-top:7px;
  color:#9fb1c7;
  font-size:13px;
  line-height:1.4;
}
.settings-form{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.settings-form section{
  min-width:0;
  padding:14px;
  border:1px solid rgba(185,205,231,.16);
  border-radius:10px;
  background:rgba(255,255,255,.025);
}
.settings-form h3{
  margin:0 0 12px;
  color:#e9f5ff;
  font-size:13px;
  font-weight:650;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.settings-form label{
  display:grid;
  gap:7px;
  margin-top:11px;
}
.settings-form label:first-of-type{margin-top:0}
.settings-field{
  display:grid;
  gap:8px;
  margin-top:11px;
}
.settings-field>span{
  color:#a9bbcf;
  font-size:12px;
  font-weight:500;
}
.settings-form label span{
  color:#a9bbcf;
  font-size:12px;
  font-weight:500;
}
.settings-form input,
.settings-form select,
.settings-form textarea{
  width:100%;
  min-height:38px;
  padding:0 11px;
  border:1px solid rgba(185,205,231,.22);
  border-radius:7px;
  outline:0;
  background:rgba(7,16,26,.78);
  color:#eef7ff;
  font-size:13px;
}
.settings-form textarea{
  min-height:64px;
  padding:9px 11px;
  resize:vertical;
  line-height:1.35;
}
.settings-form input:focus,
.settings-form select:focus,
.settings-form textarea:focus{
  border-color:rgba(24,199,255,.72);
  box-shadow:0 0 0 3px rgba(24,199,255,.1);
}
.settings-pair{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.extension-selector{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.settings-form .extension-option{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  margin:0;
  padding:0 9px;
  border:1px solid rgba(185,205,231,.22);
  border-radius:7px;
  background:rgba(7,16,26,.66);
  cursor:pointer;
}
.settings-form .extension-option input{
  position:absolute;
  width:1px;
  height:1px;
  min-height:0;
  margin:0;
  opacity:0;
  pointer-events:none;
}
.settings-form .extension-option span{
  color:#dcecff;
  font-size:13px;
  font-weight:700;
}
.settings-form .extension-option:has(input:checked){
  border-color:rgba(22,240,140,.72);
  background:rgba(22,240,140,.13);
  box-shadow:0 0 0 1px rgba(22,240,140,.08) inset;
}
.settings-form .extension-option:has(input:checked) span{
  color:#baffd9;
}
.settings-form .switch-row{
  grid-template-columns:18px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-height:34px;
  margin-top:8px;
}
.switch-row input{
  min-height:0;
  width:16px;
  height:16px;
  accent-color:var(--green);
}
.settings-actions{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding-top:4px;
}
.settings-actions button{
  min-height:38px;
  padding:0 15px;
  font-size:13px;
}
.settings-actions .primary{
  border-color:rgba(22,240,140,.72);
  background:rgba(22,240,140,.14);
  color:#c9ffe4;
}
@media(max-width:760px){
  .settings-form{grid-template-columns:1fr}
  .settings-pair{grid-template-columns:1fr}
  .extension-selector{grid-template-columns:repeat(2,minmax(0,1fr))}
  .settings-actions{justify-content:stretch;flex-wrap:wrap}
  .settings-actions button{flex:1 1 150px}
}

/* Final responsive dropdown and spacing polish */
.source-card{
  padding-right:16px;
}
.source-copy span{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px 10px;
  padding-right:14px;
  white-space:normal;
}
.source-copy span i{
  margin:0;
}

.route-control-card .more-menu{
  position:relative;
  z-index:80;
}
.route-actions-popover,
.route-control-card .route-actions-popover{
  position:absolute;
  left:0;
  right:auto;
  width:252px;
  max-height:310px;
  overflow:auto;
  padding:8px;
  border:1px solid rgba(181,205,235,.3);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(9,19,30,.98),rgba(5,11,19,.99));
  box-shadow:0 18px 44px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.035) inset;
  scrollbar-width:thin;
  scrollbar-color:rgba(132,154,183,.34) transparent;
}
.route-actions-popover.open-down,
.route-control-card .route-actions-popover.open-down{
  top:calc(100% + 8px);
  bottom:auto;
}
.route-actions-popover.open-up,
.route-control-card .route-actions-popover.open-up{
  top:auto;
  bottom:calc(100% + 8px);
}
.route-actions-popover::-webkit-scrollbar{width:6px}
.route-actions-popover::-webkit-scrollbar-track{background:transparent}
.route-actions-popover::-webkit-scrollbar-thumb{background:rgba(132,154,183,.34);border-radius:999px}
.popover-group{
  gap:3px;
  padding:5px 0;
}
.popover-group:first-child{padding-top:0}
.popover-group:last-child{padding-bottom:0}
.popover-group>span{
  padding:3px 7px 2px;
  font-size:10px;
}
.route-actions-popover button,
.route-control-card .route-actions-popover button{
  min-height:31px;
  padding:0 8px;
  font-size:12px;
}
.route-actions-popover .warning-action{
  color:#ffd28a;
}
.route-actions-popover .destructive-action{
  color:#ff8178;
}
.route-actions-popover .positive-action,
.route-actions-popover .utility-action{
  color:#dce8f7;
}

.flow-arrow{
  width:25px;
  height:25px;
  box-shadow:0 0 0 3px rgba(5,11,19,.86),0 0 10px color-mix(in srgb,var(--accent) 16%,transparent);
}
.flow-arrow:after{
  width:78px;
  background:linear-gradient(90deg,transparent,rgba(145,174,210,.3),transparent);
}
.flow-arrow:before{
  font-size:12px;
}

.artifact-card{
  padding-top:12px;
  padding-bottom:12px;
}
.artifact-actions button{
  min-height:28px;
}

@media(max-width:1650px){
  .command-bar{
    grid-template-columns:minmax(180px,1fr) auto;
    grid-template-rows:auto auto;
    align-items:center;
    gap:10px 14px;
    min-height:0;
    padding:12px 0;
  }
  .brand-block{
    grid-column:1;
    grid-row:1;
    grid-template-columns:42px minmax(0,1fr);
    max-width:260px;
    gap:9px;
  }
  .brand-mark{
    width:42px;
    height:42px;
    font-size:13px;
  }
  .brand-block h1{
    font-size:23px;
    letter-spacing:.02em;
  }
  .brand-block p{
    max-width:210px;
    font-size:11.5px;
    line-height:1.22;
  }
  .top-actions{
    grid-column:2;
    grid-row:1;
    justify-content:flex-end;
    gap:7px;
  }
  .top-actions .route-btn{
    min-height:37px;
    padding:0 10px;
    font-size:12px;
  }
  .top-actions .route-btn.new-run{
    padding:0 12px;
  }
  .metric-strip{
    grid-column:1/-1;
    grid-row:2;
    width:100%;
    grid-template-columns:minmax(92px,.62fr) minmax(320px,2fr) minmax(135px,.86fr) minmax(92px,.62fr);
  }
  .metric-chip:nth-child(5),
  .metric-chip:nth-child(6){
    display:none;
  }
  #routeStageLabels{
    display:none;
  }
  .route-stages{
    gap:8px;
  }
  .route-stages span,
  .route-stages em{
    font-size:12px;
  }
  .source-copy span{
    padding-right:16px;
  }
}

@media(max-width:1040px){
  .top-actions{
    grid-column:1/-1;
    grid-row:2;
    justify-content:flex-start;
  }
  .metric-strip{
    grid-row:3;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .metric-chip:nth-child(5),
  .metric-chip:nth-child(6){
    display:none;
  }
}

/* Final micro-polish and route dropdown pass */
.brand-block{
  grid-template-columns:54px minmax(0,1fr);
  gap:12px;
}
.brand-mark{
  position:relative;
  width:54px;
  height:54px;
  z-index:0;
  color:#49f1ca;
  border:0;
  background:linear-gradient(135deg,#5f7cff 0%,#16f0c0 78%);
  text-shadow:0 0 10px rgba(73,241,202,.35);
}
.brand-mark:before{
  content:"";
  position:absolute;
  inset:3px;
  z-index:-1;
  clip-path:inherit;
  background:linear-gradient(145deg,#08151f,#07111d);
}
.brand-block h1{
  font-size:27px;
  letter-spacing:.015em;
  font-weight:700;
  white-space:nowrap;
}
.brand-block p{
  margin-top:7px;
  font-size:13px;
  color:#c4d2e3;
}
.metric-strip{
  grid-template-columns:15fr 47fr 20fr 18fr;
}
.metric-chip:nth-child(5),
.metric-chip:nth-child(6){
  display:none;
}
.metric-chip{
  grid-template-columns:28px minmax(0,1fr);
  column-gap:12px;
  align-content:center;
}
.metric-chip:before{
  content:"";
  grid-row:1/4;
  align-self:center;
  width:28px;
  height:28px;
  border:1px solid rgba(24,199,255,.7);
  border-radius:6px;
  background:
    linear-gradient(rgba(24,199,255,.78),rgba(24,199,255,.78)) 8px 9px/13px 2px no-repeat,
    linear-gradient(rgba(24,199,255,.42),rgba(24,199,255,.42)) 8px 15px/10px 2px no-repeat,
    rgba(24,199,255,.08);
  box-shadow:0 0 18px rgba(24,199,255,.13);
}
.metric-chip.wide:before{
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,rgba(22,240,140,.9) 0 3px,transparent 4px),
    radial-gradient(circle at 25% 28%,rgba(22,240,140,.75) 0 2px,transparent 3px),
    radial-gradient(circle at 76% 72%,rgba(22,240,140,.75) 0 2px,transparent 3px),
    rgba(22,240,140,.07);
}
.metric-chip:nth-child(3):before{
  background:
    linear-gradient(rgba(24,199,255,.78),rgba(24,199,255,.78)) 8px 8px/11px 2px no-repeat,
    linear-gradient(rgba(24,199,255,.42),rgba(24,199,255,.42)) 8px 14px/13px 2px no-repeat,
    linear-gradient(rgba(24,199,255,.42),rgba(24,199,255,.42)) 8px 20px/9px 2px no-repeat,
    rgba(24,199,255,.08);
}
.metric-chip:nth-child(4):before{
  border-color:rgba(22,240,140,.7);
  border-radius:999px;
  background:linear-gradient(90deg,var(--green) 0 44%,rgba(211,229,255,.16) 44%) center/18px 6px no-repeat,rgba(22,240,140,.06);
}
.run-console{
  grid-template-columns:minmax(300px,.92fr) minmax(360px,1.1fr) minmax(300px,.9fr) minmax(320px,1fr);
}
.console-file,
.route-builder,
.route-output-column{
  padding-right:18px;
  border-right:1px solid rgba(199,221,251,.12);
}
.expected-output{
  margin-top:16px;
  padding:14px 0 0;
  border-top:1px solid rgba(199,221,251,.11);
  border-right:0;
}
.expected-output h2{
  font-size:12px;
  color:#a9bdcf;
}
.expected-output ul{
  max-width:none;
  margin:10px 0 8px;
}
.expected-output li{
  white-space:normal;
}
.route-options{
  position:relative;
  display:block;
  margin-top:12px;
}
.route-select-trigger{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 14px;
  border-color:var(--green);
  border-radius:8px;
  background:linear-gradient(90deg,rgba(22,240,140,.18),rgba(22,240,140,.07));
  color:#bffff0;
  font-size:13px;
  font-weight:500;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 18px rgba(22,240,140,.08);
}
.route-select-trigger span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.route-select-trigger b{
  color:#87ffd0;
  font-size:12px;
  font-weight:500;
}
.route-select-menu{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 8px);
  z-index:70;
  max-height:300px;
  overflow:auto;
  padding:9px;
  border:1px solid rgba(185,205,231,.28);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(9,19,30,.98),rgba(5,11,19,.99));
  box-shadow:0 18px 46px rgba(0,0,0,.45);
}
.route-select-menu[hidden]{display:none}
.route-select-group{
  display:grid;
  gap:4px;
  padding:6px 0;
}
.route-select-group:first-child{padding-top:0}
.route-select-group+.route-select-group{border-top:1px solid rgba(199,221,251,.11)}
.route-select-group>span{
  padding:2px 7px;
  color:#8294aa;
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.route-option-item{
  min-height:31px;
  justify-content:flex-start;
  padding:0 9px;
  border-color:transparent;
  background:transparent;
  color:#dce8f7;
  font-size:12.5px;
}
.route-option-item:hover{border-color:rgba(24,199,255,.25);background:rgba(24,199,255,.07)}
.route-option-item.selected{color:#8dffd0;background:rgba(22,240,140,.08);border-color:rgba(22,240,140,.26)}
.source-copy span{
  display:flex;
  flex-wrap:wrap;
  gap:4px 9px;
  padding-right:16px;
}
.source-copy .meta-item{
  display:inline-flex;
  white-space:nowrap;
}
.source-copy span i{
  align-self:center;
}
@media(max-width:1380px){
  .source-copy span i{display:none}
  .source-copy .meta-item{flex-basis:100%}
}
.agent-card{
  padding-top:11px;
  padding-bottom:11px;
}
.agent-rows{
  margin-top:7px;
  padding-top:7px;
  gap:4px;
}
.handoff-box{
  min-height:38px;
  padding:6px 8px;
}
.agent-actions{
  margin-top:6px;
}
.flow-arrow{
  width:23px;
  height:23px;
  opacity:.82;
  box-shadow:0 0 0 3px rgba(5,11,19,.82),0 0 8px color-mix(in srgb,var(--accent) 12%,transparent);
}
.flow-arrow:after{
  width:70px;
  background:linear-gradient(90deg,transparent,rgba(145,174,210,.2),transparent);
}
.flow-arrow:before{font-size:11px}
.artifact-card{
  min-height:190px;
  padding:11px 12px;
}
.artifact-card.pending{
  opacity:.68;
  filter:saturate(.55);
}
.artifact-actions{
  padding-top:10px;
}
.artifact-actions button{
  min-height:27px;
}
@media(max-width:1650px){
  .run-console{
    grid-template-columns:minmax(260px,.88fr) minmax(330px,1.08fr) minmax(260px,.86fr) minmax(280px,1fr);
  }
  .metric-strip{
    grid-template-columns:15fr 47fr 20fr 18fr;
  }
}
@media(max-width:1040px){
  .run-console{
    grid-template-columns:1fr;
  }
  .console-file,
  .route-builder,
  .route-output-column{
    border-right:0;
    padding-right:0;
  }
}

/* Setup row replacement polish */
.run-console{
  grid-template-columns:minmax(380px,1.05fr) minmax(350px,.92fr) minmax(260px,.72fr) minmax(300px,.8fr);
  gap:0;
  padding:0;
  overflow:visible;
  border-color:rgba(80,144,190,.34);
}
.run-console>div,
.run-console>aside,
.run-console>article{
  min-height:232px;
  padding:18px 20px;
}
.console-file,
.route-output-column,
.start-route-card{
  border-right:1px solid rgba(199,221,251,.11);
}
.run-console h2,
.panel h2{
  font-size:15px;
  letter-spacing:.055em;
}
.console-subhead{
  margin:24px 0 9px;
  color:var(--green);
  font-size:12px;
  font-weight:650;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.route-output-column .console-subhead,
.expected-output h2{
  color:var(--green);
}
.console-file .console-subhead:first-of-type{
  margin-top:26px;
}
.source-card{
  grid-template-columns:54px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  gap:15px;
  min-height:96px;
  margin-top:0;
  padding:16px;
  border-color:rgba(80,144,190,.35);
  border-radius:10px;
  background:rgba(10,24,36,.64);
}
.doc-icon{
  width:48px;
  height:58px;
}
.source-copy strong{
  font-size:16px;
}
.source-copy .input-counts{
  display:grid;
  gap:3px;
  margin-top:8px;
  padding:7px 9px;
  border:1px solid rgba(83,142,184,.28);
  border-radius:7px;
  background:rgba(6,18,29,.42);
}
.source-copy .input-counts[hidden]{display:none}
.source-copy .input-count{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  color:#aebfd1;
  font-size:11px;
  line-height:1.35;
}
.source-copy .input-count em{
  overflow:hidden;
  font-style:normal;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.source-copy .input-count b{
  color:#eef7ff;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.source-copy span{
  padding-right:12px;
  color:#c8d8e8;
  font-size:13px;
}
.source-copy small{
  margin-top:6px;
  font-size:12px;
}
.source-card button{
  grid-column:3;
  grid-row:1;
  align-self:start;
  justify-self:end;
  min-height:41px;
  margin-top:0;
  padding:0 16px;
}
.source-card button:before{
  content:"^";
  margin-right:8px;
  color:#d9e7f7;
  font-size:12px;
}
.console-file .start-agent{
  margin-top:24px;
}
.console-file .start-agent .console-subhead,
.console-file .start-agent h2{
  margin-bottom:14px;
  color:var(--green);
}
.start-agent-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:0;
}
.start-agent-card{
  grid-template-columns:1fr;
  justify-items:center;
  align-content:center;
  min-height:70px;
  padding:9px;
  gap:5px;
  overflow:hidden;
}
.start-agent-card img{
  width:50px;
  height:50px;
}
.start-agent-card strong{
  width:100%;
  min-width:0;
  overflow:hidden;
  color:#f4fbff;
  font-size:12.5px;
  font-weight:500;
  line-height:1.15;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.route-output-column{
  padding-right:20px;
}
.route-output-column .console-subhead{
  margin-top:15px;
  color:var(--green);
}
.route-options{
  margin-top:0;
}
.route-select-trigger{
  min-height:38px;
  padding:0 12px;
  border-color:rgba(185,205,231,.28);
  background:rgba(255,255,255,.03);
  color:#eaf4ff;
}
.route-select-trigger i{
  flex:0 0 25px;
  width:25px;
  height:25px;
  border:1px solid rgba(22,240,140,.68);
  border-radius:6px;
  background:
    radial-gradient(circle at 50% 50%,rgba(22,240,140,.9) 0 3px,transparent 4px),
    radial-gradient(circle at 28% 30%,rgba(22,240,140,.72) 0 2px,transparent 3px),
    radial-gradient(circle at 73% 70%,rgba(22,240,140,.72) 0 2px,transparent 3px),
    rgba(22,240,140,.08);
}
.route-output-hint{
  margin:8px 0 13px;
  color:var(--green);
  font-size:12px;
}
.expected-output{
  margin-top:0;
  padding-top:12px;
}
.expected-output h2{
  font-size:12px;
  color:#d8e6f6;
}
.expected-output ul{
  margin-top:10px;
  gap:5px;
}
.expected-output li{
  font-size:12.5px;
  line-height:1.16;
}
.expected-output span{
  font-size:12.5px;
}
.start-route-card{
  min-height:232px;
  margin:12px;
  padding:20px 18px;
  border:1px solid rgba(22,240,140,.55);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(22,240,140,.14),rgba(7,19,28,.64));
}
.start-route-card h2,
.route-control-card h2{
  font-size:22px;
}
.route-control-card small{
  max-width:100%;
  white-space:normal;
}
.route-control-buttons .route-btn:only-child,
#startRouteBtn{
  min-width:140px;
}
.route-control-card .wide-more{
  margin-top:2px;
}
.health-panel.panel{
  min-height:232px;
  margin:12px;
  border:1px solid rgba(80,144,190,.28);
  border-radius:10px;
  background:rgba(9,20,31,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.health-note{
  margin-top:4px;
}
@media(max-width:1650px){
  .run-console{
    grid-template-columns:minmax(330px,1fr) minmax(340px,.94fr) minmax(240px,.74fr) minmax(290px,.86fr);
  }
  .source-card{
    grid-template-columns:48px minmax(0,1fr) minmax(118px,auto);
  }
  .source-card button{
    grid-column:3;
    grid-row:1;
    align-self:start;
    justify-self:end;
    margin-top:0;
  }
  .start-agent-card img{
    width:42px;
    height:42px;
  }
}
@media(max-width:1120px){
  .run-console{
    grid-template-columns:1fr;
  }
  .run-console>div,
  .run-console>aside,
  .run-console>article{
    min-height:0;
  }
  .console-file,
  .route-output-column,
  .start-route-card{
    border-right:0;
    border-bottom:1px solid rgba(199,221,251,.11);
  }
  .start-route-card,
  .health-panel.panel{
    border-radius:0;
  }
}

/* Final setup heading rhythm polish */
.run-console{
  --setup-subhead: #b9c8d8;
  --setup-title-gap: 18px;
  --setup-subhead-gap: 11px;
}
.console-subhead,
.console-file .start-agent h2,
.expected-output h2{
  color:var(--setup-subhead);
  font-size:12px;
  font-weight:650;
  line-height:1.15;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.console-file .console-subhead,
.route-output-column .console-subhead,
.route-output-column .expected-output h2,
.console-file .start-agent h2{
  color:var(--setup-subhead);
}
.console-subhead,
.route-output-column .console-subhead{
  margin:var(--setup-title-gap) 0 var(--setup-subhead-gap);
}
.console-file .console-subhead:first-of-type{
  margin-top:var(--setup-title-gap);
}
.console-file .start-agent{
  margin-top:24px;
}
.console-file .start-agent h2{
  margin:0 0 var(--setup-subhead-gap);
}
.start-agent-grid{
  margin-top:0;
}
.expected-output{
  margin-top:18px;
}
.expected-output h2{
  margin:0 0 var(--setup-subhead-gap);
}

/* Start Route hero card polish */
.start-route-card.idle-route-card{
  min-height:calc(100% - 24px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px 22px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 22%,rgba(22,240,140,.18),transparent 34%),
    linear-gradient(145deg,rgba(22,240,140,.13),rgba(7,19,28,.7));
}
.start-play-ring{
  width:76px;
  height:76px;
  display:grid;
  place-items:center;
  margin:0 auto 18px;
  border:3px solid rgba(64,255,145,.86);
  border-radius:50%;
  background:radial-gradient(circle,rgba(22,240,140,.15),rgba(6,18,27,.74));
  box-shadow:0 0 30px rgba(22,240,140,.34),inset 0 0 20px rgba(22,240,140,.08);
}
.start-play-ring span{
  width:0;
  height:0;
  margin-left:6px;
  border-top:17px solid transparent;
  border-bottom:17px solid transparent;
  border-left:25px solid #9af7c6;
  filter:drop-shadow(0 0 10px rgba(22,240,140,.46));
}
.start-route-card.idle-route-card h2,
.route-control-card.idle-route-card h2{
  margin:0;
  color:#64f49f;
  font-size:22px;
  font-weight:550;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.route-control-card.idle-route-card .route-state{
  display:none;
}
.route-control-card.idle-route-card small{
  min-height:0;
  margin-top:12px;
  color:#f2f7ff;
  font-size:13px;
  line-height:1.35;
  white-space:normal;
  overflow-wrap:anywhere;
}
.route-control-card.idle-route-card .route-meta{
  display:block;
  max-width:min(100%, 210px);
  color:#b9e8cf;
  font-size:12px;
  line-height:1.25;
  letter-spacing:.01em;
}
.route-control-card.idle-route-card .route-control-buttons{
  width:min(100%,190px);
  margin-top:14px;
}
.route-control-card.idle-route-card .route-control-buttons .route-btn:only-child,
.route-control-card.idle-route-card #startRouteBtn{
  width:100%;
  min-width:0;
  justify-content:center;
}
.route-control-card.idle-route-card .more-menu{
  width:min(100%,190px);
  margin-top:12px;
}
.route-control-card.idle-route-card .wide-more{
  min-height:40px;
  justify-content:space-between;
}
@media(max-width:1650px){
  .start-play-ring{
    width:68px;
    height:68px;
    margin-bottom:15px;
  }
  .start-play-ring span{
    border-top-width:15px;
    border-bottom-width:15px;
    border-left-width:22px;
  }
  .start-route-card.idle-route-card h2,
  .route-control-card.idle-route-card h2{
    font-size:20px;
  }
  .route-control-card.idle-route-card small{
    font-size:13.5px;
  }
}

/* Start/health column height alignment */
.run-console>.start-route-card,
.run-console>.health-panel.panel{
  align-self:stretch;
  height:calc(100% - 24px);
}
.route-control-card.idle-route-card .route-control-buttons{
  --idle-route-control-width:196px;
  width:min(100%,var(--idle-route-control-width));
}
.route-control-card.idle-route-card #startRouteBtn{
  width:100%;
  min-height:42px;
  padding:0 22px;
}
.route-control-card.idle-route-card .more-menu{
  width:min(100%,var(--idle-route-control-width,196px));
}