/* taller.css — I-taller Bloc 0 «Les mans i la màquina».
   Full d'estils del taller de teclat i ratolí (window.AulaTaller, taller.js). Només consum de
   tokens (skins.css): cap color ni tipografia fora de les variables, com la resta de fulls. */

/* ── targeta de l'entrada (columna «Avui», SEMPRE visible) ── */
.taller-card{border-color:var(--accent2);}
.taller-text{font-size:12.5px;line-height:1.5;color:var(--text);margin:0 0 12px;}
.taller-grups{display:flex;flex-direction:column;gap:12px;}
.taller-subtitol{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);margin:0 0 6px;}
.taller-llista{display:flex;flex-wrap:wrap;gap:6px;}

/* ── overlay de cada activitat (mateixa pell que el de dits.js) ── */
.taller-overlay{position:fixed;inset:0;background:rgba(10,10,15,.55);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;}
.taller-caixa{background:var(--bg2);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);width:min(92vw,560px);max-height:86vh;overflow-y:auto;padding:20px 22px 22px;}
.taller-cap{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;}
.taller-titol{font-family:var(--font-head);font-size:20px;font-weight:700;margin:0;color:var(--accent2);}
.taller-instruccio{font-size:15px;line-height:1.5;color:var(--text);margin:0 0 14px;}
.taller-escenari{position:relative;background:var(--bg3);border:1px solid var(--border);border-radius:12px;min-height:220px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;padding:20px;margin-bottom:12px;}
.taller-encert{font-size:14px;font-weight:700;color:var(--ok-fg);margin:0;min-height:18px;}
.taller-encert[hidden]{display:none;}

/* ── ratolí: clicar / doble clic ── */
.taller-objectiu{width:96px;height:96px;border-radius:50%;background:var(--accent);color:var(--alumna-bubble-fg);display:flex;align-items:center;justify-content:center;font-size:42px;box-shadow:var(--shadow);cursor:pointer;user-select:none;border:none;}
.taller-objectiu.tocat{background:var(--ok);color:var(--ok-fg);}
.taller-ou{width:96px;height:96px;border-radius:50% 50% 48% 48%;background:var(--badge1-bg);color:var(--badge1-fg);display:flex;align-items:center;justify-content:center;font-size:42px;box-shadow:var(--shadow);cursor:pointer;user-select:none;border:none;}
.taller-ou.obert{background:var(--ok);color:var(--ok-fg);}

/* ── ratolí: arrossegar ── */
.taller-peca{width:64px;height:64px;border-radius:12px;background:var(--accent);color:var(--alumna-bubble-fg);display:flex;align-items:center;justify-content:center;font-size:30px;cursor:grab;user-select:none;}
.taller-casella{width:84px;height:84px;border:2px dashed var(--border);border-radius:12px;display:flex;align-items:center;justify-content:center;background:transparent;}
.taller-casella.plena{border-style:solid;border-color:var(--ok);background:var(--ok-bg);}

/* ── ratolí: la roda ── */
.taller-roda{height:180px;overflow-y:auto;width:100%;max-width:340px;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:8px;}
.taller-roda-item{flex:0 0 auto;padding:12px 14px;background:var(--bg3);border-radius:10px;font-size:13px;color:var(--text-dim);text-align:center;}
.taller-roda-fi{padding:14px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:12px;font-size:34px;text-align:center;cursor:pointer;user-select:none;}
.taller-roda-fi.trobat{background:var(--ok-bg);border-color:var(--ok);}

/* ── ratolí: els botons de la finestra ── */
.taller-finestra{width:280px;border:1px solid var(--border);border-radius:12px;background:var(--bg2);box-shadow:var(--shadow);overflow:hidden;}
.taller-finestra-barra{display:flex;align-items:center;justify-content:flex-end;gap:6px;padding:7px 9px;background:var(--bg3);border-bottom:1px solid var(--border);}
.taller-finestra-boto{width:24px;height:24px;min-width:24px;border-radius:6px;border:1px solid var(--border);background:var(--bg2);color:var(--text);font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;}
.taller-finestra-boto.minimitza{color:var(--text);}
.taller-finestra-boto.tanca{background:var(--danger);color:#fff;border-color:var(--danger);}
.taller-finestra-cos{padding:16px;font-size:13px;color:var(--text);text-align:center;transition:padding .15s ease;}
.taller-finestra.minimitzada .taller-finestra-cos{padding:6px;font-size:11px;color:var(--text-dim);}
.taller-finestra.maximitzada .taller-finestra-cos{padding:26px;}

/* ── teclat: fila de repòs / majúscules / espai i retorn / accents ── */
.taller-teclat{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;max-width:420px;}
.taller-tecla{width:40px;height:40px;border-radius:8px;border:1px solid var(--border);background:var(--bg2);color:var(--text);font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;user-select:none;}
.taller-tecla.guia{border-color:var(--accent);background:var(--accent-soft);}
.taller-tecla.premuda{background:var(--ok);border-color:var(--ok);color:var(--ok-fg);}
.taller-accio{font-family:var(--font-head);font-size:44px;font-weight:700;color:var(--accent2);min-width:60px;text-align:center;}
.taller-caselles{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:420px;}
.taller-casella{min-width:44px;height:44px;padding:0 8px;border-radius:8px;border:1px solid var(--border);background:var(--bg2);color:var(--text);font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;user-select:none;}
.taller-casella.feta{background:var(--ok);border-color:var(--ok);color:var(--ok-fg);}
.taller-input{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:10px;padding:10px 14px;font-size:20px;width:140px;text-align:center;font-family:var(--font-mono);}