/* LEARN HARD production shell: approved Design Lab V4 geometry.
   Real content, actions, progress and access remain in the production player. */
:root {
  color-scheme:dark;
  --navy-900:#0a1b2e;
  --navy-800:#10243e;
  --navy-750:#132c48;
  --navy-700:#183550;
  --navy-650:#203e5c;
  --navy-line:#35506d;
  --blue:#2869b8;
  --blue-bright:#8ebeff;
  --mint:#9ce0b5;
  --gold:#eecb74;
  --text:#f9fbfe;
  --muted:#c3d5e9;
}
* { box-sizing:border-box; }
html { scrollbar-gutter:stable; scroll-behavior:auto; scroll-padding-top:78px; scroll-padding-bottom:90px; }
body { margin:0; background:var(--navy-800); color:var(--text); font-family:Inter,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
button { font:inherit; }
button:focus-visible, a:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.skip-link { position:fixed; top:12px; left:12px; z-index:30; background:#fff; padding:12px 16px; color:#10243e; border-radius:8px; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.course-shell { min-height:100vh; width:100%; }
.topbar { min-height:78px; background:#0d2036; border-bottom:1px solid #2a405c; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:14px clamp(20px,2.9vw,56px); position:sticky; top:0; z-index:10; box-shadow:0 12px 35px #06182b22; }
.brand-lockup, .topbar-right { display:flex; align-items:center; gap:21px; min-width:0; }
.brand-name { font-size:25px; font-weight:850; letter-spacing:-.052em; color:#fff; white-space:nowrap; }
.brand-name span { color:#8ebeff; }
.brand-name sup { font-size:8px; vertical-align:top; letter-spacing:0; margin-left:1px; }
.brand-separator { width:1px; height:30px; background:#3a5270; }
.course-name { font-size:15px; font-weight:800; white-space:nowrap; letter-spacing:.02em; color:#fff; }
.course-name sup { font-size:8px; margin-left:2px; vertical-align:super; }
.topbar-course-name { color:#b8cbe1; font-size:12px; letter-spacing:.01em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; max-width:420px; }
.course-layout { display:grid; grid-template-columns:316px minmax(0,1fr); align-items:start; min-height:calc(100vh - 78px); }
.sidebar { min-width:0; position:sticky; top:78px; height:calc(100vh - 78px); overflow-y:auto; scrollbar-width:thin; scrollbar-color:#57738c #10243e; border-right:1px solid #34506b; background:linear-gradient(145deg,#112945 0%,#10243e 72%); padding:32px 22px 40px; }
.eyebrow,.nav-label { font-size:10px; letter-spacing:.18em; font-weight:850; color:#8ebeff; }
.sidebar-intro { padding:0 11px 26px; border-bottom:1px solid #365471; }
.sidebar-intro h2 { font-size:21px; letter-spacing:-.035em; line-height:1.26; margin:13px 0 27px; color:#fff; }
.sidebar-progress-label { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#d3e0ee; font-size:11px; font-weight:650; }
.sidebar-progress-label span:last-child { color:#a9c7e7; }
.progress-track { width:100%; height:7px; background:#29435c; border-radius:100px; overflow:hidden; margin:13px 0 9px; }
.progress-track span { display:block; height:100%; border-radius:100px; background:linear-gradient(90deg,#2869b8,#9ce0b5); }
.progress-caption { margin:0; font-size:10px; color:#8fa6bd; }
.outline-toggle { display:none; }
.outline-contents { padding:26px 0 0; }
.nav-label { padding:0 12px; margin:0 0 14px; }
.module-list,.screen-list { display:grid; gap:5px; }
.module-option { display:flex; align-items:flex-start; gap:13px; min-height:38px; padding:10px 11px; font-size:12px; color:#b2c6dc; line-height:1.55; border-radius:10px; }
.module-option-current { background:#1b3a5a; color:#fff; border:1px solid #3a668f; }
.module-number { font-size:10px; color:#85a7c8; font-weight:800; margin-top:2px; }
.module-option-current .module-number { color:#9ce0b5; }
.lesson-label { margin-top:31px; }
.screen-option { display:flex; align-items:flex-start; gap:13px; padding:10px 10px; min-height:38px; color:#afc4d9; font-size:11.5px; line-height:1.55; border-radius:9px; }
.screen-number { flex:0 0 24px; height:22px; line-height:22px; text-align:center; color:#a7bfda; font-size:10px; font-weight:800; }
.screen-option.is-done .screen-number { color:var(--mint); }
.screen-option.is-current { color:#fff; background:#244a71; border:1px solid #467aaf; box-shadow:inset 3px 0 #8ebeff; }
.screen-option.is-current .screen-number { color:#fff; }
.screen-option.is-locked { opacity:.57; }
.nav-endnote { font-size:10px; line-height:1.6; color:#7992aa; margin:29px 10px 0; }
.mainstage { min-width:0; min-height:calc(100vh - 78px); background:radial-gradient(circle at 98% 0%,rgba(40,105,184,.19),transparent 420px),linear-gradient(165deg,#182b45 0%,#0c1c30 76%); }
.stage-topline { min-height:64px; padding:8px clamp(30px,5vw,80px); border-bottom:1px solid #304b66; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.crumb { min-width:0; overflow-wrap:anywhere; color:#e0ebf6; font-size:11px; letter-spacing:.12em; font-weight:800; }
.crumb span:first-child { color:#8ebeff; }
.crumb-divider { padding:0 12px; color:#667f9d; }
.screen-counter { flex:none; white-space:nowrap; border:1px solid #436282; padding:8px 14px; border-radius:10px; font-size:12px; color:#fff; letter-spacing:.07em; font-weight:850; }
.screen-counter span { color:#9db6cf; font-weight:500; }
.screen-counter strong { color:#fff; font-weight:850; }
.lesson-body { width:min(100%,1030px); margin:0 auto; padding:47px clamp(32px,6vw,90px) 54px; }
.lesson-kicker { display:flex; gap:9px; align-items:center; color:#a6c9ee; font-size:11px; font-weight:850; letter-spacing:.18em; }
.kicker-dot { width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 4px #9ce0b51c; }
.middle-dot { color:#577a9f; margin:0 1px; }
#lessonTitle { font-size:clamp(37px,3.9vw,52px); max-width:780px; color:#fff; font-weight:850; line-height:1.13; letter-spacing:-.052em; margin:23px 0 28px; text-wrap:balance; }
.opening-copy { max-width:750px; border-bottom:1px solid #375371; padding-bottom:15px; margin-bottom:27px; }
.opening-copy p { font-size:18px; line-height:1.75; margin:0 0 15px; color:#d6e5f4; }
.opening-copy p:first-child { color:#f1f7ff; font-weight:600; }
.concept-card { margin:28px 0 33px; border:1px solid #42617e; border-radius:17px; overflow:hidden; background:#1b3754; box-shadow:0 16px 42px #061b2e36; }
.concept-row { display:grid; grid-template-columns:minmax(150px,.6fr) minmax(0,1.4fr); align-items:center; gap:17px; padding:20px 25px; }
.concept-row+.concept-row { border-top:1px solid #385672; }
.concept-name { color:#fff; font-size:15px; font-weight:800; letter-spacing:-.01em; }
.concept-row p { color:#cfe0ef; font-size:15.5px; line-height:1.6; margin:0; }
.concept-row:last-child { background:#204565; }
.concept-row:last-child .concept-name { color:#aeeac6; }
.reading-copy { max-width:800px; }
.reading-copy p { color:#d6e5f4; font-size:17px; line-height:1.82; margin:0 0 21px; }
.takeaway { margin:37px 0 25px; padding:25px 28px 29px; max-width:830px; background:#1b344f; border:1px solid #446281; border-radius:17px; box-shadow:inset 4px 0 var(--gold); }
.takeaway-head { display:flex; gap:11px; align-items:center; margin-bottom:11px; font-size:11px; font-weight:850; letter-spacing:.15em; color:var(--gold); }
.takeaway-mark { width:9px; height:9px; border:2px solid var(--gold); border-radius:3px; transform:rotate(45deg); }
.takeaway p { font-size:18px; font-weight:650; line-height:1.65; color:#fff; margin:0; }
.course-primary { cursor:pointer; border:1px solid #377ad0; background:#2869b8; min-width:170px; min-height:50px; padding:13px 25px; border-radius:11px; box-shadow:0 8px 20px #051a30a6; color:white; font-size:15px; font-weight:750; transition:background .15s, box-shadow .15s; }
.course-primary:hover { background:#3579cd; box-shadow:0 10px 20px #051a30c7; }
.stage-footer { padding:30px clamp(30px,5vw,80px); font-size:11px; color:#8ca6bf; border-top:1px solid #314b66; }
@media(max-width:1050px) and (min-width:801px) {
  .course-layout { grid-template-columns:275px minmax(0,1fr); }
  .sidebar { padding-left:14px; padding-right:14px; }
  .lesson-body { padding-left:45px; padding-right:45px; }
  .topbar-course-name { display:none; }
  .concept-row { grid-template-columns:minmax(135px,.7fr) minmax(0,1.3fr); }
}
@media(max-width:800px) {
  .topbar { min-height:66px; padding:14px 20px; }
  .brand-name { font-size:22px; }
  .brand-separator { height:25px; }
  .course-name { font-size:13px; }
  .topbar-course-name { display:none; }
  .course-layout { display:flex; flex-direction:column; min-height:0; }
  .sidebar { position:static; flex:0 0 auto; width:100%; height:auto; padding:21px 23px 17px; border-right:0; border-bottom:1px solid #385875; overflow:visible; background:#142d49; }
  .sidebar-intro { padding:0; border-bottom:0; }
  .sidebar-intro h2 { font-size:17px; margin:6px 0 15px; }
  .eyebrow { font-size:9px; }
  .sidebar-progress-label { font-size:11px; }
  .progress-track { margin:10px 0 10px; height:5px; }
  .progress-caption { display:none; }
  .outline-toggle { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; margin:12px 0 0; padding:11px 13px; border:1px solid #3d5a79; color:#d8eafc; background:#1a3755; border-radius:10px; font-size:12px; font-weight:750; cursor:pointer; }
  .menu-bars { width:16px; display:flex; flex-direction:column; gap:3px; }
  .menu-bars i { height:2px; width:16px; background:#bdd4ec; border-radius:3px; }
  .outline-contents { display:none; padding:19px 0 6px; }
  .sidebar.outline-open .outline-contents { display:block; }
  .module-list { gap:2px; }
  .module-option { font-size:12px; }
  .lesson-label { margin-top:22px; }
  .mainstage { width:100%; min-height:0; }
  .stage-topline { min-height:51px; padding:8px 23px; }
  .lesson-body { padding:38px 23px 60px; width:100%; }
  .stage-footer { padding:25px 23px; }
  #lessonTitle { font-size:clamp(31px,5.2vw,45px); max-width:670px; }
}
@media(max-width:500px) {
  .topbar { padding:12px 17px; min-height:61px; }
  .brand-lockup { gap:12px; }
  .brand-name { font-size:21px; }
  .brand-separator { height:22px; }
  .course-name { font-size:12px; }
  .sidebar { padding:17px 18px 16px; }
  .sidebar-intro h2 { margin:8px 0 14px; font-size:17px; }
  .stage-topline { min-height:49px; padding:8px 19px; }
  .crumb { font-size:10px; }
  .screen-counter { font-size:10px; padding:7px 10px; }
  .lesson-body { padding:30px 20px 50px; }
  .lesson-kicker { font-size:9px; letter-spacing:.14em; }
  #lessonTitle { font-size:36px; line-height:1.14; margin:22px 0 25px; }
  .opening-copy { margin-bottom:23px; padding-bottom:10px; }
  .opening-copy p { font-size:16px; line-height:1.72; margin-bottom:16px; }
  .concept-card { margin:24px 0 29px; border-radius:14px; }
  .concept-row { display:block; padding:17px 19px; }
  .concept-name { font-size:14px; margin-bottom:6px; }
  .concept-row p { font-size:14.5px; line-height:1.58; }
  .reading-copy p { font-size:15.8px; line-height:1.78; margin-bottom:19px; }
  .takeaway { margin:31px 0 24px; padding:22px 20px; border-radius:13px; }
  .takeaway p { font-size:16px; line-height:1.7; }
  .course-primary { width:100%; }
  .stage-footer { font-size:10px; padding:22px 20px; line-height:1.6; }
}
@media(max-width:350px) {
  .brand-separator { display:none; }
  .brand-lockup { flex-wrap:wrap; }
  #lessonTitle { font-size:31px; }
  .lesson-body { padding-left:16px; padding-right:16px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .course-primary { transition:none; } }


/* V4 — approved layout: course-wide progress stays in left rail;
   the bottom dock contains navigation actions only. */
.mainstage { display:flex; flex-direction:column; }
.lesson-body { flex:1 0 auto; }
/* Preserve the original bar's position and make percentage unobtrusive. */
.progress-caption { color:#a8c7e3; font-size:10px; }
.story-author { color:#9ce0b5 !important; font-weight:800; letter-spacing:.04em; }
.story-copy { margin-top:19px; }
.lesson-dock {
  width:100%; position:sticky; bottom:0; z-index:9;
  border-top:1px solid #41617e;
  background:rgba(11,27,47,.96);
  -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px);
  box-shadow:0 -13px 30px #06142388;
}
.dock-inner {
  width:min(100%,1030px); min-height:79px; margin:0 auto;
  padding:13px clamp(32px,6vw,90px);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.dock-actions { display:flex; flex-shrink:0; align-items:center; justify-content:flex-end; gap:10px; margin-left:auto; min-width:0; }
.dock-back, .dock-return {
  display:inline-flex; align-items:center; justify-content:center;
  white-space:nowrap; cursor:pointer; color:#d8e7f7;
  background:#173149; border:1px solid #456784;
  border-radius:11px; font-size:13px; font-weight:750;
  min-height:47px; padding:11px 17px;
  transition:background .15s;
}
.dock-back { min-width:95px; }
.dock-return { background:#152c47; }
.dock-back:hover:not(:disabled), .dock-return:hover:not(:disabled) { background:#224665; }
.dock-back:disabled, .lesson-dock .course-primary:disabled {
  opacity:.48; cursor:default; box-shadow:none;
}
.dock-return[hidden] { display:none; }
.return-short { display:none; }
.lesson-dock .course-primary {
  width:auto; min-width:146px; min-height:47px;
  flex:0 0 auto; padding:11px 20px;
}
.stage-footer { padding-top:22px; padding-bottom:24px; }
@media(max-width:800px) {
  .mainstage { min-height:calc(100vh - 66px); min-height:calc(100svh - 66px); }
  .dock-inner { min-height:72px; padding:11px 23px calc(11px + env(safe-area-inset-bottom)); }
}
@media(max-width:600px) {
  .return-full { display:none; }
  .return-short { display:inline; }
  .dock-inner { gap:8px; }
  .dock-actions { gap:7px; }
  .dock-back { min-width:76px; padding:10px 12px; }
  .dock-return { padding:10px 11px; }
  .lesson-dock .course-primary { min-width:112px; padding:10px 14px; font-size:14px; }
}
@media(max-width:500px) {
  .mainstage { min-height:calc(100vh - 61px); min-height:calc(100svh - 61px); }
  .lesson-body { padding-bottom:36px; }
  .dock-inner { min-height:75px; padding:10px 18px calc(10px + env(safe-area-inset-bottom)); }
  .dock-back { font-size:12.5px; min-width:69px; }
  .dock-return { font-size:11px; padding:10px 8px; }
  .lesson-dock .course-primary { min-width:104px; min-height:45px; font-size:13px; padding:10px 12px; }
}
@media(max-width:350px) {
  .dock-inner { padding-left:14px; padding-right:14px; gap:6px; }
  .dock-actions { gap:6px; }
  .dock-back { padding-left:9px; padding-right:9px; min-width:63px; }
  .dock-return { padding-left:7px; padding-right:7px; }
  .lesson-dock .course-primary { min-width:101px; }
}
@media(prefers-reduced-motion:reduce) {
  .dock-back, .dock-return { transition:none; }
}

/* Production adapters: native controls, course panels, and account navigation. */
[hidden], .course-layout[hidden] { display:none !important; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.course-page { width:100%; margin:0; padding:0; }
.brand-name { text-decoration:none; }
.topbar-course-name { margin:0; font-weight:500; }
.course-site-nav { position:relative; font-size:12px; }
.course-site-nav>summary { cursor:pointer; list-style:none; padding:8px 14px; border:1px solid #385676; border-radius:40px; color:#c3d5e9; }
.course-site-nav>summary::-webkit-details-marker { display:none; }
.course-site-nav nav { position:absolute; top:calc(100% + 10px); right:0; display:grid; min-width:160px; padding:8px; border:1px solid #385676; border-radius:12px; background:#10243e; box-shadow:0 12px 35px #06182b66; }
.course-site-nav nav a { padding:12px; color:#d6e5f4; text-decoration:none; border-radius:6px; }
.course-site-nav nav a:hover { background:#244a71; }
.sidebar-intro { position:relative; }
.sidebar-intro h2 { overflow-wrap:anywhere; }
.sidebar progress { display:block; width:100%; height:7px; margin:13px 0 9px; border:0; border-radius:100px; overflow:hidden; appearance:none; background:#29435c; accent-color:#9ce0b5; }
.sidebar progress::-webkit-progress-bar { background:#29435c; border-radius:100px; }
.sidebar progress::-webkit-progress-value { background:linear-gradient(90deg,#2869b8,#9ce0b5); border-radius:100px; }
.sidebar progress::-moz-progress-bar { background:linear-gradient(90deg,#2869b8,#9ce0b5); border-radius:100px; }
#courseOutline>summary { list-style:none; }
#courseOutline>summary::-webkit-details-marker { display:none; }
.module-option,.screen-option { width:100%; font-family:inherit; text-align:left; border:0; background:transparent; cursor:pointer; }
.module-option-current { border:1px solid #3a668f; background:#1b3a5a; }
.screen-option.is-current { border:1px solid #467aaf; background:#244a71; }
.module-option:disabled { cursor:default; }
.screen-option:disabled { opacity:.57; cursor:default; }
.module-option.is-complete .module-number { color:#9ce0b5; }
.module-number { flex:0 0 auto; }
#introNav button,#chapterNav button { display:block; width:100%; padding:10px; min-height:38px; text-align:left; font:inherit; font-size:11.5px; line-height:1.55; border:1px solid transparent; border-radius:9px; color:#afc4d9; background:transparent; cursor:pointer; }
#introNav button[aria-current],#chapterNav button[aria-current] { color:#fff; border-color:#467aaf; background:#244a71; }
#introNav button:disabled,#chapterNav button:disabled { opacity:.57; cursor:default; }
.chapter-list:not(:empty) { margin-top:16px; padding-top:12px; border-top:1px solid #365471; }
.mainstage { scroll-margin-top:78px; }
.mainstage:focus { outline:none; }
.course-screen-label { display:flex; align-items:center; gap:9px; color:#a6c9ee; font-size:11px; font-weight:850; letter-spacing:.18em; margin:0; }
.course-screen-label::before { content:''; flex:0 0 8px; height:8px; border-radius:50%; background:#9ce0b5; box-shadow:0 0 0 4px #9ce0b51c; }
.screen-counter { white-space:nowrap; }
.lesson-body { min-width:0; }
.course-copy p,.course-feedback p { font-size:17px; line-height:1.82; margin:0 0 21px; white-space:pre-line; overflow-wrap:anywhere; }
.course-copy>p { max-width:760px; }
:where(.course-copy,.course-feedback) p:not(.course-certificate p) { color:#d6e5f4; }
.nav-label { text-transform:uppercase; }
.course-copy strong,.course-feedback strong { font-weight:750; }
.course-copy .opening-copy p { font-size:18px; line-height:1.75; margin:0 0 15px; }
.course-copy .opening-copy p:first-child { color:#f1f7ff; font-weight:600; }
.course-copy .concept-card { padding:0; }
.course-copy .concept-row { margin:0; color:#cfe0ef; font-size:15.5px; line-height:1.6; }
.concept-explanation { min-width:0; }
.concept-name { font-size:15px; font-weight:800; line-height:normal; }
.course-copy .takeaway p { margin:0; color:#fff; font-size:18px; font-weight:650; line-height:1.65; }
.course-copy .takeaway p strong { font-weight:inherit; }
.course-takeaway-label { display:block; margin-bottom:7px; color:#eecb74; font-size:11px; letter-spacing:.15em; }
.course-cover-brand { color:#fff; font-size:28px; font-weight:800; margin:24px 0 0; letter-spacing:.015em; }
.course-brand-mark { font-size:.42em; vertical-align:super; line-height:0; margin-left:.08em; }
.course-cover-content { color:#c3d5e9; font-size:17px; line-height:1.8; }
.course-cover-content p { margin:0 0 24px; }
.course-cover-content strong { color:#fff; }
.course-cover-content .course-cover-edition,.course-cover-content .course-cover-copyright { font-size:12px; }
.course-creator-context { display:grid; gap:6px; padding:0 0 19px; margin:0 0 24px; border-bottom:1px solid #375371; font-size:12px; line-height:1.7; color:#a6c9ee; }
.course-creator-context p,.course-creator-context>strong { margin:0; color:#9ce0b5; font-size:18px; font-weight:800; }
.course-copy .course-creator-role,.course-copy .course-context-label { color:#a6c9ee; font-size:14px; }
.course-welcome-emphasis,.course-editorial-heading { font-weight:750; color:#fff; }
.course-editorial-card,.course-perspective,.course-principle,.course-recap-carry,.course-assessment-rules { margin:28px 0; padding:24px 26px; border:1px solid #42617e; border-radius:17px; background:#1b3754; box-shadow:0 16px 42px #061b2e36; }
.course-editorial-card p:last-child,.course-perspective p:last-child,.course-recap-carry p:last-child { margin-bottom:0; }
.course-perspective,.course-recap-carry { border-left:4px solid #eecb74; }
.course-copy .course-quote-attribution { color:#eecb74; font-size:13px; margin-top:12px; }
.course-principle>span { display:block; }
.course-inline-perspective { box-shadow:none; }
.course-section-label { font-size:11px; color:#a6c9ee; text-transform:uppercase; letter-spacing:.15em; margin:0 0 16px; }
.course-editorial-card h3,.course-moment h3,.course-feedback h3,.course-post-copy h3 { color:#fff; line-height:1.5; }
.course-workflow { display:grid; grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr); align-items:center; gap:0; margin:28px 0; }
.course-workflow-step { min-width:0; margin:0; padding:18px; border:1px solid #42617e; border-radius:13px; background:#1b3754; color:#d6e5f4; line-height:1.6; }
.course-workflow-step.is-current { background:#204565; }
.course-workflow-arrow { text-align:center; color:#a6c9ee; }
.course-workflow-reading.is-long-flow,.course-workflow-reading:has(>p:nth-of-type(4)) { grid-template-columns:minmax(0,1fr); }
.course-workflow-reading.is-long-flow .course-workflow-arrow,.course-workflow-reading:has(>p:nth-of-type(4)) .course-workflow-arrow { transform:rotate(90deg); }
.course-copy .course-workflow-step { margin:0; font-size:15.5px; }
.course-communication-loop { position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:100px 100px; gap:70px 12px; margin:28px 0; }
.course-loop-step { position:relative; font-size:14px !important; }
.course-loop-step::before { content:attr(data-step); display:block; color:#9ce0b5; font-size:11px; }
.course-loop-step[data-step="1"] { grid-area:1 / 2; }
.course-loop-step[data-step="2"] { grid-area:2 / 3; }
.course-loop-step[data-step="3"] { grid-area:2 / 1; }
.course-loop-desktop { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.course-loop-return,.course-loop-down { display:none; }
.course-outcome-flows { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:24px 0; }
.course-outcome-flow { padding:22px; border:1px solid #42617e; border-radius:17px; background:#1b3754; }
.course-outcome-flow p { margin:0; text-align:center; font-size:15px; }
.course-flow-heading { padding-bottom:14px; margin-bottom:16px !important; border-bottom:1px solid #42617e; }
.course-flow-down { display:block; text-align:center; color:#a6c9ee; padding:10px 0; }
.course-client-questions p,.course-message-points p { margin:0; }
.course-message-points { padding-left:22px; line-height:1.8; }
.course-data-table { width:100%; table-layout:fixed; border-collapse:collapse; margin:28px 0; font-size:15px; line-height:1.6; }
.course-data-table :is(th,td) { padding:14px; border:1px solid #42617e; text-align:left; overflow-wrap:anywhere; }
.course-data-table th { background:#204565; color:#fff; }
.course-roadmap { list-style:none; padding:0; margin:28px 0; display:grid; gap:12px; }
.course-roadmap button { display:flex; align-items:baseline; gap:20px; width:100%; padding:20px 24px; text-align:left; border:1px solid #42617e; border-radius:13px; background:#1b3754; color:#fff; cursor:pointer; font:inherit; line-height:1.6; }
.course-roadmap button:disabled { opacity:.57; cursor:default; }
.course-roadmap button span { color:#9ce0b5; font-weight:800; }
.course-overview,.course-recap-points { padding-left:22px; line-height:1.8; }
.course-overview li,.course-recap-points li { padding-left:5px; margin-bottom:17px; }
.course-complete { padding:24px; margin-top:28px; border:1px solid #42617e; border-top:4px solid #9ce0b5; border-radius:17px; background:#204565; }
.course-complete p:first-child { color:#9ce0b5; font-weight:800; }
.course-complete p:first-child::before { content:'✓ '; }
.course-choices { display:grid; gap:12px; padding:0; margin:26px 0 0; border:0; min-width:0; }
.course-choice { display:flex; align-items:flex-start; gap:12px; padding:18px 20px; border:1px solid #456784; border-radius:13px; background:#173149; font-size:16px; line-height:1.65; cursor:pointer; }
.course-choice:has(input:checked) { background:#244a71; border-color:#8ebeff; box-shadow:inset 3px 0 #8ebeff; }
.course-choice input,.course-check input { flex:0 0 auto; width:18px; height:18px; margin-top:5px; accent-color:#8ebeff; }
.course-choice:focus-within { outline:3px solid #eecb74; outline-offset:3px; }
.course-feedback { padding:24px 26px; margin-top:26px; border:1px solid #eecb74; border-radius:17px; background:#302e28; }
.course-feedback.is-supported { border-color:#9ce0b5; background:#193b3e; }
.course-feedback p:last-child { margin-bottom:0; }
.course-answer-review,.course-case-history { margin-top:24px; padding:20px 24px; border:1px solid #42617e; border-radius:13px; background:#1b3754; line-height:1.7; }
.course-answer-review summary,.course-case-history summary { color:#a6c9ee; font-weight:750; cursor:pointer; }
.course-answer-review>div { border-top:1px solid #42617e; padding-top:16px; margin-top:16px; }
.course-writing { display:grid; gap:10px; margin-top:24px; }
.course-writing label { font-weight:700; line-height:1.6; }
.course-writing textarea,.course-writing input,.course-completion-copy { width:100%; min-width:0; padding:14px; border:1px solid #456784; border-radius:11px; background:#10243e; color:#f1f7ff; font:inherit; line-height:1.65; }
.course-writing textarea { min-height:150px; resize:vertical; }
.course-writing textarea::placeholder { color:#a8c7e3; }
.course-completion-copy { min-height:220px; }
.course-lesson .course-response-note { font-style:italic; line-height:1.75; color:#a6c9ee; margin:24px 0 18px 18px; }
.course-check { display:flex; align-items:flex-start; gap:10px; padding:10px 0; line-height:1.6; }
.course-input-message { color:#eecb74; font-weight:700; line-height:1.6; }
.course-input-message:empty { display:none; }
.course-assessment-attempt { color:#a6c9ee; font-size:13px; margin:18px 0; }
.course-post-copy .course-assessment-score { font-size:40px; font-weight:800; }
.course-congratulations dl { display:grid; gap:8px; margin:28px 0; }
.course-congratulations dt { font-weight:750; }
.course-congratulations dd { margin:0 0 14px; }
.course-completion-motto { padding-top:24px; margin-top:32px !important; border-top:3px solid #9ce0b5; font-size:24px !important; font-weight:800; }
.course-revision,.course-secondary-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.course-revision button,.course-secondary-actions button,.course-case-history button { padding:12px 18px; min-height:44px; border:1px solid #456784; border-radius:11px; background:#173149; color:#d8e7f7; cursor:pointer; }
.dock-return-slot { min-width:0; }
.lesson-dock .dock-inner { min-height:79px; }
.lesson-dock .course-primary { width:146px; padding:6px 10px; font-size:15px; line-height:normal; }
.lesson-dock .course-primary[data-compact="true"] { font-size:13px; line-height:1.23; }
.dock-back,.dock-return { line-height:1.23; white-space:normal; overflow-wrap:anywhere; }
.dock-return { max-width:100%; }
.dock-return span { min-width:0; }
.lesson-dock .course-primary { overflow-wrap:anywhere; }
.action-short { display:none; }
.stage-footer { line-height:1.7; }
.stage-footer>span { font-size:10px; }
.stage-footer a,.lesson-body a { color:#8ebeff; }
input:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #eecb74; outline-offset:4px; }
#courseGate { margin:32px auto; padding:28px; max-width:720px; border:1px solid #42617e; border-radius:17px; background:#1b3754; line-height:1.7; }
#courseGate a { color:#8ebeff; }
#courseGate button { padding:12px 18px; margin-left:12px; border:1px solid #456784; border-radius:11px; background:#2869b8; color:#fff; cursor:pointer; }
.course-admin-preview { margin:0; padding:16px 24px; border:2px solid #eecb74; background:#10243e; color:#fff; }
.course-admin-preview label { display:block; }
.course-admin-preview select { display:block; width:100%; padding:10px; margin:12px 0; }
.course-admin-preview a { color:#8ebeff; }
.course-account-controls { margin:16px; padding:16px; border:1px solid #42617e; border-radius:13px; background:#1b3754; }
.course-account-controls button { margin:8px; padding:10px; }
/* The certificate is an independent, unchanged light document inside the shell. */
.course-certificate-preview { max-width:600px; margin-inline:auto; }
.course-post-copy .course-certificate h3 { color:#102638; }
.course-certificate { color-scheme:light; }
@media(max-width:1050px) { .course-outcome-flows { grid-template-columns:minmax(0,1fr); } }
@media(max-width:800px) {
 html { scroll-padding-top:66px; }
 .mainstage { scroll-margin-top:66px; }
 .sidebar-intro { border-bottom:0; }
 .sidebar progress { height:5px; margin:10px 0; }
 #progressLabel { display:block; position:absolute; top:0; right:0; margin:0; font-size:10px; }
 #courseOutline[open]>.outline-contents { display:block; }
 .lesson-dock .dock-inner { min-height:calc(72px + env(safe-area-inset-bottom)); }
 .course-workflow,.course-workflow-reading { grid-template-columns:minmax(0,1fr); }
 .course-workflow-arrow { height:26px; transform:rotate(90deg); }
 .course-communication-loop { display:flex; flex-direction:column; gap:0; padding-left:36px; }
 .course-loop-desktop { display:none; }
 .course-loop-down { display:block; text-align:center; color:#a6c9ee; height:30px; }
 .course-loop-return { display:block; position:absolute; top:0; left:0; width:36px; height:100%; }
}
@media(max-width:600px) {
 .action-full { display:none; }
 .action-short { display:inline; }
 .lesson-dock .course-primary { width:112px; font-size:13px; }
 .dock-back { max-width:100px; }
}
@media(max-width:500px) {
 html { scroll-padding-top:61px; }
 .mainstage { scroll-margin-top:61px; }
 .brand-lockup { gap:12px; }
 .topbar-right { gap:0; }
 .course-site-nav>summary { padding:7px 9px; font-size:10px; }
 .course-copy p,.course-feedback p { font-size:15.8px; line-height:1.78; margin-bottom:19px; }
 .course-copy .opening-copy p { font-size:16px; line-height:1.72; margin-bottom:16px; }
 .course-screen-label { font-size:9px; letter-spacing:.14em; }
 .course-copy .concept-row { font-size:14.5px; line-height:1.58; }
 .concept-name { display:block; font-size:14px; }
 .course-copy .takeaway p { font-size:16px; line-height:1.7; }
 .course-choice { font-size:15px; padding:15px; }
 .course-feedback,.course-editorial-card,.course-assessment-rules { padding:20px; }
 .course-data-table :is(th,td) { padding:8px; font-size:13px; }
 .lesson-dock .dock-inner { min-height:calc(75px + env(safe-area-inset-bottom)); }
 .lesson-dock .course-primary { width:104px; min-height:47px; }
 .course-roadmap button { padding:17px; gap:14px; }
 .course-cover-brand { font-size:24px; }
}
@page learn-hard-certificate { size:11in 8.5in; margin:0; }
@media print {
 .topbar,.course-rail,.course-admin-preview,.course-account-controls,.stage-topline,.stage-footer,.lesson-dock,.skip-link { display:none !important; }
 body.course-certificate-view { background:white; margin:0; }
 body.course-certificate-view .course-page { page:learn-hard-certificate; }
 body.course-certificate-view :is(.course-page,.course-layout,#lesson,.lesson-body) { display:block !important; width:100%; max-width:none; min-height:0; margin:0; padding:0; border:0; box-shadow:none; background:white; }
 body.course-certificate-view .lesson-body>:not(.course-post-copy) { display:none !important; }
 body.course-certificate-view .course-certificate-preview { max-width:none; width:11in; height:8.5in !important; }
 body.course-certificate-view .course-certificate { break-inside:avoid; transform:scale(.96) !important; }
}
/* Chronological outline: expansion is confined to the navigation rail. */
.outline-section h3 { margin:0; font-size:inherit; }
.outline-section + .outline-section { margin-top:5px; }
.outline-section .module-option { display:flex; align-items:flex-start; gap:10px; }
.accordion-title { flex:1; min-width:0; overflow-wrap:anywhere; }
.accordion-indicator { flex:none; width:12px; color:#a9c7e7; text-align:center; }
.accordion-complete { color:#9ce0b5; }
.outline-lessons { padding:7px 0 12px 10px; margin-left:10px; border-left:1px solid #365471; }
.outline-lessons[hidden] { display:none; }
.outline-lessons .screen-option { margin:2px 0; }
.outline-lessons .screen-option > span:last-child { min-width:0; overflow-wrap:anywhere; }
.outline-lessons .screen-number { flex:0 0 12px; }
#lesson[data-screen="CREATOR-01"] #lessonTitle { margin-bottom:10px; }
#lesson[data-screen="CREATOR-01"] .creator-credentials { display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.3em; margin:0 0 28px; font-size:clamp(17px,2vw,23px); line-height:1.5; font-weight:600; letter-spacing:.04em; color:#9ce0b5; }
#lesson[data-screen="CREATOR-01"] .creator-credentials > span { white-space:nowrap; }
#lesson[data-screen="CREATOR-01"] .creator-credentials sup { font-size:.55em; line-height:0; vertical-align:super; }
@media (min-width:801px) {
 .sidebar { display:flex; flex-direction:column; overflow:hidden; }
 .sidebar-intro { flex:none; }
 #courseOutline { min-height:0; overflow-y:auto; scrollbar-width:thin; overscroll-behavior:contain; }
}
@media (max-width:760px) {
 #courseOutline[open] > .outline-contents { height:46vh; min-height:180px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
}