/* =========================================================
   DESAFIO MATEMÁTICO — MOBILE OVERRIDES v1.3.9
   Carregado depois do app.css para garantir prioridade.
   ========================================================= */

@media (max-width: 767px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
  }

  body { font-size: 16px !important; }

  /* ---------------- LOGIN PÚBLICO ---------------- */
  body.login-rebuilt {
    min-height: 100svh !important;
    overflow-y: auto !important;
  }

  .login-bg {
    position: fixed !important;
    inset: 0 !important;
    background-position: 68% center !important;
    background-size: cover !important;
  }

  .login-stage {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-height: 100svh !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 20px 16px 28px !important;
    gap: 16px !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
  }

  .login-hero-left {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    margin: 0 auto !important;
    text-align: center !important;
    padding: 8px 6px 2px !important;
  }

  .login-brand-block {
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
  }

  .login-brand-logo {
    width: 96px !important;
    max-width: 96px !important;
    height: auto !important;
    border-radius: 10px !important;
  }

  .login-copy {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }

  .login-copy h2 {
    margin: 0 !important;
    line-height: .98 !important;
    letter-spacing: -.025em !important;
  }

  .login-copy h2 .login-copy-main {
    display: flex !important;
    justify-content: center !important;
    white-space: normal !important;
    font-size: clamp(25px, 7.4vw, 32px) !important;
    line-height: 1.02 !important;
    font-weight: 700 !important;
    letter-spacing: -.025em !important;
  }

  .login-copy h2 .login-copy-script {
    display: inline-block !important;
    margin-top: 3px !important;
    padding: 0 4px 5px 1px !important;
    font-size: clamp(34px, 10vw, 43px) !important;
    line-height: .88 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }

  .login-copy h2 .login-copy-script:after {
    height: 3px !important;
    bottom: -1px !important;
  }

  .login-copy p {
    display: block !important;
    margin: 10px auto 0 !important;
    max-width: 290px !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    color: rgba(255,255,255,.88) !important;
  }

  .login-card,
  .login-card-rebuilt {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px 0 0 !important;
    padding: 22px 18px 18px !important;
    border-radius: 18px !important;
    align-self: stretch !important;
    justify-self: stretch !important;
  }

  .login-card-rebuilt .login-kicker {
    font-size: 10px !important;
    letter-spacing: .14em !important;
    margin-bottom: 6px !important;
  }

  .login-card-rebuilt h1 {
    font-size: 30px !important;
    line-height: 1 !important;
    margin: 0 0 6px !important;
    font-weight: 700 !important;
  }

  .login-card-rebuilt .sub {
    font-size: 13px !important;
    line-height: 1.35 !important;
    max-width: 300px !important;
    margin: 0 auto 16px !important;
  }

  .login-form-rebuilt {
    gap: 9px !important;
  }

  .login-form-rebuilt .input {
    height: 52px !important;
    min-height: 52px !important;
    font-size: 16px !important;
    border-radius: 12px !important;
  }

  .login-main-cta {
    height: 54px !important;
    min-height: 54px !important;
    font-size: 17px !important;
    border-radius: 12px !important;
  }

  .login-official-slogan {
    margin-top: 12px !important;
    padding-top: 12px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  .login-bottom-cards {
    order: 3 !important;
    display: flex !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    gap: 12px !important;
    overflow: visible !important;
  }

  .login-bottom-cards::-webkit-scrollbar { display: none !important; }

  .login-stat-card {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 14px !important;
    border-radius: 16px !important;
  }

  .login-stat-icon {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
    border-radius: 12px !important;
  }

  .login-stat-card h3 { font-size: 15px !important; margin: 0 0 3px !important; }
  .login-stat-card p { font-size: 12px !important; line-height: 1.3 !important; }

  .login-project-credit {
    position: static !important;
    transform: none !important;
    left: auto !important;
    bottom: auto !important;
    order: 4 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 12px 4px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
    text-align: center !important;
  }

  /* ---------------- ADMIN / ALUNO ---------------- */
  .admin-layout,
  .student-shell {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 100svh !important;
    height: auto !important;
    overflow: visible !important;
  }

  .main,
  .student-app {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100svh !important;
    height: auto !important;
    overflow: visible !important;
  }

  .sidebar,
  .student-side {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 58px !important;
    padding: 6px 8px !important;
    display: flex !important;
    justify-content: center !important;
    overflow: hidden !important;
    background: #061a32 !important;
    box-shadow: 0 5px 18px rgba(0,0,0,.16) !important;
  }

  .side-logo,
  .student-side-logo,
  .sidebar-motto,
  .sidebar-space-art,
  .sidebar-footer,
  .student-side-motto {
    display: block !important;
    margin: 10px auto 0 !important;
    max-width: 290px !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    color: rgba(255,255,255,.88) !important;
  }

  .nav,
  .student-nav {
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 0 2px !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
  }

  .nav::-webkit-scrollbar,
  .student-nav::-webkit-scrollbar { display:none !important; }

  .nav a,
  .student-nav a {
    flex: 0 0 auto !important;
    min-width: auto !important;
    min-height: 44px !important;
    padding: 8px 11px !important;
    border-radius: 11px !important;
    display: inline-flex !important;
    justify-content: center !important;
    gap: 6px !important;
    font-size: 12px !important;
  }

  .nav a span,
  .student-nav a span {
    display: inline !important;
    white-space: nowrap !important;
  }

  .nav a svg,
  .student-nav a svg {
    width: 18px !important;
    height: 18px !important;
  }

  .topbar,
  .student-topbar {
    position: sticky !important;
    top: 58px !important;
    z-index: 90 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 56px !important;
    padding: 7px 10px !important;
    gap: 8px !important;
  }

  .top-search,
  .student-searchlike { width: 100% !important; max-width: none !important; }
  .top-search input,
  .student-searchlike input { min-height: 42px !important; font-size: 16px !important; }
  .top-actions { display: none !important; }
  .student-account>div:not(.student-avatar), .student-account>svg { display:none !important; }

  .content,
  .student-main {
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 10px 22px !important;
  }

  .page-title,
  .dashboard-heading {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  .page-title h1,
  .dashboard-heading h1 { font-size: 25px !important; line-height:1.1 !important; }
  .page-title p,
  .dashboard-heading p { font-size: 13px !important; line-height:1.4 !important; }
  .page-actions { width:100% !important; display:grid !important; grid-template-columns:1fr !important; gap:8px !important; }
  .page-actions .btn { width:100% !important; }

  .btn {
    min-height: 48px !important;
    padding: 0 15px !important;
    font-size: 15px !important;
    border-radius: 11px !important;
  }

  .btn-sm { min-height: 40px !important; font-size: 13px !important; }
  .input,.select,.textarea,select,textarea { min-height: 48px !important; font-size:16px !important; border-radius:11px !important; }
  .textarea { min-height: 120px !important; }
  .field label { font-size:13px !important; }

  .grid,.grid-2,.grid-3,.grid-4,
  .filters,.builder-filters,.game-top,
  .settings-grid,.danger-grid,.access-data,
  .design-grid,.student-dashboard-grid,.kpis,.student-kpis,
  .question-stats-grid,.admin-access-summary {
    grid-template-columns: 1fr !important;
  }

  .card,.dashboard-card,.student-card,.settings-card,.game-builder,.danger-zone {
    padding: 14px !important;
    border-radius: 15px !important;
  }

  .kpis,.student-kpis { gap:9px !important; }
  .kpi,.student-kpi { min-height:88px !important; padding:13px !important; }
  .student-kpi strong,.kpi strong { font-size:24px !important; }

  .table-wrap {
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    border-radius:13px !important;
  }

  .table { min-width: 700px !important; width:max-content !important; }
  .table th,.table td { font-size:12px !important; padding:11px 10px !important; }
  .action { width:38px !important; height:38px !important; border-radius:9px !important; }
  .action svg { width:17px !important; height:17px !important; }

  .question-stats-grid { gap:9px !important; }
  .question-stat-card { padding:13px !important; min-height:82px !important; }
  .question-stat-icon { width:48px !important; height:48px !important; flex-basis:48px !important; }
  .question-stat-card strong { font-size:25px !important; }

  .student-hero {
    padding:16px !important;
    border-radius:15px !important;
    gap:12px !important;
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .student-hero h1 { font-size:27px !important; }
  .student-hero p { font-size:13px !important; line-height:1.4 !important; }
  .student-hero-action { width:100% !important; margin:2px 0 0 !important; }
  .student-hero-action .btn { width:100% !important; }

  .achievement-list { grid-template-columns:1fr !important; }
  .performance-card,.category-card,.achievements-card { min-height:auto !important; }

  /* Tela do jogo */
  .game-wrap { width:100% !important; max-width:100% !important; padding:12px 10px 22px !important; }
  .game-top { gap:8px !important; }
  .hud-box { padding:10px !important; border-radius:12px !important; }
  .hud-box b { font-size:18px !important; }
  .game-card { padding:16px !important; border-radius:16px !important; }
  .game-card h2 { font-size:22px !important; line-height:1.35 !important; }
  .options { grid-template-columns:1fr !important; }
  .option-btn { min-height:56px !important; font-size:15px !important; padding:13px 14px !important; }
  .game-actions { flex-direction:column !important; gap:9px !important; }
  .game-actions > * { width:100% !important; }
  .game-actions .btn { width:100% !important; }
}

@media (max-width: 390px) {
  .login-stage { padding: 18px 12px 24px !important; }
  .login-hero-left { gap:10px !important; padding-top:4px !important; }
  .login-brand-logo { width:84px !important; max-width:84px !important; }
  .login-copy h2 .login-copy-main { font-size:24px !important; }
  .login-copy h2 .login-copy-script { font-size:35px !important; }
  .login-card,.login-card-rebuilt { padding:16px 13px 14px !important; }
  .login-card-rebuilt h1 { font-size:28px !important; }
  .login-card-rebuilt .sub { font-size:12.5px !important; }
  .login-stat-card { width:100% !important; min-width:0 !important; }
  .content,.student-main { padding-left:8px !important; padding-right:8px !important; }
}