/* classer.css — format « Classer / Trier » (tap-to-place). Complète exo.css (chargé avant).
   La page charge : fonts.css + exo.css + classer.css. */
.consigne{background:var(--panel);border:1px solid var(--rule);border-radius:12px;padding:12px 15px;margin-top:14px;font-size:.95rem;color:var(--ink-2)}
.consigne b{color:var(--ink)}

.pool{display:flex;flex-wrap:wrap;gap:9px;background:var(--paper);border:2px dashed var(--rule);border-radius:14px;padding:14px;margin-top:14px;min-height:64px}
.pool:empty::before{content:"Tous les éléments sont placés 👍";color:var(--ink-2);font-size:.9rem}
.pool-title{font-family:var(--disp);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-2);margin:16px 0 0}

.chip-item{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:2px solid var(--accent);color:var(--accent-2);border-radius:999px;padding:9px 14px;font-weight:700;font-size:.95rem;cursor:pointer;transition:transform .05s,box-shadow .15s}
.chip-item:hover{box-shadow:0 3px 10px rgba(15,40,60,.14)}
.chip-item.sel{background:var(--accent);color:#fff;box-shadow:0 0 0 3px var(--accent-soft)}
.chip-item.ok{border-color:var(--ok);background:var(--ok-soft);color:var(--ink);cursor:default}
.chip-item.ko{border-color:var(--ko);background:var(--ko-soft);color:var(--ink);cursor:default}
.chip-item .corr{font-size:.78rem;font-weight:600;color:var(--ko);margin-left:2px}

.cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:14px}
.cat{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:0 0 12px;overflow:hidden;transition:box-shadow .15s,border-color .15s}
.cat.target{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.cat h3{font-family:var(--disp);font-weight:700;font-size:1rem;margin:0;padding:12px 14px;background:var(--accent-soft);color:var(--accent-2);border-bottom:1px solid var(--rule);cursor:pointer}
.cat .drop{display:flex;flex-wrap:wrap;gap:8px;padding:12px 12px 0;min-height:52px}
.cat .drop:empty::before{content:"Touche une carte puis ici";color:var(--ink-2);font-size:.82rem;opacity:.8}

.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.actions .grow{flex:1}
.result-cla{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:16px 18px;margin-top:16px;display:none}
.result-cla.show{display:block}
.result-cla .score{font-family:var(--disp);font-weight:700;font-size:1.6rem;color:var(--accent-2)}
.result-cla .msg{color:var(--ink-2);margin-top:4px}