/* COACH K IDENTITY tokens (PR 1). Behind COACH_K_IDENTITY_V1: the HTML adds class .ck-identity to <html>.
   When the class is absent, none of these apply and the app looks exactly as before. */

/* ── Fonts ──────────────────────────────────────────────────────────────────── */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/archivo-wght.woff2) format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-latin-wght-normal.woff2) format('woff2');
}

/* ── Tokens (only when .ck-identity is on the root) ─────────────────────────── */
.ck-identity {
  --ink: #080A09;
  --field: #0E120F;
  --card: #141A16;
  --line: #26302A;
  --text: #F4F5F0;
  --muted: #A3ADA5;
  --lime: #A5FF33;
  --gold: #E4BB6B;
  --gold-brand: #D5A64A;

  /* Map onto the names each page already uses */
  --bone: var(--text);
  --dim: var(--muted);
  --brass: var(--gold);
  --brass2: var(--gold-brand);
  --panel: var(--field);
  --panel2: var(--card);
  --ink2: var(--field);
  --line2: var(--line);
  --black: var(--ink);
  --raised: var(--card);
  --warn: var(--gold);

  --sans: 'Inter', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  --display: 'Archivo', 'Inter', ui-sans-serif, -apple-system, sans-serif;
}

/* ── Motion ─────────────────────────────────────────────────────────────────── */
.ck-identity {
  --ck-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ck-dur: 500ms;
}
@media (prefers-reduced-motion: reduce) {
  .ck-identity {
    --ck-dur: 0ms;
  }
  .ck-identity .ck-eyes animateTransform,
  .ck-identity .ck-eyes animate {
    /* SVG animations: paused via CSS */
  }
  .ck-identity svg.ck-eyes[data-eyes="thinking"] animateTransform {
    /* browsers that support pausing SMIL via CSS */
  }
  /* Fallback: hide the sweep and show static pupils */
  .ck-identity .ck-eyes[data-eyes="thinking"] circle animateTransform {
    display: none;
  }
}

/* ── Eyes ────────────────────────────────────────────────────────────────────── */
.ck-eyes {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}
@media (prefers-reduced-motion: reduce) {
  .ck-eyes[data-eyes="thinking"] {
    /* Static: the SVG animateTransform simply won't run in most browsers
       when reduced motion is on, but we also handle it in JS by not adding
       the animation when matchMedia says so. */
  }
}

/* ── Icon swap (when .ck-identity is on) ────────────────────────────────────── */
.ck-identity .ck-mark {
  background: none;
  border-radius: 0;
  width: 32px;
  height: 32px;
  color: transparent;
  font-size: 0;
  background-image: url(/assets/coach-k/icons/coach-k-icon-lime-64.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .ck-identity .ck-mark {
    background-image: url(/assets/coach-k/icons/coach-k-icon-lime-128.png);
  }
}
