/* Mises en pratique de la compression (plugin-dynamique.html#en-pratique) */
#en-pratique{scroll-margin-top:110px}
.cp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:16px 0}
.cp-cards article{min-width:0;padding:18px;border-radius:13px;background:#f3f5fa;border:1px solid var(--line)}
.cp-cards small{font:9.5px 'DM Mono';letter-spacing:.06em;color:var(--blue)}
.cp-cards h3{margin:6px 0;font-size:17px}
.cp-cards p{margin:0;font-size:13.5px;color:#434958}
.cp-cards .set{display:block;margin-top:8px;font:11px 'DM Mono',monospace;color:#6b7280}
.cp-lab{display:grid;gap:12px;margin:14px 0 18px;padding:16px;border-radius:18px;background:var(--ink);color:#fff}
.cp-lab button{padding:8px 12px;border:1px solid #ffffff1c;border-radius:9px;background:#1b202b;color:#e7ebf3;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cp-lab button[aria-pressed=true]{background:#1f2a40;border-color:#6f9bff}
.cp-lab .cp-play{background:var(--mint);border-color:var(--mint);color:var(--ink);min-width:96px}
.cp-lab .cp-play:disabled{opacity:.5;cursor:wait}
.cp-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.cp-seg{display:flex;flex-wrap:wrap;gap:5px}
.cp-set{display:flex;flex-wrap:wrap;gap:6px 16px;padding:10px 12px;border-radius:10px;background:#ffffff0a;font-size:12.5px;color:#cfd5e1;min-height:1.5em}
.cp-set b{margin-left:4px;font:600 12.5px 'DM Mono',monospace;color:#ffd36e}
.cp-canvas{display:block;width:100%;height:240px;border-radius:12px;background:#0d111a}
.cp-lab .cp-status{margin:0;min-height:3em;font-size:13.5px;line-height:1.5;color:#e7ebf3}
@media(max-width:800px){.cp-cards{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.cp-cards{grid-template-columns:1fr}}
/* Façonner les attaques et les crêtes */
#attaques-et-cretes{scroll-margin-top:110px}
.tr-lab{display:grid;gap:12px;margin:14px 0 18px;padding:16px;border-radius:18px;background:var(--ink);color:#fff}
.tr-lab button{padding:8px 12px;border:1px solid #ffffff1c;border-radius:9px;background:#1b202b;color:#e7ebf3;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.tr-lab button[aria-pressed=true]{background:#1f2a40;border-color:#6f9bff}
.tr-lab .tr-play{background:var(--mint);border-color:var(--mint);color:var(--ink);min-width:96px}
.tr-lab .tr-play:disabled{opacity:.5;cursor:wait}
.tr-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.tr-seg{display:flex;flex-wrap:wrap;gap:5px}
.tr-ctrls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 18px;align-items:end}
.tr-ctrls label{display:grid;gap:4px;min-width:0;font-size:12.5px;color:#cfd5e1}
.tr-ctrls output{font:600 11.5px 'DM Mono',monospace;color:#ffd36e}
.tr-ctrls input[type=range]{width:100%;accent-color:var(--mint)}
.tr-ctrls .tr-check{display:flex;align-items:center;gap:7px;cursor:pointer}.tr-check input{accent-color:var(--mint);width:16px;height:16px}
.tr-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tr-facts div{display:grid;gap:3px;min-width:0;padding:10px 12px;border-radius:10px;background:#ffffff0a}
.tr-facts small{font:9px 'DM Mono',monospace;letter-spacing:.06em;color:#8f98aa}
.tr-facts b{font:600 14px 'DM Mono',monospace;color:#fff}
.tr-lab .tr-facts span{font-size:11px;color:#9da6b7}
.tr-canvas{display:block;width:100%;height:220px;border-radius:12px;background:#0d111a}
.tr-lab .tr-status{margin:0;min-height:3em;font-size:13.5px;line-height:1.5;color:#e7ebf3}
@media(max-width:800px){.tr-ctrls,.tr-facts{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.tr-ctrls,.tr-facts{grid-template-columns:1fr}}
