/* IMAGE GALLERY */
    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
      gap: var(--space-md);
      max-height: 550px; overflow-y: auto;
      padding-right: var(--space-xs);
      scrollbar-width: thin;
      scrollbar-color: var(--cyber-red-700) var(--cyber-void-400);
    }
    .gallery-grid::-webkit-scrollbar { width: 8px; }
    .gallery-grid::-webkit-scrollbar-track { background: var(--cyber-void-400); }
    .gallery-grid::-webkit-scrollbar-thumb { background: var(--cyber-red-700); border-radius: 0; box-shadow: 0 0 6px color-mix(in srgb, var(--cyber-red-500) 40%, transparent); }
    .gallery-grid::-webkit-scrollbar-thumb:hover { background: var(--cyber-red-500); }
    .gallery-item {
      position: relative; overflow: hidden;
      border: 1px solid var(--color-border-default);
      clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%, 0 calc(100% - 15px));
      transition: all var(--transition-base); aspect-ratio: 4 / 3;
    }
    .gallery-item:hover {
      border-color: var(--cyber-red-500);
      box-shadow: 0 0 20px color-mix(in srgb, var(--cyber-red-500) 40%, transparent);
      transform: scale(1.02);
    }
    .gallery-item img {
      width: 100%; height: 100%; object-fit: cover;
      transition: filter var(--transition-base);
    }
    .gallery-item:hover img { filter: brightness(1.1) contrast(1.1); }
    .gallery-placeholder {
      width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
      background: var(--cyber-void-300); color: var(--cyber-chrome-500);
      font-family: var(--font-mono); font-size: var(--text-xs); text-align: center;
      padding: var(--space-sm);
    }
    .gallery-item { cursor: zoom-in; }
    .gallery-item:focus-visible { outline: 2px solid var(--cyber-red-500); outline-offset: 2px; }
    .gallery-item__hint {
      position: absolute; left: 0; right: 0; bottom: 0;
      padding: var(--space-2xs) var(--space-xs);
      font-family: var(--font-mono); font-size: var(--text-xs);
      color: var(--cyber-red-500); text-shadow: 0 0 6px var(--cyber-red-500);
      background: linear-gradient(0deg, color-mix(in srgb, var(--cyber-void-900) 92%, transparent), transparent);
      transform: translateY(100%); transition: transform var(--transition-base);
    }
    .gallery-item:hover .gallery-item__hint,
    .gallery-item:focus-visible .gallery-item__hint { transform: none; }
    @media (hover: none) {
      .gallery-item__hint { transform: none; }
      .track-name.is-scrolling:hover .track-name__inner { animation-play-state: running; }
    }