/* MathSynapse UI/UX foundation derived from the ui-ux-pro-max inclusive-design audit. */
:root {
  --ux-focus: #0d9488;
  --ux-focus-soft: rgba(13, 148, 136, 0.22);
  --ux-ink: #172033;
  --ux-muted: #4d5a72;
  --ux-surface: #ffffff;
  --ux-line: #d7dfeb;
  --ux-shadow: 0 16px 38px rgba(24, 35, 59, 0.1);
}

body button:not(:disabled),
body a[href],
body [role="button"]:not([aria-disabled="true"]) {
  cursor: pointer;
}

body :where(button, a[href], input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--ux-focus-soft);
  outline-offset: 3px;
}

.landing-shell {
  color: var(--ux-ink);
}

.landing-shell ::selection {
  background: #d9f4ee;
  color: #104d47;
}

.landing-nav {
  isolation: isolate;
}

.landing-reading-progress {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  z-index: 2;
  height: 3px;
  overflow: hidden;
  pointer-events: none;
}

.landing-reading-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #6756e8 0 34%, #0d9488 55% 76%, #d97706 100%);
  transform: scaleX(var(--landing-read-progress, 0));
  transform-origin: left center;
  transition: transform 90ms linear;
}

.landing-nav-links button {
  min-height: 44px;
}

.landing-button,
.landing-nav-menu-toggle {
  min-height: 44px;
}

.landing-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.landing-button .ux-action-icon {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 180ms ease;
}

.landing-button[data-ux-direction="forward"]:hover .ux-action-icon {
  transform: translateX(3px);
}

.landing-button[data-ux-direction="enter"]:hover .ux-action-icon {
  transform: translateY(-1px) scale(1.06);
}

.landing-kicker,
.landing-section-label {
  font-size: 13px;
  line-height: 1.35;
}

.landing-hero-proof {
  font-size: 15px;
}

.landing-proof-mark {
  min-width: 27px;
  height: 24px;
  font-size: 12px;
}

.landing-synny-step,
.landing-evidence-source,
.landing-footer a {
  font-size: 14px;
}

.landing-section-heading > p,
.landing-product-copy > p,
.landing-role-band p {
  color: var(--ux-muted);
  line-height: 1.65;
}

.landing-evidence-grid article {
  transition:
    transform 190ms ease,
    border-color 190ms ease,
    background-color 190ms ease,
    box-shadow 190ms ease;
}

.landing-evidence-grid p {
  line-height: 1.62;
}

.landing-text-action {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding-top: 4px;
  font-size: 15px;
}

.landing-footer a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.entry-home-link,
.theme-button,
.entry-shell .chip,
.entry-shell .password-toggle,
.entry-shell .register-link {
  min-height: 44px;
}

.entry-home-link,
.entry-shell .register-link {
  font-size: 15px;
}

.entry-shell label,
.entry-shell .auth-helper,
.entry-shell .entry-support-copy {
  line-height: 1.5;
}

@media (hover: hover) and (pointer: fine) {
  .landing-evidence-grid article:hover {
    z-index: 1;
    transform: translateY(-4px);
    background: #fbfcff;
    box-shadow: var(--ux-shadow);
  }

  .landing-button:hover {
    transform: translateY(-2px);
  }
}

@media (max-width: 720px) {
.landing-kicker,
  .landing-section-label {
    font-size: 12px;
  }

  .landing-hero-proof {
    font-size: 15px;
  }

  .landing-evidence-grid article,
  .landing-evidence-grid article:first-child {
    padding-block: 28px;
  }

  .landing-synny-step,
  .landing-evidence-source,
  .landing-footer a {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-reading-progress > span,
  .landing-button,
  .landing-button .ux-action-icon,
  .landing-evidence-grid article {
    transition: none;
  }

  .landing-shell *,
  .landing-shell *::before,
  .landing-shell *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* Complete touch-target coverage found by the viewport audit. */
.landing-brand,
.landing-footer button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.landing-hero-signal i {
  font-size: 11px;
}
