/* ============================================================
   WAYPATH PLATFORM — premium Linear/Cursor refresh
   Floating composer · status-grouped list · restrained palette
   Signal orange reserved for live state. No notched buttons
   except the one primary action. Calmer hairlines.
   ============================================================ */

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0a0a0a;color:#ededed;font-family:var(--f-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden;height:100vh}
button{font-family:inherit;color:inherit;border:none;background:transparent;padding:0;cursor:pointer}
input,textarea,select{font-family:inherit}
::selection{background:var(--orange);color:#0a0a0a}

/* ============ CUSTOM SCROLLBAR (global) ============ */
*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.10) transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:0;border:2px solid transparent;background-clip:content-box;transition:background .15s}
*::-webkit-scrollbar-thumb:hover{background:rgba(255,90,31,.5);background-clip:content-box}
*::-webkit-scrollbar-corner{background:transparent}

:root{
  --bg:#0a0a0a;
  --bg-1:#0e0e0e;
  --bg-2:#131313;
  --bg-3:#1a1a1a;
  --hair:#1c1c1c;
  --hair-2:#262626;
  --hair-h:#2e2e2e;
  --fg:#ededed;
  --fg-2:#a8a8a8;
  --fg-3:#8a8a8a;
  --fg-4:#5a5a5a;
  --signal:#ff5a1f;
  --signal-soft:rgba(255,90,31,.12);
  --status-run:#ff8a4d;
  --status-ready:#6fc18f;
  --status-wait:#d6b46a;
  --status-done:#5a5a5a;
  --status-err:#e0604a;
  --row-h:42px;
  --rail-w:236px;
  --inspector-w:380px;
  --topbar-h:42px;
  --composer-w:640px;
}

/* ============ SHELL ============ */
.app{
  display:grid;
  grid-template-columns:var(--rail-w) 1fr;
  grid-template-rows:var(--topbar-h) 1fr;
  grid-template-areas:"top top" "rail main";
  height:100vh;height:100dvh;position:relative;background:var(--bg);
}
.app.with-inspector{grid-template-columns:var(--rail-w) 1fr var(--inspector-w);grid-template-areas:"top top top" "rail main inspector"}

/* ============ TOPBAR ============ */
.top{
  grid-area:top;display:grid;grid-template-columns:var(--rail-w) 1fr auto;
  border-bottom:1px solid var(--hair);background:rgba(10,10,10,.92);
  backdrop-filter:saturate(160%) blur(10px);
  align-items:center;position:relative;z-index:30;
}
/* signal trim line — brand correlation */
.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent 0,var(--signal) 22%,var(--signal) 28%,transparent 32%,transparent 100%);opacity:.55;pointer-events:none}
.top .ws{
  display:flex;align-items:center;gap:9px;padding:0 14px;height:100%;
  border-right:1px solid var(--hair);font-family:var(--f-sans);
}
.top .ws .av{
  width:22px;height:22px;background:transparent;
  display:inline-flex;align-items:center;justify-content:center;
  position:relative;overflow:visible;
}
.top .ws .av .ascii-status{
  display:block;width:22px !important;height:22px !important;
  border-radius:50%;overflow:hidden;
}
.top .ws .av svg{width:14px;height:14px;display:block}
.top .ws .nm{font-family:var(--f-num);font-weight:700;font-size:14px;color:var(--fg);letter-spacing:.01em}
.top .ws .nm small{font-family:var(--f-sans);font-weight:400;font-size:12px;color:var(--fg-2);margin-left:6px;letter-spacing:-.005em}
.top .ws .chev{color:var(--fg-3);font-size:10px;margin-left:auto}

.top .crumbs{
  display:flex;align-items:center;gap:8px;padding:0 16px;height:100%;
  font-family:var(--f-sans);font-size:13px;color:var(--fg-2);letter-spacing:-.005em;overflow:hidden;
}
.top .crumbs .sep{color:var(--fg-4);font-size:11px}
.top .crumbs .cur{color:var(--fg);font-weight:500}
.top .crumbs .tag{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-3);letter-spacing:.02em;
  margin-left:6px;
}

.top .ract{display:flex;align-items:center;gap:6px;padding:0 12px;height:100%}
.cmdk{
  display:flex;align-items:center;gap:8px;height:26px;padding:0 8px 0 10px;
  border:1px solid var(--hair-2);background:var(--bg-1);color:var(--fg-3);
  font-family:var(--f-sans);font-size:12px;cursor:text;letter-spacing:-.005em;
  border-radius:2px;
}
.cmdk:hover{border-color:var(--hair-h);color:var(--fg-2)}
kbd{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.04em;color:var(--fg-3);background:var(--bg);border:1px solid var(--hair-2);padding:1px 5px;border-radius:2px}
.live-tag{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-2);letter-spacing:.06em;text-transform:uppercase;
  height:26px;padding:0 9px;background:var(--bg-1);border-radius:2px;border:1px solid var(--hair-2);
}
.live-tag b{color:var(--signal);font-weight:600;font-family:var(--f-num);font-size:12px;letter-spacing:-.01em}
.live-tag:hover{border-color:var(--hair-h);color:var(--fg)}
.pulse{width:6px;height:6px;background:var(--signal);border-radius:50%;box-shadow:0 0 0 0 rgba(255,90,31,.6);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,90,31,.6)}80%{box-shadow:0 0 0 7px rgba(255,90,31,0)}100%{box-shadow:0 0 0 0 rgba(255,90,31,0)}}
.user-chip{width:26px;height:26px;background:var(--bg-2);border:1px solid var(--hair-2);display:inline-flex;align-items:center;justify-content:center;font-family:var(--f-sans);font-weight:500;font-size:11px;color:var(--fg);letter-spacing:-.005em}

/* ============ RAIL ============ */
.rail{
  grid-area:rail;border-right:1px solid var(--hair);background:#070707;
  display:flex;flex-direction:column;overflow-y:auto;padding:8px 0;
}
.rail::-webkit-scrollbar{width:4px}
.rail::-webkit-scrollbar-thumb{background:var(--hair-2)}

.r-group{display:flex;flex-direction:column;padding:0 0 8px}
.r-sec{
  display:flex;align-items:center;justify-content:space-between;
  font-family:var(--f-sans);font-size:11px;color:var(--fg-3);font-weight:500;letter-spacing:-.005em;
  padding:14px 14px 4px;
}
.r-sec .ct{color:var(--fg-4);font-weight:400;font-family:var(--f-mono);font-size:10px}

.r-item{
  display:grid;grid-template-columns:14px 1fr auto;gap:10px;align-items:center;
  padding:5px 12px;height:28px;margin:0 6px;
  font-family:var(--f-sans);font-size:13px;color:var(--fg-2);letter-spacing:-.005em;
  cursor:pointer;border-radius:3px;
}
.r-item:hover{background:var(--bg-2);color:var(--fg)}
.r-item.on{background:var(--bg-2);color:var(--fg)}
.r-item.on .lab::after{content:""}
.r-item .ic{width:13px;height:13px;display:block;flex-shrink:0;color:var(--fg-3)}
.r-item:hover .ic,.r-item.on .ic{color:var(--fg-2)}
.r-item .ct{font-family:var(--f-mono);font-size:10px;color:var(--fg-4);letter-spacing:0}
.r-item:hover .ct,.r-item.on .ct{color:var(--fg-3)}
.r-item .kbd{font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);opacity:0;transition:opacity .12s}
.r-item:hover .kbd{opacity:1}
.r-item:hover .ct{opacity:0}

.r-sub{
  display:grid;grid-template-columns:8px 1fr auto;gap:10px;align-items:center;
  padding:4px 12px 4px 18px;margin:0 6px;border-radius:3px;
  font-family:var(--f-sans);font-size:12.5px;color:var(--fg-2);letter-spacing:-.005em;cursor:pointer;
}
.r-sub:hover{background:var(--bg-2);color:var(--fg)}
.r-sub i{width:6px;height:6px;background:var(--status-run);display:block;border-radius:50%}
.r-sub.idle i{background:var(--status-done)}
.r-sub .st{font-family:var(--f-mono);font-size:9.5px;color:var(--fg-4);letter-spacing:.02em}

.rail-foot{
  margin-top:auto;border-top:1px solid var(--hair);padding:10px 14px;
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--f-sans);font-size:11px;color:var(--fg-3);letter-spacing:-.005em;
}
.rail-foot .l{display:flex;align-items:center;gap:8px}
.rail-foot .av-sm{width:18px;height:18px;background:var(--bg-2);border:1px solid var(--hair-2);display:inline-flex;align-items:center;justify-content:center;font-family:var(--f-sans);font-size:9.5px;color:var(--fg)}
.rail-foot b{color:var(--fg-2);font-weight:500}

/* ============ MAIN ============ */
/* main — layout already declared above; atmosphere block adds position:relative */
.main{
  grid-area:main;display:grid;grid-template-rows:auto auto 1fr;
  min-width:0;overflow:hidden;background:var(--bg);
}
.list{overflow-x:hidden}

.subhead{
  display:flex;align-items:center;gap:14px;padding:0 22px;
  border-bottom:1px solid var(--hair);background:var(--bg);position:relative;z-index:2;
}
.subhead h1{
  font-family:var(--f-sans);font-size:18px;font-weight:600;letter-spacing:-.015em;color:var(--fg);margin:0;
}
.subhead .meta{
  font-family:var(--f-sans);font-size:12px;color:var(--fg-3);letter-spacing:-.005em;display:flex;align-items:center;gap:6px;
}
.subhead .meta b{color:var(--fg-2);font-weight:500}

.subhead .spacer{flex:1}
.subhead .views{display:flex;align-items:center;gap:2px;height:30px}
.subhead .view{
  font-family:var(--f-sans);font-size:12px;color:var(--fg-3);letter-spacing:-.005em;
  padding:5px 9px;cursor:pointer;border-radius:3px;display:inline-flex;align-items:center;gap:6px;
}
.subhead .view:hover{background:var(--bg-2);color:var(--fg-2)}
.subhead .view.on{color:var(--fg);background:var(--bg-2)}
.subhead .view .ct{font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4)}
.subhead .view.on .ct{color:var(--fg-2)}
.subhead .iconbtn{
  width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;color:var(--fg-3);
  font-family:var(--f-mono);font-size:11px;cursor:pointer;border-radius:3px;
}
.subhead .iconbtn:hover{background:var(--bg-2);color:var(--fg)}

/* ============ TODAY SUB-TABS ============ */
.subhead.has-tabs{gap:10px}
.sub-tabs{
  display:flex;align-items:center;gap:0;height:30px;
  margin-left:14px;padding-left:14px;
  border-left:1px solid var(--hair);
  position:relative;
}
.sub-tab{
  position:relative;
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--f-sans);font-size:13px;font-weight:500;color:var(--fg-3);letter-spacing:-.005em;
  padding:6px 12px;cursor:pointer;border-radius:3px;
  transition:color .12s;
}
.sub-tab:hover{color:var(--fg-2)}
.sub-tab.on{color:var(--fg)}
.sub-tab.on::after{
  content:"";position:absolute;left:10px;right:10px;bottom:-9px;height:2px;
  background:var(--signal);
}
.sub-tab .ct{
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);font-weight:400;letter-spacing:.02em;
}
.sub-tab.on .ct{color:var(--fg-2)}
.sub-tab .dot{
  width:6px;height:6px;border-radius:50%;background:var(--signal);
  box-shadow:0 0 0 0 rgba(255,90,31,.55);animation:pulse 1.8s infinite;
  margin-left:-2px;
}

/* ============ REPORTS FEED ============ */
.reports{
  overflow-y:auto;overflow-x:hidden;background:var(--bg);
  padding:18px 22px 140px;
}
.reports::-webkit-scrollbar{width:6px}
.reports::-webkit-scrollbar-thumb{background:var(--hair-2);border-radius:3px}

.reports-head,.reports-foot{
  display:flex;align-items:baseline;gap:10px;
  padding:4px 2px 14px;
  font-family:var(--f-sans);letter-spacing:-.005em;
}
.reports-foot{padding:30px 2px 0;color:var(--fg-4);border-top:1px dashed var(--hair-2);margin-top:18px}
.reports-head .k,.reports-foot .k{
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-3);letter-spacing:.06em;text-transform:uppercase;
}
.reports-head .m,.reports-foot .m{font-size:12px;color:var(--fg-3)}
.reports-foot kbd{margin-left:2px}

.report-card{
  display:block;width:100%;max-width:880px;
  background:var(--bg-1);border:1px solid var(--hair);
  padding:18px 20px 14px;margin:0 0 10px;
  text-align:left;cursor:pointer;
  font-family:var(--f-sans);letter-spacing:-.005em;color:var(--fg-2);
  transition:border-color .12s,background .12s;position:relative;
}
.report-card:hover{border-color:var(--hair-h);background:var(--bg-2)}
.report-card.fresh{border-left:2px solid var(--signal)}
.report-card.fresh::before{
  content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:2px;
  background:var(--signal);
}

.report-card .rc-head{
  display:flex;align-items:center;gap:8px;
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);letter-spacing:.04em;
  margin-bottom:8px;
}
.report-card .rc-id{
  color:var(--fg-3);background:var(--bg);border:1px solid var(--hair-2);
  padding:2px 6px;border-radius:2px;letter-spacing:.06em;
}
.report-card .rc-when{color:var(--fg-2)}
.report-card .rc-sep{color:var(--fg-4)}
.report-card .rc-type{color:var(--fg-3);text-transform:uppercase}
.report-card .rc-spacer{flex:1}
.report-card .rc-fresh{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--signal);font-family:var(--f-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;
}
.report-card .rc-fresh .pulse{width:5px;height:5px}

.report-card .rc-title{
  font-family:var(--f-sans);font-size:19px;font-weight:600;color:var(--fg);letter-spacing:-.015em;
  margin:0 0 4px;line-height:1.2;
}
.report-card .rc-author{
  font-size:12px;color:var(--fg-3);margin-bottom:10px;
}
.report-card .rc-author .agent{color:var(--signal);font-family:var(--f-mono);font-size:11px;text-transform:lowercase;letter-spacing:.02em}
.report-card .rc-summary{
  font-size:13.5px;line-height:1.55;color:var(--fg-2);margin:0 0 12px;max-width:64ch;
}

.report-card .rc-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;
  padding:10px 0;margin-bottom:10px;
  border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
}
.report-card .rc-stat .k{
  font-family:var(--f-mono);font-size:9.5px;color:var(--fg-4);text-transform:uppercase;letter-spacing:.08em;
  margin-bottom:3px;
}
.report-card .rc-stat .v{
  font-family:var(--f-num);font-weight:700;font-size:22px;color:var(--fg);letter-spacing:-.01em;
  font-feature-settings:"tnum" 1,"ss01" 1;display:flex;align-items:baseline;gap:5px;
}
.report-card .rc-stat .v .u{
  font-family:var(--f-mono);font-weight:400;font-size:10px;color:var(--fg-3);letter-spacing:.04em;
}

.report-card .rc-list{
  list-style:none;padding:0;margin:0 0 12px;
  display:flex;flex-direction:column;gap:6px;
}
.report-card .rc-list li{
  display:grid;grid-template-columns:6px auto auto 1fr;gap:8px;align-items:baseline;
  font-size:12.5px;color:var(--fg-2);
}
.report-card .rc-list .d{
  width:4px;height:4px;background:var(--fg-4);border-radius:50%;align-self:center;transform:translateY(-1px);
}
.report-card .rc-list .who{color:var(--fg);font-weight:500;font-size:12.5px}
.report-card .rc-list .sep{color:var(--fg-4)}
.report-card .rc-list .note{color:var(--fg-3)}

.report-card .rc-foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-top:10px;border-top:1px dashed var(--hair-2);
}
.report-card .rc-link{
  font-family:var(--f-mono);font-size:11px;color:var(--signal);letter-spacing:.04em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:2px;
}
.report-card .rc-link .arr{font-family:var(--f-sans);font-size:13px}
.report-card:hover .rc-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.report-card .rc-meta{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--f-mono);font-size:10px;color:var(--fg-4);text-transform:uppercase;letter-spacing:.06em;
}

/* ============ LIST ============ */
.list{
  overflow-y:auto;overflow-x:hidden;background:var(--bg);
  padding-bottom:120px;  /* floating composer gap */
}
.list::-webkit-scrollbar{width:6px}
.list::-webkit-scrollbar-thumb{background:var(--hair-2);border-radius:3px}

.group-h{
  display:flex;align-items:center;gap:8px;padding:14px 22px 6px;
  font-family:var(--f-sans);font-size:12px;color:var(--fg-2);letter-spacing:-.005em;font-weight:500;
  position:sticky;top:0;background:rgba(10,10,10,.92);backdrop-filter:blur(6px);z-index:2;
}
.group-h .ct{font-family:var(--f-mono);font-size:11px;color:var(--fg-4);font-weight:400}
.group-h .caret{color:var(--fg-3);font-size:9px;cursor:pointer}
.group-h .spacer{flex:1}
.group-h .grp-meta{font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);letter-spacing:.02em}

.row{
  display:grid;grid-template-columns:24px 1fr 160px 64px 90px 40px;gap:14px;
  align-items:center;padding:0 22px;height:var(--row-h);
  border-bottom:1px solid var(--hair);cursor:pointer;position:relative;
  font-family:var(--f-sans);letter-spacing:-.005em;
}
.row:hover{background:var(--bg-1)}
.row.sel{background:var(--bg-2)}
.row.sel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal)}

.row .st{
  display:flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;
  background:var(--bg);border:1px solid var(--hair-2);
  overflow:hidden;flex-shrink:0;
}
.row.high .st{border-color:rgba(255,90,31,.55)}
.row.warm .st{border-color:var(--hair-h)}
.row .st .ascii-status{display:block;width:22px !important;height:22px !important}
.row .st .dot{position:relative;width:12px;height:12px;display:inline-block}
.row .st .dot::before{content:"";position:absolute;inset:2px;border:1.5px solid var(--status-run);border-radius:50%}
.row .st .dot.run::before{border-color:var(--status-run);border-top-color:transparent;animation:spin .9s linear infinite}
.row .st .dot.ready::before{border-color:var(--status-ready);background:var(--status-ready)}
.row .st .dot.wait::before{border-color:var(--status-wait);background:transparent;border-style:dashed}
.row .st .dot.done::before{border-color:var(--status-done);background:transparent}
@keyframes spin{to{transform:rotate(360deg)}}

.row .title{display:flex;align-items:center;gap:10px;min-width:0;overflow:hidden}
.row .title b{
  font-size:13.5px;color:var(--fg);font-weight:500;letter-spacing:-.005em;
  white-space:nowrap;flex-shrink:0;
}
.row .title .sub{font-family:var(--f-sans);font-size:12.5px;color:var(--fg-3);font-weight:400;margin-left:2px;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.row .title .id{
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);font-weight:400;letter-spacing:0;
  border:1px solid var(--hair-2);padding:1px 5px;border-radius:2px;flex-shrink:0;
}

.row .sig{
  display:flex;flex-direction:column;gap:1px;
  font-family:var(--f-sans);font-size:12px;color:var(--fg-2);font-weight:500;letter-spacing:-.005em;
}
.row .sig .ln2{font-size:11px;color:var(--fg-3);font-weight:400}

.row .conf{
  font-family:var(--f-num);font-size:15px;color:var(--fg);font-weight:700;letter-spacing:-.02em;
  text-align:left;line-height:1;
}
.row.high .conf{color:var(--signal)}

.row .agt{font-family:var(--f-sans);font-size:11.5px;color:var(--fg-3);font-weight:400;display:flex;align-items:center;gap:7px;letter-spacing:-.005em}
.row .agt i{width:5px;height:5px;background:var(--fg-3);display:block;border-radius:50%}
.row.run-status .agt i{background:var(--status-run);animation:pulse 1.8s infinite}

.row .time{
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);text-align:right;letter-spacing:.02em;
  display:flex;justify-content:flex-end;align-items:center;gap:8px;
}
.row:hover .time .jump{opacity:1}
.row .time .jump{opacity:0;font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);transition:opacity .12s}

/* ============ INSPECTOR ============ */
.inspector{
  grid-area:inspector;border-left:1px solid var(--hair);background:#080808;
  display:grid;grid-template-rows:42px 1fr auto;
  overflow:hidden;min-width:0;
}
.insp-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;border-bottom:1px solid var(--hair);background:var(--bg-1);
}
.insp-head .crumb{
  font-family:var(--f-sans);font-size:12.5px;color:var(--fg-2);letter-spacing:-.005em;display:flex;align-items:center;gap:8px;
}
.insp-head .crumb b{color:var(--fg);font-weight:500}
.insp-head .crumb .id{font-family:var(--f-mono);font-size:10.5px;color:var(--fg-4);border:1px solid var(--hair-2);padding:1px 5px;border-radius:2px;margin-left:4px}
.insp-head .tools{display:flex;align-items:center;gap:2px}
.insp-head .iconbtn{width:24px;height:24px;color:var(--fg-3);font-family:var(--f-mono);font-size:11px;cursor:pointer;border-radius:3px}
.insp-head .iconbtn:hover{background:var(--bg-2);color:var(--fg)}

.insp-body{overflow-y:auto;overflow-x:hidden;padding:16px 18px 16px;display:flex;flex-direction:column;gap:14px}
.insp-body::-webkit-scrollbar{width:4px}
.insp-body::-webkit-scrollbar-thumb{background:var(--hair-2)}

/* inspector hero */
.it-hero{display:flex;flex-direction:column;gap:6px}
.it-hero .hero-row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:flex-start}
.it-hero .hero-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.it-hero .hero-viz{
  width:88px;height:88px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--hair-2);background:var(--bg);position:relative;flex-shrink:0;
}
.it-hero .hero-viz::before,.it-hero .hero-viz::after{
  content:"";position:absolute;width:8px;height:8px;border:0 solid var(--signal);pointer-events:none;
}
.it-hero .hero-viz::before{top:-1px;left:-1px;border-top-width:1.5px;border-left-width:1.5px}
.it-hero .hero-viz::after{bottom:-1px;right:-1px;border-bottom-width:1.5px;border-right-width:1.5px}
.it-hero .hero-viz canvas{width:78px !important;height:78px !important}
.it-hero .topline{
  font-family:var(--f-mono);font-size:10.5px;color:var(--signal);letter-spacing:.02em;
  display:flex;align-items:center;gap:8px;
}
.it-hero .topline .dt{width:5px;height:5px;background:var(--signal);border-radius:50%}
.it-hero h2{
  font-family:var(--f-display);font-weight:900;text-transform:uppercase;
  font-size:38px;line-height:.92;letter-spacing:-.02em;color:var(--fg);margin:6px 0 2px;
}
.it-hero h2 em{font-style:normal;color:var(--signal)}
.it-hero .sub{font-family:var(--f-sans);font-size:12.5px;color:var(--fg-2);line-height:1.5;margin-top:6px;letter-spacing:-.005em}
.it-hero .sub b{color:var(--fg);font-weight:500}

/* prop list */
.it-props{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair);border:1px solid var(--hair)}
.it-props .p{padding:10px 12px;background:var(--bg-1);display:flex;flex-direction:column;gap:3px}
.it-props .p .k{font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);letter-spacing:.14em;text-transform:uppercase}
.it-props .p .v{font-family:var(--f-num);font-size:22px;color:var(--fg);font-weight:700;letter-spacing:-.02em;display:flex;align-items:baseline;gap:4px;line-height:1}
.it-props .p .v .u{font-family:var(--f-mono);font-size:10px;color:var(--signal);font-weight:500;letter-spacing:.06em}

/* callout */
.callout{
  border-left:2px solid var(--signal);background:var(--signal-soft);
  padding:10px 14px;font-family:var(--f-sans);font-size:13px;line-height:1.55;color:var(--fg);letter-spacing:-.005em;
}
.callout b{color:var(--signal);font-weight:500}
.callout .who{display:flex;align-items:center;gap:7px;font-family:var(--f-sans);font-size:11px;color:var(--signal);font-weight:500;letter-spacing:-.005em;margin-bottom:5px}

/* section heading inside inspector */
.it-sec{
  display:flex;align-items:center;justify-content:space-between;
  font-family:var(--f-sans);font-size:11px;color:var(--fg-3);letter-spacing:-.005em;font-weight:500;
  padding:2px 0 4px;
}
.it-sec .id-pill{font-family:var(--f-mono);font-size:10px;color:var(--fg-4);margin-left:6px;font-weight:400}
.it-sec .more{font-family:var(--f-sans);font-size:11px;color:var(--fg-3);cursor:pointer;letter-spacing:-.005em}
.it-sec .more:hover{color:var(--fg)}

/* journey */
.journey{display:flex;flex-direction:column}
.j-row{display:grid;grid-template-columns:42px 12px 1fr;gap:10px;align-items:center;padding:7px 0;font-family:var(--f-sans);position:relative}
.j-row::before{content:"";position:absolute;left:46px;top:0;bottom:0;width:1px;background:var(--hair);z-index:0}
.j-row:first-child::before{top:50%}
.j-row:last-child::before{bottom:50%}
.j-row .t{font-family:var(--f-mono);font-size:10.5px;color:var(--fg-3);letter-spacing:.02em}
.j-row.dim .t{color:var(--fg-4)}
.j-row .d{width:7px;height:7px;background:var(--signal);border-radius:50%;justify-self:center;z-index:1;border:2px solid var(--bg)}
.j-row.dim .d{background:var(--fg-4)}
.j-row .what{font-size:12.5px;color:var(--fg);font-weight:500;letter-spacing:-.005em;line-height:1.4}
.j-row.dim .what{color:var(--fg-2)}
.j-row .what span{display:block;font-size:11.5px;color:var(--fg-3);font-weight:400;margin-top:1px;letter-spacing:-.005em}
.j-row .src{font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);display:block;margin-top:2px;letter-spacing:.02em}

/* stakeholders */
.stk{display:flex;flex-direction:column;border:1px solid var(--hair)}
.stk .p{padding:9px 12px;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;background:var(--bg-1)}
.stk .p:last-child{border-bottom:none}
.stk .p:hover{background:var(--bg-2)}
.stk .p b{font-family:var(--f-sans);font-size:12.5px;color:var(--fg);font-weight:500;letter-spacing:-.005em}
.stk .p .you-tag{font-family:var(--f-mono);font-size:9.5px;color:var(--signal);margin-left:6px;font-weight:400;letter-spacing:.02em}
.stk .p .role{font-family:var(--f-sans);font-size:11px;color:var(--fg-3);letter-spacing:-.005em}
.stk .p .tch{font-family:var(--f-sans);font-size:11.5px;color:var(--fg-2);text-align:right;letter-spacing:-.005em;display:flex;align-items:center;gap:6px;justify-content:flex-end}
.stk .p .tch i{width:5px;height:5px;background:var(--status-run);border-radius:50%}
.stk .p .tch.cold i{background:var(--fg-4)}
.stk .p .tch.warm i{background:var(--status-wait)}

/* playbook list */
.pb{display:flex;flex-direction:column;border:1px solid var(--hair)}
.pb .step{display:grid;grid-template-columns:54px 1fr 14px;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--hair);background:var(--bg-1);font-family:var(--f-sans);letter-spacing:-.005em}
.pb .step:last-child{border-bottom:none}
.pb .step .w{font-family:var(--f-mono);font-size:10px;color:var(--signal)}
.pb .step.done .w{color:var(--fg-3)}
.pb .step .t{font-size:12.5px;color:var(--fg);font-weight:500}
.pb .step .t span{display:block;font-size:11px;color:var(--fg-3);font-weight:400;margin-top:1px}
.pb .step.done .t{color:var(--fg-2)}
.pb .step .d{width:8px;height:8px;border:1.5px solid var(--signal);border-radius:50%;justify-self:end}
.pb .step.done .d{background:var(--fg-4);border-color:var(--fg-4)}

/* insp footer / fire */
.insp-foot{border-top:1px solid var(--hair);padding:10px 12px;display:flex;gap:6px;background:var(--bg-1)}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--f-sans);font-size:12px;font-weight:500;letter-spacing:-.005em;
  padding:6px 12px;background:var(--signal);color:#0a0a0a;cursor:pointer;border-radius:3px;
  transition:transform .12s,box-shadow .12s,background .12s;
  white-space:nowrap;
}
.btn:hover{background:var(--status-run)}
.btn.notched{
  clip-path:polygon(0 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%);
  border-radius:0;
}
.btn.ghost{background:transparent;color:var(--fg-2);border:1px solid var(--hair-2)}
.btn.ghost:hover{border-color:var(--hair-h);color:var(--fg);background:var(--bg-2)}
.btn.tiny{padding:4px 8px;font-size:11px}
.btn.full{flex:1;justify-content:center}
.btn .arr{font-size:11px;opacity:.7}

/* ============ FLOATING COMPOSER ============ */
.composer-float{
  position:fixed;bottom:18px;left:0;right:0;display:flex;justify-content:center;
  z-index:40;pointer-events:none;padding:0 24px;
}
.composer-float .pill{
  pointer-events:auto;
  width:100%;max-width:var(--composer-w);
  background:rgba(20,20,20,.85);backdrop-filter:saturate(180%) blur(20px);
  border:1px solid var(--hair-h);
  box-shadow:0 18px 50px rgba(0,0,0,.5),0 2px 0 rgba(255,255,255,.02) inset;
  border-radius:10px;overflow:hidden;
  display:flex;flex-direction:column;
}
.composer-float .meta{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 12px 6px;
  font-family:var(--f-sans);font-size:11px;color:var(--fg-3);letter-spacing:-.005em;
}
.composer-float .meta .l{display:flex;align-items:center;gap:8px}
.composer-float .meta .l .agent-tag{display:inline-flex;align-items:center;gap:6px;color:var(--fg-2)}
.composer-float .meta .l .agent-tag i{width:5px;height:5px;background:var(--signal);border-radius:50%}
.composer-float .meta .r{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}

.composer-float .s-chip{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--f-sans);font-size:11px;color:var(--fg-2);
  padding:3px 8px;border:1px solid var(--hair-2);background:var(--bg-1);cursor:pointer;letter-spacing:-.005em;border-radius:2px;
}
.composer-float .s-chip:hover{border-color:var(--hair-h);color:var(--fg);background:var(--bg-2)}
.composer-float .s-chip kbd{font-size:9px;padding:0 4px}

.composer-float .input-row{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  padding:6px 12px 12px;
}
.composer-float .prefix{
  font-family:var(--f-sans);font-size:12px;color:var(--fg-3);
  display:inline-flex;align-items:center;gap:6px;
}
.composer-float .prefix .ic{width:14px;height:14px;border:1px solid var(--hair-h);border-radius:3px;display:inline-flex;align-items:center;justify-content:center;color:var(--fg-2);font-family:var(--f-mono);font-size:9.5px}
.composer-float input{
  background:transparent;border:none;outline:none;color:var(--fg);
  font-family:var(--f-sans);font-size:14px;letter-spacing:-.01em;height:30px;width:100%;
}
.composer-float input::placeholder{color:var(--fg-3)}
.send-mini{
  height:26px;padding:0 10px;background:var(--signal);color:#0a0a0a;
  font-family:var(--f-sans);font-size:12px;font-weight:500;letter-spacing:-.005em;
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;border-radius:3px;
}
.send-mini:hover{background:var(--status-run)}
.send-mini kbd{font-family:var(--f-mono);font-size:9px;color:#0a0a0a;background:rgba(0,0,0,.18);padding:0 4px;border:none}

/* ============ AGENT THREAD MODE ============ */
.thread-wrap{
  overflow-y:auto;overflow-x:hidden;padding:28px 24px 140px;
  display:flex;flex-direction:column;align-items:stretch;background:transparent;
  position:relative;
}
/* single canvas covers the full main pane — sphere + ambient field rendered together,
   same as Waypath.html hero. No second atmos-field overlay needed. */
.thread-ascii-bg{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;opacity:.68;z-index:0;
  -webkit-mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);
  mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);
}
.thread-ascii-bg canvas{width:100% !important;height:100% !important;cursor:crosshair}
.thread{display:flex;flex-direction:column;gap:12px;max-width:760px;width:100%;margin:0 auto;position:relative;z-index:1}
.umsg{
  background:var(--bg-2);padding:10px 14px;border-radius:8px 8px 2px 8px;
  font-family:var(--f-sans);font-size:13.5px;color:var(--fg);align-self:flex-end;max-width:80%;letter-spacing:-.01em;line-height:1.5;
}
.umsg .who{font-family:var(--f-sans);font-size:11px;color:var(--fg-3);margin-bottom:3px;letter-spacing:-.005em}

/* agent message */
.amsg{background:transparent;padding:0}
.amsg .who{
  font-family:var(--f-sans);font-size:11px;color:var(--fg-2);display:flex;align-items:center;gap:7px;margin-bottom:6px;font-weight:500;letter-spacing:-.005em;
}
.amsg .who i{width:6px;height:6px;background:var(--signal);border-radius:50%;animation:pulse 2s infinite}
.amsg .who .dur{color:var(--fg-4);font-weight:400;margin-left:2px}
.amsg .body p{font-family:var(--f-sans);font-size:14.5px;line-height:1.55;color:var(--fg);margin:0;letter-spacing:-.005em}
.amsg .body p b{color:var(--signal);font-weight:500}

/* agent reasoning steps */
.agent-steps{
  display:flex;flex-direction:column;gap:3px;
  padding:8px 12px;border-left:1px solid var(--hair-h);margin-left:3px;
  font-family:var(--f-mono);font-size:11px;color:var(--fg-3);letter-spacing:.02em;line-height:1.5;
}
.agent-steps .step{display:flex;align-items:baseline;gap:8px;animation:fade-in .4s ease-out backwards}
.agent-steps .step:nth-child(1){animation-delay:0s}
.agent-steps .step:nth-child(2){animation-delay:.18s}
.agent-steps .step:nth-child(3){animation-delay:.36s}
.agent-steps .step:nth-child(4){animation-delay:.54s}
.agent-steps .step .ic{color:var(--signal);font-size:10.5px;width:10px}
.agent-steps .step .t{color:var(--fg-2)}
.agent-steps .step .meta{color:var(--fg-4);margin-left:auto;font-size:10px}
@keyframes fade-in{from{opacity:0;transform:translateX(-3px)}to{opacity:1;transform:translateX(0)}}

/* tool call chip */
.tool-call{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-2);letter-spacing:.04em;
  padding:5px 10px;border:1px solid var(--hair-2);background:var(--bg-1);border-radius:3px;
}
.tool-call .arr{color:var(--signal);font-size:11px}
.tool-call .tool{color:var(--fg);font-weight:500}
.tool-call .sep{color:var(--fg-4)}
.tool-call .status{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;padding:1px 6px;border-radius:2px}
.tool-call .status.sent{background:rgba(111,193,143,.12);color:var(--status-ready)}
.tool-call .status.queued{background:rgba(214,180,106,.12);color:var(--status-wait)}
.tool-call .status.error{background:rgba(224,96,74,.12);color:var(--status-err)}
.tool-call .target{color:var(--fg-3);font-size:10px}

/* draft preview card */
.draft-card{
  background:var(--bg-1);border:1px solid var(--hair-2);border-radius:6px;overflow:hidden;
  display:flex;flex-direction:column;
}
.draft-card .dc-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;border-bottom:1px solid var(--hair);background:var(--bg-2);
}
.draft-card .dc-tag{
  font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);letter-spacing:.18em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:6px;
}
.draft-card .dc-tag::before{
  content:"";width:6px;height:6px;background:var(--status-wait);border-radius:50%;
}
.draft-card .dc-tools{display:flex;gap:4px}
.draft-card .dc-tool{
  font-family:var(--f-sans);font-size:11px;color:var(--fg-3);
  padding:3px 8px;border:1px solid var(--hair-2);background:var(--bg);border-radius:2px;cursor:pointer;letter-spacing:-.005em;
}
.draft-card .dc-tool:hover{border-color:var(--hair-h);color:var(--fg)}
.draft-card .dc-tool.send{background:var(--signal);color:#0a0a0a;border-color:var(--signal);font-weight:500}
.draft-card .dc-tool.send:hover{background:var(--status-run)}
.draft-card .dc-row{
  display:grid;grid-template-columns:60px 1fr;gap:10px;padding:6px 14px;
  font-family:var(--f-sans);font-size:12px;letter-spacing:-.005em;
  border-bottom:1px solid var(--hair);
}
.draft-card .dc-row .dc-k{color:var(--fg-3)}
.draft-card .dc-row .dc-v{color:var(--fg)}
.draft-card .dc-row .dc-v b{font-weight:500}
.draft-card .dc-body{
  padding:14px;font-family:var(--f-sans);font-size:13.5px;color:var(--fg);line-height:1.6;letter-spacing:-.005em;
  white-space:pre-wrap;
}

/* typing indicator */
.typing{
  display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  padding:6px 12px;border:1px dashed var(--hair-h);background:rgba(20,20,20,.5);border-radius:3px;
  font-family:var(--f-sans);font-size:11.5px;color:var(--fg-3);letter-spacing:-.005em;
}
.typing .who{display:inline-flex;align-items:center;gap:7px;color:var(--fg-2);font-weight:500}
.typing .dots{display:inline-flex;gap:3px}
.typing .dots i{width:4px;height:4px;background:var(--signal);border-radius:50%;animation:typing-bounce 1.2s infinite ease-in-out}
.typing .dots i:nth-child(2){animation-delay:.15s}
.typing .dots i:nth-child(3){animation-delay:.30s}
.typing .action{color:var(--fg-3);font-style:italic;font-size:11px}
@keyframes typing-bounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-3px);opacity:1}}

.actcard{
  border:1px solid var(--hair);background:var(--bg-1);position:relative;
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:6px;
}
.actcard.high{border-color:var(--hair-h)}
.actcard.high::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal);border-radius:6px 0 0 6px}
.actcard .body{display:flex;flex-direction:column;gap:3px;min-width:0}
.actcard .body .topline{display:flex;align-items:center;gap:8px;font-family:var(--f-sans);font-size:11px;color:var(--fg-3);letter-spacing:-.005em}
.actcard .body .topline .conf{font-family:var(--f-mono);font-size:11px;color:var(--signal);font-weight:500}
.actcard .body .topline .id{font-family:var(--f-mono);font-size:10px;color:var(--fg-4)}
.actcard .body b{font-family:var(--f-sans);font-size:14px;color:var(--fg);font-weight:500;letter-spacing:-.01em}
.actcard .body p{font-family:var(--f-sans);font-size:12.5px;color:var(--fg-2);line-height:1.5;margin:2px 0 0;letter-spacing:-.005em}
.actcard .body p em{font-style:normal;color:var(--signal);font-weight:500}
.actcard .acts{display:flex;gap:6px;align-items:center;flex-shrink:0}

/* ============ FIRST RUN ============ */
.firstrun-wrap{overflow-y:auto;overflow-x:hidden;background:transparent;display:flex;justify-content:center;padding:60px 24px 160px;position:relative}
.firstrun-ascii-bg{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;opacity:.68;z-index:0;
  -webkit-mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);
  mask:linear-gradient(180deg,#000 0,#000 70%,transparent 100%);
}
.firstrun-ascii-bg canvas{width:100% !important;height:100% !important;cursor:crosshair}
.firstrun{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;max-width:520px;position:relative;z-index:1}
.firstrun .demo-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--f-sans);font-size:11.5px;color:var(--fg-2);letter-spacing:-.005em;
  border:1px solid var(--hair-2);padding:4px 9px;border-radius:99px;background:var(--bg-1);
}
.firstrun .demo-tag i{width:5px;height:5px;background:var(--signal);border-radius:50%}
/* firstrun headline — back to display font */
.firstrun h1{font-family:var(--f-display);font-weight:900;text-transform:uppercase;font-size:clamp(48px,6vw,80px);line-height:.86;letter-spacing:-.02em;color:var(--fg);margin:0;max-width:14ch}
.firstrun h1 em{font-style:normal;color:var(--signal)}
.firstrun .sub{font-family:var(--f-sans);font-size:14.5px;line-height:1.55;color:var(--fg-2);max-width:42ch;margin:0;letter-spacing:-.005em}
.firstrun .picks{display:flex;flex-direction:column;gap:6px;width:100%;margin-top:8px}
.firstrun .pick{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;
  border:1px solid var(--hair-2);background:var(--bg-1);padding:11px 14px;cursor:pointer;border-radius:6px;
  font-family:var(--f-sans);font-size:13px;color:var(--fg);letter-spacing:-.005em;
  transition:background .12s,border-color .12s;
}
.firstrun .pick:hover{border-color:var(--hair-h);background:var(--bg-2)}
.firstrun .pick .ic{width:8px;height:8px;border:1.5px solid var(--signal);border-radius:50%;flex-shrink:0;background:transparent}
.firstrun .pick .ic.solid{background:var(--signal)}
.firstrun .pick .lab{text-align:left;letter-spacing:-.01em;font-weight:500}
.firstrun .pick kbd{font-size:10px}
.firstrun .pick .arr{color:var(--fg-3);font-size:13px}

/* ============ ATMOSPHERE ============ */
.main{position:relative}
/* hidden — atmos field replaced by single sphere canvas (matches Waypath.html hero) */
.atmos-field{display:none}
.main > .subhead,.main > .list,.main > .thread-wrap,.main > .firstrun-wrap,.main > .reports{position:relative;z-index:1}

.atmos-glow{
  position:fixed;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(900px 500px at 78% 8%, rgba(255,90,31,.055), transparent 60%),
    radial-gradient(700px 420px at -8% 84%, rgba(255,90,31,.028), transparent 60%);
  animation:atmos-breathe 12s ease-in-out infinite;
}
@keyframes atmos-breathe{0%,100%{opacity:.7}50%{opacity:1}}

/* topbar trim — living scan */
.top::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent 0%,var(--signal) 20%,var(--signal) 30%,transparent 50%,transparent 100%);
  background-size:220% 100%;
  opacity:.55;pointer-events:none;
  animation:scan-slow 11s linear infinite;
}
@keyframes scan-slow{0%{background-position:-120% 0}100%{background-position:120% 0}}

.ticker{
  display:flex;align-items:center;gap:0;
  border-bottom:1px solid var(--hair);background:var(--bg);
  height:26px;overflow:hidden;position:relative;flex-shrink:0;z-index:2;
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;color:var(--fg-2);
}
.ticker .tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:0 12px;height:100%;background:var(--bg);border-right:1px solid var(--hair);
  color:var(--signal);font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:9.5px;flex-shrink:0;
  position:relative;z-index:2;
}
.ticker .tag i{width:5px;height:5px;background:var(--signal);border-radius:50%;animation:pulse 1.6s infinite}
.ticker .track{
  flex:1;overflow:hidden;position:relative;height:100%;display:flex;align-items:center;
  mask:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 30px),transparent);
  -webkit-mask:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 30px),transparent);
}
.ticker .lane{
  display:flex;align-items:center;gap:34px;white-space:nowrap;
  animation:ticker-scroll 64s linear infinite;padding-left:34px;
  will-change:transform;
}
.ticker .ev{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}
.ticker .ev .t{color:var(--fg-3);letter-spacing:.04em}
.ticker .ev .from{color:var(--fg-2);font-weight:500;letter-spacing:.06em}
.ticker .ev em{font-style:normal;color:var(--signal);font-weight:500}
.ticker .ev .sep{color:var(--fg-4);margin:0 4px}
@keyframes ticker-scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-50% - 17px))}}

/* status icon glow ring — in-progress only */
.row.high .st::after{
  content:"";position:absolute;width:24px;height:24px;border-radius:50%;
  box-shadow:0 0 0 0 rgba(255,90,31,.4);animation:halo 2.6s ease-out infinite;pointer-events:none;
}
.row .st{position:relative;overflow:visible}
.row .st .ascii-status{border-radius:50%;overflow:hidden}
@keyframes halo{0%{box-shadow:0 0 0 0 rgba(255,90,31,.4)}80%{box-shadow:0 0 0 6px rgba(255,90,31,0)}100%{box-shadow:0 0 0 0 rgba(255,90,31,0)}}

/* ============ /ATMOSPHERE ============ */

/* ============ TWEAKS visibility safety ============ */
.twk-panel{z-index:2147483647 !important}

/* ============ MOBILE ============ */
@media (max-width:1100px){
  .app.with-inspector{grid-template-columns:var(--rail-w) 1fr;grid-template-areas:"top top" "rail main"}
  .inspector{display:none}
}
@media (max-width:760px){
  .app{grid-template-columns:1fr;grid-template-areas:"top" "main"}
  .rail{display:none}
  .top{grid-template-columns:1fr auto}
  .top .ws{display:none}
  .row{grid-template-columns:24px 1fr 64px;gap:10px}
  .row .sig,.row .agt,.row .time{display:none}
  .row .conf{display:none}
  .composer-float{padding:0 12px;bottom:12px}
}

/* ============ SIGNAL STRIP (header center) ============
   Port of <ModuleCard strengthStrip /> — vermillion bars on a dark
   wp-grid-surface backdrop. Sits dead-center in the topbar. */
.top .signal-strip{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:10px;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  font-family:var(--f-mono);
  pointer-events:auto;
  user-select:none;
}
.top .signal-strip .ss-label{
  font-size:9.5px;color:var(--fg-3);letter-spacing:.14em;
}
.top .signal-strip .ss-num{
  font-size:9.5px;color:var(--fg-2);letter-spacing:.04em;font-feature-settings:"tnum" 1;
}
.top .signal-strip .ss-help{
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;
  width:13px;height:13px;border-radius:50%;
  border:1px solid var(--hair);
  background:rgba(255,255,255,.04);
  color:var(--fg-3);
  font-family:var(--f-mono);font-size:8.5px;font-weight:600;line-height:1;
  cursor:help;user-select:none;
  transition:background .15s, color .15s, border-color .15s;
}
.top .signal-strip .ss-help:hover,
.top .signal-strip .ss-help:focus-visible{
  background:rgba(255,255,255,.08);
  color:var(--fg-1);
  border-color:rgba(255,255,255,.18);
  outline:none;
}
.top .signal-strip .ss-tip{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);
  width:260px;padding:10px 12px;
  background:#0b0b0b;
  border:1px solid var(--hair);
  border-radius:3px;
  box-shadow:0 8px 24px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.6);
  font-family:var(--f-sans);font-size:11px;line-height:1.45;
  color:var(--fg-2);letter-spacing:0;text-transform:none;
  text-align:left;
  opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity .12s ease, transform .12s ease;
  z-index:50;
}
.top .signal-strip .ss-tip b{ color:var(--fg-1);font-weight:600; }
.top .signal-strip .ss-help:hover .ss-tip,
.top .signal-strip .ss-help:focus-visible .ss-tip{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(2px);
}
/* Sized for the 42px topbar — scale the spec's 2/10/14 up 2× and gap
   from 3 → 6 so the strip reads at header scale. Dark-bg tier inversion:
   the spec's #080808 / rgba(8,8,8,.25) tiers are designed for a light
   panel; on the dark topbar we invert to light-on-dark with the same
   contrast steps so `lo` / `md` / `hi` still read as a three-tier
   signal meter. */
.top .signal-strip > div{ gap:4px !important; }
.top .signal-strip .tick-lo,
.top .signal-strip .tick-md,
.top .signal-strip .tick-hi{
  width:3px !important;
  border-radius:2px !important;
  flex:none !important;
}
.top .signal-strip .tick-lo,
.top .signal-strip .tick-md{
  height:13px !important;
}
.top .signal-strip .tick-hi{
  height:18px !important;
  margin:-2.5px 0 !important;
}
.top .signal-strip .tick-lo{ background:rgba(250,250,249,.25) !important; }
.top .signal-strip .tick-md{ background:#FAFAF9 !important; }
.strength-strip{
  display:flex;align-items:center;gap:2px;height:18px;
}
.strength-strip .seg{
  width:2px;height:14px;border-radius:1px;flex:none;
  transition:background .2s ease;
}
.strength-strip .seg.lit{
  height:18px;
  background:#E8522B;
  box-shadow:0 0 6px rgba(232,82,43,.55);
}
.strength-strip .seg.on{
  background:#FAFAF9;
}
.strength-strip .seg.warn{
  background:rgba(232,82,43,.55);
}
.strength-strip .seg.off{
  background:#383838;
}

@media(max-width:900px){
  .top .signal-strip{display:none}
}

/* ============ ATLAS · correlation view (ATL-01) ============ */
.atlas-wrap{
  position:absolute;inset:0;
  background:#080808;
  overflow:hidden;
  font-family:var(--f-sans);
  /* sit above .atmos-glow (z:1), below composer (z:40), inspector closed in atlas mode */
  z-index:5;
}
.main.scenario-active .atlas-wrap,
.atlas-wrap{ z-index:5 }
.atlas-canvas{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  cursor:grab;background:#080808;
}
.atlas-canvas:active{cursor:grabbing}

/* top-left meta */
.atlas-meta{
  position:absolute;top:18px;left:22px;
  display:flex;flex-direction:column;gap:8px;
  max-width:360px;pointer-events:none;z-index:2;
}
.atlas-meta-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--f-mono);font-size:9.5px;color:var(--signal);
  letter-spacing:.18em;text-transform:uppercase;font-weight:500;
}
.atlas-meta-tag i{
  width:6px;height:6px;background:var(--signal);border-radius:50%;
  box-shadow:0 0 0 0 rgba(255,90,31,.6);animation:pulse 1.8s infinite;
}
.atlas-meta-stats{
  display:flex;align-items:center;gap:6px;
  font-family:var(--f-mono);font-size:10.5px;color:var(--fg-3);letter-spacing:.04em;
}
.atlas-meta-stats b{color:var(--fg);font-family:var(--f-num);font-weight:700;font-size:13px;letter-spacing:-.01em}
.atlas-meta-stats .dot{color:var(--fg-4)}
.atlas-meta-sub{
  font-family:var(--f-sans);font-size:12px;line-height:1.55;color:var(--fg-2);
  letter-spacing:-.005em;max-width:340px;
  padding-top:2px;
}

/* bottom-right legend */
.atlas-legend{
  position:absolute;bottom:120px;right:22px;
  background:rgba(11,11,11,.78);
  backdrop-filter:saturate(160%) blur(10px);
  border:1px solid var(--hair-2);
  padding:10px 13px 8px;border-radius:6px;
  display:flex;flex-direction:column;gap:4px;
  z-index:3;min-width:178px;
  box-shadow:0 12px 40px rgba(0,0,0,.5);
}
.atlas-legend-h{
  font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);
  letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  padding-bottom:4px;margin-bottom:3px;
  border-bottom:1px solid var(--hair);
}
.atlas-legend-row{
  display:grid;grid-template-columns:10px 1fr auto;gap:9px;align-items:center;
  font-family:var(--f-sans);font-size:11.5px;color:var(--fg-2);letter-spacing:-.005em;
}
.atlas-legend-row .sw{
  width:8px;height:8px;border-radius:50%;display:block;
  box-shadow:0 0 0 1px rgba(255,255,255,.04);
}
.atlas-legend-row .lab{color:var(--fg-2)}
.atlas-legend-row .ct{font-family:var(--f-mono);font-size:10px;color:var(--fg-4);letter-spacing:.02em}
.atlas-legend-foot{
  margin-top:6px;padding-top:7px;border-top:1px solid var(--hair);
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  font-family:var(--f-mono);font-size:9.5px;color:var(--fg-4);
  letter-spacing:.06em;text-transform:uppercase;
}
.atlas-legend-foot .sep{color:var(--hair-h)}

/* selection chip — top-right */
.atlas-sel{
  position:absolute;top:18px;right:22px;
  background:rgba(11,11,11,.85);
  backdrop-filter:saturate(160%) blur(10px);
  border:1px solid var(--hair-h);border-left:2px solid var(--signal);
  padding:10px 14px;border-radius:4px;
  display:flex;flex-direction:column;gap:5px;
  font-family:var(--f-sans);font-size:12.5px;color:var(--fg);letter-spacing:-.005em;
  min-width:220px;z-index:3;
  box-shadow:0 12px 40px rgba(0,0,0,.5);
}
.atlas-sel-row{display:flex;align-items:center;gap:8px}
.atlas-sel-row.dim{color:var(--fg-3);font-size:11px;font-family:var(--f-mono);letter-spacing:.02em}
.atlas-sel-row.dim b{color:var(--fg-2);font-weight:500}
.atlas-sel-row .sw{width:9px;height:9px;border-radius:50%;display:block;flex-shrink:0}
.atlas-sel-row b{color:var(--fg);font-weight:500;letter-spacing:-.005em}
.atlas-sel-row .tp{
  font-family:var(--f-mono);font-size:9.5px;color:var(--fg-3);letter-spacing:.14em;
  margin-left:auto;
}
.atlas-sel-row .dot{color:var(--fg-4)}

/* boot loader */
.atlas-boot{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:10px;
  font-family:var(--f-mono);font-size:11px;color:var(--fg-3);letter-spacing:.14em;
  text-transform:uppercase;background:#080808;z-index:4;
}
.atlas-boot-spin{
  width:14px;height:14px;border:1.5px solid var(--hair-h);border-top-color:var(--signal);
  border-radius:50%;animation:spin .9s linear infinite;
}

/* rail: Atlas + Demo */
.r-item.r-atlas .ic{color:var(--fg-3)}
.r-item.r-atlas:hover .ic,.r-item.r-atlas.on .ic{color:var(--signal)}
.r-item.r-demo{
  /* visually demote — it's a guided tour, not a destination */
  color:var(--fg-3);
}
.r-item.r-demo .ic{color:var(--fg-4)}
.r-item.r-demo:hover{color:var(--fg-2)}
.r-item.r-demo:hover .ic{color:var(--signal)}
.r-item.r-demo.on .ic{color:var(--signal)}
.r-item.r-demo.on{background:var(--bg-2);color:var(--fg)}
.r-demo-live{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--f-mono);font-size:9.5px;color:var(--signal);
  letter-spacing:.08em;text-transform:uppercase;
}
.r-demo-live i{width:5px;height:5px;background:var(--signal);border-radius:50%;animation:pulse 1.8s infinite}

/* atlas: shrink legend on narrow viewports */
@media(max-width:1100px){
  .atlas-legend{min-width:0;padding:9px 11px}
  .atlas-legend-row .lab{font-size:11px}
}
@media(max-width:760px){
  .atlas-meta{max-width:none;right:22px}
  .atlas-meta-sub{display:none}
  .atlas-sel{top:auto;bottom:160px;right:14px;left:14px}
  .atlas-legend{bottom:80px;right:14px;left:14px}
  .atlas-legend-foot{display:none}
}