:root {
  color-scheme:light;
  --navy:#102338;
  --navy-deep:#0b1a2a;
  --ink:#173146;
  --muted:#586b77;
  --paper:#f7f6f1;
  --surface:#fff;
  --cyan:#007b8d;
  --cyan-bright:#43d5e5;
  --cyan-soft:#e5f5f6;
  --line:#d6dcd9;
  --rail-line:#2b4052;
  --danger:#983735;
  --danger-soft:#fcf0ed;
  --success:#176248;
  --success-soft:#eaf4ee;
  --radius:6px;
  --rail-width:292px;
  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.25rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-10:2.5rem;
  --space-12:3rem;
  --space-16:4rem;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:6rem
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-size:16px;
  line-height:1.65
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled {
  cursor:not-allowed;
  opacity:.55
}
a {
  color:inherit
}
button {
  color:inherit
}
button,input,select,textarea {
  border-radius:var(--radius)
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,pre:focus-visible {
  outline:3px solid var(--cyan);
  outline-offset:4px
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2,h3 {
  line-height:1.2;
  letter-spacing:-.035em
}
h1 {
  font-size:clamp(2rem,4vw,3.25rem);
  font-weight:650;
  margin-bottom:var(--space-6)
}
h2 {
  font-size:1.75rem;
  font-weight:650;
  margin-bottom:var(--space-5)
}
h3 {
  font-size:1.125rem;
  letter-spacing:-.015em;
  margin-bottom:var(--space-3)
}
p {
  margin-bottom:var(--space-4)
}
[hidden] {
  display:none!important
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.skip-link {
  position:fixed;
  left:1rem;
  top:-5rem;
  z-index:50;
  padding:.75rem 1rem;
  background:var(--surface);
  border:2px solid var(--cyan)
}
.skip-link:focus {
  top:1rem
}
.app-shell {
  min-height:100vh
}
.course-rail {
  position:fixed;
  inset:0 auto 0 0;
  width:var(--rail-width);
  display:flex;
  flex-direction:column;
  background:var(--navy);
  color:#e8eff3;
  z-index:20
}
.rail-brand {
  padding:var(--space-6) var(--space-6) var(--space-5);
  display:flex;
  align-items:center;
  justify-content:space-between
}
.rail-brand a {
  text-decoration:none;
  font-size:1.65rem;
  font-weight:750;
  letter-spacing:-.06em;
  line-height:1.1
}
.rail-brand span {
  color:var(--cyan-bright)
}
.rail-brand small {
  font-size:.6rem;
  display:block;
  letter-spacing:.26em;
  color:#adc0cd;
  font-weight:500;
  margin-top:.5rem
}
.rail-close {
  display:none
}
.rail-course {
  margin:0 var(--space-6);
  padding:var(--space-6) 0;
  border-top:1px solid var(--rail-line);
  border-bottom:1px solid var(--rail-line)
}
.eyebrow {
  font-size:.69rem;
  letter-spacing:.16em;
  line-height:1.5;
  font-weight:750;
  color:var(--cyan);
  text-transform:uppercase;
  margin-bottom:var(--space-4)
}
.rail-course .eyebrow {
  color:#88b9c5;
  font-size:.59rem
}
.rail-course p {
  font-size:1.3rem;
  font-weight:550;
  letter-spacing:-.02em;
  line-height:1.3;
  margin:.75rem 0
}
.rail-description {
  font-size:.75rem;
  color:#b4c4cf
}
.rail-overview {
  margin:var(--space-4) var(--space-3) var(--space-2);
  padding:.625rem .875rem;
  text-decoration:none;
  font-size:.82rem;
  font-weight:600;
  border-radius:4px
}
.rail-overview:hover {
  background:#20394d
}
.rail-overview span {
  color:var(--cyan-bright);
  margin-right:.5rem
}
.lesson-nav {
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:0 var(--space-3) var(--space-4);
  flex:1;
  scrollbar-width:thin;
  scrollbar-color:#456174 transparent
}
.rail-loading {
  padding:var(--space-4);
  font-size:.8rem;
  color:#b4c4cf
}
.chapter {
  border-bottom:1px solid var(--rail-line)
}
.chapter summary {
  padding:1rem .75rem;
  display:grid;
  grid-template-columns:1.65rem minmax(0,1fr) .75rem;
  gap:.5rem;
  cursor:pointer;
  list-style:none;
  font-size:.79rem;
  line-height:1.4;
  font-weight:550
}
.chapter summary::-webkit-details-marker {
  display:none
}
.chapter summary::after {
  content:"+";
  color:#93aebd;
  text-align:center
}
.chapter[open] summary::after {
  content:"−"
}
.chapter-number {
  font-size:.65rem;
  color:#8ca6b7;
  line-height:1.75;
  font-variant-numeric:tabular-nums
}
.chapter-lessons {
  list-style:none;
  padding:0 0 .5rem;
  margin:0
}
.lesson-nav-button {
  display:grid;
  grid-template-columns:1.25rem minmax(0,1fr);
  gap:.5rem;
  width:100%;
  text-align:left;
  border:0;
  border-left:2px solid transparent;
  background:none;
  color:#bacbd5;
  padding:.6rem .75rem .6rem 1rem;
  font-size:.76rem;
  line-height:1.5;
  border-radius:0
}
.lesson-nav-button:hover {
  background:#1b3448;
  color:#fff
}
.lesson-nav-button[aria-current="page"] {
  background:#1a3b4d;
  color:#fff;
  border-left-color:var(--cyan-bright)
}
.lesson-nav-button[aria-current="page"] .lesson-index {
  color:var(--cyan-bright)
}
.lesson-index {
  color:#7f9bad;
  font-size:.63rem;
  line-height:1.9
}
.lesson-nav-title {
  overflow-wrap:anywhere
}
.lesson-nav-status {
  display:block;
  font-size:.59rem;
  color:#91aab9;
  margin-top:.15rem;
  letter-spacing:.03em
}
.lesson-nav-status.complete {
  color:#8ce0ca
}
.rail-progress {
  padding:var(--space-4) var(--space-6) var(--space-5);
  background:var(--navy-deep);
  border-top:1px solid var(--rail-line)
}
.rail-progress>div {
  display:flex;
  justify-content:space-between;
  gap:.5rem;
  font-size:.64rem;
  color:#b3c5d0
}
.rail-progress strong {
  font-weight:600;
  color:#e7f0f4;
  font-variant-numeric:tabular-nums
}
.rail-progress progress {
  width:100%;
  height:4px;
  display:block;
  margin:.625rem 0;
  accent-color:var(--cyan-bright);
  border:0;
  background:#304457
}
.rail-progress progress::-webkit-progress-bar {
  background:#304457
}
.rail-progress progress::-webkit-progress-value {
  background:var(--cyan-bright)
}
.rail-progress progress::-moz-progress-bar {
  background:var(--cyan-bright)
}
.rail-progress p {
  font-size:.61rem;
  line-height:1.5;
  color:#8ea9ba;
  margin:0
}
.workspace {
  margin-left:var(--rail-width);
  min-width:0
}
.topbar {
  min-height:80px;
  padding:var(--space-4) var(--space-10);
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  background:rgba(247,246,241,.97);
  position:sticky;
  top:0;
  z-index:10
}
.topbar-context,.account-actions {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  min-width:0
}
.topbar-title {
  text-decoration:none;
  font-size:.8rem;
  font-weight:650;
  white-space:nowrap
}
.pilot-label {
  font-size:.52rem;
  letter-spacing:.15em;
  color:var(--muted);
  border-left:1px solid var(--line);
  padding-left:var(--space-4);
  white-space:nowrap
}
.account-name {
  max-width:10rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.77rem;
  color:var(--muted)
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  text-decoration:none;
  min-height:44px;
  padding:.7rem 1.1rem;
  border:1px solid transparent;
  font-size:.8rem;
  line-height:1.4;
  font-weight:650;
  transition:background-color .15s,border-color .15s,transform .15s;
  white-space:normal
}
.button-primary {
  background:var(--cyan);
  color:#fff
}
.button-primary:hover:not(:disabled) {
  background:#006475
}
.button-outline {
  background:transparent;
  border-color:#a8b5b9;
  color:var(--ink)
}
.button-outline:hover:not(:disabled) {
  border-color:var(--cyan);
  background:var(--cyan-soft)
}
.button-quiet {
  padding:.5rem .25rem;
  background:none;
  color:var(--muted);
  font-size:.74rem
}
.button-quiet:hover {
  color:var(--cyan)
}
.button-small {
  min-height:38px;
  padding:.55rem .9rem;
  font-size:.73rem
}
.text-link {
  color:var(--cyan);
  text-underline-offset:.25em;
  font-size:.8rem;
  font-weight:600
}
.text-link:hover {
  text-decoration-thickness:2px
}
.text-button {
  border:0;
  background:none;
  color:var(--cyan);
  padding:.25rem 0;
  text-decoration:underline;
  text-underline-offset:.25em;
  font-size:.77rem;
  font-weight:600
}
.icon-button {
  display:none;
  background:none;
  border:1px solid var(--line);
  min-width:40px;
  min-height:40px;
  font-size:1.25rem
}
.service-notice {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  padding:1rem 2.5rem;
  background:var(--danger-soft);
  border-bottom:1px solid #e3c4be;
  font-size:.8rem;
  color:var(--danger)
}
.service-notice .text-button {
  color:var(--danger);
  flex-shrink:0
}
main {
  max-width:1240px;
  padding:0 var(--space-12);
  margin:0 auto;
  min-width:0
}
.hero {
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(250px,1fr);
  gap:var(--space-16);
  padding:var(--space-16) 0 var(--space-12)
}
.hero h1 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(2.7rem,4.7vw,4.6rem);
  line-height:1.06;
  font-weight:500;
  letter-spacing:-.055em;
  margin-bottom:var(--space-6)
}
.hero-lede {
  font-size:1.25rem;
  line-height:1.5;
  max-width:36rem;
  letter-spacing:-.02em
}
.hero-description {
  color:var(--muted);
  font-size:.88rem;
  max-width:37rem;
  line-height:1.8
}
.hero-actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:var(--space-5);
  margin-top:var(--space-8)
}
.hero-footnote {
  color:var(--muted);
  font-size:.69rem;
  margin-top:var(--space-4)
}
.hero-index {
  border-top:3px solid var(--cyan);
  padding-top:var(--space-6);
  align-self:start;
  margin-top:var(--space-1)
}
.hero-index>.eyebrow {
  margin-bottom:var(--space-6)
}
.hero-index ol {
  list-style:none;
  padding:0;
  margin:0
}
.hero-index li {
  display:flex;
  gap:var(--space-4);
  padding:0 0 var(--space-5);
  margin:0 0 var(--space-5);
  border-bottom:1px solid var(--line)
}
.hero-index li>span {
  font-size:.65rem;
  line-height:1.9;
  color:var(--cyan);
  font-variant-numeric:tabular-nums
}
.hero-index strong {
  font-size:.84rem;
  font-weight:650
}
.hero-index li p {
  font-size:.77rem;
  line-height:1.6;
  margin:.4rem 0 0;
  color:var(--muted)
}
.course-facts {
  display:flex;
  justify-content:space-between;
  gap:var(--space-4)
}
.course-facts div {
  display:flex;
  flex-direction:column
}
.course-facts strong {
  font-size:1.75rem;
  line-height:1.3;
  font-weight:500;
  letter-spacing:-.04em
}
.course-facts span {
  font-size:.61rem;
  color:var(--muted);
  margin-top:.3rem
}
.learning-summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-8);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:var(--space-8) 0;
  margin-bottom:var(--space-12)
}
.learning-summary h2 {
  font-size:1.4rem;
  margin-bottom:.75rem
}
.learning-summary .eyebrow {
  margin-bottom:.5rem
}
.learning-summary p:last-child {
  font-size:.82rem;
  color:var(--muted);
  margin:0
}
.summary-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:flex-end
}
.summary-actions .button {
  font-size:.73rem
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:var(--space-6);
  margin-bottom:var(--space-6)
}
.section-heading h2 {
  margin-bottom:0
}
.section-heading .eyebrow {
  margin-bottom:.75rem
}
.section-heading>.muted {
  font-size:.72rem
}
.curriculum-section {
  padding:var(--space-4) 0 var(--space-10)
}
.curriculum-list {
  border-top:1px solid var(--line)
}
.curriculum-row {
  display:grid;
  grid-template-columns:2.5rem minmax(0,1fr) auto;
  gap:var(--space-5);
  padding:var(--space-5) 0;
  border-bottom:1px solid var(--line);
  align-items:start
}
.curriculum-number {
  font-size:.73rem;
  color:var(--cyan);
  padding-top:.2rem;
  font-variant-numeric:tabular-nums
}
.curriculum-row h3 {
  font-size:.97rem;
  margin:0 0 .4rem;
  font-weight:650
}
.curriculum-row p {
  font-size:.79rem;
  line-height:1.7;
  color:var(--muted);
  margin:0;
  max-width:47rem
}
.curriculum-meta {
  text-align:right;
  font-size:.67rem;
  line-height:1.7;
  min-width:4.5rem;
  color:var(--muted)
}
.curriculum-meta a {
  display:block;
  color:var(--cyan);
  font-weight:650;
  margin-top:.4rem;
  text-underline-offset:.2em
}
.practice-note {
  display:flex;
  gap:var(--space-6);
  border-left:3px solid var(--cyan);
  background:#eaf0ed;
  padding:var(--space-8);
  margin:var(--space-4) 0 var(--space-12)
}
.note-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #98b9bd;
  border-radius:50%;
  width:1.5rem;
  height:1.5rem;
  flex-shrink:0;
  color:var(--cyan);
  font-size:.8rem
}
.practice-note h2 {
  font-size:1rem;
  letter-spacing:-.01em;
  margin-bottom:.75rem
}
.practice-note p {
  font-size:.79rem;
  line-height:1.8;
  color:var(--muted)
}
.practice-note p:last-child {
  margin:0
}
.muted {
  color:var(--muted)
}
.empty-state {
  padding:var(--space-6) 0;
  color:var(--muted);
  font-size:.85rem
}
.lesson-view {
  padding:var(--space-8) 0 0
}
.lesson-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:var(--space-8);
  font-size:.7rem
}
.lesson-topline .text-link {
  font-size:.73rem
}
.lesson-loading {
  padding:var(--space-10) 0;
  color:var(--muted)
}
.lesson-view>div>h1 {
  max-width:52rem;
  font-size:clamp(2rem,3.2vw,3rem)
}
.lesson-state {
  font-size:.72rem;
  margin:-.5rem 0 var(--space-8);
  color:var(--muted)
}
.lesson-state.is-complete {
  color:var(--success)
}
.reader-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 244px;
  gap:var(--space-10);
  align-items:start
}
.lesson-article {
  min-width:0
}
.lesson-body p {
  font-size:.96rem;
  line-height:1.95;
  margin-bottom:var(--space-5);
  max-width:48rem
}
.lesson-article section {
  margin-top:var(--space-10)
}
.lesson-article h2 {
  font-size:1.3rem;
  margin-bottom:var(--space-4)
}
.subsection-heading {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  margin-bottom:.75rem
}
.subsection-heading h2 {
  margin-bottom:0
}
.subsection-heading .text-button {
  font-size:.69rem;
  flex-shrink:0
}
.helper-text {
  font-size:.72rem;
  line-height:1.7;
  color:var(--muted);
  margin:.625rem 0 var(--space-4)
}
pre {
  font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
  font-size:.73rem;
  line-height:1.8;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  tab-size:2
}
.command-list pre {
  background:#edf0ec;
  border:1px solid var(--line);
  padding:var(--space-5);
  border-left:3px solid #8ea9ad;
  border-radius:var(--radius);
  margin:0 0 var(--space-3)
}
.evidence-list {
  padding-left:1.25rem;
  font-size:.86rem;
  line-height:1.9
}
.evidence-list li {
  padding-left:.4rem;
  margin-bottom:.6rem
}
.evidence-list li::marker {
  color:var(--cyan)
}
.tutor-panel {
  border-top:3px solid var(--cyan);
  padding-top:var(--space-5);
  position:sticky;
  top:112px
}
.connection-state {
  display:inline-block;
  font-size:.62rem;
  color:#745c21;
  background:#f2ead4;
  padding:.25rem .5rem;
  margin-bottom:var(--space-4);
  border:1px solid #e3d8b8;
  border-radius:3px
}
.tutor-panel h2 {
  font-size:1.2rem;
  margin-bottom:.75rem
}
.tutor-panel>p {
  font-size:.76rem;
  line-height:1.7;
  color:var(--muted)
}
.tutor-panel label {
  font-size:.7rem
}
.tutor-panel textarea {
  font-size:.71rem;
  resize:none
}
.tutor-panel .button {
  width:100%;
  font-size:.7rem
}
.authored-help {
  border-top:1px solid var(--line);
  padding-top:var(--space-6);
  margin-top:var(--space-6)
}
.authored-help h3 {
  font-size:.9rem
}
.authored-help p {
  font-size:.73rem;
  color:var(--muted);
  line-height:1.7
}
.hint-output {
  margin-top:var(--space-4);
  padding:var(--space-4);
  background:var(--cyan-soft);
  border-left:2px solid var(--cyan);
  font-size:.76rem;
  line-height:1.85;
  overflow-wrap:anywhere
}
.hint-output strong {
  display:block;
  font-size:.63rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:.5rem;
  color:var(--cyan)
}
label,legend {
  display:block;
  font-size:.76rem;
  font-weight:600;
  margin-bottom:.5rem
}
input,select,textarea {
  width:100%;
  min-width:0;
  max-width:100%;
  border:1px solid #aab6ba;
  padding:.65rem .75rem;
  min-height:44px;
  background:var(--surface);
  color:var(--ink);
  font-size:.82rem
}
textarea {
  resize:vertical;
  line-height:1.65;
  display:block
}
textarea:disabled,input:disabled,select:disabled {
  background:#eceeea;
  color:#63747c;
  cursor:not-allowed
}
input::placeholder,textarea::placeholder {
  color:#6e7c83;
  opacity:1
}
input[type="radio"] {
  width:1rem;
  min-height:1rem;
  height:1rem;
  accent-color:var(--cyan);
  flex-shrink:0;
  margin:.25rem 0
}
.form-field {
  min-width:0
}
fieldset {
  margin:0;
  padding:0;
  border:0;
  min-width:0
}
.checkpoint-section {
  padding:var(--space-6) 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.checkpoint-section .eyebrow {
  margin-bottom:.75rem
}
.checkpoint-section label {
  font-size:.88rem;
  font-weight:500;
  line-height:1.8;
  margin-bottom:var(--space-4)
}
.checkpoint-section .button {
  margin-top:.25rem
}
.inline-message {
  padding:.875rem 1rem;
  background:var(--cyan-soft);
  border-left:3px solid var(--cyan);
  font-size:.78rem;
  line-height:1.75;
  overflow-wrap:anywhere;
  margin-top:var(--space-4)
}
.inline-message p:last-child {
  margin:0
}
.inline-message.is-success {
  background:var(--success-soft);
  color:var(--success);
  border-left-color:var(--success)
}
.inline-message.is-error,.error-message {
  background:var(--danger-soft);
  color:var(--danger);
  border-left-color:var(--danger)
}
.lesson-pagination {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  padding:var(--space-8) 0 var(--space-6);
  margin-top:var(--space-6);
  border-bottom:1px solid var(--line)
}
.locked-lesson {
  padding:var(--space-12) 0;
  max-width:45rem
}
.locked-lesson h1 {
  font-size:2rem
}
.locked-lesson>p {
  color:var(--muted)
}
.locked-lesson .helper-text {
  margin-top:var(--space-6)
}
.practice-section {
  padding:var(--space-12) 0;
  border-bottom:1px solid var(--line)
}
.practice-section .section-heading {
  margin-bottom:var(--space-4)
}
.practice-description {
  color:var(--muted);
  font-size:.84rem;
  max-width:49rem;
  margin-bottom:var(--space-6)
}
.mode-label {
  display:inline-block;
  font-size:.65rem;
  border:1px solid #a8b8ba;
  padding:.375rem .625rem;
  border-radius:3px;
  white-space:nowrap
}
.mode-label.vulnerable {
  background:#f7eee0;
  color:#7a5624;
  border-color:#d7bd94
}
.mode-label.patched {
  background:var(--success-soft);
  color:var(--success);
  border-color:#a7c5b7
}
.practice-toolbar {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);
  gap:var(--space-6);
  margin-top:var(--space-6)
}
.reset-control>div {
  display:flex;
  gap:var(--space-3)
}
.reset-control select {
  flex:1
}
.reset-control .button {
  flex-shrink:0;
  font-size:.73rem
}
.request-form {
  border:1px solid var(--line);
  background:var(--surface);
  padding:var(--space-6);
  margin-top:var(--space-6)
}
.request-line {
  display:flex;
  gap:var(--space-4)
}
.method-field {
  width:110px;
  flex-shrink:0
}
.path-field {
  flex:1
}
.path-field input,#lab-token,#request-body {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:.76rem
}
.request-form>.form-field {
  margin-top:var(--space-5)
}
.request-actions {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  margin-top:var(--space-5)
}
.request-actions .helper-text {
  margin:0
}
.response-section {
  margin-top:var(--space-6)
}
.response-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:var(--space-4);
  margin-bottom:var(--space-3)
}
.response-heading h3 {
  font-size:.9rem;
  margin:0
}
.response-status {
  font-size:.64rem;
  color:var(--muted);
  font-variant-numeric:tabular-nums
}
.response-status.good {
  color:var(--success);
  font-weight:650
}
.response-status.denied {
  color:var(--danger);
  font-weight:650
}
#response-body {
  background:var(--navy);
  color:#dbe9ee;
  padding:var(--space-6);
  border-radius:var(--radius);
  min-height:170px;
  max-height:460px;
  overflow:auto;
  margin:0;
  border:1px solid var(--navy)
}
.verification-section {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:var(--space-6);
  margin-top:var(--space-8);
  padding-top:var(--space-6);
  border-top:1px solid var(--line)
}
.verification-section h3 {
  font-size:.9rem
}
.verification-section p {
  font-size:.77rem;
  color:var(--muted);
  margin-bottom:.5rem
}
.verification-section .helper-text {
  font-size:.67rem;
  max-width:31rem
}
.verification-section form {
  display:flex;
  gap:.75rem;
  max-width:28rem;
  align-items:flex-start;
  min-width:0
}
.verification-section select {
  font-size:.73rem
}
.verification-section .button {
  font-size:.72rem;
  flex-shrink:0
}
.access-section {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:var(--space-12);
  padding:var(--space-16) 0
}
.access-copy h2 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:2.5rem;
  font-weight:500;
  line-height:1.15;
  letter-spacing:-.045em;
  max-width:27rem
}
.access-copy>p:not(.eyebrow) {
  font-size:.86rem;
  color:var(--muted);
  max-width:29rem;
  line-height:1.85
}
.access-copy .helper-text {
  font-size:.73rem!important
}
.plan-selection {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-3);
  margin-bottom:var(--space-5)
}
.plan-selection legend {
  grid-column:1/-1;
  margin-bottom:.75rem
}
.plan-option {
  display:flex;
  gap:.75rem;
  border:1px solid #aebbbd;
  background:var(--surface);
  padding:1rem;
  margin:0;
  border-radius:var(--radius);
  cursor:pointer
}
.plan-option:has(input:checked) {
  border-color:var(--cyan);
  box-shadow:inset 0 0 0 1px var(--cyan);
  background:#f0f8f6
}
.plan-option strong {
  font-size:.8rem;
  font-weight:650
}
.plan-option small {
  display:block;
  font-size:.68rem;
  font-weight:400;
  color:var(--muted);
  margin-top:.25rem;
  line-height:1.5
}
.optional {
  font-weight:400;
  color:var(--muted)
}
#enrolment-submit {
  margin-top:var(--space-5)
}
.enrolment-status {
  font-size:.74rem;
  color:var(--muted);
  line-height:1.8;
  margin-top:var(--space-4)
}
.enrolment-status p {
  border-top:1px solid var(--line);
  padding-top:.75rem;
  margin-bottom:.75rem
}
.enrolment-status strong {
  color:var(--ink);
  font-weight:650
}
.admin-section {
  padding:var(--space-10) 0;
  border-top:1px solid var(--line)
}
.admin-request {
  padding:var(--space-5) 0;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--space-5)
}
.admin-request h3 {
  font-size:.95rem;
  margin-bottom:.4rem
}
.admin-request p {
  font-size:.76rem;
  color:var(--muted);
  margin-bottom:.5rem;
  overflow-wrap:anywhere
}
.admin-request .button {
  align-self:start;
  font-size:.72rem
}
.admin-request .request-note {
  color:var(--ink);
  white-space:pre-wrap
}
.request-meta {
  font-size:.65rem!important
}
.page-footer {
  border-top:1px solid var(--line);
  padding:var(--space-6) 0 var(--space-8);
  display:flex;
  justify-content:space-between;
  gap:var(--space-4);
  font-size:.61rem;
  color:var(--muted)
}
dialog {
  border:1px solid var(--line);
  border-radius:8px;
  padding:var(--space-10);
  background:var(--paper);
  color:var(--ink);
  max-width:calc(100vw - 2rem);
  max-height:calc(100dvh - 2rem);
  overflow-y:auto;
  box-shadow:0 24px 100px #0b1a2a33
}
dialog::backdrop {
  background:#0b1a2ab8;
  backdrop-filter:blur(3px)
}
.auth-dialog {
  width:460px
}
.dialog-close {
  position:absolute;
  right:1rem;
  top:.75rem;
  border:0;
  background:none;
  font-size:1.7rem;
  line-height:1;
  min-width:36px;
  min-height:36px;
  color:var(--muted)
}
.auth-dialog h2,.certificate-dialog h2 {
  font-size:1.8rem;
  margin-bottom:var(--space-3)
}
.auth-dialog>p:not(.eyebrow) {
  font-size:.81rem;
  color:var(--muted);
  line-height:1.8
}
.auth-switch {
  display:flex;
  border-bottom:1px solid var(--line);
  margin:var(--space-6) 0
}
.auth-switch button {
  flex:1;
  border:0;
  border-radius:0;
  border-bottom:2px solid transparent;
  padding:.65rem .25rem;
  background:none;
  font-size:.79rem;
  color:var(--muted)
}
.auth-switch button[aria-pressed="true"] {
  color:var(--cyan);
  border-bottom-color:var(--cyan);
  font-weight:650
}
.auth-dialog form input {
  margin-bottom:var(--space-4)
}
.auth-dialog .helper-text {
  font-size:.68rem;
  margin-top:-.25rem
}
.auth-dialog .auth-footnote {
  font-size:.66rem!important;
  margin:var(--space-5) 0 0;
  border-top:1px solid var(--line);
  padding-top:var(--space-4)
}
.full-width {
  width:100%
}
.certificate-dialog {
  width:650px
}
.certificate-dialog>.eyebrow {
  margin-top:var(--space-4)
}
.completion-name {
  font-family:Georgia,"Times New Roman",serif;
  font-size:2.5rem;
  line-height:1.25;
  letter-spacing:-.03em;
  margin:var(--space-8) 0 var(--space-4);
  overflow-wrap:anywhere
}
.completion-course {
  font-size:1rem;
  line-height:1.7
}
.completion-meta {
  border-top:1px solid var(--line);
  padding-top:var(--space-5);
  margin-top:var(--space-6);
  font-size:.72rem;
  color:var(--muted);
  overflow-wrap:anywhere
}
.completion-requirements {
  padding:var(--space-4) 0;
  line-height:1.9;
  font-size:.86rem
}
.certificate-actions {
  margin-top:var(--space-6)
}
.noscript-notice {
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:var(--danger-soft);
  border-top:2px solid var(--danger);
  padding:1rem;
  z-index:100;
  font-size:.9rem
}
.rail-backdrop {
  display:none
}
@media(min-width:1600px) {
  main {
    padding:0 var(--space-16)
  }
  .hero {
    gap:5rem
  }
  .reader-layout {
    grid-template-columns:minmax(0,1fr) 260px;
    gap:var(--space-12)
  }
}
@media(max-width:1199px) {
  :root {
    --rail-width:260px
  }
  .topbar {
    padding:var(--space-4) var(--space-6)
  }
  main {
    padding:0 var(--space-8)
  }
  .hero {
    gap:var(--space-8);
    grid-template-columns:minmax(0,1.2fr) minmax(220px,1fr)
  }
  .hero h1 {
    font-size:3.25rem
  }
  .hero-actions {
    gap:var(--space-4)
  }
  .reader-layout {
    grid-template-columns:minmax(0,1fr)
  }
  .tutor-panel {
    position:static;
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:var(--space-6);
    padding-top:var(--space-6);
    margin:var(--space-4) 0
  }
  .tutor-panel .connection-state,.tutor-panel>h2,.tutor-panel>p,.tutor-panel>label,.tutor-panel>textarea,.tutor-panel>.button {
    grid-column:1
  }
  .tutor-panel .connection-state {
    justify-self:start
  }
  .authored-help {
    grid-column:2;
    grid-row:1/8;
    padding:0 0 0 var(--space-6);
    margin:0;
    border-top:0;
    border-left:1px solid var(--line)
  }
  .practice-toolbar {
    grid-template-columns:1fr
  }
  .verification-section {
    display:block
  }
  .verification-section form {
    margin-top:var(--space-4);
    max-width:100%
  }
  .access-section {
    gap:var(--space-8)
  }
  .learning-summary {
    align-items:flex-start
  }
  .summary-actions {
    flex-direction:column;
    min-width:10rem
  }
  .account-actions {
    gap:.75rem
  }
  .account-name {
    max-width:7rem
  }
  .pilot-label {
    display:none
  }
}
@media(max-width:899px) {
  :root {
    --rail-width:280px
  }
  .course-rail {
    display:none;
    box-shadow:20px 0 60px #0b1a2a33
  }
  .course-rail.is-open {
    display:flex
  }
  .rail-close {
    display:block;
    border:1px solid #486072;
    background:none;
    color:#d7e5ed;
    min-width:36px;
    min-height:36px;
    font-size:1.5rem;
    line-height:1
  }
  .rail-backdrop:not([hidden]) {
    display:block;
    position:fixed;
    inset:0;
    background:#071521a3;
    border:0;
    border-radius:0;
    z-index:19
  }
  .workspace {
    margin-left:0
  }
  .icon-button {
    display:inline-flex;
    align-items:center;
    justify-content:center
  }
  .topbar {
    min-height:72px
  }
  .topbar-context {
    gap:.75rem
  }
  .topbar-title {
    font-size:.76rem
  }
  main {
    max-width:1000px;
    padding:0 var(--space-8)
  }
  .hero {
    padding-top:var(--space-12)
  }
  .hero h1 {
    font-size:3.5rem
  }
  .reader-layout {
    grid-template-columns:minmax(0,1fr) 220px;
    gap:var(--space-6)
  }
  .tutor-panel {
    display:block;
    padding-top:var(--space-5)
  }
  .authored-help {
    border-left:0;
    border-top:1px solid var(--line);
    padding:var(--space-6) 0 0;
    margin-top:var(--space-6)
  }
  .lesson-view>div>h1 {
    font-size:2.25rem
  }
  .access-copy h2 {
    font-size:2.2rem
  }
  .service-notice {
    padding:1rem 2rem
  }
}
@media(max-width:639px) {
  html {
    scroll-padding-top:5.5rem
  }
  .topbar {
    padding:.75rem 1rem;
    gap:.5rem
  }
  .topbar-context {
    gap:.6rem
  }
  .topbar-title {
    max-width:6.75rem;
    white-space:normal;
    line-height:1.4
  }
  .account-actions {
    gap:.6rem
  }
  .button-small {
    font-size:.66rem;
    min-height:40px;
    padding:.5rem .65rem
  }
  .button-quiet {
    font-size:.66rem
  }
  .account-name {
    display:none
  }
  main {
    padding:0 var(--space-5)
  }
  .hero {
    display:block;
    padding:var(--space-10) 0 var(--space-8)
  }
  .hero h1 {
    font-size:3.25rem
  }
  .hero-lede {
    font-size:1.1rem
  }
  .hero-description {
    font-size:.83rem
  }
  .hero-index {
    margin-top:var(--space-10)
  }
  .hero-index li {
    padding-bottom:var(--space-4);
    margin-bottom:var(--space-4)
  }
  .hero-index strong {
    font-size:.88rem
  }
  .hero-index li p {
    font-size:.79rem
  }
  .course-facts {
    justify-content:flex-start;
    gap:var(--space-12)
  }
  .learning-summary {
    display:block;
    padding:var(--space-6) 0;
    margin-bottom:var(--space-8)
  }
  .summary-actions {
    margin-top:var(--space-5);
    flex-direction:row;
    justify-content:flex-start;
    min-width:0
  }
  .section-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:.75rem
  }
  .section-heading h2 {
    font-size:1.5rem
  }
  .curriculum-row {
    grid-template-columns:1.65rem minmax(0,1fr);
    gap:.75rem
  }
  .curriculum-meta {
    grid-column:2;
    text-align:left;
    display:flex;
    gap:1rem;
    align-items:center
  }
  .curriculum-meta a {
    display:inline;
    margin:0
  }
  .curriculum-row p {
    font-size:.77rem
  }
  .practice-note {
    padding:var(--space-5);
    gap:var(--space-4);
    margin-bottom:var(--space-8)
  }
  .practice-note p {
    font-size:.75rem
  }
  .reader-layout {
    display:block
  }
  .tutor-panel {
    margin-top:var(--space-10);
    padding:var(--space-5);
    background:#edf2ee;
    border:1px solid var(--line);
    border-top:3px solid var(--cyan);
    border-radius:var(--radius)
  }
  .lesson-view {
    padding-top:var(--space-6)
  }
  .lesson-topline {
    font-size:.63rem;
    margin-bottom:var(--space-6);
    align-items:flex-start
  }
  .lesson-view>div>h1 {
    font-size:2rem
  }
  .lesson-body p {
    font-size:.91rem;
    line-height:1.9
  }
  .lesson-class {
    font-size:.63rem
  }
  .lesson-pagination {
    align-items:stretch;
    gap:.75rem;
    padding:var(--space-6) 0
  }
  .lesson-pagination .button {
    font-size:.71rem;
    padding:.65rem .75rem;
    max-width:50%
  }
  .locked-lesson {
    padding:var(--space-8) 0
  }
  .locked-lesson h1 {
    font-size:1.65rem
  }
  .practice-section {
    padding:var(--space-10) 0
  }
  .practice-toolbar {
    gap:var(--space-5)
  }
  .practice-description {
    font-size:.8rem
  }
  .reset-control>div {
    gap:.75rem
  }
  .reset-control .button {
    font-size:.68rem
  }
  .request-form {
    padding:var(--space-4)
  }
  .request-line {
    gap:.75rem
  }
  .method-field {
    width:88px
  }
  .request-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:.5rem
  }
  .response-section {
    margin-top:var(--space-5)
  }
  #response-body {
    padding:var(--space-4);
    font-size:.67rem
  }
  .verification-section form {
    flex-direction:column;
    align-items:stretch;
    gap:.75rem
  }
  .verification-section .button {
    align-self:flex-start
  }
  .access-section {
    display:block;
    padding:var(--space-10) 0
  }
  .access-copy h2 {
    font-size:2.3rem
  }
  .access-form-area {
    margin-top:var(--space-6)
  }
  .plan-option {
    padding:.875rem .75rem;
    gap:.5rem
  }
  .plan-option strong {
    font-size:.75rem
  }
  .plan-option small {
    font-size:.62rem
  }
  .page-footer {
    flex-direction:column;
    gap:.5rem;
    font-size:.61rem
  }
  .service-notice {
    padding:1rem 1.25rem;
    align-items:flex-start;
    flex-direction:column;
    gap:.25rem
  }
  .service-notice .text-button {
    padding:0
  }
  .admin-request {
    grid-template-columns:1fr
  }
  .admin-request .button {
    justify-self:start
  }
  .admin-section .section-heading {
    gap:1rem
  }
  .auth-dialog,.certificate-dialog {
    padding:var(--space-8) var(--space-6);
    max-width:calc(100vw - 1.5rem)
  }
  .auth-dialog>.eyebrow {
    font-size:.6rem
  }
  .completion-name {
    font-size:2rem
  }
  .subsection-heading {
    gap:.5rem;
    align-items:flex-start
  }
  .subsection-heading .text-button {
    font-size:.63rem
  }
  .subsection-heading h2 {
    font-size:1.18rem
  }
  .hero-actions {
    gap:var(--space-4)
  }
  .hero-actions .button {
    font-size:.75rem
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  * {
    transition:none!important
  }
}
@media print {
  body.print-certificate {
    background:#fff
  }
  body.print-certificate>.app-shell,body.print-certificate>.skip-link,body.print-certificate>#rail-backdrop,body.print-certificate>#auth-dialog,body.print-certificate>noscript {
    display:none!important
  }
  body.print-certificate #certificate-dialog {
    display:block!important;
    position:static;
    max-width:none;
    width:100%;
    max-height:none;
    border:2px solid #102338;
    box-shadow:none;
    margin:0;
    padding:1.5cm;
    background:#fff
  }
  body.print-certificate .dialog-close,body.print-certificate .certificate-actions {
    display:none!important
  }
  body.print-certificate #certificate-dialog::backdrop {
    background:none
  }
}