:root {
  --to-primary: #3157d5;
  --to-primary-dark: #223da9;
  --to-secondary: #6d4aff;
  --to-accent: #ffb703;
  --to-success: #17a673;
  --to-danger: #ef476f;
  --to-ink: #172033;
  --to-muted: #667085;
  --to-surface: #ffffff;
  --to-bg: #f5f7ff;
  --to-border: #e6e9f4;
  --to-radius: 22px;
  --to-shadow: 0 18px 48px rgba(35, 55, 120, .10);
}

html { scroll-behavior: smooth; }
body.site-body {
  min-height: 100vh;
  color: var(--to-ink);
  background:
    radial-gradient(circle at 10% 0%, rgba(109, 74, 255, .10), transparent 30rem),
    radial-gradient(circle at 100% 8%, rgba(49, 87, 213, .10), transparent 28rem),
    var(--to-bg) !important;
}
body.site-body, body.site-body button, body.site-body input, body.site-body select {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--to-primary); }
a:hover { color: var(--to-primary-dark); }

.site-nav {
  position: sticky;
  top: 0;
  z-index: 1040;
  border-bottom: 1px solid rgba(230, 233, 244, .9);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
}
.site-nav .navbar { min-height: 70px; }
.site-nav .page-shell { max-width: 1380px; }
.site-brand {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  font-weight: 800;
  color: var(--to-ink) !important;
  text-decoration: none;
  letter-spacing: -.03em;
}
.site-brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  flex: 0 0 40px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(49, 87, 213, .22);
}
.site-brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
}
.site-nav .nav-link {
  font-weight: 650;
  color: #4a5568;
  border-radius: 12px;
  padding: .55rem .68rem !important;
  white-space: nowrap;
}
.site-nav .nav-link:hover,
.site-nav .nav-link.active { background: #f1f3ff; color: var(--to-primary); }
.nav-cta {
  border-radius: 999px !important;
  font-weight: 700 !important;
  padding-inline: 1rem !important;
  white-space: nowrap;
}

.site-main { width: 100%; }
.page-shell { max-width: 1120px; margin-inline: auto; }
.content-shell { max-width: 900px; margin-inline: auto; }

.hero {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  background: linear-gradient(135deg, #253eb4 0%, #4169e1 48%, #7457ff 100%);
  color: #fff;
  box-shadow: 0 26px 70px rgba(42, 63, 170, .22);
}
.hero::after {
  content: "×  ÷  +  −";
  position: absolute;
  right: -1rem;
  bottom: -2.5rem;
  font-size: clamp(4rem, 10vw, 9rem);
  font-weight: 900;
  letter-spacing: -.12em;
  opacity: .075;
  pointer-events: none;
}
.hero-content { position: relative; z-index: 1; padding: clamp(2rem, 5vw, 4.25rem); }
.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .48rem .8rem;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 700;
  font-size: .9rem;
}
.hero h1 { font-size: clamp(2.25rem, 5vw, 4.4rem); line-height: 1.02; letter-spacing: -.055em; font-weight: 900; }
.hero p { color: rgba(255,255,255,.86); font-size: clamp(1rem, 2vw, 1.2rem); max-width: 680px; }
.hero .btn-light { color: var(--to-primary-dark); font-weight: 800; }

.quick-card,
.feature-card,
.tool-card,
.site-card,
body.site-body .card {
  border: 1px solid var(--to-border) !important;
  border-radius: var(--to-radius) !important;
  background: rgba(255,255,255,.97);
  box-shadow: var(--to-shadow) !important;
}
.quick-card { margin-top: -38px; position: relative; z-index: 2; }
.quick-card .form-control,
.quick-card .form-select,
body.site-body .form-control,
body.site-body .form-select {
  min-height: 48px;
  border-radius: 13px;
  border-color: #dfe3ef;
}
body.site-body .form-control:focus,
body.site-body .form-select:focus {
  border-color: rgba(49,87,213,.55);
  box-shadow: 0 0 0 .25rem rgba(49,87,213,.12);
}

.section-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 850; color: var(--to-primary); }
.section-title { font-weight: 850; letter-spacing: -.035em; }
.section-subtitle { color: var(--to-muted); }

.feature-card, .tool-card { height: 100%; padding: 1.35rem; text-align: left; transition: transform .18s ease, box-shadow .18s ease; }
.feature-card:hover, .tool-card:hover { transform: translateY(-3px); box-shadow: 0 22px 55px rgba(35,55,120,.15) !important; }
.feature-icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  font-size: 1.6rem;
  background: #f1f3ff;
  margin-bottom: 1rem;
}
.feature-card h3, .tool-card h3 { font-size: 1.05rem; font-weight: 800; margin-bottom: .45rem; }
.feature-card p, .tool-card p { color: var(--to-muted); margin-bottom: 1rem; }

.operation-grid .btn {
  min-height: 58px;
  border-radius: 16px;
  font-weight: 800;
  border-width: 1px;
}
.btn { border-radius: 13px; font-weight: 700; }
.btn-lg { border-radius: 16px; }
.btn-primary { background: var(--to-primary); border-color: var(--to-primary); }
.btn-primary:hover { background: var(--to-primary-dark); border-color: var(--to-primary-dark); }
.btn-success { background: var(--to-success); border-color: var(--to-success); }

.result-sheet {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: .65rem;
}
.result-line {
  border-radius: 14px;
  padding: .8rem 1rem;
  background: #f7f8ff;
  border: 1px solid #e7eafd;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

.game-config .btn-group { flex-wrap: wrap; }
.game-config .btn-group > .btn { flex: 1 1 220px; border-radius: 13px !important; margin: 2px; }

.progress-panel {
  border-radius: var(--to-radius);
  padding: 1.25rem;
  background: linear-gradient(145deg, #fff, #f8f9ff);
  border: 1px solid var(--to-border);
}
.progress-ring {
  width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
  background: conic-gradient(var(--to-primary) var(--progress, 0%), #e8ebf6 0);
  position: relative;
}
.progress-ring::after { content:""; width: 44px; height: 44px; border-radius: 50%; background:#fff; position:absolute; }
.progress-ring span { position: relative; z-index: 1; font-size: .75rem; font-weight: 800; }

body.site-body main.container,
body.site-body > .container,
body.site-body main .container {
  max-width: 1120px;
}

/* Faz páginas antigas ganharem o novo acabamento sem alterar suas regras. */
body.site-body .shadow,
body.site-body .shadow-sm { box-shadow: var(--to-shadow) !important; }
body.site-body .rounded { border-radius: var(--to-radius) !important; }
body.site-body .bg-white { border: 1px solid var(--to-border); }
body.site-body h1, body.site-body h2 { letter-spacing: -.03em; }
body.site-body .table { --bs-table-bg: transparent; }
body.site-body .nav-pills .nav-link { border-radius: 999px; font-weight: 700; }
body.site-body .nav-pills .nav-link.active { background: var(--to-primary); }

.site-footer {
  width: 100%;
  margin-top: 4rem;
  border-top: 1px solid var(--to-border);
  background: rgba(255,255,255,.75);
}
.site-footer a { color: #667085; text-decoration: none; }
.site-footer a:hover { color: var(--to-primary); }
.site-footer-brand { font-weight: 850; color: var(--to-ink); }

.back-to-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1030;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  display: none;
  place-items: center;
  background: var(--to-primary);
  color: #fff;
  box-shadow: 0 10px 24px rgba(49,87,213,.28);
}
.back-to-top.is-visible { display: grid; }

@media (max-width: 767.98px) {
  .site-nav .navbar { min-height: 62px; }
  .hero { border-radius: 0 0 28px 28px; margin-inline: -12px; }
  .hero-content { padding: 2.2rem 1.25rem 4rem; }
  .quick-card { margin-top: -32px; }
  .quick-card .card-body { padding: 1rem; }
  .operation-grid .btn { min-height: 54px; font-size: .92rem; }
  body.site-body { padding: 0 !important; }
  body.site-body > main, body.site-body > div:not(.site-nav) { max-width: 100% !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Compatibilidade com templates antigos que usam utilitários flex no body. */
body.site-body { padding: 0 !important; align-items: stretch !important; justify-content: flex-start !important; }
.site-nav { width: 100%; flex: 0 0 auto; }
body.site-body > main { width: 100%; }

/* --------------------------------------------------------------------------
   Fase 2 — progresso, gamificação e telas de treino
   -------------------------------------------------------------------------- */
.progress-dashboard {
  border: 1px solid var(--to-border);
  border-radius: 28px;
  padding: clamp(1.1rem, 3vw, 2rem);
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(247,249,255,.98));
  box-shadow: var(--to-shadow);
}
.progress-stat {
  height: 100%;
  min-height: 116px;
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid #e8ebf5;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .1rem;
}
.progress-stat-icon { font-size: 1.25rem; margin-bottom: .2rem; }
.progress-stat strong { font-size: clamp(1.45rem, 3vw, 2rem); line-height: 1; color: var(--to-ink); }
.progress-stat small { color: var(--to-muted); font-weight: 650; }
.daily-goal {
  padding: 1.15rem;
  border: 1px solid #e8ebf5;
  border-radius: 20px;
  background: #fff;
}
.daily-goal .progress { height: 9px; border-radius: 999px; background: #e9edf9; }
.daily-goal .progress-bar { border-radius: 999px; background: linear-gradient(90deg, var(--to-primary), var(--to-secondary)); }
.achievement-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: .65rem;
}
.achievement-chip {
  min-height: 78px;
  display: flex;
  gap: .75rem;
  align-items: center;
  padding: .8rem .9rem;
  border: 1px solid #e7eafb;
  border-radius: 17px;
  background: #fff;
}
.achievement-emoji {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  font-size: 1.35rem;
  background: #f3f5ff;
}
.achievement-chip strong { display: block; font-size: .9rem; }
.achievement-chip small { display: block; color: var(--to-muted); font-size: .74rem; line-height: 1.25; margin-top: .12rem; }
.achievement-empty {
  grid-column: 1 / -1;
  padding: 1rem;
  border-radius: 16px;
  border: 1px dashed #ccd3ea;
  color: var(--to-muted);
  background: rgba(255,255,255,.6);
}
.privacy-note {
  font-size: .78rem;
  color: var(--to-muted);
}

.game-shell { max-width: 760px; margin-inline: auto; }
.game-card { padding: clamp(1rem, 4vw, 2rem) !important; }
.game-eyebrow {
  display: inline-flex;
  align-items: center;
  padding: .38rem .7rem;
  border-radius: 999px;
  background: #f0f3ff;
  color: var(--to-primary);
  font-size: .75rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.game-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .55rem;
  margin: 1rem 0;
}
.game-stat {
  padding: .72rem .6rem;
  border-radius: 15px;
  background: #f8f9ff;
  border: 1px solid #e8ebf8;
  text-align: center;
}
.game-stat span { display: block; color: var(--to-muted); font-size: .72rem; font-weight: 700; }
.game-stat strong { display: block; font-size: 1.05rem; margin-top: .1rem; }
.question-card {
  margin: 1rem 0 1.2rem;
  padding: clamp(1rem, 4vw, 1.65rem);
  border-radius: 22px;
  background: linear-gradient(145deg, #f7f8ff, #fff);
  border: 1px solid #e5e9fb;
}
.question-card .question-expression {
  font-size: clamp(2rem, 7vw, 3.4rem);
  font-weight: 900;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}
.answer-input { min-height: 62px !important; font-size: 1.65rem !important; font-weight: 800; }
.session-progress {
  height: 7px;
  background: #edf0f8;
  border-radius: 999px;
  overflow: hidden;
}
.session-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--to-primary), var(--to-secondary));
}
.game-result-score {
  display: inline-grid;
  place-items: center;
  min-width: 112px;
  min-height: 112px;
  border-radius: 28px;
  margin: .5rem auto 1rem;
  background: linear-gradient(145deg, #f1f4ff, #fff);
  border: 1px solid #dfe4fa;
}
.game-result-score strong { font-size: 2.5rem; line-height: 1; color: var(--to-primary); }
.game-result-score small { color: var(--to-muted); font-weight: 700; }

@media (max-width: 575.98px) {
  .progress-stat { min-height: 98px; padding: .8rem; }
  .achievement-grid { grid-template-columns: 1fr; }
  .game-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; }
  .game-stat { padding: .6rem .35rem; }
  .game-stat strong { font-size: .92rem; }
  .game-stat span { font-size: .66rem; }
}

/* --------------------------------------------------------------------------
   Fase 3 — treino inteligente e painel Meu desempenho
   -------------------------------------------------------------------------- */
.smart-training-note {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .45rem;
  margin: .9rem 0 .2rem;
}
.smart-training-note span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: .38rem .68rem;
  border-radius: 999px;
  background: #f8f9ff;
  border: 1px solid #e4e8f7;
  color: #59627a;
  font-size: .76rem;
  font-weight: 750;
}
.question-mode-badge {
  display: inline-flex;
  align-items: center;
  padding: .35rem .7rem;
  border-radius: 999px;
  background: #eaf0ff;
  color: var(--to-primary-dark);
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .02em;
}
.question-mode-badge.is-review {
  background: #fff4dd;
  color: #8a5a00;
  border: 1px solid #ffe1a3;
}
.weak-factors {
  padding: .85rem;
  border-radius: 16px;
  background: #fffaf0;
  border: 1px solid #f6e4bd;
}
.weak-factor-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .65rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #efd9aa;
  color: #6e5010;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.weak-factor-chip small { color: #9a7628; font-weight: 700; }
.table-switcher .btn { min-width: 38px; border-radius: 10px; }

.performance-hero {
  overflow: hidden;
  position: relative;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border-radius: 28px;
  background: linear-gradient(135deg, #253eb4 0%, #4169e1 52%, #7457ff 100%);
  color: #fff;
  box-shadow: 0 24px 60px rgba(42, 63, 170, .2);
}
.performance-hero::after {
  content: "✓  ×  10";
  position: absolute;
  right: -1rem;
  bottom: -2.2rem;
  font-size: clamp(4rem, 10vw, 8rem);
  font-weight: 950;
  opacity: .07;
  pointer-events: none;
}
.performance-hero > .row { position: relative; z-index: 1; }
.performance-hero h1 { font-size: clamp(2.1rem, 5vw, 3.8rem); font-weight: 900; letter-spacing: -.055em; }
.performance-hero p { color: rgba(255,255,255,.86); font-size: 1.05rem; max-width: 720px; }
.performance-privacy {
  padding: 1rem;
  border-radius: 18px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  font-size: .88rem;
  line-height: 1.45;
}
.recommendation-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem;
  border-radius: 22px;
  border: 1px solid #dfe5ff;
  background: linear-gradient(120deg, #f5f7ff, #fff);
  box-shadow: var(--to-shadow);
}
.recommendation-icon {
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(145deg, #e8edff, #fff);
  border: 1px solid #dce3ff;
  font-size: 1.7rem;
}
.performance-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .8rem;
}
.table-progress-card {
  min-width: 0;
  padding: 1rem;
  border: 1px solid #e6e9f4;
  border-radius: 19px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(43, 55, 105, .055);
}
.table-progress-card h3 {
  margin: .35rem 0 0;
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: -.02em;
}
.table-progress-card.is-mastered { border-color: #bfe5cf; background: linear-gradient(145deg, #f5fff9, #fff); }
.table-progress-card.is-needs-work { border-color: #ffd6b8; background: linear-gradient(145deg, #fff8f2, #fff); }
.table-progress-card.is-almost { border-color: #cfd8ff; background: linear-gradient(145deg, #f7f8ff, #fff); }
.table-progress-icon { font-size: 1.15rem; }
.table-status {
  display: inline-flex;
  padding: .25rem .48rem;
  border-radius: 999px;
  background: #f2f4f8;
  color: #667085;
  font-size: .62rem;
  font-weight: 850;
  white-space: nowrap;
}
.is-mastered .table-status { background: #e6f7ed; color: #237044; }
.is-needs-work .table-status { background: #fff0e4; color: #9b4f13; }
.is-almost .table-status { background: #edf0ff; color: var(--to-primary); }
.table-accuracy { display: flex; align-items: baseline; gap: .35rem; margin: .8rem 0 .4rem; }
.table-accuracy strong { font-size: 1.55rem; line-height: 1; font-weight: 900; }
.table-accuracy span { color: var(--to-muted); font-size: .7rem; font-weight: 650; }
.table-progress-track { height: 7px; overflow: hidden; border-radius: 999px; background: #edf0f6; }
.table-progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--to-primary), var(--to-secondary)); }
.is-mastered .table-progress-track span { background: linear-gradient(90deg, #28a36a, #55c98d); }
.is-needs-work .table-progress-track span { background: linear-gradient(90deg, #ef8d46, #f4b263); }
.table-progress-meta {
  display: flex;
  justify-content: space-between;
  gap: .4rem;
  margin: .55rem 0 .8rem;
  color: var(--to-muted);
  font-size: .68rem;
  font-weight: 700;
}
.review-list { display: grid; gap: .55rem; }
.review-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .8rem;
  padding: .75rem .85rem;
  border-radius: 15px;
  border: 1px solid #e7eaf4;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: transform .16s ease, border-color .16s ease;
}
.review-item:hover { transform: translateX(3px); border-color: #cbd4ff; }
.review-expression {
  min-width: 72px;
  padding: .45rem .55rem;
  border-radius: 11px;
  background: #f2f4ff;
  color: var(--to-primary-dark);
  font-weight: 900;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.review-item strong, .review-item small { display: block; }
.review-item strong { font-size: .86rem; }
.review-item small { color: var(--to-muted); font-size: .72rem; }
.review-arrow { color: var(--to-primary); font-weight: 900; }

@media (max-width: 991.98px) {
  .performance-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .recommendation-card { align-items: flex-start; flex-wrap: wrap; }
  .recommendation-card .btn { width: 100%; }
}
@media (max-width: 575.98px) {
  .performance-grid { grid-template-columns: 1fr; }
  .performance-hero { margin-inline: -4px; border-radius: 22px; }
  .recommendation-icon { width: 48px; height: 48px; border-radius: 15px; }
  .smart-training-note { gap: .3rem; }
  .smart-training-note span { font-size: .68rem; padding-inline: .5rem; }
}

/* --------------------------------------------------------------------------
   Fase 3.1 — resumo do treino 4 operações
   -------------------------------------------------------------------------- */
.training-summary-heading {
  max-width: 760px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.training-summary-heading h1 {
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  letter-spacing: -.045em;
}
.training-summary-success {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  color: #fff;
  font-size: 2rem;
  font-weight: 950;
  background: linear-gradient(145deg, #27c281, #14a96d);
  box-shadow: 0 12px 26px rgba(23,166,115,.22);
}
.training-summary-card,
.training-report-card {
  overflow: hidden;
}
.summary-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
}
.summary-kpi {
  min-height: 142px;
  padding: 1rem .8rem;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px solid #e7eaf5;
  background: #f8f9ff;
}
.summary-kpi-icon { font-size: 1.3rem; line-height: 1; margin-bottom: .45rem; }
.summary-kpi strong { font-size: clamp(1.8rem, 4vw, 2.5rem); line-height: 1; font-weight: 900; }
.summary-kpi small { margin-top: .35rem; color: var(--to-muted); font-weight: 750; }
.summary-kpi-success { background: #f0fbf6; border-color: #d5f1e4; }
.summary-kpi-success strong { color: #128158; }
.summary-kpi-error { background: #fff5f7; border-color: #f7dce3; }
.summary-kpi-error strong { color: #c63e5f; }
.summary-kpi-streak { background: #fff9ee; border-color: #f3e5c8; }
.summary-kpi-streak strong { color: #a76a00; }
.summary-section {
  padding: 1.15rem;
  border-radius: 20px;
  border: 1px solid #e8ebf5;
  background: #fbfcff;
}
.summary-section-title {
  display: flex;
  gap: .7rem;
  align-items: flex-start;
}
.summary-section-title > span { font-size: 1.1rem; line-height: 1.35; }
.summary-section-title strong { display: block; font-size: 1rem; }
.summary-section-title small { display: block; color: var(--to-muted); line-height: 1.35; margin-top: .12rem; }
.summary-achievement {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: .4rem .7rem;
  border-radius: 999px;
  background: #fff6d8;
  border: 1px solid #f1dfa0;
  color: #785c00;
  font-weight: 800;
  font-size: .78rem;
}
.operation-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
.operation-summary-item {
  min-height: 82px;
  padding: .8rem .9rem;
  border-radius: 16px;
  border: 1px solid #e6e9f4;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .4rem;
}
.operation-summary-name { font-weight: 800; }
.operation-summary-counts { display: flex; gap: .65rem; font-size: .82rem; font-weight: 800; }
.operation-summary-counts .is-correct { color: #128158; }
.operation-summary-counts .is-wrong { color: #c63e5f; }
.training-report-card .card-body { min-height: 100%; }
.training-report-text {
  min-height: 300px;
  margin: 0;
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid #e5e8f2;
  background: #f8f9fc;
  color: #283247;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: .86rem;
  line-height: 1.65;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.training-report-empty {
  min-height: 220px;
  display: grid;
  place-items: center;
  padding: 1rem;
  border-radius: 18px;
  border: 1px dashed #d7dceb;
  color: var(--to-muted);
  text-align: center;
}
.summary-actions { display: grid; gap: .65rem; }

@media (max-width: 991.98px) {
  .training-summary-heading { text-align: left !important; }
}

@media (max-width: 575.98px) {
  .training-summary-heading {
    align-items: flex-start;
    justify-content: flex-start;
  }
  .training-summary-success {
    width: 48px;
    height: 48px;
    flex-basis: 48px;
    border-radius: 15px;
    font-size: 1.6rem;
  }
  .training-summary-heading h1 { font-size: 2rem; }
  .summary-kpi-grid { gap: .45rem; }
  .summary-kpi { min-height: 112px; padding: .7rem .35rem; border-radius: 16px; }
  .summary-kpi strong { font-size: 1.7rem; }
  .summary-kpi small { font-size: .68rem; }
  .operation-summary-grid { grid-template-columns: 1fr; }
  .training-report-text { min-height: 250px; font-size: .78rem; }
}

/* --------------------------------------------------------------------------
   Fase 4 — Jogos 2.0
   -------------------------------------------------------------------------- */
.game-shell-wide { max-width: 900px; }
.game-mode-strip {
  display: flex;
  gap: .5rem;
  overflow-x: auto;
  padding: .2rem .1rem .45rem;
  scrollbar-width: thin;
}
.game-mode-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 40px;
  padding: .55rem .8rem;
  border-radius: 999px;
  border: 1px solid #dfe4f2;
  background: #fff;
  color: #3d465b;
  text-decoration: none;
  font-size: .8rem;
  font-weight: 800;
  box-shadow: 0 5px 14px rgba(31,45,84,.04);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.game-mode-pill:hover { transform: translateY(-1px); border-color: #bfc9f7; }
.game-mode-pill.is-active {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, var(--to-primary), var(--to-secondary));
  box-shadow: 0 8px 20px rgba(62,81,218,.2);
}
.game-mode-pill.is-disabled { opacity: .62; }
.smart-training-note.is-review { background: #fff8e8; border-color: #f2dfaf; }
.game-stat-timer strong { font-variant-numeric: tabular-nums; }
.keyboard-hint { color: var(--to-muted); font-size: .7rem; font-weight: 700; }

.game-modes-launcher {
  padding: clamp(1rem, 3vw, 1.4rem);
  border: 1px solid #e4e8f4;
  border-radius: 24px;
  background: linear-gradient(145deg, #fff, #f8f9ff);
  box-shadow: var(--to-shadow-sm);
}
.game-mode-launch-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
}
.game-mode-launch-card {
  min-height: 142px;
  padding: .9rem;
  border-radius: 18px;
  border: 1px solid #e4e8f4;
  background: #fff;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .35rem;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.game-mode-launch-card:hover {
  transform: translateY(-3px);
  border-color: #c8d1ff;
  box-shadow: 0 12px 24px rgba(50,66,140,.08);
}
.game-mode-launch-card.is-review { background: linear-gradient(145deg, #fffaf0, #fff); }
.game-mode-launch-card.is-disabled { opacity: .65; }
.game-mode-launch-icon { font-size: 1.45rem; }
.game-mode-launch-card strong { font-size: .93rem; }
.game-mode-launch-card small { color: var(--to-muted); line-height: 1.35; }

.performance-actions { min-width: 210px; }
.mistake-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
.mistake-card {
  padding: .75rem .85rem;
  border-radius: 15px;
  border: 1px solid #f0dfe4;
  background: #fff8fa;
  display: grid;
  gap: .15rem;
}
.mistake-card strong { color: #a52f50; font-size: 1rem; }
.mistake-card span { font-size: .76rem; color: #5d6474; }
.mistake-card small { color: #248154; font-weight: 800; }
.perfect-session {
  padding: 1rem;
  border-radius: 16px;
  background: #effbf5;
  border: 1px solid #d3f0e2;
  color: #176d4d;
  font-weight: 800;
  text-align: center;
}
.summary-tip {
  color: var(--to-muted);
  font-size: .82rem;
  line-height: 1.55;
}
.summary-tip strong { color: var(--to-text); }

@media (max-width: 1199.98px) {
  .game-mode-launch-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .game-mode-launch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .game-mode-launch-card { min-height: 132px; }
  .performance-actions { width: 100%; min-width: 0; }
}
@media (max-width: 575.98px) {
  .game-mode-strip { margin-inline: -.25rem; padding-inline: .25rem; }
  .game-mode-pill { font-size: .72rem; padding: .5rem .68rem; }
  .game-mode-launch-grid { grid-template-columns: 1fr; }
  .game-mode-launch-card { min-height: 0; flex-direction: row; align-items: center; flex-wrap: wrap; }
  .game-mode-launch-card small { flex-basis: 100%; padding-left: 2rem; }
  .mistake-grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Etapa 5 — Exercícios, pais e professores
   -------------------------------------------------------------------------- */
.exercise-hero,
.teacher-hero {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  padding: clamp(1.6rem, 4vw, 3rem);
  background: linear-gradient(135deg, #243aa7 0%, #3157d5 52%, #6d4aff 100%);
  color: #fff;
  box-shadow: 0 24px 65px rgba(35, 55, 150, .20);
}
.exercise-hero { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.exercise-hero h1,
.teacher-hero h1 { font-size: clamp(2rem, 4.5vw, 3.65rem); line-height: 1.04; letter-spacing: -.05em; font-weight: 900; max-width: 800px; }
.exercise-hero p,
.teacher-hero p { max-width: 720px; color: rgba(255,255,255,.86); font-size: 1.06rem; margin-bottom: 0; }
.exercise-hero .section-label { color: #dfe5ff; }
.exercise-hero-badge { width: 100px; height: 100px; border-radius: 28px; display: grid; place-items: center; flex: 0 0 auto; font-size: 3.5rem; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.2); transform: rotate(3deg); }

.exercise-preset-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; }
.exercise-preset-card { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: .75rem; row-gap: .1rem; padding: 1rem; border-radius: 18px; border: 1px solid var(--to-border); background: rgba(255,255,255,.96); color: var(--to-ink); text-decoration: none; box-shadow: 0 10px 30px rgba(35,55,120,.06); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.exercise-preset-card > span { grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: #f1f3ff; font-size: 1.3rem; }
.exercise-preset-card strong { font-size: .94rem; }
.exercise-preset-card small { color: var(--to-muted); line-height: 1.25; }
.exercise-preset-card:hover,
.exercise-preset-card.is-active { transform: translateY(-2px); border-color: rgba(49,87,213,.42); color: var(--to-primary-dark); box-shadow: 0 16px 36px rgba(35,55,120,.10); }

.exercise-builder { overflow: hidden; }
.exercise-step-pill { white-space: nowrap; border-radius: 999px; background: #f1f3ff; color: var(--to-primary); font-weight: 850; font-size: .8rem; padding: .45rem .7rem; }
.exercise-form-section { padding: 1.35rem 0; border-top: 1px solid var(--to-border); }
.exercise-form-section:first-of-type { border-top: 0; padding-top: 0; }
.exercise-section-heading { display: flex; align-items: flex-start; gap: .85rem; margin-bottom: 1rem; }
.exercise-section-heading > span { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 11px; display: grid; place-items: center; background: linear-gradient(135deg, var(--to-primary), var(--to-secondary)); color: #fff; font-weight: 850; }
.exercise-section-heading h3 { font-size: 1.03rem; font-weight: 850; margin: .1rem 0 .12rem; }
.exercise-section-heading p { color: var(--to-muted); font-size: .9rem; margin: 0; }
.exercise-operation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.exercise-check-card { position: relative; display: flex; align-items: center; gap: .75rem; padding: .85rem; border: 1px solid var(--to-border); border-radius: 16px; background: #fff; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.exercise-check-card:hover { transform: translateY(-1px); border-color: rgba(49,87,213,.35); }
.exercise-check-card input { width: 18px; height: 18px; accent-color: var(--to-primary); }
.exercise-check-card:has(input:checked) { border-color: rgba(49,87,213,.52); background: #f6f7ff; box-shadow: inset 0 0 0 1px rgba(49,87,213,.06); }
.exercise-check-symbol { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: #eef1ff; color: var(--to-primary); font-weight: 900; font-size: 1.25rem; }
.exercise-check-card strong, .exercise-check-card small { display: block; }
.exercise-check-card small { color: var(--to-muted); font-size: .78rem; }
.exercise-tables-block { border-radius: 16px; padding: 1rem; background: #f8f9ff; border: 1px solid #e8ebf8; transition: opacity .18s ease; }
.exercise-tables-block.is-muted { opacity: .48; }
.exercise-table-selector { display: grid; grid-template-columns: repeat(12, minmax(34px, 1fr)); gap: .35rem; }
.exercise-table-selector label { cursor: pointer; }
.exercise-table-selector input { position: absolute; opacity: 0; pointer-events: none; }
.exercise-table-selector span { min-height: 39px; display: grid; place-items: center; border-radius: 11px; background: #fff; border: 1px solid #dfe3ef; font-weight: 800; transition: .15s ease; }
.exercise-table-selector input:checked + span { background: var(--to-primary); color: #fff; border-color: var(--to-primary); box-shadow: 0 6px 14px rgba(49,87,213,.22); }
.exercise-toggle-card { display: flex; align-items: flex-start; gap: .7rem; border: 1px solid var(--to-border); border-radius: 16px; padding: .95rem; height: 100%; cursor: pointer; background: #fff; }
.exercise-toggle-card input { margin-top: .2rem; width: 18px; height: 18px; accent-color: var(--to-primary); }
.exercise-toggle-card strong, .exercise-toggle-card small { display: block; }
.exercise-toggle-card small { color: var(--to-muted); font-size: .82rem; margin-top: .12rem; }
.exercise-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.exercise-side-stack { position: sticky; top: 92px; }
.exercise-help-card { background: linear-gradient(145deg, #fff, #f7f8ff) !important; }
.exercise-benefit-list { display: grid; gap: .7rem; color: #46516a; font-weight: 650; }

.exercise-preview-container[hidden] { display: none !important; }
.exercise-preview-sheet { border-radius: 18px; background: #fff; border: 1px solid #dfe3ef; padding: clamp(1rem, 3vw, 2rem); box-shadow: inset 0 0 0 1px rgba(49,87,213,.02); }
.exercise-preview-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 2px solid #eef0f7; }
.exercise-preview-kicker { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 850; color: var(--to-primary); }
.exercise-preview-header h3 { margin: .15rem 0; font-weight: 850; }
.exercise-preview-header p { color: var(--to-muted); margin: 0; font-size: .9rem; }
.exercise-preview-student { display: grid; gap: .2rem; font-size: .85rem; color: #59647a; text-align: right; }
.exercise-preview-grid { display: grid; gap: .5rem; }
.exercise-preview-grid.cols-1 { grid-template-columns: 1fr; }
.exercise-preview-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.exercise-preview-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.exercise-preview-question { min-height: 48px; border: 1px solid #e8ebf4; border-radius: 11px; padding: .65rem .75rem; display: flex; align-items: center; gap: .42rem; font-weight: 720; background: #fcfcff; }
.exercise-preview-number { color: var(--to-primary); font-weight: 900; min-width: 1.7rem; }
.exercise-answer-line { flex: 1; min-width: 28px; border-bottom: 1px solid #9ea7b8; transform: translateY(4px); }
.exercise-preview-answer-note { margin-top: 1rem; padding: .7rem .85rem; border-radius: 11px; background: #effaf6; color: #157456; font-weight: 700; font-size: .86rem; }

.teacher-hero { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 2rem; align-items: center; }
.teacher-kicker { display: inline-flex; padding: .45rem .75rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.20); background: rgba(255,255,255,.12); font-weight: 750; margin-bottom: 1rem; }
.teacher-hero-visual { min-height: 240px; position: relative; }
.teacher-floating-card { position: absolute; min-width: 145px; padding: 1rem; border-radius: 18px; background: rgba(255,255,255,.95); color: var(--to-ink); box-shadow: 0 18px 40px rgba(20,30,90,.22); display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: .6rem; }
.teacher-floating-card span { grid-row: 1 / span 2; font-size: 1.8rem; }
.teacher-floating-card strong, .teacher-floating-card small { display: block; }
.teacher-floating-card small { color: var(--to-muted); font-size: .78rem; }
.teacher-floating-card:nth-child(1) { top: 0; right: 75px; transform: rotate(2deg); }
.teacher-floating-card:nth-child(2) { top: 92px; right: 0; transform: rotate(-3deg); }
.teacher-floating-card:nth-child(3) { bottom: 0; right: 120px; transform: rotate(2deg); }
.teacher-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; }
.teacher-stat-grid > div { border-radius: 16px; background: #f8f9ff; border: 1px solid #e8ebf6; padding: 1rem; }
.teacher-stat-grid strong { display: block; font-size: 1.45rem; font-weight: 900; color: var(--to-primary-dark); }
.teacher-stat-grid span { color: var(--to-muted); font-size: .78rem; }
.teacher-recommendation-box { border-radius: 20px; padding: 1.25rem; background: linear-gradient(145deg, #f8f9ff, #eef1ff); border: 1px solid #dfe4fb; }
.teacher-routine { display: grid; gap: .2rem; }
.teacher-routine-step { display: grid; grid-template-columns: 42px 1fr; gap: .8rem; padding: .7rem 0; border-bottom: 1px solid var(--to-border); }
.teacher-routine-step:last-child { border-bottom: 0; }
.teacher-routine-step > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: #f1f3ff; color: var(--to-primary); font-weight: 900; }
.teacher-routine-step strong { display: block; margin-bottom: .12rem; }
.teacher-routine-step p { color: var(--to-muted); margin: 0; font-size: .9rem; }
.teacher-preset-list { display: grid; gap: .6rem; }
.teacher-preset-list a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .7rem; padding: .8rem; border-radius: 14px; border: 1px solid var(--to-border); text-decoration: none; color: var(--to-ink); background: #fff; }
.teacher-preset-list a:hover { border-color: rgba(49,87,213,.38); background: #f9faff; }
.teacher-preset-list a > span { font-size: 1.35rem; }
.teacher-preset-list strong, .teacher-preset-list small { display: block; }
.teacher-preset-list small { color: var(--to-muted); }
.teacher-preset-list b { color: var(--to-primary); }
.teacher-tip-card { height: 100%; padding: 1.15rem; border-radius: 18px; background: rgba(255,255,255,.96); border: 1px solid var(--to-border); box-shadow: 0 10px 28px rgba(35,55,120,.06); }
.teacher-tip-card > span { font-size: 1.5rem; }
.teacher-tip-card h3 { font-size: 1rem; font-weight: 850; margin: .7rem 0 .35rem; }
.teacher-tip-card p { color: var(--to-muted); margin: 0; font-size: .88rem; }
.teacher-privacy-card { background: linear-gradient(135deg, #fff, #f7f8ff) !important; }

@media (max-width: 991.98px) {
  .exercise-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exercise-side-stack { position: static; }
  .teacher-hero { grid-template-columns: 1fr; }
  .teacher-hero-visual { display: none; }
  .teacher-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exercise-table-selector { grid-template-columns: repeat(6, minmax(34px, 1fr)); }
}

@media (max-width: 575.98px) {
  .exercise-hero { border-radius: 22px; }
  .exercise-hero-badge { display: none; }
  .exercise-preset-grid { grid-template-columns: 1fr; }
  .exercise-operation-grid { grid-template-columns: 1fr; }
  .exercise-actions { grid-template-columns: 1fr; }
  .exercise-table-selector { grid-template-columns: repeat(4, minmax(34px, 1fr)); }
  .exercise-preview-header { display: block; }
  .exercise-preview-student { text-align: left; margin-top: .65rem; }
  .exercise-preview-grid.cols-2,
  .exercise-preview-grid.cols-3 { grid-template-columns: 1fr; }
  .teacher-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* ===== Fase 6: SEO, conteúdo e apoio ===== */
.content-auto { content-visibility: auto; contain-intrinsic-size: 1px 520px; }
.nav-support { color: #8a4b08 !important; background: #fff6df; border-radius: 999px; padding-inline: .8rem !important; }
.nav-support:hover { background: #ffedbd; color: #713b04 !important; }
.learning-hub-hero { border-radius: 30px; padding: clamp(1.7rem,4vw,3.6rem); background: radial-gradient(circle at 85% 20%, rgba(255,255,255,.20), transparent 26%), linear-gradient(135deg,#2949bb,#5b55e8); color:#fff; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2rem; align-items:center; overflow:hidden; }
.learning-hub-hero h1 { font-size:clamp(2.1rem,5vw,4rem); line-height:1.02; font-weight:900; max-width:850px; margin:.5rem 0 1rem; }
.learning-hub-hero p { max-width:760px; font-size:1.08rem; color:rgba(255,255,255,.86); }
.learning-hub-hero .section-label { color:#fff; background:rgba(255,255,255,.14); }
.learning-hub-symbol { font-size:clamp(3rem,8vw,7rem); font-weight:900; opacity:.22; white-space:nowrap; letter-spacing:.08em; }
.learning-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.learning-card { display:flex; flex-direction:column; min-height:235px; padding:1.35rem; border:1px solid var(--to-border); border-radius:20px; background:#fff; color:var(--to-ink); text-decoration:none; box-shadow:0 12px 28px rgba(35,55,120,.05); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.learning-card:hover { transform:translateY(-3px); border-color:rgba(49,87,213,.35); box-shadow:0 18px 38px rgba(35,55,120,.10); }
.learning-card > span { color:var(--to-primary); text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; font-weight:850; }
.learning-card h3 { font-size:1.18rem; font-weight:850; margin:.55rem 0; }
.learning-card p { color:var(--to-muted); flex:1; }
.learning-card b { color:var(--to-primary); }
.seo-action-strip { border-radius:22px; padding:1.3rem 1.5rem; border:1px solid var(--to-border); background:linear-gradient(135deg,#fff,#f6f8ff); display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.article-shell { width:min(1120px,100%); margin:0 auto; }
.article-hero { max-width:850px; }
.article-hero h1 { font-size:clamp(2.2rem,5vw,4.2rem); line-height:1.04; font-weight:900; margin:.55rem 0 1rem; letter-spacing:-.035em; }
.article-hero .lead { color:var(--to-muted); max-width:790px; }
.article-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:2rem; align-items:start; }
.article-content { min-width:0; }
.article-section { padding:1.5rem 0; border-bottom:1px solid var(--to-border); }
.article-section:first-child { padding-top:.25rem; }
.article-section h2 { font-size:clamp(1.45rem,3vw,2rem); font-weight:850; margin-bottom:.8rem; }
.article-section p, .article-section li { color:#46516a; line-height:1.78; font-size:1.02rem; }
.article-section li + li { margin-top:.4rem; }
.article-aside { position:sticky; top:92px; display:grid; gap:1rem; }
.article-practice-card, .article-support-card { border-radius:20px; padding:1.25rem; border:1px solid var(--to-border); background:#fff; box-shadow:0 12px 28px rgba(35,55,120,.05); }
.article-practice-card strong, .article-support-card strong { font-size:1.05rem; display:block; margin-bottom:.35rem; }
.article-practice-card p, .article-support-card p { color:var(--to-muted); font-size:.9rem; }
.article-support-card { background:linear-gradient(145deg,#fffaf0,#fff); }
.article-support-card > span { font-size:1.6rem; }
.article-support-card a { font-weight:800; text-decoration:none; }
.faq-stack { display:grid; gap:.7rem; margin-top:1rem; }
.faq-stack details { border:1px solid var(--to-border); border-radius:14px; padding:.9rem 1rem; background:#fff; }
.faq-stack summary { cursor:pointer; font-weight:800; color:var(--to-ink); }
.faq-stack p { margin:.7rem 0 0; font-size:.95rem; }
.related-guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.related-guide-grid a { display:flex; flex-direction:column; gap:.45rem; padding:1rem; border-radius:16px; border:1px solid var(--to-border); background:#fff; color:var(--to-ink); text-decoration:none; }
.related-guide-grid span { color:var(--to-muted); font-size:.87rem; flex:1; }
.related-guide-grid b { color:var(--to-primary); }
.home-learning-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; }
.home-learning-grid a { padding:1rem; border:1px solid var(--to-border); border-radius:17px; background:#fff; text-decoration:none; color:var(--to-ink); display:grid; gap:.3rem; min-height:145px; }
.home-learning-grid a > span { font-size:1.5rem; }
.home-learning-grid strong { font-size:.98rem; }
.home-learning-grid small { color:var(--to-muted); line-height:1.45; }
.support-shell { width:min(1120px,100%); margin:0 auto; }
.support-hero { max-width:800px; margin-inline:auto; }
.support-cup { width:68px; height:68px; display:grid; place-items:center; margin:0 auto 1rem; border-radius:22px; background:#fff2cf; font-size:2rem; box-shadow:0 12px 28px rgba(129,81,17,.12); }
.support-hero h1 { font-size:clamp(2rem,5vw,3.6rem); font-weight:900; letter-spacing:-.03em; margin:.6rem 0 1rem; }
.support-hero p { color:var(--to-muted); font-size:1.08rem; }
.support-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:1.25rem; align-items:start; }
.support-main-card { box-shadow:0 18px 50px rgba(35,55,120,.08); }
.support-secure { white-space:nowrap; font-size:.78rem; font-weight:800; padding:.45rem .7rem; border-radius:999px; background:#effaf6; color:#157456; }
.support-amounts { display:flex; flex-wrap:wrap; gap:.55rem; }
.support-amount { border:1px solid var(--to-border); border-radius:12px; padding:.62rem .9rem; text-decoration:none; color:var(--to-ink); font-weight:800; background:#fff; }
.support-amount:hover,.support-amount.is-active { background:#eef1ff; border-color:#9aa9ed; color:var(--to-primary-dark); }
.pix-box { display:grid; grid-template-columns:280px minmax(0,1fr); gap:1.25rem; padding:1.15rem; border-radius:20px; background:#f8f9ff; border:1px solid #e1e5f5; align-items:center; }
.pix-qr-wrap { border-radius:16px; background:#fff; padding:.65rem; display:grid; place-items:center; }
.pix-qr-wrap img { max-width:100%; height:auto; }
.pix-code { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.72rem; resize:none; }
.support-config-warning { border-radius:16px; padding:1rem; background:#fff8e7; border:1px solid #f4d58b; color:#64480b; }
.support-side { display:grid; gap:1rem; }
.support-why-card,.support-promise-card,.support-privacy-card { padding:1.2rem; border-radius:18px; background:#fff; border:1px solid var(--to-border); }
.support-why-card > span { font-size:1.5rem; }
.support-why-card h2 { font-size:1.05rem; font-weight:850; margin:.65rem 0; }
.support-why-card ul { padding-left:1.15rem; color:var(--to-muted); font-size:.9rem; margin:0; }
.support-promise-card { background:linear-gradient(145deg,#f0fdf7,#fff); }
.support-privacy-card { background:linear-gradient(145deg,#f7f8ff,#fff); }
.support-promise-card p,.support-privacy-card p { color:var(--to-muted); font-size:.88rem; margin:.35rem 0 0; }
@media (max-width:991.98px){.learning-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout,.support-grid{grid-template-columns:1fr}.article-aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.home-learning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pix-box{grid-template-columns:240px minmax(0,1fr)}}
@media (max-width:767.98px){.learning-hub-hero{grid-template-columns:1fr}.learning-hub-symbol{display:none}.seo-action-strip{align-items:flex-start;flex-direction:column}.related-guide-grid{grid-template-columns:1fr}.article-aside{grid-template-columns:1fr}.pix-box{grid-template-columns:1fr}.pix-qr-wrap{max-width:290px;margin:auto}.support-secure{display:none}}
@media (max-width:575.98px){.learning-card-grid,.home-learning-grid{grid-template-columns:1fr}.support-amount{flex:1;text-align:center;min-width:95px}.article-hero h1{font-size:2.25rem}.learning-hub-hero{border-radius:22px}}

@media (max-width:1399.98px){
  .site-nav .navbar-collapse { padding: .4rem 0 1rem; }
  .site-nav .navbar-nav { align-items: stretch !important; gap: .2rem; }
  .site-nav .nav-link { padding: .65rem .8rem !important; }
  .site-nav .nav-cta { width: 100%; text-align: center; margin-top: .2rem; }
  .nav-support { display: inline-flex; align-items: center; gap: .35rem; }
}
@media (min-width:1400px) and (max-width:1499.98px){
  .site-nav .nav-link { font-size: .94rem; padding-inline: .56rem !important; }
  .site-brand { font-size: 1rem; }
  .nav-cta { padding-inline: .8rem !important; }
}


/* Ranking recente + novos jogadores */
.ranking-recent-note { display:flex; align-items:center; justify-content:center; padding:.8rem 1rem; border:1px solid #dfe5ff; border-radius:16px; background:linear-gradient(135deg,#f7f9ff,#fff); }
.ranking-recent-note div { display:flex; flex-wrap:wrap; gap:.35rem .65rem; align-items:baseline; justify-content:center; text-align:center; }
.ranking-recent-note strong { color:var(--to-primary-dark); }
.ranking-recent-note span { color:var(--to-muted); font-size:.9rem; }
.ranking-newcomers { border:1px solid var(--to-border); border-radius:20px; padding:1rem; background:#fff; box-shadow:0 12px 28px rgba(35,55,120,.05); }
.ranking-newcomers-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
.ranking-newcomer-card { position:relative; display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:.7rem; align-items:center; min-width:0; padding:.75rem; border:1px solid #e7eafb; border-radius:15px; background:#fbfcff; }
.ranking-newcomer-avatar { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,#3456d1,#7257ef); color:#fff; font-weight:900; }
.ranking-newcomer-card span:not(.ranking-new-badge) { color:var(--to-muted); font-size:.78rem; }
.ranking-new-badge { padding:.25rem .45rem; border-radius:999px; font-size:.62rem; font-weight:900; letter-spacing:.04em; background:#e8f8ef; color:#137a4e; }
.min-w-0 { min-width:0; }

/* Mural de apoiadores */
.supporters-wall { padding:1.5rem; border-radius:24px; border:1px solid var(--to-border); background:linear-gradient(145deg,#ffffff,#f8f9ff); box-shadow:0 16px 44px rgba(35,55,120,.06); }
.supporters-heading { max-width:720px; margin:0 auto 1.25rem; }
.supporters-heading h2 { font-size:clamp(1.6rem,3vw,2.35rem); font-weight:900; margin:.4rem 0 .55rem; }
.supporters-heading p { color:var(--to-muted); margin:0; }
.supporters-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.supporter-card { display:grid; grid-template-columns:46px minmax(0,1fr); gap:.8rem; align-items:start; padding:1rem; border-radius:17px; background:#fff; border:1px solid #e5e8f5; }
.supporter-card.is-featured { background:linear-gradient(145deg,#fffaf0,#fff); border-color:#f0d895; }
.supporter-avatar { width:46px; height:46px; border-radius:15px; display:grid; place-items:center; font-weight:900; color:#fff; background:linear-gradient(135deg,#3158d5,#7659ef); }
.supporter-card strong { font-size:.96rem; }
.supporter-card p { color:var(--to-muted); font-size:.84rem; line-height:1.5; margin:.35rem 0 0; }
.supporter-star { display:inline-flex; padding:.2rem .42rem; border-radius:999px; background:#fff2cf; color:#775114; font-size:.68rem; font-weight:850; }
.supporters-empty { max-width:560px; margin:auto; padding:1.2rem; border:1px dashed #cfd6ef; border-radius:18px; background:#fff; }
.supporters-empty > span { display:block; font-size:1.7rem; margin-bottom:.35rem; }
.supporters-empty p { color:var(--to-muted); margin:.25rem 0 0; }
.supporters-how { display:flex; align-items:flex-start; gap:.75rem; padding:1rem; border-radius:16px; background:#eef3ff; }
.supporters-how > span { font-size:1.35rem; }
.supporters-how p { color:#4c5870; font-size:.9rem; }
.supporters-how a { font-weight:800; }
@media (max-width:991.98px){.supporters-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767.98px){.ranking-newcomers-grid,.supporters-grid{grid-template-columns:1fr}.ranking-newcomer-card{grid-template-columns:42px minmax(0,1fr)}.ranking-new-badge{grid-column:2;justify-self:start}.supporters-wall{padding:1rem}}

/* ==========================================================================
   Fase 7 — acabamento visual + VS / Gincana
   ========================================================================== */

/* Tabelas visuais */
.times-hero { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:2rem; align-items:center; padding:clamp(1.6rem,4vw,3rem); border-radius:30px; color:#fff; background:radial-gradient(circle at 85% 18%,rgba(255,255,255,.18),transparent 28%),linear-gradient(135deg,#2949bb,#6256ed); box-shadow:0 22px 55px rgba(44,64,160,.16); }
.times-hero h1 { font-size:clamp(2rem,4.5vw,3.7rem); line-height:1.02; font-weight:900; letter-spacing:-.035em; margin:.5rem 0 1rem; }
.times-hero p { max-width:720px; margin:0; color:rgba(255,255,255,.86); font-size:1.05rem; }
.times-hero .section-label { color:#fff; background:rgba(255,255,255,.14); }
.times-hero-visual { width:190px; aspect-ratio:1; justify-self:end; border-radius:34px; display:grid; place-items:center; align-content:center; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.18); transform:rotate(3deg); }
.times-hero-visual span { font-size:2rem; font-weight:800; opacity:.8; }
.times-hero-visual strong { font-size:4.3rem; line-height:1; font-weight:950; }
.times-toolbar { display:flex; gap:1rem; align-items:center; justify-content:space-between; padding:1rem 1.15rem; border-radius:18px; border:1px solid var(--to-border); background:#fff; }
.times-toolbar strong,.times-toolbar span { display:block; }
.times-toolbar span { color:var(--to-muted); font-size:.86rem; margin-top:.15rem; }
.times-card-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.times-card { border:1px solid var(--to-border); border-radius:22px; padding:1rem; background:#fff; box-shadow:0 12px 30px rgba(35,55,120,.055); break-inside:avoid; }
.times-card header { display:flex; align-items:center; gap:.75rem; padding-bottom:.8rem; margin-bottom:.65rem; border-bottom:1px solid #edf0f8; }
.times-number { width:46px; height:46px; flex:0 0 46px; display:grid; place-items:center; border-radius:14px; color:#fff; background:linear-gradient(135deg,#3158d5,#7257ef); font-size:1.2rem; font-weight:900; }
.times-card header strong,.times-card header small { display:block; }
.times-card header small { color:var(--to-muted); font-size:.75rem; }
.times-list { display:grid; gap:.22rem; }
.times-list div { display:flex; justify-content:space-between; gap:1rem; padding:.34rem .45rem; border-radius:8px; }
.times-list div:nth-child(even) { background:#f8f9ff; }
.times-list span { color:#4b566b; font-variant-numeric:tabular-nums; }
.times-list b { color:var(--to-primary-dark); font-variant-numeric:tabular-nums; }
.times-card-actions { display:grid; grid-template-columns:1fr 1fr; gap:.45rem; margin-top:.85rem; }
.times-compact-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:.75rem; }
.times-compact-card { border:1px solid var(--to-border); border-radius:17px; background:#fff; padding:.75rem; break-inside:avoid; }
.times-compact-card h2 { font-size:1.05rem; color:var(--to-primary); font-weight:900; padding-bottom:.45rem; border-bottom:1px solid #edf0f8; }
.times-compact-card div { display:flex; justify-content:space-between; font-size:.78rem; padding:.17rem 0; font-variant-numeric:tabular-nums; }
.times-bottom-cta { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.3rem 1.4rem; border-radius:20px; background:linear-gradient(145deg,#f7f8ff,#fff); border:1px solid var(--to-border); }

/* Aprender v2 */
.learning-hub-hero-v2 { grid-template-columns:minmax(0,1.15fr) minmax(320px,.65fr); }
.learning-hero-copy { min-width:0; }
.learning-hero-map { display:grid; gap:.6rem; padding:1rem; border-radius:22px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(5px); }
.learning-hero-map > span { color:rgba(255,255,255,.7); padding:.2rem .35rem; }
.learning-hero-map a { display:grid; grid-template-columns:42px minmax(0,1fr); gap:.7rem; align-items:center; padding:.72rem; border-radius:14px; color:#fff; text-decoration:none; background:rgba(255,255,255,.09); transition:background .18s ease,transform .18s ease; }
.learning-hero-map a:hover { background:rgba(255,255,255,.17); transform:translateX(3px); }
.learning-hero-map b { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.16); font-size:1.25rem; }
.learning-hero-map strong,.learning-hero-map small { display:block; }
.learning-hero-map small { color:rgba(255,255,255,.7); font-size:.76rem; margin-top:.08rem; }
.learning-path { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.learning-path > div { display:grid; grid-template-columns:44px minmax(0,1fr); align-items:center; column-gap:.8rem; padding:1rem; border:1px solid var(--to-border); border-radius:18px; background:#fff; }
.learning-path span { grid-row:1/span 2; width:44px; height:44px; display:grid; place-items:center; border-radius:14px; background:#eef1ff; color:var(--to-primary); font-weight:900; }
.learning-path strong,.learning-path small { display:block; }
.learning-path small { color:var(--to-muted); }

/* Exercícios ampliados */
.exercise-preset-grid-6 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.exercise-preview-question.has-workspace { min-height:76px; align-items:flex-start; padding-top:.8rem; }

/* Pais/professores */
.teacher-competition-banner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:clamp(1.4rem,3vw,2.1rem); border-radius:24px; color:#fff; background:radial-gradient(circle at 85% 20%,rgba(255,255,255,.16),transparent 24%),linear-gradient(135deg,#243b9f,#5c52e3); }
.teacher-competition-banner h2 { font-size:clamp(1.5rem,3vw,2.25rem); font-weight:900; margin:.35rem 0 .45rem; }
.teacher-competition-banner p { max-width:760px; color:rgba(255,255,255,.82); margin:0; }
.teacher-competition-banner .section-label { color:#fff; background:rgba(255,255,255,.13); }
.local-progress-explainer { border-radius:24px; padding:clamp(1.25rem,3vw,2rem); background:linear-gradient(145deg,#fff,#f7f8ff); border:1px solid var(--to-border); }
.local-progress-heading { max-width:800px; margin-bottom:1.2rem; }
.local-progress-heading h2 { font-size:clamp(1.55rem,3vw,2.3rem); font-weight:900; margin:.4rem 0; }
.local-progress-heading p { color:var(--to-muted); margin:0; }
.local-progress-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.local-progress-grid article { padding:1rem; border-radius:17px; background:#fff; border:1px solid #e7eaf5; }
.local-progress-grid article > span { display:block; font-size:1.45rem; margin-bottom:.55rem; }
.local-progress-grid strong { display:block; margin-bottom:.3rem; }
.local-progress-grid p { color:var(--to-muted); font-size:.84rem; margin:0; line-height:1.5; }

/* Banner de competição na home */
.home-competition-banner { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding:clamp(1.4rem,3vw,2rem); border-radius:24px; color:#fff; background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.14),transparent 25%),linear-gradient(135deg,#5f49d7,#2747bb); box-shadow:0 18px 44px rgba(40,55,150,.13); }
.home-competition-banner h2 { font-weight:900; font-size:clamp(1.4rem,2.8vw,2.15rem); margin:.35rem 0; }
.home-competition-banner p { margin:0; color:rgba(255,255,255,.83); max-width:800px; }
.home-competition-banner .section-label { color:#fff; background:rgba(255,255,255,.12); }

/* VS / Gincana */
.competition-shell { max-width:1220px; }
.competition-hero { display:grid; grid-template-columns:minmax(0,1fr) 290px; align-items:center; gap:2rem; padding:clamp(1.5rem,4vw,3rem); border-radius:30px; color:#fff; background:radial-gradient(circle at 90% 10%,rgba(255,255,255,.18),transparent 25%),linear-gradient(135deg,#263fa7,#6653ea); }
.competition-hero h1 { font-size:clamp(2.1rem,5vw,4rem); font-weight:950; line-height:1; letter-spacing:-.035em; margin:.5rem 0 1rem; }
.competition-hero p { max-width:760px; color:rgba(255,255,255,.84); font-size:1.04rem; margin:0; }
.competition-hero .section-label { color:#fff; background:rgba(255,255,255,.14); }
.competition-hero-podium { height:190px; display:flex; align-items:flex-end; justify-content:center; gap:.35rem; }
.competition-hero-podium span { width:72px; display:grid; place-items:center; border-radius:18px 18px 8px 8px; background:rgba(255,255,255,.14); font-size:2rem; border:1px solid rgba(255,255,255,.14); }
.competition-hero-podium span:nth-child(1) { height:115px; }.competition-hero-podium span:nth-child(2) { height:165px; }.competition-hero-podium span:nth-child(3) { height:88px; }
.competition-panel { padding:clamp(1.2rem,3vw,2rem); border-radius:24px; background:#fff; border:1px solid var(--to-border); box-shadow:0 18px 50px rgba(35,55,120,.065); }
.competition-panel[hidden] { display:none !important; }
.competition-section-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:1.2rem; }
.competition-section-head h2 { font-weight:900; margin:.3rem 0 0; }
.competition-local-badge { white-space:nowrap; padding:.42rem .68rem; border-radius:999px; background:#eef9f4; color:#14704e; font-size:.76rem; font-weight:850; }
.competition-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.competition-mode-card { position:relative; display:grid; grid-template-columns:52px minmax(0,1fr); column-gap:.8rem; align-items:center; padding:1rem; border:2px solid #e7eaf5; border-radius:19px; cursor:pointer; background:#fff; }
.competition-mode-card input { position:absolute; opacity:0; }
.competition-mode-card > span { grid-row:1/span 2; width:52px; height:52px; display:grid; place-items:center; border-radius:16px; background:#f2f4ff; font-size:1.5rem; }
.competition-mode-card strong,.competition-mode-card small { display:block; }.competition-mode-card small { color:var(--to-muted); }
.competition-mode-card:has(input:checked) { border-color:var(--to-primary); background:#f8f9ff; box-shadow:inset 0 0 0 1px rgba(49,87,213,.08); }
.competition-form-block { height:100%; padding:1.15rem; border-radius:18px; background:#f9faff; border:1px solid #e8ebf6; }
.competition-form-block h3 { font-size:1rem; font-weight:900; margin-bottom:1rem; }
.competition-fair-note { display:flex; align-items:flex-start; gap:.8rem; margin-top:1rem; padding:.85rem 1rem; border-radius:15px; background:#fff8e9; border:1px solid #f4dfaa; }
.competition-fair-note > span { font-size:1.35rem; }.competition-fair-note strong { display:block; }.competition-fair-note p { margin:.15rem 0 0; color:#6b5a32; font-size:.84rem; }
.competition-turn-kicker { display:inline-block; color:var(--to-primary); font-weight:850; text-transform:uppercase; letter-spacing:.09em; font-size:.75rem; }
.competition-player-avatar { width:82px; height:82px; display:grid; place-items:center; margin:1rem auto; border-radius:25px; color:#fff; background:linear-gradient(135deg,#3158d5,#7659ef); font-size:2rem; font-weight:950; box-shadow:0 14px 32px rgba(49,87,213,.22); }
.competition-game-top { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.competition-game-top h2 { margin:.1rem 0 0; font-weight:900; }
.competition-live-stats { display:grid; grid-template-columns:repeat(4,minmax(76px,1fr)); gap:.5rem; }
.competition-live-stats div { padding:.65rem .8rem; text-align:center; border-radius:14px; background:#f8f9ff; border:1px solid #e8ebf6; }
.competition-live-stats strong,.competition-live-stats span { display:block; }.competition-live-stats strong { font-size:1.35rem; font-weight:950; color:var(--to-primary-dark); }.competition-live-stats span { color:var(--to-muted); font-size:.7rem; }
.competition-score-strip { display:flex; gap:.45rem; overflow:auto; padding:.9rem 0 .3rem; scrollbar-width:thin; }
.competition-score-chip { flex:0 0 auto; display:flex; gap:.45rem; align-items:center; padding:.4rem .65rem; border-radius:999px; background:#f5f6fb; color:#59647a; font-size:.78rem; border:1px solid #e5e8f1; }
.competition-score-chip.is-current { background:#eef1ff; color:var(--to-primary-dark); border-color:#b8c3f3; }.competition-score-chip strong { color:inherit; }
.competition-question-card { max-width:680px; margin:1.2rem auto 0; text-align:center; padding:clamp(1.2rem,4vw,2.5rem); border-radius:24px; background:linear-gradient(145deg,#fafbff,#f2f4ff); border:1px solid #e0e5fa; }
.competition-question-type { color:var(--to-primary); font-size:.78rem; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
.competition-question { font-size:clamp(3rem,8vw,6.2rem); font-weight:950; line-height:1; letter-spacing:-.04em; margin:1rem 0 1.2rem; color:#172033; }
#competition-answer-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.6rem; max-width:430px; margin:auto; }
#competition-answer { min-height:58px; text-align:center; font-size:1.4rem; font-weight:850; }
#competition-answer-form .btn { min-width:120px; }
.competition-feedback { height:30px; margin-top:.75rem; font-weight:850; }.competition-feedback.is-correct { color:#16825d; }.competition-feedback.is-error { color:#b75a28; }
.competition-result-icon { font-size:3.5rem; }.competition-result-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; max-width:700px; margin:1.2rem auto; }.competition-result-stats div { padding:.9rem; border-radius:15px; background:#f8f9ff; border:1px solid #e7eaf4; }.competition-result-stats strong,.competition-result-stats span { display:block; }.competition-result-stats strong { font-size:1.45rem; color:var(--to-primary-dark); }.competition-result-stats span { font-size:.76rem; color:var(--to-muted); }
.competition-podium { display:flex; align-items:flex-end; justify-content:center; gap:.8rem; min-height:240px; margin:1rem 0 2rem; }.podium-place { width:min(190px,30%); text-align:center; padding:1rem .6rem; border-radius:20px 20px 8px 8px; background:#f6f7ff; border:1px solid #e1e5f6; display:grid; align-content:center; gap:.2rem; }.podium-place > span { font-size:2rem; }.podium-place strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.podium-place b { color:var(--to-primary); font-size:.8rem; }.podium-place.place-1 { min-height:210px; order:2; background:linear-gradient(180deg,#fff8dd,#fff); border-color:#eed681; }.podium-place.place-2 { min-height:170px; order:1; }.podium-place.place-3 { min-height:140px; order:3; }
.competition-final-table-wrap { overflow:auto; border:1px solid var(--to-border); border-radius:18px; }.competition-final-table { margin:0; white-space:nowrap; }.competition-final-table th { background:#f7f8ff; color:#4f5a70; font-size:.8rem; }

@media (max-width:1199.98px) {
  .times-card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .times-compact-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .local-progress-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:991.98px) {
  .times-hero,.competition-hero,.learning-hub-hero-v2 { grid-template-columns:1fr; }
  .times-hero-visual,.competition-hero-podium { display:none; }
  .times-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .times-compact-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .exercise-preset-grid-6 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .teacher-competition-banner,.home-competition-banner,.times-bottom-cta { align-items:flex-start; flex-direction:column; }
  .competition-game-top { align-items:flex-start; flex-direction:column; }
  .competition-live-stats { width:100%; }
}
@media (max-width:767.98px) {
  .times-toolbar { align-items:flex-start; flex-direction:column; }
  .times-card-grid,.times-compact-grid,.competition-mode-grid,.learning-path { grid-template-columns:1fr; }
  .local-progress-grid { grid-template-columns:1fr; }
  .competition-live-stats,.competition-result-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .competition-podium { gap:.35rem; min-height:190px; }.podium-place { width:32%; padding:.7rem .35rem; }.podium-place.place-1 { min-height:180px; }.podium-place.place-2 { min-height:145px; }.podium-place.place-3 { min-height:120px; }
}
@media (max-width:575.98px) {
  .exercise-preset-grid-6 { grid-template-columns:1fr; }
  #competition-answer-form { grid-template-columns:1fr; }
  .competition-question { font-size:3.2rem; }
}

@media print {
  .site-nav,.site-footer,.no-print { display:none !important; }
  body.site-body { background:#fff !important; }
  .site-main,.page-shell { max-width:none !important; width:100% !important; margin:0 !important; padding:0 !important; }
  .times-card-grid { grid-template-columns:repeat(4,1fr); gap:7px; }
  .times-card { box-shadow:none; border-radius:8px; padding:7px; page-break-inside:avoid; }
  .times-card header { padding-bottom:5px; margin-bottom:3px; }.times-number { width:28px; height:28px; flex-basis:28px; border-radius:7px; color:#000; background:#fff; border:1px solid #777; }.times-card header small { display:none; }.times-list div { padding:1px 2px; font-size:9pt; }.times-list div:nth-child(even) { background:#fff; }
  .times-compact-grid { grid-template-columns:repeat(6,1fr); gap:6px; }.times-compact-card { border-radius:6px; padding:5px; }.times-compact-card div { font-size:8.5pt; }
}

/* ==========================================================================
   Fase 7.1 — refinamento visual, cronômetro e tabelas ampliadas
   ========================================================================== */

/* Chamadas da gincana: evita botão espremido/quebrado */
.competition-promo-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  align-items: center;
  gap: clamp(1rem, 3vw, 2rem);
}
.competition-promo-copy { min-width: 0; }
.competition-promo-action {
  min-width: 0;
  padding: 1rem;
  border-radius: 20px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.17);
  text-align: center;
}
.competition-promo-icon { display:block; font-size:1.7rem; margin-bottom:.55rem; }
.competition-promo-action .btn {
  width: 100%;
  padding: .8rem 1rem;
  font-weight: 850;
  white-space: nowrap;
  border-radius: 14px;
}
.competition-promo-action small { display:block; margin-top:.5rem; color:rgba(255,255,255,.72); font-size:.72rem; }

/* Cronômetro visível da competição */
.competition-clock {
  margin: 1rem 0 .25rem;
  padding: .85rem 1rem;
  border-radius: 18px;
  background: linear-gradient(145deg,#edf2ff,#f8f9ff);
  border: 1px solid #dfe5fb;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.competition-clock[hidden] { display:none !important; }
.competition-clock-copy { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.competition-clock-copy span { color:#54617b; font-size:.82rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.competition-clock-copy strong { color:var(--to-primary-dark); font-size:clamp(1.9rem,4vw,3rem); line-height:1; font-weight:950; font-variant-numeric:tabular-nums; }
.competition-clock-track { height:9px; margin-top:.7rem; overflow:hidden; border-radius:999px; background:#dce2f5; }
.competition-clock-track span { display:block; width:100%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#3158d5,#7059ee); transition:width .18s linear; }
.competition-clock.is-urgent { background:#fff4f2; border-color:#ffb4aa; animation:competitionClockPulse .8s ease-in-out infinite alternate; }
.competition-clock.is-urgent .competition-clock-copy strong { color:#cf3f35; }
.competition-clock.is-urgent .competition-clock-track span { background:linear-gradient(90deg,#ff7a67,#d83a31); }
@keyframes competitionClockPulse { from { transform:scale(1); } to { transform:scale(1.008); } }
.competition-result-stats { grid-template-columns:repeat(5,minmax(0,1fr)); }

/* Tabela visual configurável */
.times-builder {
  padding: 1.15rem;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--to-border);
  box-shadow: 0 12px 34px rgba(35,55,120,.05);
}
.times-builder-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.times-builder-heading h2 { margin:.3rem 0 .2rem; font-size:1.4rem; font-weight:900; }
.times-builder-heading p { margin:0; color:var(--to-muted); }
.times-builder-presets { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.4rem; }
.times-builder-presets a { padding:.38rem .62rem; border-radius:999px; border:1px solid #d8def3; background:#f8f9ff; color:var(--to-primary); text-decoration:none; font-size:.78rem; font-weight:800; }
.times-builder-form { display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)) auto; gap:.7rem; align-items:end; }
.times-builder-form label { display:block; margin-bottom:.3rem; font-size:.78rem; font-weight:800; color:#4e5a71; }
.times-builder-form .btn { min-height:38px; white-space:nowrap; }
.times-summary-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; }
.times-summary-strip div { padding:.8rem 1rem; border-radius:16px; background:#fff; border:1px solid var(--to-border); }
.times-summary-strip strong,.times-summary-strip span { display:block; }
.times-summary-strip strong { font-size:1.2rem; color:var(--to-primary-dark); font-weight:900; }
.times-summary-strip span { margin-top:.15rem; color:var(--to-muted); font-size:.74rem; }
.times-card-grid.is-long { grid-template-columns:repeat(3,minmax(0,1fr)); }
.times-compact-grid.is-long { grid-template-columns:repeat(5,minmax(0,1fr)); }

/* Exercícios até 20 */
.exercise-table-shortcuts { display:flex; flex-wrap:wrap; gap:.35rem; }
.exercise-table-selector-20 { grid-template-columns:repeat(10,minmax(0,1fr)); }
.exercise-factor-note { display:flex; align-items:flex-start; gap:.6rem; padding:.75rem .85rem; border-radius:14px; background:#f4f7ff; border:1px solid #e1e7fb; }
.exercise-factor-note > span { font-size:1.1rem; }
.exercise-factor-note strong,.exercise-factor-note small { display:block; }
.exercise-factor-note small { color:var(--to-muted); margin-top:.15rem; line-height:1.45; }

@media (max-width:1199.98px) {
  .times-builder-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .times-builder-form .btn { grid-column:1/-1; }
  .times-card-grid.is-long { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .times-compact-grid.is-long { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .exercise-table-selector-20 { grid-template-columns:repeat(10,minmax(0,1fr)); }
}
@media (max-width:991.98px) {
  .competition-promo-banner { grid-template-columns:1fr; }
  .competition-promo-action { width:100%; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:.35rem .7rem; text-align:left; }
  .competition-promo-icon { grid-row:1 / span 2; margin:0; }
  .competition-promo-action small { margin:0; }
  .competition-result-stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .times-builder-heading { align-items:flex-start; flex-direction:column; }
  .times-builder-presets { justify-content:flex-start; }
  .times-summary-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .exercise-table-selector-20 { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media (max-width:575.98px) {
  .competition-promo-action { display:block; text-align:center; }
  .competition-promo-action .btn { white-space:normal; }
  .competition-promo-icon { margin-bottom:.45rem; }
  .competition-clock-copy { align-items:flex-end; }
  .competition-clock-copy span { font-size:.7rem; }
  .competition-result-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .times-builder-form,.times-summary-strip { grid-template-columns:1fr; }
  .times-card-grid.is-long,.times-compact-grid.is-long { grid-template-columns:1fr; }
  .exercise-table-selector-20 { grid-template-columns:repeat(5,minmax(0,1fr)); }
}

@media print {
  .times-builder,.times-summary-strip { display:none !important; }
}

/* --------------------------------------------------------------------------
   Fase 7.2 — refinamento final: jogo compacto + tabelas/atividades até 100
   -------------------------------------------------------------------------- */
.game-config-v2 .card-body { display: grid; gap: 0; }
.game-config-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1.25rem; }
.game-config-heading > div { max-width:760px; }
.game-config-badge { flex:0 0 auto; display:inline-flex; align-items:center; padding:.55rem .75rem; border-radius:999px; background:#f1f4ff; border:1px solid #dfe5fb; color:var(--to-primary-dark); font-size:.76rem; font-weight:850; white-space:nowrap; }
.game-config-controls { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr); gap:1rem; align-items:end; padding:1rem; border-radius:18px; background:#f8f9ff; border:1px solid #e5e9f7; }
.game-config-v2 .btn-group { display:flex; flex-wrap:nowrap; gap:.55rem; }
.game-config-v2 .btn-group > .btn { flex:1 1 0; min-width:0; margin:0; border-radius:13px !important; }
.game-config-control .form-select { min-height:48px; }
.operation-grid-v2 { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.65rem; }
.operation-grid-v2 .btn { min-width:0; min-height:62px; padding:.7rem .55rem; display:flex; align-items:center; justify-content:center; gap:.35rem; white-space:normal; line-height:1.15; }
.operation-grid-v2 .btn span { font-weight:850; }

.exercise-range-grid { display:grid; grid-template-columns:minmax(120px,.7fr) minmax(120px,.7fr) minmax(220px,1.6fr); gap:.75rem; align-items:start; }
.exercise-specific-tables { min-width:0; }
.exercise-table-shortcuts .btn { border-radius:999px; }

/* Em consultas grandes, o navegador pode pular a renderização fora da tela. */
.times-card.content-auto,
.times-compact-card.content-auto { contain-intrinsic-size: 1px 760px; }

@media (max-width: 1199.98px) {
  .operation-grid-v2 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .operation-grid-v2 .btn:last-child { grid-column:span 2; }
  .exercise-range-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .exercise-specific-tables { grid-column:1 / -1; }
}

@media (max-width: 767.98px) {
  .game-config-heading { display:block; }
  .game-config-badge { margin-top:.8rem; }
  .game-config-controls { grid-template-columns:1fr; }
  .operation-grid-v2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .operation-grid-v2 .btn:last-child { grid-column:1 / -1; }
}

@media (max-width: 575.98px) {
  .game-config-controls { padding:.8rem; }
  .game-config-v2 .btn-group { flex-direction:column; }
  .operation-grid-v2 { grid-template-columns:1fr; }
  .operation-grid-v2 .btn:last-child { grid-column:auto; }
  .exercise-range-grid { grid-template-columns:1fr; }
  .exercise-specific-tables { grid-column:auto; }
}

/* ==========================================================================
   Fase 8 — Matemática Fundamental I
   ========================================================================== */
.math-hero {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  gap:clamp(1.5rem,4vw,3.5rem);
  align-items:center;
  padding:clamp(2rem,5vw,4rem);
  border-radius:32px;
  color:#fff;
  background:linear-gradient(135deg,#294bc2 0%,#405fe0 55%,#7657ee 100%);
  box-shadow:0 24px 70px rgba(43,70,180,.18);
  overflow:hidden;
  position:relative;
}
.math-hero::after { content:"+  ×  ÷  −"; position:absolute; right:-1rem; bottom:-2.8rem; font-size:clamp(4rem,11vw,9rem); font-weight:950; letter-spacing:.08em; color:rgba(255,255,255,.07); white-space:nowrap; pointer-events:none; }
.math-hero > * { position:relative; z-index:1; }
.math-hero h1 { max-width:760px; margin:.6rem 0 1rem; font-size:clamp(2.3rem,5vw,4.6rem); line-height:.98; letter-spacing:-.045em; font-weight:950; }
.math-hero p { max-width:720px; margin:0; color:rgba(255,255,255,.84); font-size:clamp(1rem,1.5vw,1.14rem); line-height:1.65; }
.math-hero .section-label { color:#fff; }
.math-hero-roadmap { display:grid; gap:.75rem; padding:1rem; border:1px solid rgba(255,255,255,.16); border-radius:24px; background:rgba(255,255,255,.09); backdrop-filter:blur(8px); }
.math-hero-roadmap > div { display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:.75rem; align-items:center; padding:.85rem; border-radius:16px; background:rgba(255,255,255,.075); }
.math-hero-roadmap > div.is-active { background:#fff; color:#172033; box-shadow:0 12px 30px rgba(14,28,90,.16); }
.math-hero-roadmap > div > span { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:rgba(255,255,255,.15); font-weight:950; }
.math-hero-roadmap > div.is-active > span { background:#eef2ff; color:var(--to-primary); }
.math-hero-roadmap strong,.math-hero-roadmap small { display:block; }.math-hero-roadmap small { margin-top:.1rem; color:inherit; opacity:.72; line-height:1.35; }.math-hero-roadmap b { font-size:.65rem; text-transform:uppercase; letter-spacing:.06em; opacity:.65; }

.education-level-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.education-level-card { min-height:250px; padding:1.35rem; border-radius:24px; background:#fff; border:1px solid var(--to-border); text-decoration:none; color:#172033; display:flex; gap:1rem; align-items:flex-start; box-shadow:0 14px 40px rgba(35,55,120,.05); transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.education-level-card.is-active:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(35,55,120,.1); border-color:#bec9f6; }
.education-level-card.is-coming { background:linear-gradient(145deg,#fafbff,#f6f7fb); }
.education-level-icon { flex:0 0 52px; width:52px; height:52px; display:grid; place-items:center; border-radius:17px; background:#f2f4ff; font-size:1.45rem; }
.education-level-card small { color:var(--to-primary); font-weight:850; text-transform:uppercase; letter-spacing:.05em; font-size:.68rem; }.education-level-card h3 { margin:.35rem 0 .6rem; font-size:1.35rem; font-weight:900; }.education-level-card p { margin:0 0 1rem; color:var(--to-muted); line-height:1.55; }.education-level-card strong { color:var(--to-primary); }
.education-level-card.is-coming strong { color:#80889a; }
.math-philosophy { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; }
.math-philosophy > div { padding:1.1rem; border-radius:18px; background:#fff; border:1px solid var(--to-border); }.math-philosophy span { width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#eef2ff;color:var(--to-primary);font-weight:950;margin-bottom:.65rem; }.math-philosophy strong,.math-philosophy small { display:block; }.math-philosophy small { margin-top:.25rem;color:var(--to-muted);line-height:1.4; }

.fundamental-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr); gap:1rem; align-items:stretch; }
.fundamental-hero > div:first-child { padding:clamp(1.5rem,4vw,2.6rem); border-radius:28px; background:linear-gradient(135deg,#f8faff,#eef2ff); border:1px solid #dfe5fb; }
.fundamental-hero h1 { margin:.45rem 0 .7rem; font-size:clamp(2rem,4vw,3.5rem); line-height:1.02; letter-spacing:-.035em; font-weight:950; }.fundamental-hero p { margin:0; max-width:760px; color:var(--to-muted); font-size:1.05rem; line-height:1.6; }
.fundamental-progress-summary { padding:1.5rem; border-radius:28px; color:#fff; background:linear-gradient(145deg,#3157d5,#7259eb); display:flex; flex-direction:column; justify-content:center; }.fundamental-progress-summary small,.fundamental-progress-summary strong,.fundamental-progress-summary span { display:block; }.fundamental-progress-summary small { opacity:.7; text-transform:uppercase; letter-spacing:.06em; font-weight:800; }.fundamental-progress-summary strong { margin:.4rem 0 .35rem; font-size:1.3rem; }.fundamental-progress-summary span { opacity:.85; }.fundamental-progress-track { height:9px; margin-top:1rem; border-radius:999px; background:rgba(255,255,255,.18); overflow:hidden; }.fundamental-progress-track i { display:block; height:100%; width:0; background:#fff; border-radius:inherit; transition:width .3s ease; }

.fundamental-topic-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.fundamental-topic-card { min-height:290px; padding:1.25rem; color:#172033; text-decoration:none; background:#fff; border:1px solid var(--to-border); border-radius:24px; box-shadow:0 12px 36px rgba(35,55,120,.045); display:flex; flex-direction:column; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.fundamental-topic-card:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(35,55,120,.09); border-color:#c9d1f5; }
.fundamental-topic-card.is-mastered { border-color:#aadfc8; }
.fundamental-topic-icon { width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#f2f4ff;font-size:1.55rem;margin-bottom:1rem; }.fundamental-topic-copy { flex:1; }.fundamental-topic-copy small { color:var(--to-primary); font-weight:850; text-transform:uppercase; letter-spacing:.05em; font-size:.68rem; }.fundamental-topic-copy h2 { margin:.3rem 0 .55rem; font-size:1.22rem; font-weight:900; }.fundamental-topic-copy p { margin:0;color:var(--to-muted);line-height:1.5;font-size:.92rem; }
.fundamental-topic-progress { margin:1rem 0 .8rem; }.fundamental-topic-progress > span { display:block; margin-bottom:.35rem; color:#667085; font-size:.72rem;font-weight:800; }.fundamental-topic-progress > div { height:6px;border-radius:999px;background:#edf0f7;overflow:hidden; }.fundamental-topic-progress i { display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3157d5,#6d5be8);transition:width .3s ease; }.fundamental-topic-card > strong { color:var(--to-primary);font-size:.88rem; }

.f1-topic-hero { display:flex; gap:1.25rem; align-items:center; padding:clamp(1.5rem,4vw,2.5rem); border-radius:28px; background:linear-gradient(135deg,#3157d5,#6d59ed); color:#fff; }.f1-topic-symbol { flex:0 0 76px;width:76px;height:76px;display:grid;place-items:center;border-radius:22px;background:rgba(255,255,255,.14);font-size:2.2rem;border:1px solid rgba(255,255,255,.16); }.f1-topic-hero .section-label { color:#fff; }.f1-topic-hero h1 { margin:.35rem 0 .5rem;font-size:clamp(1.9rem,4vw,3rem);font-weight:950;letter-spacing:-.035em; }.f1-topic-hero p { margin:0;max-width:850px;color:rgba(255,255,255,.85);line-height:1.6; }
.f1-learning-card,.f1-practice-card { min-height:100%; padding:clamp(1.25rem,3vw,2rem); border-radius:26px;background:#fff;border:1px solid var(--to-border);box-shadow:0 14px 40px rgba(35,55,120,.05); }.f1-learning-card h2,.f1-practice-card h2 { margin:.35rem 0 1rem;font-size:1.45rem;font-weight:900; }.f1-learning-card p { color:var(--to-muted);line-height:1.65; }
.f1-example-box { margin:1.2rem 0; padding:1rem 1.1rem; border-radius:18px;background:#f4f7ff;border:1px solid #e0e6fb; }.f1-example-box small,.f1-example-box strong,.f1-example-box span { display:block; }.f1-example-box small { text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;font-weight:850;color:var(--to-primary); }.f1-example-box strong { margin:.3rem 0;font-size:1.12rem; }.f1-example-box span { color:var(--to-muted);font-size:.86rem; }
.f1-key-points { display:grid;gap:.55rem;margin-bottom:.7rem; }.f1-key-points > div { display:flex;gap:.6rem;align-items:flex-start; }.f1-key-points span { flex:0 0 26px;width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#eaf8f1;color:#13855c;font-weight:950; }.f1-key-points p { margin:.1rem 0 0;line-height:1.4;color:#47536a; }
.f1-round-counter { flex:0 0 auto;padding:.38rem .6rem;border-radius:999px;background:#eef2ff;color:var(--to-primary);font-size:.75rem;font-weight:900; }.f1-practice-progress { height:8px;border-radius:999px;background:#edf0f7;overflow:hidden; }.f1-practice-progress i { display:block;width:0;height:100%;background:linear-gradient(90deg,#3157d5,#7359ee);border-radius:inherit;transition:width .25s ease; }
.f1-question-wrap { padding:1.5rem 0 .4rem;text-align:center; }.f1-question-wrap > small { color:var(--to-muted); }.f1-question-wrap h3 { margin:.65rem auto 1.25rem;max-width:620px;min-height:70px;display:grid;place-items:center;font-size:clamp(1.35rem,3vw,2rem);line-height:1.25;font-weight:900; }
.f1-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;max-width:560px;margin:auto; }.f1-option { min-height:56px;padding:.7rem 1rem;border-radius:15px;border:1px solid #d8def3;background:#fff;color:#172033;font-weight:850;font-size:1rem;transition:transform .12s ease,border-color .12s ease,background .12s ease; }.f1-option:not(:disabled):hover { transform:translateY(-2px);border-color:#9dadf0;background:#f7f8ff; }.f1-option.is-correct { border-color:#83cfad;background:#eaf8f1;color:#116b4c; }.f1-option.is-wrong { border-color:#f0a39d;background:#fff0ef;color:#ac3e37; }.f1-feedback { min-height:28px;margin-top:.8rem;font-weight:800; }.f1-feedback.is-correct { color:#16825d; }.f1-feedback.is-wrong { color:#b64b43; }
.f1-practice-result { padding:2rem 0 .5rem;text-align:center; }.f1-practice-result > span { display:block;font-size:3rem; }.f1-practice-result h3 { margin:.5rem 0;font-size:1.5rem;font-weight:900; }.f1-practice-result p { color:var(--to-muted); }
.f1-next-topics { display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding:1.2rem;border-radius:20px;background:#fff;border:1px solid var(--to-border); }

.home-math-expansion { display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:1.2rem;align-items:center;padding:clamp(1.5rem,4vw,2.5rem);border-radius:28px;color:#fff;background:linear-gradient(135deg,#203da8,#3158d5 55%,#5d5de4);box-shadow:0 18px 50px rgba(36,61,165,.15); }.home-math-expansion .section-label { color:#fff; }.home-math-expansion h2 { margin:.45rem 0 .7rem;font-size:clamp(1.7rem,3.5vw,2.65rem);font-weight:950;letter-spacing:-.035em; }.home-math-expansion p { margin:0;color:rgba(255,255,255,.82);line-height:1.6; }.home-math-topic-cloud { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem; }.home-math-topic-cloud span { padding:.75rem .85rem;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.13);font-size:.86rem;font-weight:800; }

@media (max-width:1199.98px) {
  .fundamental-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:991.98px) {
  .math-hero,.fundamental-hero,.home-math-expansion { grid-template-columns:1fr; }
  .education-level-grid { grid-template-columns:1fr; }
  .education-level-card { min-height:auto; }
  .math-philosophy { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .f1-next-topics { align-items:flex-start;flex-direction:column; }
}
@media (max-width:767.98px) {
  .fundamental-topic-grid,.math-philosophy { grid-template-columns:1fr; }
  .f1-topic-hero { align-items:flex-start; }.f1-topic-symbol { flex-basis:58px;width:58px;height:58px;border-radius:17px;font-size:1.65rem; }
  .f1-options { grid-template-columns:1fr; }
  .home-math-topic-cloud { grid-template-columns:1fr 1fr; }
}
@media (max-width:575.98px) {
  .math-hero,.fundamental-hero > div:first-child,.fundamental-progress-summary,.f1-topic-hero,.f1-learning-card,.f1-practice-card,.home-math-expansion { border-radius:22px; }
  .math-hero-roadmap > div { grid-template-columns:38px minmax(0,1fr); }.math-hero-roadmap > div b { grid-column:2; }
  .home-math-topic-cloud { grid-template-columns:1fr; }
}

/* Fase 8.1 — IA pedagógica com fallback local */
.fundamental-ai-chip {
  display:inline-flex;align-items:center;padding:.22rem .48rem;border-radius:999px;
  background:#f1edff;color:#6550d8;font-size:.62rem;font-weight:900;letter-spacing:.02em;
  border:1px solid #dfd7ff;
}
.f1-ai-status {
  display:inline-flex;align-items:center;gap:.35rem;margin:-.15rem 0 .9rem;padding:.4rem .65rem;
  border-radius:999px;background:#f3f0ff;border:1px solid #e0d9ff;color:#5e4bc8;
  font-size:.74rem;font-weight:850;line-height:1.2;
}
.f1-ai-status[data-source="gemini"] { background:#eef8ff;border-color:#cfe9ff;color:#176fa8; }
.f1-ai-status[data-source="local"] { background:#f6f7fa;border-color:#e2e6ef;color:#667085; }
.f1-ai-status[data-source="loading"] { background:#f7f5ff;color:#715bca; }
.f1-ai-skeleton {
  grid-column:1/-1;height:124px;border-radius:18px;
  background:linear-gradient(90deg,#f3f5fb 25%,#e9edfa 37%,#f3f5fb 63%);
  background-size:400% 100%;animation:f1-ai-shimmer 1.25s ease infinite;
}
@keyframes f1-ai-shimmer { 0% { background-position:100% 0; } 100% { background-position:0 0; } }
@media (prefers-reduced-motion: reduce) { .f1-ai-skeleton { animation:none; } }

/* Fase 8.2 — dicas alinhadas aos tipos reais de questão */
.f1-question-bases {
  margin:1.2rem 0 1rem;padding:1rem;border-radius:18px;background:#fbfcff;border:1px solid #e4e8f6;
}
.f1-question-bases-head small,.f1-question-bases-head strong { display:block; }
.f1-question-bases-head small { color:var(--to-primary);font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em; }
.f1-question-bases-head strong { margin:.22rem 0 .8rem;font-size:.96rem; }
.f1-question-bases-grid { display:grid;gap:.55rem; }
.f1-question-base { display:flex;gap:.7rem;align-items:flex-start;padding:.7rem .75rem;border-radius:14px;background:#fff;border:1px solid #edf0f7; }
.f1-question-base > span { flex:0 0 26px;width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#eef2ff;color:var(--to-primary);font-size:.72rem;font-weight:950; }
.f1-question-base strong { display:block;font-size:.88rem; }
.f1-question-base p { margin:.12rem 0 0!important;font-size:.79rem;line-height:1.42!important;color:var(--to-muted)!important; }
.f1-hint-box { max-width:560px;margin:-.45rem auto 1rem;text-align:left; }
.f1-hint-toggle { width:100%;padding:.7rem .85rem;border:1px dashed #b8c4ee;border-radius:14px;background:#f8faff;color:#3554b5;font-weight:850;text-align:left;transition:background .15s ease,border-color .15s ease; }
.f1-hint-toggle:hover { background:#f1f5ff;border-color:#8ea0e6; }
.f1-hint-box p { margin:.5rem 0 0;padding:.72rem .85rem;border-radius:13px;background:#fff8df;border:1px solid #f0dea0;color:#685919;font-size:.88rem;line-height:1.45; }
.f1-hint-box p[hidden] { display:none; }

/* --------------------------------------------------------------------------
   Fase 8.4 — desempenho integrado do Fundamental I
   -------------------------------------------------------------------------- */
.performance-scope-note {
  color: var(--to-muted);
  font-size: .76rem;
  font-weight: 700;
}
.f1-performance-section {
  overflow: hidden;
  background:
    radial-gradient(circle at 94% 8%, rgba(77, 91, 255, .09), transparent 28%),
    #fff;
}
.performance-grid-f1 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.f1-performance-card {
  display: flex;
  flex-direction: column;
}
.f1-performance-card > .btn { margin-top: auto; }
.progress-stat-compact { min-height: 104px; }
.recommendation-card-f1 {
  box-shadow: none;
  background: linear-gradient(120deg, #f7f9ff, #fff);
}
.f1-performance-card.is-empty .table-progress-icon { opacity: .72; }
.f1-performance-card.is-empty .table-status { background: #f4f5f8; color: #707684; }

@media (max-width: 1199.98px) {
  .performance-grid-f1 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .performance-grid-f1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .performance-grid-f1 { grid-template-columns: 1fr; }
  .performance-scope-note { display: none; }
}

/* --------------------------------------------------------------------------
   Fase 9 — Fundamental II + acabamento do painel
   -------------------------------------------------------------------------- */
.performance-open-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  white-space: nowrap;
  width: auto;
  min-width: 0;
  padding-inline: 1rem;
}

.education-level-card-f2 {
  background: linear-gradient(145deg, #f8fbff, #f2f7ff);
  border-color: #d6e6fb;
}
.education-level-card-f2:hover { border-color: #9fc2f3; }

.fundamental2-theme .section-label { color: #1f6fc7; }
.fundamental2-hero > div:first-child {
  background: linear-gradient(135deg, #f7fbff, #eef6ff);
  border-color: #d7e8fb;
}
.fundamental2-progress-summary {
  background: linear-gradient(145deg, #1766b3, #2f7bd4 55%, #4f65d9);
}
.fundamental2-topic-card .fundamental-topic-icon { background: #eef7ff; }
.fundamental2-topic-card .fundamental-topic-copy small,
.fundamental2-topic-card > strong { color: #1f6fc7; }
.fundamental2-topic-card .fundamental-topic-progress i {
  background: linear-gradient(90deg, #1f6fc7, #4e67dd);
}
.fundamental2-topic-hero {
  background: linear-gradient(135deg, #155ca4, #2f7bd4 55%, #5160d9);
}
.fundamental2-example-box { background: #f2f8ff; border-color: #d8e9fb; }
.fundamental2-example-box small { color: #1f6fc7; }

.fundamental2-focus-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .8rem;
}
.fundamental2-focus-strip > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  column-gap: .65rem;
  row-gap: .1rem;
  align-items: center;
  padding: .9rem 1rem;
  border-radius: 18px;
  background: #fff;
  border: 1px solid var(--to-border);
}
.fundamental2-focus-strip > div > span {
  grid-row: 1 / span 2;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #eef6ff;
  font-size: 1.05rem;
}
.fundamental2-focus-strip strong { font-size: .86rem; }
.fundamental2-focus-strip small { color: var(--to-muted); line-height: 1.35; }

.f2-performance-section {
  overflow: hidden;
  background:
    radial-gradient(circle at 94% 8%, rgba(34, 123, 212, .10), transparent 28%),
    #fff;
}
.performance-grid-f2 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.f2-performance-card { display: flex; flex-direction: column; }
.f2-performance-card > .btn { margin-top: auto; }
.recommendation-card-f2 {
  box-shadow: none;
  background: linear-gradient(120deg, #f4f9ff, #fff);
}
.f2-performance-card.is-empty .table-progress-icon { opacity: .72; }
.f2-performance-card.is-empty .table-status { background: #f4f5f8; color: #707684; }

@media (max-width: 1199.98px) {
  .fundamental2-focus-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .performance-grid-f2 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .performance-grid-f2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .fundamental2-focus-strip, .performance-grid-f2 { grid-template-columns: 1fr; }
  .performance-open-link { width: 100%; }
}

/* --------------------------------------------------------------------------
   Fase 10 — Ensino Médio + refinamento de cache/PWA
   -------------------------------------------------------------------------- */
.education-level-card-em {
  background: linear-gradient(145deg, #fbf8ff, #f5f0ff);
  border-color: #e1d4fa;
}
.education-level-card-em:hover { border-color: #bca2ee; }

.ensino-medio-theme .section-label { color: #7447c9; }
.ensino-medio-hero > div:first-child {
  background: linear-gradient(135deg, #fbf8ff, #f4efff);
  border-color: #e4d9f8;
}
.ensino-medio-progress-summary {
  background: linear-gradient(145deg, #5e37b6, #7a4ed0 55%, #485bd7);
}
.ensino-medio-topic-card .fundamental-topic-icon { background: #f4efff; }
.ensino-medio-topic-card .fundamental-topic-copy small,
.ensino-medio-topic-card > strong { color: #7447c9; }
.ensino-medio-topic-card .fundamental-topic-progress i {
  background: linear-gradient(90deg, #7447c9, #5361dc);
}
.ensino-medio-topic-hero {
  background: linear-gradient(135deg, #5630aa, #794dcc 55%, #4f5ed6);
}
.ensino-medio-example-box { background: #f8f4ff; border-color: #e4daf8; }
.ensino-medio-example-box small { color: #7447c9; }
.ensino-medio-focus-strip > div > span { background: #f4efff; }

.em-performance-section {
  overflow: hidden;
  background:
    radial-gradient(circle at 94% 8%, rgba(116, 71, 201, .11), transparent 28%),
    #fff;
}
.performance-grid-em { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.em-performance-card { display: flex; flex-direction: column; }
.em-performance-card > .btn { margin-top: auto; }
.recommendation-card-em {
  box-shadow: none;
  background: linear-gradient(120deg, #faf7ff, #fff);
}
.em-performance-card.is-empty .table-progress-icon { opacity: .72; }
.em-performance-card.is-empty .table-status { background: #f4f5f8; color: #707684; }

@media (max-width: 1199.98px) {
  .performance-grid-em { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .performance-grid-em { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .performance-grid-em { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Fase 10.1 — camada final de responsividade
   -------------------------------------------------------------------------- */

/* Segurança global contra overflow em grids/flex e conteúdo longo. */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas { max-width: 100%; height: auto; }
.site-main,
.page-shell,
.content-shell,
.row > *,
.card,
.card-body,
.hero-content,
[class*="-grid"],
[class*="-card"],
[class*="-copy"] { min-width: 0; }
.page-shell { width: 100%; padding-inline: clamp(.75rem, 2vw, 1.25rem) !important; }
pre, code { max-width: 100%; overflow-x: auto; }
.btn:not(.nav-cta), .card, .alert { overflow-wrap: anywhere; }
.form-control, .form-select, textarea { max-width: 100%; }

/*
 * O Bootstrap expande .navbar-expand-xxl a partir de 1400px.
 * Entre 1400 e 1499px o menu completo ainda fica apertado em alguns monitores,
 * principalmente com escala de 125%/150%. Mantemos o menu recolhido nessa faixa.
 */
@media (min-width: 1400px) and (max-width: 1499.98px) {
  .site-nav .navbar-expand-xxl { flex-wrap: wrap; }
  .site-nav .navbar-expand-xxl .navbar-toggler { display: block; }
  .site-nav .navbar-expand-xxl .navbar-collapse {
    flex-basis: 100%;
    flex-grow: 1;
    align-items: center;
  }
  .site-nav .navbar-expand-xxl .navbar-collapse:not(.show) { display: none !important; }
  .site-nav .navbar-expand-xxl .navbar-collapse.show,
  .site-nav .navbar-expand-xxl .navbar-collapse.collapsing { display: block !important; }
  .site-nav .navbar-expand-xxl .navbar-nav {
    width: 100%;
    flex-direction: column;
    align-items: stretch !important;
  }
  .site-nav .nav-cta { width: 100%; margin: .25rem 0 0 !important; text-align: center; }
}

/* Laptops e tablets grandes: prioriza uma coluna antes de o conteúdo apertar. */
@media (max-width: 1199.98px) {
  .exercise-hero,
  .teacher-hero,
  .learning-hub-hero,
  .math-hero,
  .fundamental-hero,
  .home-math-expansion {
    grid-template-columns: 1fr !important;
  }
  .exercise-hero { align-items: flex-start; }
  .teacher-hero-visual { display: none; }
  .learning-hub-symbol { display: none; }
  .math-hero-roadmap { max-width: none; }
  .home-math-topic-cloud { max-width: none; }
  .article-layout,
  .support-grid { grid-template-columns: 1fr; }
  .article-aside { position: static; }
  .pix-box { grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); }
  .exercise-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Zona crítica de notebooks/tablets: elimina larguras laterais rígidas. */
@media (max-width: 991.98px) {
  .hero,
  .exercise-hero,
  .teacher-hero,
  .learning-hub-hero,
  .math-hero,
  .fundamental-hero,
  .home-math-expansion,
  .performance-hero { border-radius: 24px; }

  .exercise-hero { display: block; }
  .exercise-hero-badge { display: none; }
  .pix-box { grid-template-columns: 1fr; }
  .pix-qr-wrap { width: min(100%, 290px); margin-inline: auto; }
  .support-grid,
  .article-layout { gap: 1rem; }

  .recommendation-card,
  .performance-recommendation,
  .seo-action-strip { align-items: stretch; }

  .competition-promo-banner { gap: 1rem; }
  .competition-promo-action { max-width: none; }

  .times-builder-form,
  .exercise-range-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
  .page-shell { padding-inline: .8rem !important; }
  .site-nav .navbar { min-height: 62px; }
  .site-brand { gap: .55rem; font-size: .98rem; }
  .site-brand-mark { width: 36px; height: 36px; flex-basis: 36px; }

  .hero-content,
  .exercise-hero,
  .teacher-hero,
  .learning-hub-hero,
  .math-hero,
  .fundamental-hero,
  .home-math-expansion { padding: 1.35rem; }

  .summary-kpi-grid { grid-template-columns: 1fr 1fr; }
  .performance-grid,
  .performance-grid-f1,
  .performance-grid-f2,
  .performance-grid-em { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .teacher-stat-grid,
  .math-philosophy { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .article-aside,
  .learning-card-grid,
  .home-learning-grid,
  .related-guide-grid { grid-template-columns: 1fr; }

  .f1-topic-hero { align-items: flex-start; }
  .f1-topic-symbol { flex-basis: 64px; width: 64px; height: 64px; border-radius: 18px; }

  .times-builder-form,
  .exercise-range-grid { grid-template-columns: 1fr; }
  .times-builder-form .btn { grid-column: auto; }

  .exercise-preview-grid.cols-2,
  .exercise-preview-grid.cols-3 { grid-template-columns: 1fr; }
}

@media (max-width: 575.98px) {
  .page-shell { padding-inline: .65rem !important; }
  .site-brand > span:last-child { font-size: .94rem; }

  .hero,
  .exercise-hero,
  .teacher-hero,
  .learning-hub-hero,
  .math-hero,
  .fundamental-hero,
  .home-math-expansion,
  .performance-hero { border-radius: 20px; }

  .hero-content,
  .exercise-hero,
  .teacher-hero,
  .learning-hub-hero,
  .math-hero,
  .fundamental-hero,
  .home-math-expansion { padding: 1.15rem; }

  .summary-kpi-grid,
  .performance-grid,
  .performance-grid-f1,
  .performance-grid-f2,
  .performance-grid-em,
  .teacher-stat-grid,
  .math-philosophy { grid-template-columns: 1fr; }

  .f1-topic-hero { flex-direction: column; gap: .8rem; }
  .f1-topic-symbol { flex-basis: 58px; width: 58px; height: 58px; }

  .review-item { grid-template-columns: 1fr auto; }
  .review-expression { grid-column: 1 / -1; width: fit-content; min-width: 0; }

  .competition-clock-copy { flex-wrap: wrap; }
  .competition-clock-copy strong { width: 100%; }

  .teacher-preset-list a,
  .ranking-newcomer-card { min-width: 0; }
  .teacher-preset-list a { grid-template-columns: auto minmax(0,1fr) auto; }
}

/* Telas realmente estreitas e zoom alto. */
@media (max-width: 399.98px) {
  .page-shell { padding-inline: .5rem !important; }
  .site-brand > span:last-child { display: none; }
  .site-brand { margin-right: .25rem !important; }
  .hero h1,
  .math-hero h1,
  .fundamental-hero h1 { font-size: 1.9rem; }
  .btn-lg { padding-inline: .85rem; font-size: 1rem; }
  .operation-grid-v2,
  .f1-options,
  .home-math-topic-cloud { grid-template-columns: 1fr !important; }
}