.token-interface {
    justify-content: center;
    gap: var(--sp-3);
    flex-wrap: wrap;
    margin: 0.95rem 0 0.6rem;
  }

  #slide-5 .slide5-stage {
    grid-template-columns: minmax(0, 1fr) 0fr;
    transition: grid-template-columns 0.42s ease;
    align-items: stretch;
  }

  #slide-5 .slide5-right-reveal {
    margin-top: 0 !important;
    max-height: none;
    opacity: 0;
    overflow: hidden;
    transform: translateX(1rem);
    transition: opacity 0.3s ease, transform 0.36s ease;
  }

  #slide-5 .slide5-right-reveal .card {
    width: 100%;
  }

  #slide-5 .slide5-right-reveal.revealed {
    opacity: 1;
    transform: translateX(0);
  }

  #slide-5 .slide5-stage:has(.slide5-right-reveal.revealed) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .flow-box.raw      { border-color: rgba(160,80,0,0.45); color: var(--orange); background: rgba(160,80,0,0.08); }
  .flow-box.tokzr    { border-color: rgba(90,48,200,0.45); color: var(--purple); background: rgba(90,48,200,0.08); }
  .flow-box.ids      { border-color: rgba(42,79,214,0.5);  color: var(--accent); background: rgba(42,79,214,0.1); }
  .flow-box.embed    { border-color: rgba(15,110,47,0.45);  color: var(--green);  background: rgba(15,110,47,0.08); }

  .tradeoff-card {
    border-width: 1.25px;
  }
  .tradeoff-card h3 {
    margin-bottom: 0.35rem;
  }
  .pc-list {
    list-style: none;
    margin: 0;
  }
  .pc-list li {
    position: relative;
    padding-left: 1.05rem;
    margin: 0.3rem 0;
    font-size: var(--fs-xs);
    line-height: 1.45;
    color: #1a2050;
  }
  .pc-list.good li::before,
  .pc-list.bad li::before {
    position: absolute;
    left: 0;
    top: 0;
    font-weight: 700;
  }
  .pc-list.good li::before { content: '+'; color: var(--green); }
  .pc-list.bad li::before  { content: '-'; color: var(--red); }

  .token-count-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 0.85rem;
  }
  .token-count-box {
    flex: 1;
    min-width: 13rem;
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 0.7rem 0.8rem;
  }
  .token-count-label {
    font-size: var(--fs-2xs);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-dim);
    margin-bottom: 0.35rem;
  }
  .token-count-number {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-xs);
    color: #0d1020;
  }

  .corpus-card {
    background: var(--surface2);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 0.82rem 0.95rem;
  }
  .corpus-title {
    font-size: var(--fs-2xs);
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-dim);
    margin-bottom: 0.35rem;
  }
  .corpus-body {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-2xs);
    line-height: 1.58;
    color: #0d1020;
    white-space: pre-line;
  }
  .pair-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
  }
  .pair-chip {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-2xs);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 0.45rem 0.55rem;
    background: rgba(42,79,214,0.08);
    color: #0f1a60;
  }
  .pair-chip strong {
    color: var(--accent);
  }

  /* Slide 9: keep the two BPE intro cards content-sized instead of stretched. */
  #slide-9 .slide-body {
    justify-content: flex-start;
  }

  #slide-9 .slide-body > .grid-2 {
    flex: 0 0 auto;
    align-items: start;
    margin-top: 0.75rem !important;
  }

  #slide-9 .card {
    height: fit-content;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  /* BPE walkthrough: each reveal should replace the previous overlay in place. */
  .bpe-initial {
    transition: opacity 0.35s ease;
  }
  .bpe-initial:has(~ .bpe-overlay.revealed) {
    opacity: 0;
    pointer-events: none;
  }
  .bpe-overlay.hidden-content.revealed:has(~ .bpe-overlay.hidden-content.revealed) {
    opacity: 0 !important;
    pointer-events: none;
  }
  .bpe-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin-top: 0;
    background: var(--bg);
  }

  .token-example {
    display: flex;
    flex-wrap: wrap;
    gap: 0.38rem;
    align-items: center;
  }
  .token-pill {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-2xs);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.5rem;
    background: var(--surface2);
    color: #0d1020;
  }
  .token-pill.main { border-color: rgba(42,79,214,0.55); color: #0d1020; background: rgba(42,79,214,0.12); }
  .token-pill.reuse { border-color: rgba(15,110,47,0.5); color: #0a3e1a; background: rgba(15,110,47,0.12); }
  .token-pill.flex { border-color: rgba(160,80,0,0.5); color: #5a2800; background: rgba(160,80,0,0.12); }
  .token-pill.discovery {
    border-color: rgba(15,110,47,0.56);
    color: #0a3e1a;
    background: rgba(15,110,47,0.16);
    box-shadow: 0 0 0 0.1rem rgba(15,110,47,0.1);
  }
  .token-pill.discovery-ed {
    border-color: rgba(160,80,0,0.56);
    color: #5a2800;
    background: rgba(160,80,0,0.16);
    box-shadow: 0 0 0 0.1rem rgba(160,80,0,0.08);
  }
  .corpus-discovery,
  .corpus-discovery-ed {
    display: inline-block;
    padding: 0.04rem 0.18rem;
    border-radius: 0.32rem;
    font-weight: 700;
    line-height: 1.1;
  }
  .corpus-discovery {
    color: #0a3e1a;
    background: rgba(15,110,47,0.16);
    box-shadow: inset 0 0 0 1px rgba(15,110,47,0.2);
  }
  .corpus-discovery-ed {
    color: #5a2800;
    background: rgba(160,80,0,0.16);
    box-shadow: inset 0 0 0 1px rgba(160,80,0,0.22);
  }
  .discovery-callout {
    background: rgba(15,110,47,0.1);
    border: 1px solid rgba(15,110,47,0.26);
    color: #0a3e1a;
  }
  .discovery-callout.discovery-callout-ed {
    background: rgba(160,80,0,0.1);
    border-color: rgba(160,80,0,0.24);
    color: #5a2800;
  }
  .example-sentence {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-xs);
    line-height: 1.6;
    color: #0f1a60;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: rgba(42,79,214,0.08);
  }
  .sense-sentence {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-xs);
    line-height: 1.62;
    color: #0f1a60;
    padding: 0.62rem 0.74rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(42,79,214,0.32);
    background: rgba(42,79,214,0.12);
  }
  .sense-focus {
    display: inline-block;
    padding: 0.08rem 0.26rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(106,79,0,0.48);
    background: rgba(106,79,0,0.16);
    color: #4a3200;
    font-weight: 700;
  }
  .id-seq {
    font-family: 'JetBrains Mono', monospace;
    font-size: var(--fs-2xs);
    line-height: 1.55;
    color: #0d1020;
    padding: 0.6rem 0.7rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: var(--surface2);
  }

  #slide-6 .spacer-sm,
#slide-7 .spacer-sm,
#slide-8 .spacer-sm {
  height: 0.0rem;
}

#slide-6 .slide-header h2,
#slide-7 .slide-header h2,
#slide-8 .slide-header h2,
#slide-11 .slide-header h2,
#slide-12 .slide-header h2 {
  margin-bottom: -1.5rem;
}

#slide-5 .slide-header h2 {
  margin-bottom: -1.5rem;
}

#slide-10 .corpus-body,
#slide-10 .token-pill,
#slide-10 .pair-chip {
  font-size: 0.92rem;
}

/* Slide 13: From token IDs to vectors — vertical spacing control */
#slide-13 .small-text {
  margin-bottom: -1.8rem;  /* intro text → math */
}
#slide-13 .math {
  margin: 0.5rem 0;  /* math spacing */
}
#slide-13 .flow.token-interface {
  margin-top: -6.8rem;  /* math → flow */
  margin-bottom: -0.25rem;  /* flow → grid */
}
#slide-13 .grid-2 {
  margin-top: -0.5rem;
}