.interaction-touch-metrics{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem .9rem;min-width:0;margin:1rem 0 .6rem;font-size:.85rem}
.interaction-metric{font-variant-numeric:tabular-nums;font-weight:650}
.interaction-input-type{opacity:.72}
.interaction-touch-stage canvas{cursor:default}
.interaction-touch-stage.interaction-touch-active canvas{touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair}
.interaction-motion-settings{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem 1rem;width:100%;min-width:0;margin-top:1rem}
.interaction-setting{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.85rem;min-width:0}
.interaction-setting input[type=range]{width:110px;max-width:100%;accent-color:#84b6b1}
.interaction-setting select{max-width:180px}
.interaction-setting select option{background:#fff;color:#182530}
.interaction-setting output{font-size:.75rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.interaction-motion-state{font-size:.8rem;opacity:.75}
@media(max-width:560px){
  .interaction-touch-metrics{gap:.35rem .6rem;font-size:.78rem}
  .interaction-input-type{flex-basis:100%}
  .interaction-motion-settings{gap:.5rem .7rem}
  .interaction-setting{gap:.35rem;font-size:.78rem}
  .interaction-setting input[type=range]{width:90px}
  .interaction-setting select{max-width:150px}
}
