.otti-layers-panel { margin-top: 16px; border-top: 1px solid var(--otti-border); padding-top: 16px; }
.otti-layers-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.otti-layers-header h3 { margin: 0; font-size: 14px; }

.otti-layers-list { display: flex; flex-direction: column; gap: 4px; min-height: 40px; }

.otti-layer-item {
  display: flex; align-items: center; gap: 8px; height: 44px;
  padding: 0 8px; border-radius: 8px; cursor: pointer; user-select: none;
  border: 1px solid transparent; background: var(--otti-bg-card);
}
.otti-layer-item.selected { border-color: var(--otti-accent); background: var(--otti-accent-light); }
.otti-layer-item.locked { opacity: 0.6; }
.otti-layer-item.hidden-layer { opacity: 0.4; }

.otti-layer-drag { cursor: grab; font-size: 16px; color: var(--otti-text-secondary); }
.otti-layer-thumb { width: 32px; height: 24px; border-radius: 4px; background: var(--otti-bg-primary); }
.otti-layer-name { flex: 1; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.otti-layer-btn {
  background: none; border: none; color: var(--otti-text-secondary);
  cursor: pointer; padding: 4px; border-radius: 4px;
}
.otti-layer-btn:hover { background: var(--otti-bg-primary); color: var(--otti-text-primary); }

.otti-layer-item.drag-over { border-top: 2px solid var(--otti-accent); }