@media (max-width: 640px) {
  .nn-lesson-content-card { margin: 12px 10px !important; }
  .nn-lesson-content-body { padding: 16px !important; }
  .nn-chapter-overview {
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    margin-bottom: 12px !important;
  }
}

/* Resource tabs — fixed 3-col grid, everything visible, no scroll.
   Widened to 900px (same breakpoint the chapter sidebar disappears
   at, per snippet 16658) so tablets get the same aligned grid
   instead of the desktop flex row wrapping unevenly. */
@media (max-width: 900px) {
  .nn-tab-nav {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    overflow: visible !important;
    position: static !important;
  }
  .nn-tab-nav::after { content: none !important; }
  .nn-tab-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    width: 100% !important;
    min-height: 46px !important;
    padding: 8px 4px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    text-align: center !important;
    border-radius: 12px !important;
    margin-bottom: 0 !important;
    background: #F8F9FB !important;
    border: 1px solid #E7E9EC !important;
    box-shadow: 0 1px 2px rgba(15,23,42,.05) !important;
    transition: transform .12s ease, box-shadow .12s ease !important;
  }
  .nn-tab-btn:active { transform: scale(.96) !important; }
  .nn-tab-btn.is-active {
    background: linear-gradient(135deg, #16A085, #11876F) !important;
    border-color: #16A085 !important;
    color: #fff !important;
    box-shadow: 0 6px 14px rgba(22,160,133,.32) !important;
  }
}