@layer modules{
/* ════════ « Alchimie » - collaboration entre composants (#alchimie) ════════
   Vue plein écran (body.in-alchimie). Catalogue de recettes reliant des composants.
   Réutilise les tokens globaux. */
body.in-alchimie .col-profile,body.in-alchimie .col-report{ display:none; }
body.in-alchimie .split{ grid-template-columns:1fr; }
body.in-alchimie #grid{ max-width:none; }

.alch-wrap{ padding:var(--sp-4); }
.alch-head{ display:flex; align-items:center; gap:var(--sp-14); margin-bottom:var(--sp-8); }
.alch-title{ font-size:var(--fs-xl); margin:0; font-weight:var(--fw-bold); }
.alch-flask{ filter:saturate(1.2); }
.alch-sub{ color:var(--mut); font-weight:var(--fw-regular); font-size:var(--fs-base); }
.alch-intro{ color:var(--mut); font-size:var(--fs-base); max-width:780px; margin:0 0 var(--sp-20); line-height:var(--lh-normal); }

.alch-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:var(--sp-16); }
.alch-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:var(--sp-18); transition:border-color .15s, box-shadow .15s; }
.alch-card.on{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.alch-card-top{ display:flex; align-items:center; gap:var(--sp-10); margin-bottom:var(--sp-12); }
.alch-card-flask{ width:38px; height:38px; border-radius:var(--radius); display:grid; place-items:center; font-size:var(--fs-lg); background:color-mix(in srgb, var(--accent) 16%, transparent); color:var(--accent); flex-shrink:0; }
.alch-card-name{ font-size:var(--fs-lg); margin:0; font-weight:var(--fw-bold); flex:1; }

/* Interrupteur */
.alch-switch{ position:relative; width:42px; height:24px; flex-shrink:0; cursor:pointer; }
.alch-switch input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.alch-knob{ position:absolute; inset:0; background:var(--line); border-radius:var(--radius-modal); transition:background .15s; }
.alch-knob::after{ content:""; position:absolute; left:3px; top:3px; width:18px; height:18px; border-radius:50%; background:var(--on-solid); transition:transform .15s; }
.alch-switch input:checked + .alch-knob{ background:var(--accent); }
.alch-switch input:checked + .alch-knob::after{ transform:translateX(18px); }

/* Recette : composants reliés */
.alch-recipe{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-6); margin-bottom:var(--sp-12); }
.alch-chip{ display:inline-flex; align-items:center; gap:var(--sp-6); font-size:var(--fs-sm); font-weight:var(--fw-strong); background:var(--bg2); border:1px solid var(--line); border-left:3px solid var(--ac,var(--accent)); border-radius:var(--radius); padding:var(--sp-4) var(--sp-8); }
.alch-chip-g{ color:var(--ac,var(--accent)); }
.alch-link{ color:var(--mut2); font-weight:var(--fw-bold); font-size:var(--fs-base); }

.alch-card-desc{ font-size:var(--fs-md); color:var(--mut); line-height:var(--lh-normal); margin:0 0 var(--sp-12); }
.alch-card-surfaces{ display:flex; flex-wrap:wrap; gap:var(--sp-4); }
.alch-surf{ font-size:var(--fs-xs); color:var(--mut2); background:var(--card2); border-radius:var(--radius-modal); padding:var(--sp-2) var(--sp-8); }

/* Config (visible quand activée) */
.alch-config{ margin-top:var(--sp-14); padding-top:var(--sp-12); border-top:1px dashed var(--line); display:flex; flex-direction:column; gap:var(--sp-8); }
.alch-opt{ display:flex; gap:var(--sp-8); align-items:flex-start; font-size:var(--fs-md); color:var(--txt); cursor:pointer; line-height:1.4; }
.alch-field{ display:flex; flex-direction:column; gap:var(--sp-4); font-size:var(--fs-sm); color:var(--mut); }
.alch-field input,.alch-field select{ border:1px solid var(--line); background:var(--bg2); color:var(--txt); border-radius:var(--radius); padding:var(--sp-6) var(--sp-8); font:inherit; font-size:var(--fs-md); }

}