.sentence-paths-overlay{
  position:absolute;
  inset:8px 8px 44px 8px;
  z-index:118;
  display:grid;
  grid-template-rows:auto auto auto auto 1fr;
  background:
    radial-gradient(circle at 8% 0%,rgba(196,148,255,.18),transparent 28%),
    radial-gradient(circle at 92% 0%,rgba(103,210,173,.12),transparent 32%),
    linear-gradient(160deg,rgba(7,11,17,.98),rgba(8,14,24,.94));
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  box-shadow:0 26px 70px rgba(0,0,0,.4);
  overflow:hidden;
  transition:border .2s ease,box-shadow .2s ease;
}
.sentence-paths-overlay:focus-within{
  border-color:rgba(221,184,111,.5);
  box-shadow:0 30px 80px rgba(0,0,0,.45);
}
.sentence-paths-overlay .sp-head,
.sentence-paths-overlay .sp-filters,
.sentence-paths-overlay .sp-summary,
.sentence-paths-overlay .sp-lens-strip{
  padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,.09);
  background:rgba(12,16,22,.9);
  backdrop-filter:blur(6px);
}
.sentence-paths-overlay .sp-head{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  align-items:end;
}
.sentence-paths-overlay .sp-title-block{
  display:grid;
  gap:4px;
}
.sentence-paths-overlay .sp-kicker,
.sentence-paths-overlay .sp-panel-kicker{
  font-family:'JetBrains Mono',monospace;
  font-size:.54rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#7f93b8;
}
.sentence-paths-overlay .sp-title-block h2{
  margin:0;
  font-family:'Cormorant Garamond',serif;
  letter-spacing:.12em;
  font-size:1.3rem;
  color:#f2d49a;
}
.sentence-paths-overlay .sp-sub{
  color:#96a9cd;
  font-family:'JetBrains Mono',monospace;
  font-size:.6rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.sentence-paths-overlay .sp-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.sentence-paths-overlay .sp-toolbar select,
.sentence-paths-overlay .sp-toolbar button,
.sentence-paths-overlay .sp-search input,
.sentence-paths-overlay .sp-zoom input{
  border:1px solid rgba(255,255,255,.2);
  background:rgba(17,22,30,.85);
  color:#f0f4ff;
  border-radius:12px;
  outline:none;
  transition:border .18s ease,background .18s ease;
}
.sentence-paths-overlay .sp-toolbar select{
  height:40px;
  padding:0 12px;
  font-size:.7rem;
}
.sentence-paths-overlay .sp-zoom{
  display:flex;
  align-items:center;
  gap:8px;
}
.sentence-paths-overlay .sp-zoom button,
.sentence-paths-overlay .sp-fullscreen,
.sentence-paths-overlay .sp-close,
.sentence-paths-overlay .sp-actions button{
  padding:8px 12px;
  font-size:.62rem;
  font-family:'JetBrains Mono',monospace;
  cursor:pointer;
}
.sentence-paths-overlay .sp-fullscreen[data-active="true"]{
  border-color:rgba(221,184,111,.42);
  background:rgba(221,184,111,.16);
  color:#fff0cb;
}
.sentence-paths-overlay .sp-close{
  width:36px;
  height:36px;
  padding:0;
}
.sentence-paths-overlay .sp-zoom input{
  width:118px;
  accent-color:#ddb86f;
  border:none;
  background:none;
}
.sentence-paths-overlay .sp-filters{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.sentence-paths-overlay .sp-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  color:#d7e4fb;
  font-size:.68rem;
}
.sentence-paths-overlay .sp-toggle input{accent-color:#ddb86f}
.sentence-paths-overlay .sp-search{
  margin-left:auto;
  min-width:min(340px,100%);
}
.sentence-paths-overlay .sp-search input{
  width:100%;
  height:40px;
  padding:0 12px;
  font-size:.72rem;
}
.sentence-paths-overlay .sp-context{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:#cedaf1;
  font-size:.66rem;
}
.sentence-paths-overlay .sp-context[hidden]{
  display:none;
}
.sentence-paths-overlay .sp-context button{
  border:none;
  background:transparent;
  color:#f6dfb2;
  font-family:'JetBrains Mono',monospace;
  font-size:.58rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}
.sentence-paths-overlay .sp-context button:hover{
  color:#fff0cf;
}
.sentence-paths-overlay .sp-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:10px;
}
.sentence-paths-overlay .sp-lens-strip{
  display:flex;
  align-items:center;
  gap:8px;
  overflow:auto;
  background:linear-gradient(90deg,rgba(196,148,255,.08),rgba(103,210,173,.045));
}
.sentence-paths-overlay .sp-lens-strip button{
  flex:0 0 auto;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:#e8f0ff;
  font-family:'JetBrains Mono',monospace;
  font-size:.58rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.sentence-paths-overlay .sp-lens-strip button:hover{
  transform:translateY(-1px);
  border-color:rgba(196,148,255,.42);
  background:rgba(196,148,255,.12);
  box-shadow:0 10px 26px rgba(0,0,0,.2);
}
.sentence-paths-overlay .sp-stat{
  min-height:58px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.025);
  padding:10px 12px;
  display:grid;
  gap:4px;
}
.sentence-paths-overlay .sp-stat span{
  font-family:'JetBrains Mono',monospace;
  font-size:.54rem;
  letter-spacing:.08em;
  color:#8599bf;
  text-transform:uppercase;
}
.sentence-paths-overlay .sp-stat strong{
  color:#eef4ff;
  font-size:.78rem;
}
.sentence-paths-overlay .sp-main{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:0;
}
.sentence-paths-overlay .sp-stage-shell{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  border-right:1px solid rgba(255,255,255,.08);
}
.sentence-paths-overlay .sp-chapters{
  display:flex;
  align-items:stretch;
  gap:8px;
  padding:12px 18px;
  overflow:auto;
  border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02);
}
.sentence-paths-overlay .sp-chapter{
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.022)),
    linear-gradient(180deg,rgba(221,184,111,var(--fill,.22)),rgba(122,168,255,.02));
  color:#d9e7ff;
  min-width:82px;
  padding:10px 12px;
  cursor:pointer;
  display:grid;
  gap:4px;
}
.sentence-paths-overlay .sp-chapter strong{font-size:.76rem}
.sentence-paths-overlay .sp-chapter span{
  font-size:.58rem;
  font-family:'JetBrains Mono',monospace;
  color:#98aacc;
}
.sentence-paths-overlay .sp-chapter.act{
  border-color:rgba(221,184,111,.42);
  box-shadow:0 0 0 1px rgba(221,184,111,.2) inset;
}
.sentence-paths-overlay .sp-chapter.ctx{
  border-color:rgba(103,210,173,.34);
}
.sentence-paths-overlay .sp-stage-scroll{
  position:relative;
  overflow:auto;
  background:
    radial-gradient(circle at 18% 16%,rgba(196,148,255,.08),transparent 30%),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) 0 0/48px 48px,
    linear-gradient(180deg,rgba(8,12,20,.72),rgba(5,8,14,.92));
}
.sentence-paths-overlay .sp-stage-scroll canvas{
  display:block;
}
.sentence-paths-overlay .sp-tip{
  position:absolute;
  pointer-events:none;
  max-width:290px;
  background:rgba(10,15,23,.96);
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  padding:10px 12px;
  color:#d6e5ff;
  font-size:.68rem;
  line-height:1.4;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .12s ease,transform .12s ease;
  box-shadow:0 12px 30px rgba(0,0,0,.45);
  z-index:5;
}
.sentence-paths-overlay .sp-tip strong{display:block;color:#ffe7ad;margin-bottom:4px}
.sentence-paths-overlay .sp-tip p{margin:0 0 5px;color:#d1def6}
.sentence-paths-overlay .sp-tip small{color:#95a9cf;font-family:'JetBrains Mono',monospace;font-size:.56rem}
.sentence-paths-overlay .sp-tip.vis{opacity:1;transform:translateY(0)}
.sentence-paths-overlay .sp-inspector{
  min-width:0;
  min-height:0;
  overflow:auto;
  padding:16px;
  display:grid;
  align-content:start;
  gap:12px;
}
.sentence-paths-overlay .sp-panel,
.sentence-paths-overlay .sp-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.024));
}
.sentence-paths-overlay .sp-panel-hot{
  border-color:rgba(196,148,255,.22);
  background:
    linear-gradient(135deg,rgba(196,148,255,.13),rgba(103,210,173,.06)),
    rgba(255,255,255,.035);
}
.sentence-paths-overlay .sp-panel{
  padding:12px 13px;
  display:grid;
  gap:8px;
}
.sentence-paths-overlay .sp-panel h3{
  margin:0;
  color:#f1f5fd;
  font-size:1.06rem;
}
.sentence-paths-overlay .sp-panel p{
  margin:0;
  color:#bdcee9;
  font-size:.68rem;
  line-height:1.55;
}
.sentence-paths-overlay .sp-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.sentence-paths-overlay .sp-card{
  padding:10px 12px;
  display:grid;
  gap:5px;
}
.sentence-paths-overlay .sp-card span{
  color:#8fa4cc;
  font-size:.56rem;
  font-family:'JetBrains Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sentence-paths-overlay .sp-card strong{color:#eef4ff;font-size:.82rem}
.sentence-paths-overlay .sp-list{
  display:grid;
  gap:8px;
}
.sentence-paths-overlay .sp-list-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font-size:.64rem;
  border-bottom:1px solid rgba(255,255,255,.05);
  padding-bottom:7px;
}
.sentence-paths-overlay .sp-list-action{
  width:100%;
  appearance:none;
  border-top:0;
  border-left:0;
  border-right:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
}
.sentence-paths-overlay .sp-list-action:hover{
  background:rgba(196,148,255,.07);
  border-radius:10px;
  padding:7px 8px;
  margin:-7px -8px 0;
}
.sentence-paths-overlay .sp-list-row:last-child{
  border-bottom:none;
  padding-bottom:0;
}
.sentence-paths-overlay .sp-list-row span{color:#d6e2f7}
.sentence-paths-overlay .sp-list-row strong{color:#aecdff;font-weight:600}
.sentence-paths-overlay .sp-actions button{
  border:1px solid rgba(221,184,111,.36);
  background:rgba(221,184,111,.12);
  color:#fff0c8;
  border-radius:999px;
}
.sentence-paths-overlay .sp-empty{
  color:#95a9cf;
  font-size:.66rem;
  line-height:1.5;
}
@media (max-width:1000px){
  .sentence-paths-overlay{
    inset:6px;
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto auto 1fr;
  }
  .sentence-paths-overlay .sp-main{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-stage-shell{
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .sentence-paths-overlay .sp-summary{
    grid-template-columns:repeat(auto-fit,minmax(100px,1fr));
  }
  .sentence-paths-overlay .sp-chapters{
    padding:8px 12px;
    gap:6px;
  }
}
@media (max-width:700px){
  .sentence-paths-overlay .sp-toolbar{
    justify-content:flex-start;
  }
  .sentence-paths-overlay .sp-search{
    width:100%;
  }
  .sentence-paths-overlay .sp-context{
    flex-wrap:wrap;
  }
  .sentence-paths-overlay .sp-zoom input{
    width:100%;
  }
  .sentence-paths-overlay .sp-stage-scroll{
    height:320px;
  }
  .sentence-paths-overlay .sp-inspector{
    padding:12px;
  }
}
@media (max-width:1260px){
  .sentence-paths-overlay .sp-summary{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .sentence-paths-overlay .sp-main{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-stage-shell{
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
}
@media (max-width:900px){
  .sentence-paths-overlay{
    inset:6px 6px 44px 6px;
  }
  .sentence-paths-overlay .sp-head{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-toolbar{
    justify-content:flex-start;
  }
  .sentence-paths-overlay .sp-summary{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .sentence-paths-overlay .sp-grid{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-search{
    margin-left:0;
    min-width:100%;
  }
}

/* BAIBEL UI v2 alignment */
.sentence-paths-overlay{
  inset:10px 10px 40px 10px;
  border-radius:14px;
  grid-template-rows:auto auto auto auto minmax(0,1fr);
  background:
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px) 0 0/64px 64px,
    linear-gradient(160deg,rgba(7,11,17,.97),rgba(7,12,18,.93));
  box-shadow:0 22px 58px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.035);
}
.sentence-paths-overlay .sp-head,
.sentence-paths-overlay .sp-filters,
.sentence-paths-overlay .sp-summary,
.sentence-paths-overlay .sp-lens-strip{
  padding:11px 14px;
}
.sentence-paths-overlay .sp-title-block h2{
  font-size:1.18rem;
  letter-spacing:.09em;
}
.sentence-paths-overlay .sp-toolbar select,
.sentence-paths-overlay .sp-toolbar button,
.sentence-paths-overlay .sp-search input,
.sentence-paths-overlay .sp-zoom input{
  border-radius:10px;
}
.sentence-paths-overlay .sp-stat,
.sentence-paths-overlay .sp-chapter,
.sentence-paths-overlay .sp-panel,
.sentence-paths-overlay .sp-card,
.sentence-paths-overlay .sp-tip{
  border-radius:10px;
}
.sentence-paths-overlay .sp-summary{
  grid-template-columns:repeat(auto-fit,minmax(116px,1fr));
}
.sentence-paths-overlay .sp-main{
  grid-template-columns:minmax(0,1fr) minmax(280px,320px);
}
.sentence-paths-overlay .sp-stage-scroll{
  background:
    linear-gradient(180deg,rgba(8,12,20,.76),rgba(5,8,14,.9)),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px) 0 0/48px 48px;
}
.sentence-paths-overlay .sp-inspector{
  padding:14px;
}
.sentence-paths-overlay .sp-route-legend{
  display:grid;
  grid-template-columns:minmax(190px,.45fr) minmax(0,1fr);
  gap:10px;
  align-items:center;
  padding:10px 14px;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(90deg,rgba(196,148,255,.09),rgba(103,210,173,.045)),
    rgba(255,255,255,.025);
}
.sentence-paths-overlay .sp-route-focus{
  min-width:0;
  display:grid;
  gap:3px;
}
.sentence-paths-overlay .sp-route-focus span,
.sentence-paths-overlay .sp-lane-chip,
.sentence-paths-overlay .sp-pillline span,
.sentence-paths-overlay .sp-signal span,
.sentence-paths-overlay .sp-signal small{
  font-family:'JetBrains Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sentence-paths-overlay .sp-route-focus span{
  color:#90a7cb;
  font-size:.52rem;
}
.sentence-paths-overlay .sp-route-focus strong{
  color:#fff0cb;
  font-size:.86rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sentence-paths-overlay .sp-route-lanes{
  min-width:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.sentence-paths-overlay .sp-lane-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:0 9px;
  border:1px solid color-mix(in srgb,var(--lane) 34%,rgba(255,255,255,.09));
  border-radius:999px;
  background:color-mix(in srgb,var(--lane) 11%,rgba(255,255,255,.035));
  color:#eaf2ff;
  font-size:.5rem;
}
.sentence-paths-overlay .sp-lane-chip i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--lane);
  box-shadow:0 0 15px color-mix(in srgb,var(--lane) 70%,transparent);
}
.sentence-paths-overlay .sp-lane-chip b{
  color:#fff3d8;
  font-size:.56rem;
}
.sentence-paths-overlay .sp-focus-card{
  position:relative;
  overflow:hidden;
  display:grid;
  gap:10px;
  padding:15px;
  border:1px solid rgba(196,148,255,.22);
  border-radius:16px;
  background:
    radial-gradient(circle at 8% 0%,rgba(196,148,255,.18),transparent 38%),
    linear-gradient(135deg,rgba(24,20,34,.94),rgba(10,16,21,.92));
  box-shadow:0 20px 54px rgba(0,0,0,.26);
}
.sentence-paths-overlay .sp-focus-card::after{
  content:'';
  position:absolute;
  inset:auto 12px 10px 12px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(196,148,255,.85),rgba(103,210,173,.72),transparent);
  transform-origin:left;
  animation:spRouteGrow 3.8s ease-in-out infinite;
}
.sentence-paths-overlay .sp-focus-card.selected{
  border-color:rgba(242,198,109,.34);
  background:
    radial-gradient(circle at 8% 0%,rgba(242,198,109,.18),transparent 38%),
    linear-gradient(135deg,rgba(31,25,17,.96),rgba(10,16,21,.92));
}
.sentence-paths-overlay .sp-focus-card h3{
  margin:0;
  color:#fff1cc;
  font-family:'Cormorant Garamond',serif;
  font-size:1.34rem;
  line-height:1;
}
.sentence-paths-overlay .sp-focus-card p{
  margin:0;
  color:#dbe7f8;
  font-size:.76rem;
  line-height:1.52;
}
.sentence-paths-overlay .sp-pillline{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.sentence-paths-overlay .sp-pillline span{
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:#edf5ff;
  font-size:.5rem;
}
.sentence-paths-overlay .sp-signal-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.sentence-paths-overlay .sp-signal{
  padding:10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:13px;
  background:rgba(255,255,255,.032);
}
.sentence-paths-overlay .sp-signal span,
.sentence-paths-overlay .sp-signal small{
  display:block;
  color:#8fa4cc;
  font-size:.48rem;
}
.sentence-paths-overlay .sp-signal strong{
  display:block;
  margin:4px 0 3px;
  color:#f5f8ff;
  font-size:1rem;
}
.sentence-paths-overlay .sp-flow-list{
  display:grid;
  gap:7px;
}
.sentence-paths-overlay .sp-flow-row{
  display:grid;
  gap:4px;
  width:100%;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.025);
  color:#dce8fa;
  text-align:left;
  cursor:pointer;
}
.sentence-paths-overlay .sp-flow-row.act{
  border-color:rgba(242,198,109,.32);
  background:rgba(242,198,109,.1);
}
.sentence-paths-overlay .sp-flow-row span{
  color:#aecdff;
  font-family:'JetBrains Mono',monospace;
  font-size:.52rem;
}
.sentence-paths-overlay .sp-flow-row strong{
  color:#f5f8ff;
  font-size:.72rem;
  line-height:1.32;
}
@keyframes spRouteGrow{
  50%{transform:scaleX(.42);opacity:.48}
}
@media (max-width:1100px){
  .sentence-paths-overlay{
    inset:8px 8px 40px 8px;
  }
  .sentence-paths-overlay .sp-main{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-route-legend{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay .sp-route-lanes{
    justify-content:flex-start;
  }
}
.sentence-paths-overlay:fullscreen{
  inset:0;
  border-radius:0;
  grid-template-rows:auto auto auto auto minmax(0,1fr);
  padding:12px;
  background:
    radial-gradient(circle at top left,rgba(221,184,111,.11),transparent 28%),
    linear-gradient(160deg,rgba(5,8,13,.99),rgba(7,12,18,.98));
}
.sentence-paths-overlay:fullscreen .sp-head{
  border-radius:18px 18px 0 0;
}
.sentence-paths-overlay:fullscreen .sp-main{
  grid-template-columns:minmax(0,1fr) minmax(320px,380px);
  min-height:0;
}
.sentence-paths-overlay:fullscreen .sp-stage-scroll{
  min-height:0;
}
@media (max-width:900px){
  .sentence-paths-overlay:fullscreen .sp-main{
    grid-template-columns:1fr;
  }
  .sentence-paths-overlay:fullscreen .sp-inspector{
    display:none;
  }
}
