@layer components {
  
  .photo-field {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
  }

  .photo-field__controls { flex: 1; min-width: 0; }

  .photo-field__remove { margin-top: var(--space); }

  @media (width <= 40rem) {
    .photo-field { flex-direction: column; gap: var(--space-3); }
    .photo-field__controls { width: 100%; }
  }
}

@layer components {
  
  .preferences__themes { flex-wrap: wrap; }

  .preferences__themes form { display: contents; }

  .preferences__theme { flex: 0 0 auto; }

  .preferences__theme[aria-current] {
    border-color: var(--accent);
    background: var(--accent-sunk);
    color: var(--ink);
  }

  
  .preferences__push-button[hidden] { display: none; }

  
  .passkey__button[hidden] { display: none; }
}