/* GYANEXIS interface baseline. Loaded last on every page.
   Holds the shared design tokens and the floor values every page must meet:
   readable text, comfortable tap targets, one focus ring and reduced motion.
   Page stylesheets keep their own layout; this sheet only corrects what falls
   below the floor, so rules here use !important where a page rule would win. */

:root {
  /* Colour roles */
  --ui-primary: #1257e0;
  --ui-primary-hover: #0a45d8;
  --ui-primary-active: #0837ad;
  --ui-secondary: #eaf2ff;
  --ui-accent: #eab308;
  --ui-bg: #f7f9fe;
  --ui-surface: #ffffff;
  --ui-surface-raised: #ffffff;
  --ui-text: #12213f;
  --ui-text-secondary: #44536f;
  --ui-text-muted: #6a7a99;
  --ui-border: #dce5f6;
  --ui-success: #16844e;
  --ui-warning: #b7791f;
  --ui-error: #c62434;
  --ui-info: #1d4ed8;
  --ui-disabled: #a9b4c8;

  /* Spacing scale */
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-space-10: 40px;
  --ui-space-12: 48px;
  --ui-space-16: 64px;

  /* Radius, icon sizes and motion */
  --ui-radius-sm: 8px;
  --ui-radius-md: 12px;
  --ui-radius-lg: 18px;
  --ui-radius-pill: 999px;
  --ui-icon-xs: 14px;
  --ui-icon-sm: 16px;
  --ui-icon-md: 20px;
  --ui-icon-lg: 24px;
  --ui-icon-xl: 32px;
  --ui-motion-fast: 140ms;
  --ui-motion-base: 220ms;
  --ui-motion-slow: 320ms;

  /* Floors */
  --ui-text-min: 11px;
  --ui-tap-min: 40px;
}

/* ------------------------------------------------------------------ */
/* Icons                                                               */
/* ------------------------------------------------------------------ */
lucide-icon { flex-shrink: 0; }
lucide-icon[data-size="xs"] { width: var(--ui-icon-xs); height: var(--ui-icon-xs); }
lucide-icon[data-size="sm"] { width: var(--ui-icon-sm); height: var(--ui-icon-sm); }
lucide-icon[data-size="md"] { width: var(--ui-icon-md); height: var(--ui-icon-md); }
lucide-icon[data-size="lg"] { width: var(--ui-icon-lg); height: var(--ui-icon-lg); }
lucide-icon[data-size="xl"] { width: var(--ui-icon-xl); height: var(--ui-icon-xl); }

/* ------------------------------------------------------------------ */
/* Motion: honour the visitor's reduced-motion setting everywhere      */
/* ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ------------------------------------------------------------------ */
/* Readable text: nothing below 11px (brand taglines 10px)             */
/* ------------------------------------------------------------------ */
body#home .gx-brand small { font-size: 10px !important; letter-spacing: 0 !important; white-space: nowrap; }
body#home #home-footer .gx-home-footer__identity small,
body#home #home-footer .gx-home-footer__identity small b,
body#home #home-footer .gx-home-footer__highlights a span { font-size: 11px !important; }
/* :not(#_) lifts these above the site-wide ID-level text rules. */
html body:not(#_):not(#_) .auth-brand small,
html body:not(#_):not(#_) a.brand-lockup span small,
html body:not(#_):not(#_) .gx-brand-tagline { font-size: 10.5px !important; }

.gx-directory__image-card strong { font-size: 12px !important; }
.gx-directory__image-card span { font-size: 11px !important; }

.reward-vault-badge { font-size: 11px !important; }
.step-badge { font-size: 11px !important; }

.prequiz-selector small,
.prequiz-details-list dd small { font-size: 11px !important; }

@media (max-width: 680px) {
  html body .category-list .gx-category-card strong { font-size: 11px !important; }
  .prequiz-details-list dt,
  .prequiz-details-list dd,
  .prequiz-details-list dd span { font-size: 11px !important; }
  body#home .gx-hero__actions .gx-button { min-height: 42px; font-size: 12px !important; }
  body#home #categories-section .gx-category-card strong { font-size: 11px !important; letter-spacing: 0; }
  body#home .gx-section-head > a { display: inline-flex; align-items: center; min-height: var(--ui-tap-min); font-size: 11px !important; }
  body#home .gx-explore-action-card strong { font-size: 11.5px !important; }
  body#home .gx-explore-action-card span { font-size: 10.5px !important; }
  body#home .gx-bottom-nav a { font-size: 10.5px !important; }
  body#home .gx-bottom-nav a span { font-size: 10.5px !important; }

  .arcade-hero__eyebrow,
  .arcade-primary-button,
  .arcade-view-all,
  .game-desc { font-size: 11px !important; }
  #games-page :is(.btn-play, .btn-how) { min-height: 38px !important; font-size: 11px !important; }
  .arcade-home p small { font-size: 10.5px !important; }
}

/* ------------------------------------------------------------------ */
/* Tap targets on touch screens                                        */
/* ------------------------------------------------------------------ */
@media (max-width: 680px) {
  body#home .gx-home-footer__links a { display: flex; align-items: center; min-height: 36px; }
  body#home .gx-home-footer__legal a { display: inline-flex; align-items: center; min-height: 36px; }
  .gx-directory__back,
  .view-all-link,
  .forgot-link { display: inline-flex !important; align-items: center; min-height: var(--ui-tap-min); }
  html body:not(#_):not(#_) #forgotPasswordBtn { display: inline-flex !important; align-items: center; min-height: var(--ui-tap-min) !important; }
  .social-media a { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; }
}