:root{--bg:#FAFAF7;--card:#FFFFFF;--ink:#0F0F0E;--muted:#5C6168;--line:#E3E1D9;--sky:#0A6C9F;--sky-ink:#FFFFFF;--sky-soft:#E8F4FB;--surface:#F1F0E9;--test:#8A5A00;--test-soft:#FFF4DC;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#070708;--card:#111214;--ink:#F4F6F8;--muted:#9AA3AB;--line:#26292C;--sky:#8FD8FF;--sky-ink:#070708;--sky-soft:#0F2230;--surface:#0E1013;--test:#F2C66D;--test-soft:#2A2110;color-scheme:dark}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.55 system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
@media (min-width:900px){.wrap{padding:0 40px}}
header{padding:14px 0;border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.logo{font-weight:800;font-size:21px;letter-spacing:-.02em;color:var(--ink);text-decoration:none}
.test{font-size:14px;font-weight:700;color:var(--test);background:var(--test-soft);border:1px solid var(--test);border-radius:999px;padding:4px 12px}
.doc h1{font-weight:800;letter-spacing:-.03em}
.doc h2{font-size:clamp(21px,5vw,27px);margin:34px 0 10px;letter-spacing:-.015em}
.doc h3{font-size:18px;margin:22px 0 6px}
.doc p{margin:0 0 14px}
.doc ul{padding-left:22px;margin:0 0 14px}
.doc li{margin-bottom:8px}
.doc table{width:100%;border-collapse:collapse;font-size:15px}
.doc th,.doc td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.doc th{font-size:14px;color:var(--muted);font-weight:600}
.doc code{font-size:.88em;background:var(--sky-soft);color:var(--sky);padding:2px 6px;border-radius:5px}
.parametri td:last-child{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;overflow-wrap:anywhere}
.avviso{color:var(--test)}
.hdr-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
footer{border-top:1px solid var(--line);padding:24px 0 40px;color:var(--muted);font-size:14px}
footer a{color:var(--sky)}
/* I docs di scontract.ai. Lo stesso file serve il sito (sopra site.css, di cui
   usa i token) e l'ambiente di test (dove i token li definisce il Worker).
   Lo scrive scripts/docs.mjs: si modifica qui, in scontratto-app. */

.docs{display:grid;gap:28px;padding:20px 0 56px}
@media (min-width:900px){.docs{grid-template-columns:220px minmax(0,1fr);gap:48px;padding-top:36px}}

/* l'indice: in colonna su desktop, a capo su telefono */
.docs-nav{font-size:15px}
.docs-nav p{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.docs-nav ul + p{margin-top:16px}
.docs-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.docs-nav a{display:block;padding:6px 10px;border-radius:8px;color:var(--ink);text-decoration:none;border:1px solid var(--line);background:var(--card)}
.docs-nav a:hover{border-color:var(--sky)}
.docs-nav a[aria-current="page"]{border-color:var(--sky);color:var(--sky);font-weight:700}
@media (min-width:900px){
  .docs-nav{position:sticky;top:24px;align-self:start}
  .docs-nav ul{display:block}
  .docs-nav li{margin:0}
  .docs-nav a{border:0;border-left:2px solid var(--line);border-radius:0;background:none;padding:7px 12px}
  .docs-nav a[aria-current="page"]{border-left-color:var(--sky)}
}

.docs .doc{min-width:0;max-width:74ch}
.docs .doc h1{font-size:clamp(32px,7vw,48px);line-height:1.02;margin:0 0 18px}
.docs .doc h2{scroll-margin-top:16px}
.docs .doc h3{scroll-margin-top:16px}
.docs .doc p,.docs .doc li{max-width:none}
.docs .doc ol{padding-left:22px;margin:0 0 14px}
.docs .doc a{color:var(--sky)}
.docs .doc blockquote{margin:0 0 18px;padding:4px 0 4px 16px;border-left:3px solid var(--sky);color:var(--muted)}
.docs .doc blockquote p{margin:0}

/* codice */
.docs .doc pre{margin:0 0 18px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow-x:auto;font-size:14px;line-height:1.55}
.docs .doc pre code{background:none;color:var(--ink);padding:0;font-size:inherit;border-radius:0}
.docs .doc code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-wrap:anywhere}
.docs .doc pre code{overflow-wrap:normal;white-space:pre}

/* tabelle: scorrono da sole su telefono, la pagina no */
.tabella{overflow-x:auto;margin:0 0 18px}
.docs .doc .tabella table{margin:0;min-width:480px}
.docs .doc th:empty{padding:0}
/* nelle celle il codice non si spezza a meta' parola: scorre la tabella */
.docs .doc td code,.docs .doc th code{white-space:nowrap;overflow-wrap:normal}

/* in fondo: pagina precedente e successiva */
.docs-pie{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:15px}
.docs-pie a{color:var(--sky);font-weight:600;text-decoration:none}
.docs-pie .dopo{margin-left:auto;text-align:right}

/* il cartellino accanto al logo */
.docs-tag{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sky);border:1px solid var(--sky);border-radius:999px;padding:2px 8px;vertical-align:middle;margin-left:4px}

/* il selettore di lingua: porta alla pagina gemella nell'altra lingua */
.docs-lang{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;font-size:13px;font-weight:700;background:var(--card)}
.docs-lang a,.docs-lang span{padding:6px 11px;line-height:1.2;text-decoration:none;color:var(--muted)}
.docs-lang a:hover{color:var(--ink)}
.docs-lang span{background:var(--sky);color:var(--sky-ink)}
.hdr-right .docs-lang{margin-right:2px}