@layer modules {
  /* Languages in flow settings: one row per language, then a three-step guide to offering callers another one. */
  .language-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r-control); }
  .language-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 2.8rem; align-items: center; gap: 1rem; min-height: 4.4rem; padding: .4rem .6rem .4rem 1.2rem; }
  .language-row + .language-row { border-top: 1px solid var(--line); }
  .language-default { display: flex; align-items: center; gap: .8rem; min-width: 0; cursor: pointer; }
  .language-default input { accent-color: var(--focus); }
  .language-name { font-weight: 600; }
  .language-name code { margin-left: .3rem; font-weight: 400; }
  .language-default-tag { visibility: hidden; padding: .1rem .7rem; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); font-size: 1.15rem; color: var(--ink-2); }
  .language-row.is-default .language-default-tag { visibility: visible; }
  .language-coverage { font-size: 1.25rem; color: var(--ok-ink); }
  .language-coverage.is-missing { color: var(--warning); }
  .language-row.is-default .language-remove { visibility: hidden; }
  .language-add { display: flex; gap: .6rem; margin-top: .8rem; }
  .language-add .field { flex: 1; min-width: 0; }
  .language-guide { margin-top: 1.6rem; padding: 1.4rem 1.6rem; border-radius: var(--r-card); background: var(--router-soft); }
  .language-guide-title { margin: 0 0 1rem; font-size: 1.45rem; font-weight: 650; }
  .guide-steps { list-style: none; margin: 0; padding: 0; counter-reset: guide; display: grid; gap: 1.2rem; }
  .guide-step { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); gap: 1rem; counter-increment: guide; }
  .guide-step p { margin: 0; }
  .guide-step .hint { margin-top: .2rem; }
  .guide-step .btn { margin-top: .8rem; }
  .guide-heading { font-weight: 600; }
  .guide-mark { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--surface); border: 1px solid var(--router-line); font-size: 1.2rem; font-weight: 650; color: var(--router-ink); }
  .guide-mark::before { content: counter(guide); }
  .guide-step.is-done .guide-mark { background: var(--ok); border-color: var(--ok); color: var(--on-accent); }
  .guide-step.is-done .guide-mark::before { content: "✓"; }
}
