/* Study Material mobile repair — intentionally scoped to body.sm-page */
body.sm-page{overflow-x:hidden}
body.sm-page main.container{width:min(100% - 28px,1180px);margin-inline:auto;padding-inline:0;padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
body.sm-page .sm-hero{padding-top:14px;margin-bottom:0}
body.sm-page .sm-search-wrap{margin-top:12px}
body.sm-page .sm-section-heading{margin:22px 0 10px}
body.sm-page .sm-grid{gap:12px}
body.sm-page .sm-card{min-height:176px;max-height:none;padding:15px;border-radius:19px;gap:8px}
body.sm-page .sm-card-icon{width:46px;height:46px;flex-basis:46px;border-radius:13px}
body.sm-page .sm-card-icon svg{width:22px;height:22px}
body.sm-page .sm-card h3{font-size:1rem;line-height:1.25}
body.sm-page .sm-card-count{font-size:.8rem}
body.sm-page .sm-card-btn{min-height:40px;padding:0 12px;border-radius:11px;font-size:.78rem;max-width:100%}
body.sm-page .sm-coming-badge{font-size:.66rem;padding:4px 8px}

/* One compact list for every published resource */
body.sm-page .sm-all-materials-section{margin-top:26px}
body.sm-page .study-resource-grid{display:grid;grid-template-columns:1fr;gap:12px}
body.sm-page .study-resource-card{display:grid!important;grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:12px;row-gap:5px;min-height:150px;padding:12px!important;border-radius:18px!important;overflow:hidden}
body.sm-page .study-resource-card .study-resource-thumb{grid-column:1;grid-row:1 / 5;width:112px!important;height:100%!important;min-height:126px;max-height:160px;aspect-ratio:auto!important;object-fit:cover;border-radius:13px!important;margin:0!important}
body.sm-page .study-resource-card .study-resource-meta{grid-column:2;grid-row:1;margin:0!important;gap:4px!important}
body.sm-page .study-resource-card .badge{font-size:.64rem!important;padding:3px 7px!important}
body.sm-page .study-resource-card h3{grid-column:2;grid-row:2;font-size:1rem!important;line-height:1.28;margin:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.sm-page .study-resource-card p{grid-column:2;grid-row:3;font-size:.82rem!important;line-height:1.45;margin:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.sm-page .study-resource-card .study-resource-actions{grid-column:2;grid-row:4;margin-top:2px!important}
body.sm-page .study-resource-card .primary-btn{min-height:38px!important;padding:0 12px!important;font-size:.78rem!important;border-radius:10px!important;width:max-content!important}

@media (max-width:768px){
  body.sm-page .site-header{height:auto!important;min-height:72px!important;padding:10px 14px!important}
  body.sm-page .site-brand{width:100%!important;max-width:none!important;display:grid!important;grid-template-columns:46px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important}
  body.sm-page .site-brand .logo{width:46px!important;height:46px!important;margin:0!important;position:static!important;transform:none!important}
  body.sm-page .site-brand-name{display:block!important;text-align:left!important;min-width:0!important}
  body.sm-page .site-brand-name h1{font-size:1rem!important;line-height:1.15!important;margin:0!important;white-space:nowrap!important}
  body.sm-page .site-brand-name p{display:block!important;font-size:.68rem!important;line-height:1.25!important;margin:3px 0 0!important;max-width:180px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  body.sm-page .modern-top-actions{position:static!important;transform:none!important;margin:0!important;display:flex!important;gap:7px!important}
  body.sm-page .modern-theme-dot,body.sm-page .modern-nav-toggle{width:40px!important;height:40px!important;min-width:40px!important;border-radius:12px!important}
  body.sm-page .site-nav{display:none!important}
  body.sm-page .sm-breadcrumb{display:none!important}
  body.sm-page .sm-hero-accent{height:44px;width:4px;flex-basis:4px;margin-top:2px}
  body.sm-page .sm-hero h1{font-size:1.85rem!important}
  body.sm-page .sm-hero p{font-size:.92rem!important;line-height:1.45!important}
  body.sm-page .sm-search-inner{min-height:46px;border-radius:14px}
  body.sm-page .modern-bottom-nav{left:0!important;right:0!important;bottom:0!important;height:68px!important;border-radius:22px 22px 0 0!important;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px))!important}
  body.sm-page .modern-bottom-nav a{font-size:.68rem!important;gap:2px!important}
  body.sm-page .modern-bottom-nav a .modern-bottom-icon{width:32px!important;height:30px!important}
}
@media (max-width:339px){
  body.sm-page .sm-grid{grid-template-columns:1fr}
  body.sm-page .sm-card{min-height:150px}
  body.sm-page .study-resource-card{grid-template-columns:92px minmax(0,1fr)}
  body.sm-page .study-resource-card .study-resource-thumb{width:92px!important}
  body.sm-page .site-brand-name p{display:none!important}
}
@media (min-width:769px){
 body.sm-page .sm-card{min-height:190px}
 body.sm-page .study-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){body.sm-page *{scroll-behavior:auto!important}}

/* Instant-loading placeholders for the Study Material landing page. */
.study-skeleton-card { pointer-events: none; min-height: 330px; }
.study-skeleton {
  border-radius: 10px;
  background: linear-gradient(90deg, #eaf1f7 25%, #f7fafc 45%, #eaf1f7 65%);
  background-size: 220% 100%;
  animation: ngs-study-shimmer 1.15s ease-in-out infinite;
}
.study-skeleton-thumb { width: 100%; height: 145px; border-radius: 14px; }
.study-skeleton-pill { width: 42%; height: 22px; margin-top: 14px; }
.study-skeleton-title { width: 78%; height: 24px; margin-top: 14px; }
.study-skeleton-line { width: 94%; height: 16px; margin-top: 12px; }
.study-skeleton-button { width: 118px; height: 42px; margin-top: auto; }
@keyframes ngs-study-shimmer { to { background-position: -220% 0; } }
body.modern-dark .study-skeleton {
  background: linear-gradient(90deg, #152338 25%, #1d3049 45%, #152338 65%);
  background-size: 220% 100%;
}
@media (prefers-reduced-motion: reduce) {
  .study-skeleton { animation: none; }
}
