@layer components {
  /* ── Round 1 selection bar (juror picks) ── */
  .selection-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--s3);
    padding: var(--s3) var(--s4);
    margin-bottom: var(--s4);
    background: var(--forest-50);
    border: 1px solid var(--forest-100);
    border-radius: var(--r-md);
  }

  .selection-bar__count {
    font-weight: 600;
    color: var(--forest-900);
  }

  .selection-flash {
    margin: 0 0 var(--s4);
    padding: var(--s2) var(--s3);
    color: var(--danger-600);
    background: var(--danger-50);
    border-radius: var(--r-sm);
    font-size: 0.875rem;
  }

  /* ── Per-photo pick toggle ── */
  .col-pick {
    text-align: right;
    white-space: nowrap;
  }

  .pick-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--s1);
    padding: var(--s1) var(--s3);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--forest-700);
    background: var(--paper);
    border: 1px solid var(--forest-300);
    border-radius: var(--r-sm);
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
  }

  .pick-btn:hover:not(:disabled) {
    background: var(--forest-50);
    border-color: var(--forest-500);
  }

  .pick-btn.is-picked {
    color: var(--paper);
    background: var(--forest-500);
    border-color: var(--forest-500);
  }

  .pick-btn:disabled {
    opacity: 0.55;
    cursor: default;
  }
}
