@media(max-width:1180px){
  :root{--sidebar-w:280px}
  .toolbar{grid-template-columns:1fr 1fr}.view-switch{width:100%}.view-switch button{flex:1}
  .hero-copy{padding-right:118px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:980px){
  :root{--topbar-h:64px}
  .topbar-inner{min-height:var(--topbar-h);padding-top:7px;padding-bottom:7px}
  .brand-mark,.brand-mark img{width:46px;height:46px}.brand-mark{flex-basis:46px}
  .brand-copy p{display:none}.mode-tab{padding:0 9px}.top-exam-btn{display:none}
  .app-layout,.app-layout.sidebar-collapsed{display:block;min-height:calc(100dvh - var(--topbar-h) - var(--safe-top))}
  .sidebar,.app-layout.sidebar-collapsed .sidebar{position:fixed;z-index:110;left:0;top:0;width:min(88vw,330px);height:100dvh;padding-top:calc(14px + var(--safe-top));padding-left:max(12px,var(--safe-left));padding-bottom:calc(18px + var(--safe-bottom));transform:translateX(-105%);opacity:1;pointer-events:auto;border-right:1px solid var(--line-strong);box-shadow:16px 0 48px rgba(0,0,0,.26);transition:transform .22s var(--ease)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-backdrop.open{display:block;position:fixed;z-index:100;inset:0;background:rgba(18,13,10,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
  .main{padding:15px max(11px,var(--safe-right)) calc(38px + var(--safe-bottom)) max(11px,var(--safe-left))}
  .toolbar-wrap{top:calc(var(--topbar-h) + var(--safe-top) + 5px)}
  .hero{border-radius:21px}.hero-copy{padding-right:0}.hero-mascot{display:none}
  .question-card{scroll-margin-top:125px}.group-heading{scroll-margin-top:125px}
  .exam-head{top:calc(var(--topbar-h) + var(--safe-top) + 4px)}
}
@media(max-width:720px){
  .brand-copy h1{font-size:13.5px}.mode-tabs{margin-left:auto}.mode-tab{font-size:11px;min-height:34px}
  .theme-btn{min-width:40px;width:40px;height:40px}.menu-btn{min-width:40px;width:40px;height:40px}
  .hero{padding:18px 16px}.hero h2{font-size:30px}.hero p{font-size:13px}.hero-actions{display:grid;grid-template-columns:1fr}.hero-action{width:100%}
  .stats-grid{grid-template-columns:1fr 1fr;gap:7px}.stat{padding:10px 11px}.stat b{font-size:18px}
  .analytics-insights{grid-template-columns:1fr}.analytics-row{grid-template-columns:1fr}.analytics-metrics{justify-content:flex-start}.analytics-bar{grid-column:1}
  .toolbar{grid-template-columns:1fr;padding:8px;gap:8px}.field select,.field input{height:46px}.view-switch{height:43px}
  .results-bar{flex-wrap:wrap}.results-bar .line{min-width:40px}.reset-btn{margin-left:auto}
  .group-heading{padding:11px 12px;border-radius:14px}.group-heading h3{font-size:15px}.group-heading span{font-size:9px}
  .question-card{padding:14px;border-radius:18px;margin-bottom:11px}.card-top{margin-bottom:11px;padding-bottom:10px}.crumb{width:100%;order:3}.badge{margin-left:auto}.prompt{font-size:15.5px;line-height:1.62}.option{min-height:50px;padding:10px 10px;gap:9px}.option-letter{width:30px;height:30px}.verify-btn{width:100%;min-height:46px}.answer-feedback{width:100%;text-align:center}.solution-body{padding:12px}.analysis-row{font-size:11px}
  .source-image{max-height:55dvh}
  .score-hero{grid-template-columns:1fr}.exam-rules{grid-template-columns:1fr 1fr}.exam-nav{grid-template-columns:repeat(10,minmax(0,1fr))}.exam-panel,.exam-setup,.exam-result{padding:15px;border-radius:19px}.exam-controls{display:grid;grid-template-columns:1fr 1fr}.exam-controls .finish{grid-column:1/-1;margin:0}.exam-controls button{width:100%}
  .footer-card{grid-template-columns:1fr;text-align:center;justify-items:center;padding:23px 18px}.footer-links{justify-content:center}.footer-copy p{font-size:11.5px}
}
@media(max-width:430px){
  .brand-copy{max-width:132px}.brand-copy h1{font-size:12px}.brand-mark,.brand-mark img{width:42px;height:42px}.brand-mark{flex-basis:42px}.topbar-inner{gap:7px;padding-left:max(8px,var(--safe-left));padding-right:max(8px,var(--safe-right))}
  .mode-tabs{gap:2px;padding:3px}.mode-tab{padding:0 7px;font-size:10px}.theme-btn{min-width:38px;width:38px;height:38px}.menu-btn{min-width:38px;width:38px;height:38px}
  .hero h2{font-size:27px}.stats-grid{grid-template-columns:1fr 1fr}.hero-progress-head{font-size:9.5px}
  .qnum{font-size:11px;min-height:34px;padding:0 10px}.prompt{font-size:15px}.option{grid-template-columns:30px minmax(0,1fr)}
  .exam-nav{grid-template-columns:repeat(8,minmax(0,1fr))}.exam-rules{grid-template-columns:1fr 1fr}.score-main b{font-size:31px}
}
@media(hover:none){.question-card:hover{box-shadow:var(--shadow-xs);border-color:var(--line)}.option:hover:not(:disabled){transform:none}.hero-action:hover,.exam-primary:hover,.exam-secondary:hover,.qnum:hover{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{.topbar,.sidebar,.sidebar-backdrop,.toolbar-wrap,.card-actions,.load-more,.reset-btn,.tanuki-footer,.hero-actions,.solution-toggle{display:none!important}.app-layout{display:block}.main{padding:0}.hero,.question-card{box-shadow:none}.solution{display:block!important}.question-card{break-inside:avoid}.source-image{max-height:none}}

/* iPhone: el selector de modo nunca debe partir sus etiquetas */
.mode-tab{white-space:nowrap;word-break:keep-all}
@media(max-width:430px){
  .mode-tabs{flex:0 0 auto}
  .mode-tab{padding-inline:8px;font-size:10.25px;line-height:1;white-space:nowrap}
  .brand-copy{max-width:124px}
}
@media(max-width:380px){
  .mode-tab{padding-inline:6px;font-size:9.75px}
  .brand-copy{max-width:116px}
}

/* Simulador móvil: mapa de 60 preguntas compacto y deslizable */
@media(max-width:720px){
  .exam-nav{
    display:flex;
    grid-template-columns:none;
    gap:6px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x proximity;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    padding:3px 2px 9px;
    margin-bottom:9px;
    scrollbar-width:none;
  }
  .exam-nav::-webkit-scrollbar{display:none}
  .exam-dot{
    flex:0 0 36px;
    width:36px;
    min-width:36px;
    min-height:36px;
    scroll-snap-align:center;
  }
}