:root{
  --premiere:#2563eb;
  --accent:var(--premiere);
  --card:#f8fafc;
  --muted:#475569;
}
.container{padding-left:clamp(12px,3vw,24px);padding-right:clamp(12px,3vw,24px)}
.page{max-width:1200px;margin:0 auto;padding-bottom:40px}
.lesson-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
@media (max-width:1024px){.lesson-grid{grid-template-columns:1fr}}
.prose{font-size:1.06rem;line-height:1.72;color:#0f172a;position:relative;z-index:0}
.badge{background:var(--accent);color:#fff;border-radius:999px;padding:.28rem .66rem;font-weight:700}
.callout{padding:14px 16px;border-left:4px solid var(--accent);background:rgba(37,99,235,.06);border-radius:10px;margin:14px 0}
.sidebar{position:sticky; top:96px; align-self:start; z-index:10; display:grid; gap:18px; grid-auto-rows:max-content}
.card{background:var(--card);border-radius:14px;box-shadow:0 6px 24px rgba(2,8,23,.06);padding:16px;margin:0}
.card h3{margin:0 0 8px}
.small{color:#475569;font-size:.95rem}
.btn{display:inline-block;padding:.6rem 1rem;border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;font-weight:600}
.btn:hover{opacity:.92}
.nb-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:8px}
.card.nb{display:flex;flex-direction:column;gap:10px}
.card.nb .actions{display:flex;gap:12px;flex-wrap:wrap}