@layer components {
  /*
   * Coach
   */
  
  dialog {
    padding: 2rem;
    border: none;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgb(var(--rgb-black) / 0.1);
    background: white;
  
    &::backdrop {
      background: rgb(var(--rgb-black) / 0.5);
    }
  }
  
  .coach-result {
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid var(--color-grey-100);
    border-radius: 0.25rem;
    background: var(--color-grey-050);
  }
}