/* oppi doc --site — Atelier skin (light + dark).  Light tokens at >= 4.5:1 on
   --bg and --pane (WCAG 2.2 AA, axe, 22/10: muted, operator, constructor and
   comment were 4.2-4.4:1). */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fraunces-600-latin.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-sans-400-latin.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-sans-600-latin.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-400-latin.woff2) format('woff2')}

:root{
  --bg:#fdfcf9; --surface:#ffffff; --pane:#f3f0e8; --pane-2:#ece8dd;
  --border:#e5dfd1; --border-strong:#d6cebc; --text:#211e17; --muted:#70685a;
  --fg-dim:#574f40; --accent:#4f46e5; --accent-ink:#ffffff; --hover:#ebe6da;
  --font-ui:'IBM Plex Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --shadow:0 6px 18px rgba(40,33,20,.11),0 2px 5px rgba(40,33,20,.06);
  --badge-data:#0e7490; --badge-iface:#7c3aed;
  --t-keyword:#475569; --t-operator:#ad4700; --t-punctuation:#1a1a1a;
  --t-number:#0550ae; --t-string:#0a7d33; --t-constructor:#7a46d6;
  --t-variable:#1a1a1a; --t-comment:#5f6670;
}
:root[data-theme="dark"]{
  --bg:#15130d; --surface:#211d15; --pane:#1b1810; --pane-2:#232017;
  --border:#332f24; --border-strong:#46402f; --text:#ece5d6; --muted:#9c9482;
  --fg-dim:#c4bdac; --accent:#aab4ff; --accent-ink:#14130d; --hover:#272217;
  --shadow:0 10px 30px rgba(0,0,0,.5);
  --badge-data:#22a5b8; --badge-iface:#b794f6;
  --t-keyword:#94a3b8; --t-operator:#ffa657; --t-punctuation:#e6e6e6;
  --t-number:#79c0ff; --t-string:#7ee787; --t-constructor:#d2a8ff;
  --t-variable:#e6e6e6; --t-comment:#a9b4bf;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#15130d; --surface:#211d15; --pane:#1b1810; --pane-2:#232017;
    --border:#332f24; --border-strong:#46402f; --text:#ece5d6; --muted:#9c9482;
    --fg-dim:#c4bdac; --accent:#aab4ff; --accent-ink:#14130d; --hover:#272217;
    --shadow:0 10px 30px rgba(0,0,0,.5);
    --badge-data:#22a5b8; --badge-iface:#b794f6;
    --t-keyword:#94a3b8; --t-operator:#ffa657; --t-punctuation:#e6e6e6;
    --t-number:#79c0ff; --t-string:#7ee787; --t-constructor:#d2a8ff;
    --t-variable:#e6e6e6; --t-comment:#a9b4bf;
  }
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--font-ui);background:var(--bg);color:var(--text);line-height:1.6;
  font-size:15px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:var(--accent)}

.layout{display:grid;grid-template-columns:clamp(220px,18vw,280px) minmax(0,1fr) clamp(180px,15vw,240px);
  min-height:100vh;max-width:1520px;margin:0 auto}

/* ── sidebar ── */
.sidebar{position:sticky;top:0;align-self:start;height:100vh;overflow:auto;
  border-right:1px solid var(--border);background:var(--pane);padding:1rem .9rem}
.brand{display:block;font-family:var(--font-display);font-weight:600;font-size:1.5rem;
  color:var(--text);text-decoration:none;margin:.1rem .2rem 1rem}
.brand:hover{color:var(--accent)}
.search{position:relative;margin-bottom:1rem}
.search input{width:100%;padding:.5em .7em;border:1px solid var(--border-strong);border-radius:8px;
  background:var(--surface);color:var(--text);font:inherit;font-size:.9rem}
.search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--hover)}
.results{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);margin:0;padding:.25rem;
  list-style:none;background:var(--surface);border:1px solid var(--border-strong);border-radius:8px;
  box-shadow:var(--shadow);max-height:62vh;overflow:auto}
.results li a{display:flex;gap:.5em;align-items:baseline;padding:.35em .5em;border-radius:6px;
  text-decoration:none;color:var(--text)}
.results li.active a,.results li a:hover{background:var(--hover)}
.res-name{font-family:var(--font-mono);font-weight:600;font-size:.85rem}
.res-mod{color:var(--muted);font-size:.74rem;margin-left:auto}
.res-kind{font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--border);border-radius:999px;padding:0 .4em}
.modtree details{margin:.05rem 0}
.modtree summary{cursor:pointer;font-family:var(--font-display);font-weight:600;font-size:.95rem;
  padding:.25em .3em;border-radius:6px;list-style:none}
.modtree summary::-webkit-details-marker{display:none}
.modtree summary::before{content:"\25B8";display:inline-block;width:1em;color:var(--muted);
  transition:transform .15s ease}
.modtree details[open]>summary::before{transform:rotate(90deg)}
.modtree summary:hover{background:var(--hover)}
.modtree ul{list-style:none;margin:0;padding:0 0 0 .85rem}
.modtree li.mod>a{display:block;padding:.18em .35em;border-radius:5px;color:var(--fg-dim);
  text-decoration:none;font-size:.88rem}
.modtree li.mod>a:hover{background:var(--hover);color:var(--text)}
.modtree li.current>a{color:var(--accent);font-weight:600}
.modtree .symbols{padding-left:.5rem;border-left:1px solid var(--border);margin:.1rem 0 .35rem .35rem}
.modtree .symbols a{display:block;padding:.08em .35em;font-family:var(--font-mono);font-size:.76rem;
  color:var(--muted);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modtree .symbols a:hover{color:var(--accent)}

/* ── main column ── */
.main{min-width:0}
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:1rem;
  padding:.55rem clamp(1rem,3vw,2.2rem);background:var(--bg);border-bottom:1px solid var(--border)}
.breadcrumb{font-size:.9rem;color:var(--muted)}
.breadcrumb .sep{margin:0 .1em;color:var(--border-strong)}
.lang-switch{margin-left:auto;border:1px solid var(--border-strong);background:var(--surface);
  color:var(--text);padding:0 .55rem;height:2rem;display:inline-flex;align-items:center;
  border-radius:7px;font-size:.85rem;font-weight:600;text-decoration:none;letter-spacing:.02em}
.lang-switch:hover{border-color:var(--accent);color:var(--accent)}
.theme-toggle{margin-left:auto;border:1px solid var(--border-strong);background:var(--surface);
  color:var(--text);width:2rem;height:2rem;border-radius:7px;cursor:pointer;font-size:1.05rem;line-height:1}
.lang-switch + .theme-toggle{margin-left:.5rem}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}
.content{padding:1.1rem clamp(1rem,3vw,2.2rem) 5rem;max-width:62rem}

/* ── doc fragment ── */
.oppi-doc{font-size:.97rem}
.content h1,.oppi-doc h1,.oppi-doc h2,.oppi-doc h3,.oppi-doc h4{font-family:var(--font-display);
  font-weight:600;line-height:1.2;margin:1.6em 0 .5em}
.content h1,.oppi-doc h1{font-size:1.95rem}
.oppi-doc h2{font-size:1.4rem;border-bottom:1px solid var(--border);padding-bottom:.25em}
.oppi-doc h3{font-size:1.12rem}
.oppi-doc>h1:first-child,.oppi-doc>h2:first-child{margin-top:.2em}
.oppi-doc p{margin:.6em 0;color:var(--fg-dim)}
.oppi-doc ul,.oppi-doc ol{color:var(--fg-dim)}
.oppi-doc a{color:var(--accent);text-decoration:none}
.oppi-doc a:hover{text-decoration:underline}
.oppi-doc code{font-family:var(--font-mono);font-size:.86em;background:var(--pane-2);
  border:1px solid var(--border);border-radius:4px;padding:.05em .35em}
.oppi-doc pre{background:var(--pane);border:1px solid var(--border);border-radius:10px;
  padding:.7em .9em;overflow:auto;margin:.6em 0}
.oppi-doc pre code{background:none;border:none;padding:0;font-size:.85rem;line-height:1.65}
.oppi-doc .decl{position:relative;margin:2.3em 0;padding-top:.2em}
.oppi-doc pre.sig{margin:0 0 .55em;border:1px solid var(--border);border-left:3px solid var(--accent);
  background:var(--surface);scroll-margin-top:4.2rem}
.oppi-doc pre.sig code{font-size:.92rem}
.oppi-doc .doc{color:var(--fg-dim)}
.oppi-doc dl.ctors,.oppi-doc dl.args{margin:.55em 0 0;padding-left:.85em;border-left:2px solid var(--border)}
.oppi-doc dl.ctors dt,.oppi-doc dl.args dt{margin-top:.5em;font-family:var(--font-mono);font-size:.85rem}
.oppi-doc dl.ctors dd,.oppi-doc dl.args dd{margin:.1em 0 .25em 1em;color:var(--muted)}
.oppi-doc dl.args dt.result{color:var(--accent)}
.oppi-doc .instances{margin:.6em 0 0;padding:.45em .7em;background:var(--pane-2);
  border:1px solid var(--border);border-radius:8px;font-size:.86rem;line-height:1.9}
.oppi-doc .instances-label{font-weight:600;color:var(--muted);margin-right:.35em}
.oppi-doc .instances a{font-family:var(--font-mono);white-space:nowrap}
.oppi-doc a.xref{text-decoration:none}
.oppi-doc a.xref:hover{text-decoration:underline}
.oppi-doc pre a.xref:hover{text-decoration:underline dotted}
/* kind badges: a small pill per declaration */
.oppi-doc .decl::before{position:absolute;right:0;top:-.1em;font-family:var(--font-ui);
  font-size:.62rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:.15em .55em;border-radius:999px;color:var(--accent-ink);background:var(--muted)}
.oppi-doc .decl-sig::before{content:"fn";background:var(--accent)}
.oppi-doc .decl-data::before{content:"data";background:var(--badge-data)}
.oppi-doc .decl-interface::before{content:"interface";background:var(--badge-iface)}
.permalink{position:absolute;left:-1.15em;top:.45em;opacity:0;color:var(--muted);
  text-decoration:none;font-size:1rem;transition:opacity .12s ease}
.decl:hover .permalink,.permalink:focus{opacity:1}
.permalink:hover{color:var(--accent)}

/* ── synopsis ── */
.synopsis{margin:1.3em 0;border:1px solid var(--border);border-radius:10px;background:var(--pane)}
.synopsis>summary{cursor:pointer;padding:.5em .9em;font-family:var(--font-display);font-weight:600}
.synopsis-list{list-style:none;margin:0;padding:.2em .6em .7em;display:grid;gap:.05em}
.synopsis-list li{position:relative;padding:.05em .3em .05em 3.6em;border-radius:5px}
.synopsis-list li:hover{background:var(--hover)}
.synopsis-list li::before{position:absolute;left:.5em;top:.25em;font-size:.58rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.synopsis-list li.k-sig::before{content:"fn"}
.synopsis-list li.k-data::before{content:"data"}
.synopsis-list li.k-interface::before{content:"ifc"}
.synopsis-list a{text-decoration:none}
.synopsis-list code{font-family:var(--font-mono);font-size:.82rem;background:none;border:none;
  padding:0;color:var(--text);white-space:pre-wrap}
.synopsis-list a:hover code{color:var(--accent)}

/* ── right rail ── */
.onthispage{position:sticky;top:0;align-self:start;height:100vh;overflow:auto;
  padding:1.2rem .8rem;border-left:1px solid var(--border)}
.onthispage .rail-title{font-family:var(--font-display);font-weight:600;color:var(--muted);
  text-transform:uppercase;font-size:.68rem;letter-spacing:.07em;margin:.2rem .3rem .6rem}
.onthispage ul{list-style:none;margin:0;padding:0}
.onthispage li a{display:block;padding:.15em .4em;border-radius:5px;color:var(--fg-dim);
  text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:var(--font-mono);font-size:.78rem;border-left:2px solid transparent}
.onthispage li a:hover{background:var(--hover);color:var(--text);border-left-color:var(--accent)}

/* ── index ── */
.content.index .intro{font-size:1.05rem;color:var(--fg-dim);max-width:44rem}
.group{margin:1.6em 0}
.group h2{font-family:var(--font-display);font-size:1.3rem;border-bottom:1px solid var(--border);
  padding-bottom:.2em}
.modlist{list-style:none;margin:.7em 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.4em}
.modlist a{display:block;padding:.45em .7em;border:1px solid var(--border);border-radius:8px;
  background:var(--surface);color:var(--text);text-decoration:none;font-family:var(--font-mono);font-size:.85rem}
.modlist a:hover{border-color:var(--accent);color:var(--accent)}
kbd{font-family:var(--font-mono);background:var(--pane-2);border:1px solid var(--border-strong);
  border-radius:4px;padding:.05em .4em;font-size:.85em}

/* ── usage banner (Prélude vs import) ── */
.usage{display:flex;gap:.6em;align-items:baseline;margin:.1rem 0 1.5em;padding:.5em .8em;
  border:1px solid var(--border);border-radius:8px;font-size:.9rem;color:var(--fg-dim)}
.usage code{font-family:var(--font-mono);font-size:.86em;background:var(--pane-2);
  border:1px solid var(--border);border-radius:4px;padding:.05em .35em;color:var(--text)}
.usage-tag{flex:none;font-size:.6rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:.2em .6em;border-radius:999px;color:var(--accent-ink)}
.usage.prelude{background:var(--pane)}
.usage.prelude .usage-tag{background:var(--badge-data)}
.usage.import .usage-tag{background:var(--accent)}

/* ── index tiers (Prélude / à importer) ── */
.tier{margin:0 0 2.2em}
.tier-head{font-family:var(--font-display);font-size:1.55rem;margin:1.1em 0 .1em}
.tier-note{color:var(--muted);font-size:.95rem;margin:.1em 0 1.1em;max-width:46rem}
.tier-note code{font-family:var(--font-mono);font-size:.86em;background:var(--pane-2);
  border:1px solid var(--border);border-radius:4px;padding:.02em .3em}
h3.ns{font-family:var(--font-display);font-size:1.12rem;color:var(--fg-dim);
  margin:1.1em 0 .35em;border-bottom:1px solid var(--border);padding-bottom:.15em}

/* ── syntax tokens (engine roles; indigo accent stays OUT of this palette) ── */
.t-keyword{color:var(--t-keyword);font-weight:600}
.t-operator{color:var(--t-operator)}
.t-punctuation{color:var(--t-punctuation)}
.t-number{color:var(--t-number)}
.t-string{color:var(--t-string)}
.t-constructor{color:var(--t-constructor)}
.t-variable{color:var(--t-variable)}
.t-comment{color:var(--t-comment);font-style:italic}

/* ── responsive: drop the rails on narrow screens ── */
@media (max-width:1100px){
  .layout{grid-template-columns:clamp(220px,26vw,280px) minmax(0,1fr)}
  .onthispage{display:none}
}
@media (max-width:760px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:static;height:auto;border-right:none;border-bottom:1px solid var(--border)}
  .oppi-doc .decl::before{position:static;display:inline-block;margin-bottom:.3em}
  .permalink{display:none}
}