/* ============================================================================
   FERA FIGHT DESIGN SYSTEM 2.0
   Fonte única para cores, espaçamento, tipografia, raios, sombras, movimento
   e componentes primitivos. O jogo continua sem framework e usa CSS nativo.
   ========================================================================== */
:root{
  /* AppSpacing: 4, 8, 12, 16, 24, 32 e 48 */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
  --space-6:24px;--space-8:32px;--space-12:48px;

  /* AppRadius */
  --radius-sm:10px;--radius-md:16px;--radius-lg:24px;
  --radius-xl:32px;--radius-pill:999px;

  /* AppColors */
  --color-ink:#233b5d;--color-ink-soft:#526987;--color-muted:#7185a0;
  --color-surface:#fffdf9;--color-surface-soft:#f2f9ff;
  --color-surface-glass:rgba(255,255,255,.88);
  --color-cyan:#16bfd4;--color-cyan-light:#65e4ed;
  --color-blue:#2f85e9;--color-blue-dark:#1b5dae;
  --color-coral:#ec6177;--color-gold:#f4b93e;--color-purple:#9d69e8;
  --color-success:#34a979;--color-line:rgba(72,126,168,.18);
  --gradient-primary:linear-gradient(115deg,#19c7d5 0%,#2f8deb 68%,#4878e8 100%);
  --gradient-surface:linear-gradient(145deg,rgba(255,255,255,.98),rgba(226,247,255,.88));

  /* AppShadows */
  --shadow-xs:0 2px 5px rgba(35,80,118,.12);
  --shadow-sm:0 5px 0 rgba(54,134,179,.22),0 10px 22px rgba(36,91,132,.14);
  --shadow-md:0 10px 0 rgba(70,133,163,.17),0 22px 48px rgba(35,79,111,.18);
  --shadow-float:0 18px 55px rgba(31,75,108,.24);
  --shadow-focus:0 0 0 4px rgba(28,191,212,.24);

  /* AppDurations / AppMotionTokens */
  --motion-fast:100ms;--motion-normal:180ms;--motion-slow:300ms;
  --motion-reveal:420ms;--ease-standard:cubic-bezier(.2,.8,.2,1);

  /* AppTypography */
  --font-ui:'Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Fredoka','Nunito Sans',system-ui,sans-serif;
  --text-display:clamp(2rem,5vw,2.25rem);
  --text-screen:clamp(1.5rem,3.4vw,1.75rem);
  --text-section:clamp(1.25rem,2.6vw,1.375rem);
  --text-button-primary:clamp(1.1875rem,2.2vw,1.3125rem);
  --text-button-secondary:clamp(1rem,2vw,1.125rem);
  --text-card:clamp(1rem,1.8vw,1.125rem);
  --text-body:clamp(.875rem,1.8vw,1rem);
  --text-meta:clamp(.75rem,1.5vw,.8125rem);

  /* AppBreakpoints: compact <600; medium 600–839; expanded >=840 */
  --content-max:1180px;--battle-max:1120px;
  --safe-top:max(var(--space-2),env(safe-area-inset-top,0px));
  --safe-right:max(var(--space-3),env(safe-area-inset-right,0px));
  --safe-bottom:max(var(--space-2),env(safe-area-inset-bottom,0px));
  --safe-left:max(var(--space-3),env(safe-area-inset-left,0px));
}

.ui-v2,.ui-v2 button,.ui-v2 input{font-family:var(--font-ui)}
.ui-v2 h1,.ui-v2 h2,.ui-v2 h3{font-family:var(--font-display)}
.ui-v2 button{min-height:48px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* AppButtonStyles */
.game-primary-button,.game-secondary-button,.game-tertiary-button,
.game-destructive-button,.game-icon-button{
  appearance:none;border:0;border-radius:var(--radius-md);cursor:pointer;
  transition:transform var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-normal) var(--ease-standard),
    filter var(--motion-normal) var(--ease-standard);
}
.game-primary-button{
  min-height:68px;padding:var(--space-3) var(--space-6);color:white!important;
  background:var(--gradient-primary)!important;box-shadow:var(--shadow-sm)!important;
  font-size:var(--text-button-primary);font-weight:800;
}
.game-secondary-button{
  min-height:56px;padding:var(--space-2) var(--space-4)!important;
  color:var(--color-ink)!important;background:var(--gradient-surface)!important;
  border:1px solid rgba(255,255,255,.92)!important;box-shadow:var(--shadow-xs)!important;
  font-size:var(--text-button-secondary)!important;font-weight:700!important;
}
.game-tertiary-button{padding:var(--space-2) var(--space-3);color:var(--color-ink-soft);background:transparent;font-size:var(--text-meta);font-weight:800}
.game-destructive-button{padding:var(--space-2) var(--space-3);color:var(--color-coral)!important;background:rgba(255,255,255,.7)!important;border:1px solid rgba(236,97,119,.36)!important;font-size:var(--text-meta);font-weight:800}
.game-icon-button{width:48px;height:48px;min-width:48px;display:grid;place-items:center;padding:0;color:var(--color-ink);background:var(--gradient-surface);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-xs)}
.game-primary-button:active,.game-secondary-button:active,.game-tertiary-button:active,
.game-destructive-button:active,.game-icon-button:active{transform:scale(.98);transition-duration:var(--motion-fast)}
.game-primary-button:focus-visible,.game-secondary-button:focus-visible,
.game-tertiary-button:focus-visible,.game-destructive-button:focus-visible,
.game-icon-button:focus-visible{outline:0;box-shadow:var(--shadow-focus)!important}
.game-primary-button:disabled,.game-secondary-button:disabled,.game-tertiary-button:disabled,
.game-destructive-button:disabled,.game-icon-button:disabled{cursor:not-allowed;opacity:.48;filter:saturate(.5)}

/* AppCardStyles */
.game-card{border:1px solid rgba(255,255,255,.88);border-radius:var(--radius-lg);background:var(--color-surface-glass);box-shadow:var(--shadow-md);backdrop-filter:blur(18px) saturate(1.12)}

.currency-chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:40px;padding:var(--space-2) var(--space-3);border:1px solid rgba(255,255,255,.88);border-radius:var(--radius-pill);background:rgba(255,255,255,.82);box-shadow:var(--shadow-xs);color:var(--color-ink);font-size:var(--text-body);font-weight:800;white-space:nowrap}
.currency-chip img{width:24px;height:24px;object-fit:contain}

.player-avatar{position:relative;display:grid;place-items:center;aspect-ratio:1;overflow:hidden;border-radius:var(--radius-md);background:linear-gradient(145deg,#fff,#dff5ff)}
.player-avatar--small{width:48px;height:48px}.player-avatar--medium{width:72px;height:72px}.player-avatar--large{width:112px;height:112px}.player-avatar--rank{width:clamp(88px,16vw,152px);height:clamp(88px,16vw,152px)}
.player-avatar img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.player-avatar.is-error:before{content:'?';display:grid;place-items:center;position:absolute;inset:0;background:#e6f5fb;color:var(--color-blue);font:800 1.25rem var(--font-display)}

@media(prefers-reduced-motion:reduce){
  :root{--motion-fast:1ms;--motion-normal:1ms;--motion-slow:1ms;--motion-reveal:1ms}
}