/* Interaction states for every control on the site and in the report app.
   Pointer only where something acts; hover styles only on devices that hover, so touch never sticks;
   press is a small, fast squeeze; focus shows a ring for keyboard users only. One easing and one set of
   durations for all of it. */
:root {
  --ix-ease: cubic-bezier(0.2, 0, 0, 1);
  --ix-fast: 120ms;
  --ix-press: 90ms;
  --ix-ring: 0 0 0 2px var(--c-bg, #fff), 0 0 0 4px var(--c-accent, #2B5CF0);
}

html { -webkit-tap-highlight-color: transparent; }
a, button, [role="tab"], [role="button"], summary, select, label[for], .runrow, .rclaim, .acc__btn, .proof__item { cursor: pointer; touch-action: manipulation; }
input, textarea { cursor: text; }
button:disabled, [aria-disabled="true"], .btn[disabled] { cursor: not-allowed; }

.btn, .wtab, .acc__btn, .runrow, .rclaim, .tile, .field__input, .chip, a {
  transition: background-color var(--ix-fast) var(--ix-ease), border-color var(--ix-fast) var(--ix-ease),
              color var(--ix-fast) var(--ix-ease), box-shadow var(--ix-fast) var(--ix-ease),
              text-decoration-color var(--ix-fast) var(--ix-ease), transform var(--ix-press) var(--ix-ease);
}

@media (hover: hover) and (pointer: fine) {
  .btn--primary:hover { background-color: #26262B; }
  .btn--outline:hover, .btn--ghost:hover, .win__bar button:hover { background-color: var(--c-surface, #FAFAFA); border-color: var(--c-line-strong, #D4D4D1); }
  .dark .btn--outline:hover, .dark__btn:hover { background-color: #F4F4F5; }
  .wtab:hover { color: var(--c-ink-2, #3F3F46); }
  .acc__btn:hover, .rclaim:hover { color: var(--c-ink, #0A0A0A); }
  .runrow:hover { background-color: var(--c-surface, #FAFAFA); }
  .tile:hover { border-color: var(--c-line-strong, #D4D4D1); }
  .field__input:hover { border-color: var(--c-ink-4, #74747D); }
  a:not(.btn):not(.brand):not(.foot__brand):not(.runrow):hover { color: var(--c-ink, #0A0A0A); text-decoration-color: currentColor; }
}

.btn:active, .wtab:active, .win__bar button:active { transform: scale(0.98); }
.runrow:active, .rclaim:active { transform: scale(0.995); }

:focus { outline: none; }
:focus-visible { outline: none; box-shadow: var(--ix-ring); border-radius: var(--r-1, 6px); }
.field__input:focus-visible { box-shadow: 0 0 0 3px color-mix(in oklch, var(--c-accent, #2B5CF0) 22%, transparent); border-color: var(--c-accent, #2B5CF0); }

a:not(.btn):not(.brand):not(.foot__brand):not(.runrow) { text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: color-mix(in oklch, currentColor 35%, transparent); }
nav a, .proof a { text-decoration-line: none; }

@media (prefers-reduced-motion: reduce) {
  .btn, .wtab, .acc__btn, .runrow, .rclaim, .tile, .field__input, .chip, a { transition: none; }
  .btn:active, .wtab:active, .runrow:active, .rclaim:active { transform: none; }
}