/* Banco da lavoro: attrezzi-adesivo (stili Banco e Nastro) */
.tool{display:inline-flex;align-items:center;gap:.5em;padding:.5em .95em .5em .7em;border:2.5px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);font-size:clamp(18px,1.9vw,31px);font-weight:500;letter-spacing:-.02em;line-height:1;white-space:nowrap;box-shadow:0 5px 0 rgba(0,0,0,.35);user-select:none;-webkit-user-select:none}
.tool .ico{width:1.15em;height:1.15em;flex:none;fill:currentColor}
.tool .ico-line{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tool.tone-0{background:#00ffd1}
.tool.tone-1{background:#ff96e6}
.tool.tone-2{background:#fff}
.tool.tone-3{background:#edff38}
.tool.tone-4{background:#c9b8ff}

/* --- Banco --- */
.band-banco{overflow:hidden;padding:clamp(56px,7vw,110px) 0 0}
.bench-head{display:flex;justify-content:space-between;align-items:end;gap:24px;padding:0 var(--g);margin-bottom:clamp(20px,3vw,40px)}
.bench-head h2{font-size:clamp(44px,6.6vw,112px);font-weight:800;line-height:.92;letter-spacing:-.045em;max-width:9ch}
.bench-hint{font-size:14px;opacity:.7;padding-bottom:.6em;display:none}
@media (hover:hover) and (pointer:fine){.bench-hint{display:block}}
.motion-off .bench-hint{display:none}
/* il tappetino da taglio: griglia fine, righe maggiori ogni 5 quadretti, righello sul bordo */
.bench{position:relative;list-style:none;margin:0 var(--g);padding:clamp(28px,4vw,56px) clamp(16px,3vw,48px);display:flex;flex-wrap:wrap;justify-content:center;align-content:end;gap:14px 10px;min-height:clamp(300px,28vw,430px);border:2px solid #ffffff2e;border-bottom:0;border-radius:18px 18px 0 0;
 background:
  repeating-linear-gradient(90deg,#ffffff38 0 1px,transparent 1px 100%) 0 0/100% 12px no-repeat,
  linear-gradient(#ffffff17 1px,transparent 1px) 0 0/160px 160px,
  linear-gradient(90deg,#ffffff17 1px,transparent 1px) 0 0/160px 160px,
  linear-gradient(#ffffff0a 1px,transparent 1px) 0 0/32px 32px,
  linear-gradient(90deg,#ffffff0a 1px,transparent 1px) 0 0/32px 32px,
  #251d55}
.bench>li{display:block}
.bench:not(.is-live)>li:nth-child(odd) .tool{rotate:-4deg}
.bench:not(.is-live)>li:nth-child(3n) .tool{rotate:6deg}
.bench:not(.is-live)>li:nth-child(4n+1) .tool{rotate:2deg}
/* con la fisica attiva ogni attrezzo è posizionato da bench.js */
.bench.is-live{display:block;height:clamp(300px,28vw,430px);padding:0;overflow:visible}
.bench.is-live>li{display:contents}
.bench.is-live .tool{rotate:none;position:absolute;left:0;top:0;transform:translate3d(-999px,-999px,0);will-change:transform;cursor:grab}
.bench.is-dragging,.bench.is-dragging .tool{cursor:grabbing}
.tool.is-held{box-shadow:0 14px 0 rgba(0,0,0,.3)}
@media(max-width:700px){
 .bench-head{display:block}
 .tool{font-size:16px;border-width:2px}
 .bench,.bench.is-live{min-height:0;height:auto;margin:0 12px}
 .bench.is-live{height:min(440px,110vw);overflow:clip}
}

/* --- Nastro: parole sopra, loghi sotto in senso contrario --- */
.band-nastro .client-window+.client-window{margin-top:18px}
.band-nastro .client-set{gap:18px;padding-right:18px}
.band-nastro .client-set>span.tool{color:var(--ink);transform:none}
.band-nastro .client-set>.tool{font-size:clamp(20px,2.2vw,36px);transition:rotate .35s var(--ease),scale .35s var(--ease)}
.band-nastro .client-set>.tool:hover{rotate:-5deg;scale:1.06}
.band-nastro .client-track[data-reverse] .tool{font-size:clamp(17px,1.6vw,26px)}