:root {
  --pb-yellow: #f8bb04;
  --pb-purple: #7938bb;
  --pb-ink: #0a0a0b;
  --pb-surface: #141416;
  --coach-gradient-soft: linear-gradient(to bottom, rgba(23, 249, 221, 0.45), rgba(248, 24, 199, 0.45));
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: var(--pb-ink);
  color: #fff;
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-feature-settings: 'cv11', 'ss01';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

main {
  flex: 1;
}

body :is(h1, h2, h3, h4, h5, h6), body .font-display {
  font-family: 'Inter Tight', 'Inter', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
}

body :is(h1, h2) {
  letter-spacing: -0.018em;
}

::selection {
  background: var(--pb-yellow);
  color: var(--pb-ink);
}

:focus-visible {
  outline: 2px solid var(--pb-yellow);
  outline-offset: 3px;
}

.coach-text {
  background-image: linear-gradient(to bottom, #9dfcf0, #fb9fe3);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.coach-outline {
  position: relative;
  background-image: linear-gradient(to bottom, rgba(23, 249, 221, 0.06), rgba(248, 24, 199, 0.06));
}

.coach-outline::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  background: var(--coach-gradient-soft);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.coach-ring {
  padding: 1.5px;
  background: var(--coach-gradient-soft);
}

.member-outline {
  border: 1px solid rgba(248, 187, 4, 0.45);
  background-image: linear-gradient(to bottom, rgba(248, 187, 4, 0.08), rgba(248, 187, 4, 0.02));
}

.member-ring {
  padding: 2px;
  background: linear-gradient(135deg, #ffe58a, rgb(248, 187, 4) 50%, #b07d02);
}