@media (max-width: 640px) {
  body { font-size: 14px; }
  .site-header { min-height: 68px; padding: 0 16px; }
  .brand { gap: 9px; }
  .brand-mark { width: 35px; height: 35px; }
  .brand small { display: none; }
  .main-nav { position: fixed; z-index: 9; right: 0; bottom: 0; left: 0; justify-content: space-around; gap: 0; padding: 8px 6px max(8px, env(safe-area-inset-bottom)); border-top: 1px solid var(--color-border); background: color-mix(in srgb, var(--color-background) 94%, transparent); backdrop-filter: blur(18px); }
  .nav-link { padding: 9px 6px; font-size: 10px; }
  .header-actions { gap: 7px; }
  .icon-button, .avatar-button { width: 36px; height: 36px; }
  .page-shell { width: min(100% - 30px, 520px); padding: 28px 0 100px; }
  .page-heading { display: block; margin-bottom: 22px; }
  .hero { min-height: 350px; padding: 29px 22px; border-radius: 18px; }
  .hero h1 { max-width: 480px; font-size: 43px; }
  .hero p { max-width: 390px; font-size: 13px; }
  .hero-aside { right: -24px; bottom: -10px; width: 130px; height: 130px; font-size: 27px; }
  .card-grid, .metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric-card { padding: 14px; }
  .metric-value { font-size: 24px; }
  .card { padding: 16px; }
  .card-link h3 { font-size: 13px; }
  .card-link p { font-size: 11px; }
  .test-sidebar { grid-template-columns: 1fr; }
  .test-sidebar .question-grid { grid-template-columns: repeat(6, minmax(32px, 1fr)); }
  .task-meta { align-items: start; }
  .task-prompt { font-size: 21px; }
  .form-row { grid-template-columns: 1fr; gap: 5px; }
  .section-block { margin-top: 32px; }
}

@media (max-width: 390px) {
  .main-nav .nav-link { font-size: 9px; }
  .brand strong { font-size: 12px; }
  .avatar-button { display: none; }
  .card-grid, .metric-grid { grid-template-columns: 1fr; }
  .hero h1 { font-size: 37px; }
  .hero-actions .button { width: 100%; }
}