/* PADS AND GRIDS — touch targets never below ~40px (spec §10) */
    .pads-matrix {
      display: grid;
      gap: 6px;
      touch-action: none;
      min-height: 0;
    }
    .pad-cell {
      background: var(--bg-surface-1);
      border: 1px solid var(--line-subtle);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      position: relative;
      min-height: 40px;
      min-width: 40px;
      padding: 4px;
      overflow: hidden;
      transition: background 0.05s ease;
      touch-action: none;
    }
    .pad-cell .pad-label {
      font: 900 10px var(--font-mono);
      text-align: center;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pad-cell .pad-sub {
      font: 700 7px var(--font-mono);
      color: var(--text-dim);
      margin-top: 2px;
    }
    .pad-cell.reserved {
      opacity: 0.35;
      border-style: dashed;
    }
    .pad-cell.reserved .pad-label { color: var(--text-dim); }
    .pad-cell:hover {
      background: var(--bg-surface-2);
      border-color: var(--line-bright);
    }
    .pad-cell:active, .pad-cell.hit {
      background: var(--acid) !important;
      color: #000 !important;
      border-color: var(--acid) !important;
    }
    .pad-cell.active-slice {
      background: var(--acid);
      color: #000;
    }

    /* SAMPLER SPECIFIC LAYOUT */
    #pane-sampler.active {
      display: grid;
      /* header · waveform · full-track extractor (auto-cut row) · pads/isolator · library */
      grid-template-rows: 38px 115px auto minmax(0, 1fr) minmax(112px, 160px);
      gap: 8px;
    }
    #pane-sampler .track-extractor-box { margin: 0 !important; min-height: 0; }
    .sampler-performance-area {
      min-height: 0;
      display: grid;
      grid-template-columns: 62% minmax(0, 1fr);
      gap: 8px;
    }
    .slicer-zone, .vocal-isolator {
      min-height: 0;
      border: 1px solid var(--line-subtle);
      background: var(--bg-surface-1);
      padding: 8px;
      overflow: hidden;
    }
    .slicer-zone {
      display: grid;
      grid-template-rows: 20px 24px minmax(0, 1fr);
      gap: 6px;
    }
    .performance-label {
      display: flex;
      justify-content: space-between;
      color: var(--text-muted);
      font: 800 8px var(--font-mono);
      letter-spacing: 0.5px;
    }
    .performance-label span:last-child { color: var(--acid); }
    #smp-slices-grid {
      grid-template-columns: repeat(4, 1fr);
      gap: 5px;
    }
    #smp-slices-grid .pad-cell {
      min-height: 38px;
      font: 800 10px var(--font-mono);
    }
    .vocal-isolator {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .isolator-title {
      font: 900 9px var(--font-mono);
      color: var(--cyan);
      letter-spacing: 0.5px;
    }
    .vocal-isolator label {
      display: grid;
      grid-template-columns: 75px minmax(0, 1fr);
      align-items: center;
      gap: 6px;
      font: 700 8px var(--font-mono);
      color: var(--text-muted);
    }
    .vocal-isolator input[type=range] {
      width: 100%;
      accent-color: var(--acid);
      touch-action: none;
    }
    .sampler-library-drawer {
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      gap: 5px;
      border: 1px solid var(--line-subtle);
      background: var(--bg-surface-1);
      padding: 6px;
      overflow: hidden;
    }
    .sampler-library-drawer.collapsed { grid-template-rows: auto; }
    .sampler-library-drawer.collapsed .sampler-library-body { display: none; }
    .sampler-library-header, .sampler-library-tools, .sampler-library-body, .ai-sample-brief {
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .sampler-library-header { justify-content: space-between; }
    .sampler-library-title { font: 900 9px var(--font-mono); color: var(--acid); letter-spacing: .6px; }
    .sampler-library-tools { flex-wrap: wrap; justify-content: flex-end; }
    .sampler-library-body { min-height: 0; align-items: stretch; overflow: hidden; }
    #smp-loops-deck {
      min-width: 0;
      flex: 1 1 58%;
      display: grid;
      grid-template-columns: repeat(6, minmax(100px, 1fr));
      gap: 4px;
      overflow-x: auto;
      overflow-y: hidden;
    }
    .ai-sample-brief {
      flex: 0 1 42%;
      min-width: 260px;
      flex-wrap: wrap;
      align-content: flex-start;
      padding-left: 6px;
      border-left: 1px solid var(--line-subtle);
    }
    .ai-sample-brief label { display: grid; gap: 2px; color: var(--text-muted); font: 800 7px var(--font-mono); }
    .ai-sample-brief select { max-width: 88px; background: var(--bg-deep); color: var(--text-main); border: 1px solid var(--line-subtle); font: 800 8px var(--font-mono); padding: 3px; }
    .ai-sample-status { width: 100%; min-height: 18px; color: var(--text-muted); font: 700 8px/1.35 var(--font-mono); overflow: hidden; text-overflow: ellipsis; }

    .smp-pack-own { display: inline-flex; align-items: center; gap: 3px; font: 800 8px var(--font-mono); color: var(--text-muted); cursor: pointer; }
    .smp-pack-own input { accent-color: var(--acid); margin: 0; }
    #smp-btn-pack:disabled { opacity: .4; cursor: not-allowed; }