.docs{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start;padding-block:clamp(28px,5vw,56px)}
.toc{position:sticky;top:20px;border-top:1px solid var(--text);padding-top:14px}
.toc-h{font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 10px}
.toc ol{list-style:none;margin:0;padding:0}
.toc a{display:block;padding:6px 0 6px 12px;border-left:2px solid var(--line);color:var(--muted);text-decoration:none;font-size:14px;line-height:1.35}
.toc a:hover{color:var(--text)} .toc a.on{color:var(--text);border-left-color:var(--text)}
@media(max-width:860px){.docs{grid-template-columns:1fr}.toc{position:static}.toc ol{display:flex;flex-wrap:wrap;gap:4px 14px}.toc a{border-left:0;padding:2px 0;border-bottom:1px solid var(--line)}}

.doc{min-width:0;max-width:78ch}
.dh{padding-bottom:clamp(20px,3vw,36px);border-bottom:1px solid var(--text)}
.dh h1{font:400 clamp(38px,6vw,72px)/1.02 var(--serif);letter-spacing:-.02em}
.dh .lead{max-width:56ch;font-size:clamp(19px,2.2vw,24px)}
.doc section{padding-block:clamp(30px,4.5vw,52px);border-bottom:1px solid var(--line)}
.doc section:last-child{border-bottom:0}
.doc h2{display:flex;align-items:baseline;gap:14px;font:400 clamp(28px,3.4vw,40px)/1.1 var(--serif);letter-spacing:-.01em;margin:0 0 18px}
.doc{counter-reset:sec} .doc section{counter-increment:sec}
.doc h2::before{content:counter(sec,decimal-leading-zero);font:400 13px var(--mono);color:var(--faint);letter-spacing:0}
.doc h3{font:500 16px var(--sans);margin:26px 0 8px;color:var(--text)}
.doc p,.doc li{color:#cfc9bb}
.doc p{margin:0 0 14px} .doc ul,.doc ol:not(.toc ol){padding-left:1.25em;margin:0 0 14px} .doc li{margin:5px 0}
.doc b{color:var(--text);font-weight:500}
.doc code{font:13px var(--mono);background:#1c1c18;border:1px solid var(--line);padding:1px 5px;border-radius:2px;color:var(--text);overflow-wrap:anywhere}
.doc .note{color:var(--faint);font-size:13.5px}
.flow{counter-reset:s;list-style:none;padding-left:0!important}
.flow li{counter-increment:s;position:relative;padding:8px 0 8px 40px;border-top:1px solid var(--line);margin:0}
.flow li::before{content:counter(s);position:absolute;left:0;top:9px;font:500 12px var(--mono);color:var(--faint);width:26px}
.flow li:last-child{border-bottom:1px solid var(--line)}
.tw{overflow-x:auto;margin:6px 0 16px;border-top:1px solid var(--text)}
.doc table{width:100%;border-collapse:collapse;font-size:14px}
.doc th{text-align:left;font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:10px 14px 10px 0;border-bottom:1px solid var(--line2)}
.doc td{padding:11px 14px 11px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--muted)}
.doc td:first-child{color:var(--text);white-space:nowrap}
@media(max-width:640px){
  .doc table,.doc tbody,.doc tr{display:block}
  .doc thead{display:none}
  .doc tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .doc td:not([data-l]),html[lang=fr] .doc td[data-l=fr],html[lang=en] .doc td[data-l=en]{display:block;padding:2px 0;border:0}
  .doc td:first-child{white-space:normal;overflow-wrap:anywhere;font-size:15px}
}
.doc pre.code{position:relative;margin:6px 0 18px;max-height:none;font-size:12.5px}
.copy{position:absolute;top:8px;right:8px;background:var(--bg);color:var(--muted);border:1px solid var(--line2);border-radius:2px;padding:3px 9px;font:500 11px var(--mono);cursor:pointer}
.copy:hover{color:var(--text);border-color:var(--text)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 36px}
.grid2>div{min-width:0}
.grid2 h3{margin-top:10px;padding-top:12px;border-top:1px solid var(--line2)}

/* workflows */
.wf{margin-top:22px}
.wf-desc{color:var(--muted);max-width:62ch}
.wf-bar{margin:6px 0 14px}
.stages{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 14px;align-items:start}
.stg{border-top:2px solid var(--line);padding-top:10px;transition:border-color .3s}
.stg h4{margin:0 0 10px;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--faint);transition:color .3s}
.stg.run{border-top-color:var(--warn)} .stg.run h4{color:var(--warn)}
.stg.done{border-top-color:var(--ok)} .stg.done h4{color:var(--ok)}
.stg.done h4::after{content:" ✓"} .stg.run h4::after{content:" …"}
.job{border:1px solid var(--line);background:var(--surface);padding:10px 12px;margin-bottom:10px;transition:border-color .3s}
.stg.run .job{border-color:var(--warn)} .stg.done .job{border-color:#35503a}
.job b{display:block;font:500 14px var(--sans);color:var(--text)}
.job .ji{display:block;font-size:11.5px;color:var(--faint);margin:2px 0 6px;overflow-wrap:anywhere}
.job p{margin:0 0 8px;font-size:13px;line-height:1.45;color:var(--muted)}
.jt{display:inline-block;font:400 11px var(--mono);color:var(--faint);border:1px solid var(--line2);padding:1px 6px}
.jt.main{color:var(--warn);border-color:#5a4a22}
.wf-meta{display:grid;grid-template-columns:minmax(110px,170px) minmax(0,1fr);margin:16px 0 4px;border-top:1px solid var(--text)}
.wf-meta dt,.wf-meta dd{margin:0;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.wf-meta dt{color:var(--muted);font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.05em;padding-top:12px}
.wf-meta dd{color:var(--text);overflow-wrap:anywhere} .wf-meta dd.mono{font-size:12.5px}
#wfCode{max-height:420px}

/* Configuration viewer */
.tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);flex-wrap:wrap;margin-bottom:16px}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:9px 0;color:var(--muted);font:500 14px var(--sans);cursor:pointer}
.tabs button:hover{color:var(--text)} .tabs button.on{color:var(--text);border-bottom-color:var(--text)}
@media(max-width:640px){   /* one row that scrolls sideways instead of wrapping into rows of uneven length */
  .tabs{flex-wrap:nowrap;gap:20px;overflow-x:auto;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:none;white-space:nowrap;margin-bottom:0}
}
.cfg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;align-items:start}
@media(max-width:900px){.cfg{grid-template-columns:1fr}}
.code{margin:0;padding:16px 18px;background:#0b0b09;border:1px solid var(--line2);font:12.5px/1.6 var(--mono);color:#cfc9bb;overflow:auto;max-height:520px;white-space:pre}
.code .c{color:#6b675e} .code .k{color:#9db4c9} .code .s{color:#a9cfa9} .code .w{color:#e0b050}
.why{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.why li{padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:14.5px} .why li b{color:var(--text);font-weight:500}