.noe{
  position:relative;border-radius:24px;overflow:hidden;
  border:1px solid var(--line-hi);background:#07080c;
  box-shadow:0 60px 130px -60px rgba(0,0,0,1),
             0 0 100px -50px rgba(167,139,250,.3);
}
.noe-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 55% 60% at 50% 50%,rgba(167,139,250,.08),transparent 70%),
    radial-gradient(ellipse 40% 40% at 15% 85%,rgba(0,245,196,.05),transparent 70%),
    linear-gradient(180deg,#0a0b11,#05060a);
}
.noe-bg::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(circle,rgba(167,139,250,.14) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 20%,transparent 75%);
  mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 20%,transparent 75%);
}
.noe-content{position:relative;z-index:2}

.noe-top{
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:20px;
  padding:18px 24px;border-bottom:1px solid var(--line);
}
.noe-file{
  display:flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:11.5px;color:var(--dim);min-width:0;
}
.noe-file span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.noe-file b{color:var(--violet-lt);font-weight:600}
.noe-mode{display:flex;gap:4px;justify-self:center}
.nm{
  font-family:var(--mono);font-size:11px;letter-spacing:1.4px;
  padding:7px 15px;border-radius:8px;cursor:none;
  background:transparent;border:1px solid transparent;
  color:var(--dim);transition:.28s;white-space:nowrap;
}
.nm:hover{color:var(--muted);background:rgba(255,255,255,.04)}
.nm.on{
  color:var(--violet-lt);border-color:rgba(167,139,250,.4);
  background:rgba(167,139,250,.08);
}
.noe-gh{
  font-family:var(--mono);font-size:11px;
  color:var(--dim);text-decoration:none;
  border:1px solid var(--line);padding:6px 13px;
  border-radius:8px;transition:.25s;
  justify-self:end;cursor:none;
}
.noe-gh:hover{color:var(--violet-lt);border-color:rgba(167,139,250,.4)}

.noe-main{
  display:grid;grid-template-columns:230px 1fr 260px;
  gap:0;min-height:520px;
}
.noe-queue{
  border-right:1px solid var(--line);
  padding:20px 16px;
  display:flex;flex-direction:column;gap:18px;
  max-height:580px;overflow-y:auto;
}
.noe-queue::-webkit-scrollbar{width:4px}
.noe-queue::-webkit-scrollbar-thumb{background:var(--line-hi);border-radius:2px}
.nq-head{
  font-family:var(--mono);font-size:10px;letter-spacing:2px;
  color:var(--dim);text-transform:uppercase;margin-bottom:2px;
}
.nq-bucket{margin-bottom:4px}
.nq-blabel{
  font-family:var(--mono);font-size:10px;letter-spacing:1.2px;
  color:var(--dim);margin-bottom:7px;
  display:flex;align-items:center;gap:7px;
}
.nq-blabel i{width:6px;height:6px;border-radius:50%;display:block;flex-shrink:0}
.nq-item{
  display:flex;align-items:center;gap:8px;
  padding:6px 9px;border-radius:7px;cursor:none;
  font-family:var(--mono);font-size:11px;color:var(--muted);
  transition:.25s;border:1px solid transparent;
  white-space:nowrap;overflow:hidden;
}
.nq-item > span:nth-child(2){overflow:hidden;text-overflow:ellipsis}
.nq-item:hover{
  background:rgba(255,255,255,.04);
  border-color:var(--line);color:var(--text);
}
.nq-item.active{
  background:rgba(167,139,250,.1);
  border-color:rgba(167,139,250,.35);
  color:var(--violet-lt);
}
.nq-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
.nq-conf{
  margin-left:auto;font-size:10px;color:var(--dim);
  flex-shrink:0;font-variant-numeric:tabular-nums;
}

.noe-viz{
  position:relative;display:grid;place-items:center;
  padding:30px 20px;
}
.noe-stage{position:relative;width:100%;height:100%;min-height:440px}
.noe-legend{
  position:absolute;bottom:14px;left:50%;transform:translateX(-50%);
  display:flex;gap:16px;
  font-family:var(--mono);font-size:10px;color:var(--dim);
}
.lg{display:flex;align-items:center;gap:6px}
.lg i{width:7px;height:7px;border-radius:50%;display:block}

.gnode{
  position:absolute;transform:translate(-50%,-50%);
  border-radius:10px;border:1px solid var(--line-hi);
  background:rgba(10,11,17,.92);backdrop-filter:blur(6px);
  padding:10px 14px;cursor:none;
  transition:.35s var(--ease);z-index:2;
}
.gnode:hover,.gnode.active{
  border-color:rgba(167,139,250,.6);
  box-shadow:0 0 30px -8px rgba(167,139,250,.7);
  transform:translate(-50%,-50%) scale(1.05);
  z-index:3;
}
.gnode-type{
  font-family:var(--mono);font-size:9px;letter-spacing:1.2px;
  color:var(--dim);margin-bottom:3px;
}
.gnode-name{
  font-size:12px;font-weight:600;letter-spacing:-.2px;
  color:var(--text);white-space:nowrap;
}
.gnode.active .gnode-name{color:var(--violet-lt)}

.noe-explain{
  border-left:1px solid var(--line);
  padding:20px 18px;
  display:flex;flex-direction:column;gap:16px;
  max-height:580px;overflow-y:auto;
}
.noe-explain::-webkit-scrollbar{width:4px}
.noe-explain::-webkit-scrollbar-thumb{background:var(--line-hi);border-radius:2px}
.nx-head{
  font-family:var(--mono);font-size:10px;letter-spacing:2px;
  color:var(--violet-lt);text-transform:uppercase;
}
.nx-atom{
  border:1px solid var(--line);border-radius:10px;padding:12px;
  font-family:var(--mono);font-size:11px;
}
.nx-atom-from{color:var(--muted);margin-bottom:3px}
.nx-atom-rel{color:var(--violet-lt);font-size:10px;letter-spacing:.8px;margin-bottom:3px}
.nx-atom-to{color:var(--text);font-weight:600}
.nx-ev{
  display:flex;gap:9px;align-items:flex-start;
  padding:9px 0;border-bottom:1px solid var(--line);
}
.nx-ev:last-child{border-bottom:0}
.nx-ev-type{
  font-family:var(--mono);font-size:9px;letter-spacing:.8px;
  padding:2px 7px;border-radius:4px;flex-shrink:0;
  margin-top:1px;text-transform:uppercase;
}
.nx-ev-type.support{background:rgba(0,245,196,.1);color:var(--cyan)}
.nx-ev-type.contradiction{background:rgba(255,45,120,.1);color:var(--magenta)}
.nx-ev-type.baseline{background:rgba(255,255,255,.06);color:var(--muted)}
.nx-ev-text{font-size:11.5px;color:var(--muted);line-height:1.6;flex:1}
.nx-conf{
  font-family:var(--mono);font-size:10px;color:var(--dim);
  flex-shrink:0;font-variant-numeric:tabular-nums;
}

.noe-foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:14px 24px;
  border-top:1px solid var(--line);flex-wrap:wrap;
}
.noe-stats{display:flex;gap:24px;flex-wrap:wrap}
.ns{font-family:var(--mono);font-size:10.5px;color:var(--dim);letter-spacing:.5px}
.ns b{
  color:var(--text);font-weight:700;
  margin-right:5px;font-variant-numeric:tabular-nums;
}
.noe-tag{
  font-family:var(--mono);font-size:10px;letter-spacing:1.4px;
  color:var(--dim);border:1px solid var(--line);
  padding:4px 11px;border-radius:999px;
}

@media(max-width:1080px){
  .noe-main{grid-template-columns:1fr;min-height:auto}
  .noe-queue{
    border-right:0;border-bottom:1px solid var(--line);
    max-height:240px;flex-direction:row;flex-wrap:wrap;gap:10px;
  }
  .noe-explain{
    border-left:0;border-top:1px solid var(--line);
    max-height:280px;
  }
  .noe-viz{min-height:380px}
  .noe-stage{min-height:320px}
}
@media(max-width:720px){
  .noe-top{grid-template-columns:1fr;gap:12px}
  .noe-mode{justify-self:start}
  .noe-gh{justify-self:start}
  .noe-queue{padding:14px 12px}
  .noe-legend{position:static;transform:none;margin-top:14px;justify-content:center}
}
/* ── 跳數控制（浮在舞台右下角） ── */
.noe-viz{position:relative}
.noe-depth-ctl{
  position:absolute;bottom:18px;right:18px;
  display:flex;align-items:center;gap:5px;
  padding:6px 12px 6px 10px;
  background:rgba(10,9,27,.82);
  border:1px solid rgba(167,139,250,.25);
  border-radius:999px;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  font-family:var(--mono);
  z-index:5;
}
.nd-label{
  font-size:9.5px;letter-spacing:1.4px;
  color:var(--dim);margin-right:4px;
}
.nd-btn{
  width:22px;height:22px;border-radius:50%;
  border:1px solid rgba(167,139,250,.25);
  background:transparent;color:var(--dim);
  font-family:var(--mono);font-size:10.5px;
  cursor:none;transition:.2s;
  display:grid;place-items:center;
}
.nd-btn:hover{color:var(--accent);border-color:var(--accent)}
.nd-btn.on{
  background:var(--accent);color:#0a091b;
  border-color:var(--accent);font-weight:700;
  box-shadow:0 0 12px rgba(167,139,250,.55);
}

/* ── 節點平滑過渡 ── */
/* ── Orbit 節點卡片：縮小、單行、不換行 ── */
.orbit-node{
  position:absolute;transform:translate(-50%,-50%);
  background:#191830;
  border:1px solid rgba(255,255,255,.08);
  border-top-width:2px;
  border-radius:8px;
  padding:6px 10px;
  font-size:10.5px;
  text-align:center;
  min-width:56px;
  max-width:110px;
  cursor:none;user-select:none;
  transition:
    left .55s cubic-bezier(.22,.9,.28,1),
    top  .55s cubic-bezier(.22,.9,.28,1),
    opacity .4s ease,
    border-color .25s,
    box-shadow .25s,
    transform .25s;
  z-index:2;
}

.orbit-node:hover{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(167,139,250,.15);
  transform:translate(-50%,-50%) scale(1.04);
  z-index:3;
}

.orbit-node.is-focus{
  border-color:var(--accent2);
  background:rgba(244,114,182,.12);
  box-shadow:0 0 0 4px rgba(244,114,182,.15);
  font-weight:600;
}

.orbit-node.active:not(.is-focus){
  border-color:var(--accent2);
  box-shadow:0 0 0 3px rgba(244,114,182,.15);
}

.orbit-node .on-name{
  color:var(--text);
  font-size:10.5px;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.orbit-node .on-type{
  color:rgba(255,255,255,.22);
  font-size:8.5px;
  margin-top:1px;
  font-family:var(--mono);
  letter-spacing:.4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ── Reasoning 鏈 ── */
.rp-node{
  color:var(--accent);
  font-weight:600;cursor:none;
  border-bottom:1px dashed rgba(167,139,250,.5);
  transition:.2s;
}
.rp-node:hover{color:var(--accent2);border-bottom-color:var(--accent2)}
.rp-arrow{color:var(--dim);margin:0 6px}