/* Shared workspace components. App navigation and reading views use the same tokens. */
.app-topbar { position: relative; z-index: 50; }
.app-topbar > .container-fluid { gap: 1rem; flex-wrap: nowrap; }
.app-topbar .navbar-brand { margin: 0; flex: 0 0 auto; max-width: 16rem; }
.app-topbar .app-topbrand { white-space: normal; font-size: 1rem; }
.workspace-menu { min-width: 0; }
.workspace-menu__items { gap: .25rem; }
.workspace-menu .nav-link { min-height: 2.75rem; padding: .65rem .85rem; border: 0; background: transparent; color: #e0ede6; border-radius: var(--radius-sm); white-space: nowrap; font-size: .875rem; }
.workspace-menu .nav-link:hover, .workspace-menu .nav-link[aria-current], .workspace-menu .nav-item:has(.dropdown-item[aria-current]) > .nav-link { background: #ffffff18; color: #fff; }
.workspace-menu .dropdown-menu { min-width: 17rem; max-width: min(25rem, calc(100vw - 2rem)); padding: .5rem; }
.workspace-menu .dropdown-item { min-height: 2.75rem; border-radius: var(--radius-sm); white-space: normal; }
.workspace-menu .dropdown-item[aria-current] { background: #e7f5ed; color: var(--color-primary); font-weight: 600; }
.workspace-account { margin-left: auto; flex: 0 0 auto; }
.workspace-account .nav-link { min-height: 2.75rem; }
.workspace-account .dropdown-menu { min-width: 14rem; }
.workspace-menu__toggle { min-width: 2.75rem; min-height: 2.75rem; padding: .5rem; color: #fff; }
.app-body .app-content { max-width: none; }
.app-body .bg-green-lt { color: #0d683b !important; }
.app-body .bg-orange-lt { color: #914100 !important; }
.learning-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1.25rem; }
.learning-card { --learning-color: #176080; box-shadow: 0 4px 18px -12px #173c5833; border-color: #dce5ed; border-radius: 1rem; }
.learning-card--program { --learning-color: #146446; }
.learning-card__cover { height: 8.5rem; border: 0; background: linear-gradient(115deg, var(--learning-color), color-mix(in srgb, var(--learning-color) 78%, #080f26)); }
.learning-card__cover::before { content: ''; position: absolute; inset: -65% -25% auto auto; width: 17rem; height: 17rem; border: 1px solid #ffffff22; border-radius: 50%; box-shadow: 0 0 0 2.1rem #ffffff09, 0 0 0 4.2rem #ffffff06; pointer-events: none; }
.learning-card__cover:has(img)::before { display: none; }
.learning-card__symbol { inset: 1.5rem 1.5rem auto auto; width: 3.75rem; height: 3.75rem; transform: none; background: #ffffff12; border: 1px solid #ffffff40; border-radius: .9rem; color: #fff; }
.learning-card__symbol svg { width: 2rem; height: 2rem; transform: none; stroke-width: 1.5; }
.learning-card__kind { bottom: 1.1rem; left: 1.25rem; color: var(--learning-color); font-size: .75rem; padding: .35rem .65rem; border-radius: 2rem; }
.learning-card__body { padding: 1.25rem; }
.learning-card__category { font-weight: 600; font-size: .75rem; margin-bottom: .6rem; }
.learning-card__title { font-size: 1.125rem; line-height: 1.4; letter-spacing: -.015em; }
.learning-card__description { font-size: .875rem; line-height: 1.65; }
.learning-card__meta { margin-top: 1rem; font-size: .8125rem; }
.learning-card__footer { padding: 1rem 1.25rem; border-top-color: #e7edf2; background: #fbfcfe; }
.learning-card__footer .btn { min-height: 2.75rem; border-radius: .5rem; padding-inline: 1rem; }
.material-stat { color: #24486b; background: #edf4fc; border: 1px solid #d2e2f2; font-size: .8125rem; line-height: 1.25; font-weight: 600; white-space: normal; text-align: left; }
.material-stat--exam { color: #633185; background: #f5eefb; border-color: #e1d2ed; }
a.material-stat { text-decoration: underline; text-underline-offset: .2em; }
.learning-card__audit { margin: .55rem 0 0; color: #52677d; font-size: .8125rem; line-height: 1.35; }
.material-markdown-preview { padding: 1rem; border: 1px solid #dbe5ee; border-radius: .65rem; background: #fbfcfe; }
.material-markdown-preview > :last-child { margin-bottom: 0; }
.material-markdown-editor > summary, .material-full-markdown > summary { cursor: pointer; list-style: none; }
.material-markdown-editor > summary::-webkit-details-marker, .material-full-markdown > summary::-webkit-details-marker { display: none; }
.material-full-markdown > summary { display: flex; align-items: center; }
:is(#material-content, #material-exam, #preview-questions, #edit-sections, #edit-questions, #edit-exam) { scroll-margin-top: 1rem; }
.learning-card__progress .workspace-progress { height: .4rem; }
.workspace-page { padding-bottom: 0; }
@media (max-width: 790px) {
  .workspace-page:has(.workspace-mobile) > .page { padding-bottom: calc(var(--workspace-nav-height) + env(safe-area-inset-bottom) + 1rem); }
}
.workspace-skip { position: fixed; width: auto; margin: 0; }
.workspace-skip:not(:focus) { clip-path: inset(100%); pointer-events: none; }
.branding-workspace { display: grid; grid-template-columns: minmax(0, 3fr) minmax(18rem, 2fr); gap: var(--space-md); align-items: start; }
.branding-workspace > * { min-width: 0; }
.branding-workspace__preview { position: sticky; top: var(--space-sm); }
.branding-dns { border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: var(--space-sm); background: #f1f8ff; }
.branding-dns code { white-space: normal; overflow-wrap: anywhere; word-break: normal; }
.branding-dns .table { min-width: 30rem; table-layout: fixed; }
.branding-dns .table th:first-child { width: 5rem; }
.branding-workspace .input-group { flex-wrap: wrap; min-width: 0; }
.branding-workspace .input-group > .form-control { min-width: 6rem; }
.branding-workspace .input-group-text { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.document-workspace { background: var(--workspace-bg); }
.document-workspace .app-document { min-height: 0; }
.document-workspace .page-header { margin-block: 2rem 1.5rem; }
.document-workspace__grid { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; align-items: start; gap: 2rem; padding-bottom: 3rem; }
.document-workspace__article { grid-column: 1; grid-row: 1; min-width: 0; }
.document-workspace__article .card { border-top: 3px solid var(--color-primary); }
.document-workspace__article .card-body { padding: clamp(1.25rem, 3vw, 3rem); }
.document-workspace__article .markdown { font-size: 1rem; line-height: 1.75; color: var(--color-text); }
.document-workspace__article .markdown h2 { scroll-margin-top: 1.5rem; border-bottom: 1px solid var(--color-border); padding-bottom: .75rem; margin-top: 2.5rem; }
.document-workspace__article .markdown h3 { scroll-margin-top: 1.5rem; }
.document-workspace__outline { grid-column: 2; grid-row: 1; position: sticky; top: 1rem; min-width: 0; }
.document-workspace__toc { position: static; max-height: none; }
.document-workspace__toc .app-document-toc-list { max-height: calc(100dvh - 8rem); overflow-y: auto; overscroll-behavior: contain; }
.document-workspace__toc .list-group-item { border: 0; border-left: 3px solid transparent; padding: .5rem .8rem; color: var(--workspace-muted); font-size: .875rem; }
.document-workspace__toc .list-group-item[aria-current] { border-left-color: var(--color-primary); background: #edf8f1; color: var(--color-primary); font-weight: 700; }
.document-workspace__toc .list-group-item:hover { background: #f1f5f9; }
.document-workspace__grid:not(:has(.document-workspace__outline)) { grid-template-columns: minmax(0, 1fr); }
.landing-comparison__cell { display: flex; align-items: flex-start; gap: .75rem; }
.landing-comparison__cell > .app-icon { width: 1.5rem; height: 1.5rem; flex: 0 0 1.5rem; margin-top: .1em; }
.lp-table td::before, .lp-table td:last-child::before { content: none; display: none; }
.lp-body { --landing-min-font: 14px; font-size: 16px; }
.lp-body :is(.lp-kicker, .lp-badge, .pr-badge, .pr-name, .pr-per, .lp-f-copy, .lp-f-links a, .lp-f-link, .lp-consent .form-check-label, .form-hint, .lp-motto, .lp-legal-body code) { font-size: var(--landing-min-font); }
.lp-body :is(.lp-card .card-body p, .lp-table td, .lp-table thead th, .pr-list li, .lp-ke-item > span:last-child, .lp-ke-extra, .lp-ke-safe, .lp-contact, .lp-legal-body, .form-label, .dropdown-item, .btn) { font-size: 1rem; }
.lp-body .form-control { font-size: 1rem; }
.lp-body .lp-table { table-layout: fixed; }
.lp-body .lp-table td { line-height: 1.6; }
.lp-body .lp-table td:last-child { font-size: 1rem; }
.lp-body .lp-table th { white-space: normal; }
.lp-body .lp-waves { overflow: hidden; pointer-events: none; }
/* A wide intrinsic canvas preserves shallow waves on phones instead of compressing four peaks. */
@media (max-width: 900px) {
  .lp-body .lp-hero .lp-waves { position: absolute; inset: auto 0 0; height: 45%; min-height: 16rem; margin: 0; z-index: 0; }
  .lp-body .lp-waves .lp-w { min-width: 1440px; width: 400%; height: 100%; }
  .lp-body .lp-hero > .container-xl { position: relative; z-index: 1; }
  .lp-body .lp-waves-top { height: 11rem; }
  .branding-workspace { grid-template-columns: minmax(0, 1fr); }
  .branding-workspace__preview { position: static; }
}
@media (max-width: 1199.98px) {
  .app-topbar > .container-fluid { flex-wrap: wrap; gap: .5rem; }
  .workspace-menu__toggle { order: -1; }
  .workspace-menu { flex-basis: 100%; order: 5; }
  .workspace-menu .dropdown-menu { max-width: none; margin: .2rem 0 .75rem; }
  .workspace-menu .nav-link { width: 100%; text-align: left; }
  .workspace-menu__items { padding-block: .5rem; }
}
@media (max-width: 767.98px) {
  .lp-body .lp-pills { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; width: 100%; }
  .lp-body .lp-pill { min-width: 0; padding: 1rem .65rem; overflow-wrap: anywhere; }
  .lp-body .lp-pill b { font-size: 1rem; }
  .lp-body .lp-pill > span:not(.lp-ic) { font-size: 14px; line-height: 1.6; }
  .document-workspace__grid { display: flex; flex-direction: column; gap: 1rem; }
  .document-workspace__outline, .document-workspace__article { width: 100%; }
  .document-workspace__outline { position: static; order: -1; }
  .document-workspace__toc details { max-height: none; }
  .company-workspace__metrics { gap: .75rem; }
  .company-workspace__metrics dt { font-size: .75rem; }
  .company-workspace__tabs a { padding-inline: .65rem; }
  .lp-body .lp-table td { padding: 1rem .7rem; font-size: 14px; }
  .lp-body .lp-table td:last-child, .lp-body .lp-table th { font-size: 14px; }
  .landing-comparison__cell { gap: .4rem; }
  .landing-comparison__cell > .app-icon { flex-basis: 1.2rem; width: 1.2rem; height: 1.2rem; }
}
@media print {
  .document-workspace__grid { display: block; }
  .document-workspace__article .card { box-shadow: none; border: 0; }
  .document-workspace__article .card-body { padding: 0; }
}
/* The admin preview uses the same sanitized lesson media as learning pages. */
.material-preview-content { overflow-wrap: anywhere; }
.material-preview-content img,
.material-preview-content video { display: block; max-width: 100%; height: auto; border-radius: .75rem; }
.material-preview-content audio { width: 100%; max-width: 36rem; }
.material-preview-content table { max-width: 100%; }
.workflow-revision-card > .card-header { flex-wrap: wrap; gap: 1rem; }
.workflow-revision-card > .card-header > div:first-child { flex: 1 1 18rem; min-width: 0; }
.workflow-revision-card .card-actions { flex-wrap: wrap; margin-left: 0; }
.workflow-handoff-steps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; overflow: visible; }
.workflow-handoff-step { min-width: 0; }
@media (max-width: 767px) {
  .workflow-handoff-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .workflow-handoff-step::after { display: none; }
  .workflow-page-header .row { flex-direction: column; align-items: stretch !important; }
  .workflow-page-header .row > .col,
  .workflow-page-header .row > .col-auto { width: 100%; margin-left: 0 !important; }
}
@media (max-width: 575px) {
  .workflow-handoff-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}