@import url('./home-tokens.css?v=20260719-type-scale-1');
@import url('./course-tokens.css?v=20260719-type-scale-1');

/* The course workspace owns its visual theme. The application topbar deliberately
   remains outside this scope and keeps the shared shell styling unchanged. */
.course-detail-page {
  background: var(--course-canvas);
}

.course-detail-page > main {
  min-height: calc(100vh - var(--praxis-shell-header-height, 70px));
  padding-bottom: 56px;
  color: var(--course-copy);
  font-family: var(--course-font-sans);
  background:
    radial-gradient(circle at 14% 2%, color-mix(in srgb, var(--course-highlight) 92%, transparent), transparent 30rem),
    radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--course-canvas-deep) 54%, transparent), transparent 34rem),
    linear-gradient(180deg, var(--course-canvas) 0%, var(--course-canvas-mid) 58%, var(--course-canvas-end) 100%);
}

.course-detail-page :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--course-font-editorial);
}

.course-detail-page :where(code, pre, kbd, samp) {
  font-family: var(--course-font-mono);
}

.course-detail-page .page {
  width: 100%;
  margin: 0;
}