/* The generated mark and accessible, crisp wordmark share one brand lockup. */
.brand .brandmark{background:transparent;box-shadow:none;flex-shrink:0;border-radius:0;overflow:visible}
.brand .brand-logo{display:block;width:100%;height:100%;object-fit:contain}
.brand-wordmark{min-width:0;font-weight:750;letter-spacing:-.045em;line-height:1.25;overflow-wrap:anywhere}
.rail .brand{font-size:1.23rem;gap:10px;margin-inline:0}
.rail .brand-wordmark>span{color:var(--mint,#3ddc97)}
.page-header .brand{font-size:1.5rem}
@media(max-width:780px){.rail .brand{font-size:1.18rem;gap:9px}}
@media(max-width:740px){.page-header .brand{font-size:1.35rem}}

/* Learner level and consistent navigation components. */
.rail-level {
  box-sizing: border-box;
  min-width: 0;
  padding: 10px;
  border: 1px solid #38506f;
  border-radius: 12px;
  background: #1e3050;
  color: #f7fbff;
  font-family: 'DM Sans', sans-serif;
}
.rail-level .rail-level-heading {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 2px 8px;
  min-width: 0;
  margin: 0 0 6px;
}
.rail-level .rail-level-badge {
  display: grid;
  place-items: center;
  box-sizing: border-box;
  grid-row: 1 / span 2;
  width: 30px;
  min-width: 30px;
  max-width: 100%;
  min-height: 32px;
  padding: 3px;
  background: #3ddc97;
  color: #13203a;
  clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
  font: 750 18px/1.2 'Sora', sans-serif;
  overflow-wrap: anywhere;
  text-align: center;
  box-shadow: inset 0 -3px 0 #28b880;
}
.rail-level .rail-level-title {
  grid-column: 2;
  min-width: 0;
  font: 700 .875rem/1.3 'Sora', sans-serif;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}
.rail-level .rail-level-xp {
  grid-column: 2;
  margin: 0;
  color: #c6d5ed;
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.rail-level .rail-level-xp-current { color: #f7fbff; }
.rail-level .rail-level-progress {
  box-sizing: border-box;
  width: 100%;
  height: 6px;
  overflow: hidden;
  border-radius: 3px;
  background: #101d35;
}
.rail-level .rail-level-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #3ddc97;
  transition: width 200ms ease-out;
}
.rail-level .rail-level-next {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 6px 0 0;
  color: #c6d5ed;
  font-size: .8125rem;
  font-weight: 400;
  line-height: 1.4;
}
.rail-level .rail-level-next > span { min-width: 0; overflow-wrap: anywhere; }
.rail-level .rail-level-next > svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  margin-top: 2px;
  color: #3ddc97;
}
.primary-nav .nav-icon {
  display: inline-grid;
  place-items: center;
  flex-shrink: 0;
  color: inherit;
}
.primary-nav .nav-icon > svg {
  display: block;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}
@media (prefers-reduced-motion: reduce) {
  .rail-level .rail-level-fill { transition: none; }
}


@media(min-width:781px){.rail .primary-nav{gap:7px!important;margin-top:24px}.rail nav.primary-nav a{gap:12px!important;padding-inline:12px!important}.rail nav.primary-nav a .nav-label{font-size:.875rem!important}.rail nav.primary-nav a>.nav-icon{background:transparent}.rail nav.primary-nav a.active>.nav-icon{background:transparent}.rail>.course{padding:14px 12px;border-radius:14px}}
@media(max-width:780px){.rail nav.primary-nav .nav-icon>svg{width:23px;height:23px}}
.rail nav.primary-nav a .nav-label{width:auto!important;height:auto!important;min-width:0;flex-shrink:1;overflow-wrap:anywhere}
@media(max-width:540px){.practice-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:stretch}.practice-nav a{min-width:0;white-space:normal;overflow-wrap:anywhere;justify-content:center;text-align:center;font-size:.875rem;line-height:1.45;padding:10px 3px;flex-wrap:wrap}}
html[data-theme="dark"] #content .warmup-feature{background:#17382f;border-color:#326152;box-shadow:0 3px 0 #123025}
html[data-theme="dark"] #content .warmup-feature .eyebrow{color:#8ce9bd}
html[data-theme="dark"] #content :is(.secondary-practice,.target-card,.flashcard-banner){background:var(--surface);border-color:var(--line);color:var(--ink);box-shadow:none}
html[data-theme="dark"] #content :is(.secondary-practice p,.secondary-practice .eyebrow,.flashcard-banner p){color:var(--muted)}
html[data-theme="dark"] #content .flashcard-banner .eyebrow{color:var(--green)}
html[data-theme="dark"] #content .secondary-practice .mix-distribution>span{background:var(--surface-soft);border-color:var(--line);color:var(--muted)}
html[data-theme="dark"] #content .secondary-practice .mix-distribution strong{background:var(--line);color:var(--ink)}
html[data-theme="dark"] #content .secondary-practice .button{background:var(--surface-soft);border-color:#64758c;color:var(--ink);box-shadow:0 3px 0 #101827}
html[data-theme="dark"] #content .secondary-practice .button:hover{background:#2c3d59}
/* StudyKernel refinement. Load after existing component styles. */
:is(.path-workspace,.path-course-overview,.today-stack,.hub-heading,.practice-workspace,.study-course,.library-roadmap-listings){--cc-space:1.5rem;--cc-section:2rem;--cc-ink:var(--ink,#18243b);--cc-muted:var(--muted,#536581);--cc-surface:var(--surface,#fff);--cc-line:var(--line,#e3e7f1);min-width:0}
:is(.path-workspace,.today-stack,.practice-workspace,.study-course) :is(.button,select){min-height:2.75rem;max-width:100%;font-size:.875rem;line-height:1.5}
:is(.path-workspace,.today-stack,.practice-workspace,.study-course) .button{white-space:normal;text-align:center;overflow-wrap:anywhere}
:is(.path-tools,.path-controls,.practice-preferences,.library-roadmap-listings) :is(a,summary,select):focus-visible{outline:3px solid #c0810d;outline-offset:4px}
.path-course-overview{margin:0 0 var(--cc-space);padding:0;border:0;gap:1rem}
.path-course-overview>div:first-child{min-width:0;max-width:22rem;width:100%}
.path-course-overview strong{font-size:.875rem;line-height:1.5;color:var(--cc-muted)}
.path-course-overview .track{height:.375rem;margin-top:.5rem}
.path-workspace .path-intro-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--cc-space);margin:0 0 var(--cc-space)}
.path-workspace .today-next-step.continue-card{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--cc-space);gap:var(--cc-space);margin:0;box-shadow:none;border:1px solid #d5dcf4;background:#eef1ff;border-radius:1rem}
.path-workspace .today-next-step>div{flex:1;min-width:0}
.path-workspace .today-next-step h2{font-size:1.375rem;line-height:1.4;margin:.5rem 0 .75rem}
.path-workspace .today-next-step p{font-size:1rem;line-height:1.7;color:var(--cc-muted);margin:0}
.path-workspace .today-next-step .resume-position{margin-top:.75rem;font-size:.875rem}
.path-workspace .today-next-step .meta{font-size:.8125rem;line-height:1.6;margin-top:1rem;gap:.375rem .75rem}
.path-workspace .today-next-step .button{flex:0 1 auto;margin:0;max-width:15rem}
.path-tools{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;column-gap:var(--cc-space);row-gap:.5rem;margin:0 0 var(--cc-section);border-bottom:1px solid var(--cc-line);padding-bottom:1rem}
.path-course-details{flex:1 1 22rem;min-width:0}
.path-course-details>summary{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem 0;list-style:none;cursor:pointer;font-size:.875rem;font-weight:700;color:var(--cc-ink);line-height:1.5}
.path-course-details>summary::-webkit-details-marker{display:none}
.path-course-details>summary:before{content:'+';font-size:1.25rem;line-height:1;color:var(--blue,#4a5cf0);flex:none;width:1rem;text-align:center}
.path-course-details[open]>summary:before{content:'−'}
.path-course-details-body{padding:1rem 0 .5rem;display:grid;gap:var(--cc-space)}
.path-course-details-body :is(.compact-course-scope,.compact-scope-label,.course-starting-guide,.course-update){margin:0;box-shadow:none}
.path-course-details-body .compact-course-scope{border:0;background:transparent;border-radius:0}
.path-course-details-body .compact-course-scope>summary{padding:.5rem 0}
.path-course-details-body .compact-course-scope .course-update{padding:1rem 0 0}
.path-course-details-body :is(p,li){font-size:1rem;line-height:1.7}
.path-secondary-links{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;align-items:center}
.path-secondary-links a{display:inline-flex;align-items:center;min-height:2.75rem;font-size:.875rem;font-weight:600;text-decoration:none}
.path-secondary-links a:hover{text-decoration:underline}
.path-workspace>.course-update{margin:0 0 var(--cc-space)}
.path-workspace .path-toolbar{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:var(--cc-space);margin:0 0 var(--cc-space)}
.path-workspace .path-toolbar h2{font-size:1.125rem;line-height:1.5;margin:0;flex:1 1 12rem}
.path-workspace .path-toolbar h2 small{display:block;font:400 .8125rem/1.6 'DM Sans',sans-serif;letter-spacing:0;margin:.25rem 0 0;color:var(--cc-muted)}
.path-controls{display:flex;flex-wrap:wrap;gap:.75rem;flex:0 1 auto;max-width:100%;min-width:0}
.path-controls label{display:grid;gap:.375rem;flex:1 1 11rem;min-width:0;max-width:100%;font-size:.875rem;line-height:1.5;font-weight:600;color:var(--cc-muted)}
.path-controls select,.practice-preferences select{width:100%;min-width:0;padding:.625rem 2rem .625rem .75rem;border:1px solid #b9c5d9;border-radius:.5rem;background:var(--cc-surface);color:var(--cc-ink);font-family:'DM Sans',sans-serif}
.hub-heading{margin-bottom:1.5rem;align-items:start}
.hub-heading h1{font-size:clamp(1.5rem,2vw,1.875rem);line-height:1.4;letter-spacing:-.035em;margin:.375rem 0 .5rem}
.hub-heading p{font-size:1rem;line-height:1.7}
.today-stack{gap:var(--cc-space);max-width:60rem}
.today-stack .today-main{padding:var(--cc-space);border:1px solid var(--cc-line);box-shadow:none;border-radius:1rem;background:var(--cc-surface)}
.today-stack .today-main-top{gap:1rem;flex-wrap:wrap}
.today-stack .today-course{margin:1rem 0 .5rem;font-size:.875rem}
.today-stack .today-main h2{font-size:1.5rem;letter-spacing:-.035em;line-height:1.4;margin:0 0 .75rem}
.today-stack .today-main>p:not(.today-course){font-size:1rem;line-height:1.7;margin:0}
.today-stack .today-meta{font-size:.8125rem;line-height:1.6;margin:1rem 0;color:var(--cc-muted)}
.today-stack .today-main-bottom{margin:var(--cc-space) 0 1rem;flex-wrap:wrap;gap:1rem}
.today-stack .today-main-bottom>span{font-size:.8125rem}
.today-stack .today-main .button{min-height:2.75rem;font-size:.875rem;padding:.6875rem 1.125rem}
.today-stack .today-review{padding:var(--cc-space);gap:1rem;border-radius:1rem;box-shadow:none;background:var(--cc-surface);border:1px solid var(--cc-line)}
.today-stack .today-review>div{flex:1;min-width:0}
.today-stack .hub-review-symbol{width:2.5rem;height:2.5rem;border-radius:.75rem;font-size:1.625rem}
.today-stack .today-review h2{font-size:1.125rem;line-height:1.5;margin:.375rem 0 .5rem}
.today-stack .today-review p{font-size:1rem;line-height:1.7;margin:0 0 .75rem}
.today-stack .today-review .button{margin:.25rem 0 0}
.today-stack .hub-review-explain{margin:.75rem 0 0;font-size:.875rem}
.today-stack .hub-review-explain summary{font-size:.875rem;min-height:2.75rem}
.today-stack .hub-review-explain p{font-size:.875rem;margin:.5rem 0 0}
.today-stack .today-footer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.today-stack .today-footer>a:is(.today-roadmap,.today-progress){display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid var(--cc-line);border-radius:.75rem;background:var(--cc-surface);color:var(--cc-ink);text-decoration:none;min-width:0;min-height:2.75rem;font-size:.875rem}
.today-stack .today-footer>a:is(.today-roadmap,.today-progress):hover{border-color:#a7b5d3;background:var(--surface-soft,#f6f8fd)}
.today-stack .today-footer>a>span{min-width:0}
.today-stack .today-footer small{font-size:.8125rem;line-height:1.6;color:var(--cc-muted);margin-top:.25rem}
.practice-workspace .warmup-feature,.practice-workspace .practice-feature.secondary-practice{padding:var(--cc-space);margin:0 0 var(--cc-space);gap:var(--cc-space);border-radius:1rem;box-shadow:none;align-items:center;flex-wrap:wrap}
.practice-workspace .warmup-feature{background:#edf8f1;border-color:#c9e4d5}
.practice-workspace .warmup-feature>div,.practice-workspace .secondary-practice>div{flex:1 1 23rem;min-width:0}
.practice-workspace .warmup-feature h2{font-size:1.375rem;line-height:1.4;margin:.5rem 0 .75rem}
.practice-workspace .secondary-practice h2{font-size:1.125rem;line-height:1.5;margin:.5rem 0 .75rem}
.practice-workspace :is(.warmup-feature,.secondary-practice) p{font-size:1rem;line-height:1.7;margin:0;color:var(--cc-muted)}
.practice-workspace :is(.warmup-feature,.secondary-practice) .button{margin:0;flex:0 1 auto;max-width:100%}
.practice-workspace .mix-distribution{margin-top:1rem;padding-top:1rem;gap:.5rem;font-size:.8125rem;flex-wrap:wrap}
.practice-workspace .mix-distribution>span{font-size:.8125rem;white-space:normal;max-width:100%}
.practice-preferences{margin:0 0 var(--cc-section);padding:0;border-bottom:1px solid var(--cc-line)}
.practice-preferences>summary,.library-roadmap-listings>summary{cursor:pointer;min-height:2.75rem;padding:.625rem 0;font-size:.875rem;font-weight:600;line-height:1.6;color:var(--cc-ink)}
.practice-preferences-body{padding:1rem 0 1.5rem;display:grid;gap:1rem}
.practice-preferences-body label{display:grid;gap:.5rem;max-width:22rem;font-size:.875rem;font-weight:600;line-height:1.5}
.practice-preferences-body small{display:block;font-size:.875rem;line-height:1.7;color:var(--cc-muted)}
.practice-workspace .section-title{margin:0 0 var(--cc-space);gap:1rem;flex-wrap:wrap}
.practice-workspace .section-title h2{font-size:1.125rem;line-height:1.5}
.practice-workspace .section-title>span{font-size:.8125rem}
.practice-workspace .targeted-grid{gap:var(--cc-space)}
.practice-workspace .target-card{padding:var(--cc-space);gap:1rem;min-width:0;box-shadow:none;flex-wrap:wrap}
.practice-workspace .target-copy{min-width:0;flex:1 1 16rem}
.practice-workspace .target-copy p{font-size:1rem;line-height:1.7}
.practice-workspace .target-card .button{margin:0}
.practice-workspace .flashcard-banner{margin-top:var(--cc-section);padding:var(--cc-space);gap:1rem;flex-wrap:wrap}
.practice-workspace .flashcard-banner p{font-size:1rem;line-height:1.7}
.study-course.library-feature{box-shadow:none;border-radius:1rem}
.study-course .course-identity{padding:var(--cc-space);gap:1rem;align-items:center;flex-wrap:wrap}
.study-course .course-identity>div:nth-child(2){min-width:0;flex:1 1 10rem}
.study-course .certificate-art.course-art-host{flex:0 0 4rem;width:4rem;height:4rem;min-height:0}
.study-course .certificate-art.course-art-host>.course-art{width:4rem;height:4rem}
.study-course .course-identity strong{font-size:1.125rem;line-height:1.5}
.study-course .course-identity-tag{font-size:.875rem;line-height:1.6;margin-top:.125rem}
.study-course .library-course{padding:var(--cc-space);gap:0}
.study-course .library-course h2{font-size:1.25rem;line-height:1.5;margin:0 0 .75rem}
.study-course .library-course>p{min-height:0;font-size:1rem;line-height:1.7;margin:0}
.study-course .course-facts{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin:var(--cc-space) 0;font-size:.875rem;line-height:1.7}
.study-course .course-facts>span{min-width:0}
.study-course .course-facts strong{display:inline;font-size:inherit;font-weight:700;margin-right:.125rem;color:var(--cc-ink)}
.study-course .library-progress{margin:0 0 var(--cc-space)}
.study-course .library-progress>div:first-child{font-size:.875rem;line-height:1.5}
.study-course .library-action{gap:.75rem;flex-direction:column;align-items:stretch;margin-top:auto}
.study-course .library-action small{font-size:.8125rem;line-height:1.7;text-align:left}
.library-roadmap-listings{margin:var(--cc-section) 0;border-top:1px solid var(--cc-line);padding-top:.5rem}
.library-roadmap-listings>summary{font-size:1rem}
html[data-theme="dark"] .path-workspace .today-next-step.continue-card{background:var(--surface-soft,#202e44);border-color:var(--cc-line)}
html[data-theme="dark"] .practice-workspace .warmup-feature{background:#1b342e;border-color:#3c6554}
html[data-theme="dark"] .practice-workspace .secondary-practice{background:var(--cc-surface);border-color:var(--cc-line)}
html[data-theme="dark"] .study-course .course-identity{background:var(--surface-soft,#202e44);border-color:var(--cc-line)}
html[data-theme="dark"] .study-course.security-feature .course-identity{background:#1b342e}
html[data-theme="dark"] .path-controls select,html[data-theme="dark"] .practice-preferences select{background:var(--surface-soft,#202e44);border-color:#64758c}
html[data-theme="dark"] .path-course-details-body .compact-course-scope{background:transparent}
@media(max-width:40rem){
 .path-workspace .today-next-step.continue-card{flex-direction:column;align-items:stretch;gap:1.5rem}
 .path-workspace .today-next-step .button{width:100%;max-width:none}
 .path-tools{display:block}.path-secondary-links{margin-top:.5rem}
 .path-controls{width:100%;flex:1 1 100%}.path-controls label{flex-basis:12rem}
 .today-stack .today-main-bottom{align-items:stretch;flex-direction:column}.today-stack .today-main-bottom .button{width:100%}
 .today-stack .today-footer{grid-template-columns:minmax(0,1fr)}
 .today-stack .today-review{gap:.75rem}.today-stack .today-review .button{width:100%}
 .practice-workspace :is(.warmup-feature,.secondary-practice) .button{width:100%}
 .practice-workspace .target-card .button{width:100%}
 .practice-workspace .flashcard-banner .button{margin:0;width:100%}
}

/* Follow-up: resilient Today grid, paired path controls, quieter topic balance. */
.today-stack{grid-template-columns:minmax(0,1fr);width:100%;min-width:0}
.today-stack>*,.today-stack :is(.today-main-top,.today-main-bottom,.today-review>div,.today-footer,.today-footer>a,.today-footer>a>span){min-width:0;max-width:100%}
.today-stack :is(h2,p,.today-course-code,.today-meta,.today-main-bottom>span,.today-footer strong,.today-footer small,.hub-review-explain summary){overflow-wrap:anywhere;white-space:normal}
.today-stack .today-main-top .pill{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.path-workspace .path-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.45fr);width:29rem;flex:0 1 29rem;max-width:100%;min-width:0}
.path-workspace .path-controls label{min-width:0;max-width:100%}
.practice-workspace .practice-mix-details{margin-top:1rem;min-width:0}
.practice-workspace .practice-mix-details>summary{min-height:2.75rem;display:list-item;cursor:pointer;font-size:.875rem;line-height:1.6;font-weight:600;color:var(--cc-muted);padding:.625rem 0;overflow-wrap:anywhere}
.practice-workspace .practice-mix-details>summary:focus-visible{outline:3px solid #c0810d;outline-offset:4px}
.practice-workspace .practice-mix-details .mix-distribution{margin:0;padding:0;border:0}
.practice-workspace .practice-mix-details[open] .mix-distribution{padding-top:.5rem;gap:.5rem}
@media(max-width:40rem){.path-workspace .path-controls{grid-template-columns:minmax(0,1fr);width:100%;flex:1 1 100%}}

/* A flex basis used for row width must not become a fixed column height. */
@media(max-width:40rem){
 .practice-workspace .warmup-feature,.practice-workspace .practice-feature.secondary-practice{flex-direction:column;align-items:stretch;flex-wrap:nowrap}
 .practice-workspace .warmup-feature>div,.practice-workspace .secondary-practice>div{flex:0 1 auto;width:100%;min-width:0;min-height:0}
 .practice-workspace .warmup-feature .button,.practice-workspace .secondary-practice .button{flex:0 1 auto;width:100%;max-width:100%}
}

/* The original warm-up switches to a column at 1200px. Use content height there. */
@media(max-width:1200px){
 .practice-workspace .warmup-feature>div{flex:0 1 auto;width:100%;min-width:0;min-height:0}
 .practice-workspace .warmup-feature .button{flex:0 1 auto;max-width:100%}
}


/* Keep switching next to the active course, with a full touch/keyboard target. */
.rail > .rail-change-course { display:flex; align-items:center; min-height:2.75rem; margin:0 0 1rem; padding:.5rem .75rem; color:#b9caff; font-size:.875rem; font-weight:600; line-height:1.5; border-radius:.5rem; text-decoration:none; }
.rail > .rail-change-course:hover { background:#ffffff12; color:#fff; text-decoration:underline; }
.rail > .rail-change-course[hidden] { display:none; }
@media(max-width:780px) { .rail > .rail-change-course { justify-content:center; width:fit-content; max-width:100%; margin:0 auto; padding:.375rem .75rem; } }

/* Secondary course switch; append after the existing sidebar rules. */
.rail > a#rail-change-course {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  flex: 0 1 auto;
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  min-height: max(44px, 2.75rem);
  margin: .5rem 0 1rem;
  padding: .5rem .75rem;
  border: 1px solid #3b4b69;
  border-radius: .625rem;
  background: #1b2943;
  color: #cbd6ff;
  font: 600 .875rem/1.5 'DM Sans', sans-serif;
  text-align: center;
  text-decoration: none;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.rail > a#rail-change-course .course-switch-icon {
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
}
.rail > a#rail-change-course .course-switch-label {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
.rail > a#rail-change-course:hover {
  background: #263754;
  border-color: #62779e;
  color: #fff;
  text-decoration: none;
}
.rail > a#rail-change-course:active { background: #304260; }
.rail > a#rail-change-course:focus-visible {
  outline: 3px solid #8ce9bd;
  outline-offset: 3px;
}
.rail > a#rail-change-course[hidden] { display: none; }
@media (max-width: 780px) {
  .rail > a#rail-change-course { margin: .5rem auto 0; }
}
@media (prefers-reduced-motion: reduce) {
  .rail > a#rail-change-course { transition: none; }
}