/* Shared platform layout; course content and tools keep their own styling. */
.site-header-row { gap: .75rem; }
.site-header-row > :first-child { min-width: 0; }
.site-header-row > :last-child { flex-shrink: 0; }
.edu-header-brand-copy { max-width: min(17rem, 34vw); }
.edu-header-subject { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edu-header-subject-icon { font-size: .75rem; }
.edu-header-controls { min-width: 0; }
/* Practice pages still own their existing responsive navigation. */
.chapter-nav { display: none; }
.chapter-select-row { display: flex; padding: .5rem 0; border-top: 1px solid #f5f5f4; }
#mobile-nav { min-width: 0; }
#edu-header { position: sticky; top: -4rem; z-index: 50; }
.edu-subject-header { background: rgba(255,255,255,.97); backdrop-filter: blur(12px); }
.edu-subject-header .site-header-row { height: 4rem; transition: opacity .16s ease; }
.edu-header-compact .site-header-row { opacity: 0; pointer-events: none; }
.site-header-row h1, .edu-header-name { color: #0f172a; font-size: 1.375rem; font-weight: 850; letter-spacing: -0.025em; }
.edu-subject-header .chapter-nav {
  display: flex; align-items: center; gap: .375rem; overflow-x: auto;
  padding: .45rem 0; border-top: 1px solid #f1f5f9;
  scrollbar-width: none; overscroll-behavior-x: contain;
}
.edu-subject-header .chapter-nav::-webkit-scrollbar { display: none; }
.edu-subject-header .chapter-nav .nav-btn {
  flex: 0 0 auto; white-space: nowrap; min-height: 42px;
  padding: .6rem .85rem; font-size: .875rem; line-height: 1.4;
  border: 1px solid transparent; border-radius: .7rem; color: #57534e;
}
.edu-subject-header .chapter-nav .nav-btn:hover { background: #f0fdfa; color: #115e59; }
.edu-subject-header .chapter-nav .nav-btn.tab-active {
  background: #115e59; color: #fff; border-color: #115e59; font-weight: 750;
  box-shadow: 0 1px 3px rgba(15,118,110,.15);
}
.edu-subject-header .nav-btn:focus-visible { outline: 3px solid #2dd4bf; outline-offset: -3px; }
#nav-login-btn { white-space: nowrap; }
#user-name { max-width: 12rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#user-avatar { flex-shrink: 0; }
#nav-user-profile:focus-visible { outline: 2px solid #0d9488; outline-offset: 4px; }
body:has(#welcome-modal:not(.hidden)) { overflow: hidden; }
#welcome-modal-content { max-height: calc(100dvh - 2rem); overflow-y: auto; overscroll-behavior: contain; }
@media (min-width: 1280px) {
  .chapter-nav { display: flex; align-items: center; justify-content: center; gap: .25rem; overflow-x: auto; border-top: 1px solid #f5f5f4; }
  .chapter-nav .nav-btn { flex-shrink: 0; white-space: nowrap; }
  .chapter-select-row { display: none; }
  .edu-subject-header .chapter-nav { justify-content: safe center; }
}
@media (prefers-reduced-motion: reduce) {
  .edu-subject-header .site-header-row { transition: none; }
}
@media (max-width: 639px) {
  .site-header-row { gap: .375rem; }
  .site-header-row > :first-child { gap: .25rem; }
  .site-header-row h1 { font-size: 1rem; }
  .site-header-row > :first-child img { width: 2rem; height: 2rem; flex-shrink: 0; }
  .edu-header-brand-copy { max-width: min(9.5rem, 42vw); }
  .edu-header-name { font-size: 1.125rem; }
  .site-header-row > :last-child { gap: .375rem; }
  .site-header-row .border-l { padding-left: .5rem; }
  #nav-login-btn { padding: .375rem .5rem; }
  #nav-login-btn svg { flex-shrink: 0; }
  #welcome-modal-content { padding: 1.5rem; }
}

/* Study rhythm: shared hierarchy, with each subject's own colors and visuals. */
body.edu-study-page .course-intro { margin-bottom: 2rem; }
body.edu-study-page .course-intro-title,
body.edu-study-page main > div:first-child > h1 {
  max-width: 62rem; margin-left: auto; margin-right: auto;
  font-size: clamp(1.875rem, 3.35vw, 2.75rem); line-height: 1.15;
  text-align: center; text-wrap: balance; overflow-wrap: break-word;
}
body.edu-study-page .course-intro-subtitle { margin-top: .85rem; font-size: 1rem; line-height: 1.6; }
body.edu-study-page .study-guide { margin-top: 1.35rem; padding: 1rem 1.25rem; }
body.edu-study-page .study-guide-title { margin-bottom: .65rem; }
body.edu-study-page .study-guide-list { gap: .5rem; font-size: .9375rem; }
body.edu-study-page .chapter-opening { margin-bottom: 1.5rem; }
body.edu-study-page .chapter-title { font-size: clamp(1.4rem, 2.1vw, 1.8rem); }
body.edu-study-page .learning-space,
body.edu-study-page .learning-stack { gap: 1.6rem; }
body.edu-study-page .learn-section { margin-top: 1.65rem; margin-bottom: 1.65rem; }
body.edu-study-page .learning-space > .learn-section { margin-top: 0; margin-bottom: 0; }
body.edu-study-page .section-head h3 { line-height: 1.35; }
body.edu-study-page main select:not(.edu-choice-source) {
  max-width: 100%; min-width: 0; min-height: 42px; padding: .55rem 2rem .55rem .75rem;
  border: 1px solid #cbd5e1; border-radius: .7rem; color: #334155;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2364758b' stroke-width='1.8'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") no-repeat right .6rem center;
  appearance: none; font-size: .875rem; line-height: 1.4;
}
body.edu-study-page main :is(input:not([type=radio]):not([type=checkbox]):not([type=range]), textarea) {
  max-width: 100%; min-width: 0; border-radius: .65rem;
}
body.edu-study-page main :is(select,input,textarea,button,summary):focus-visible {
  outline: 3px solid #2dd4bf; outline-offset: 2px;
}
body.edu-study-page .edu-choice-source { display: none !important; }
.edu-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.edu-choice-group { display: flex; flex-wrap: wrap; gap: .4rem; min-width: 0; border: 0; padding: 0; margin: 0; }
.edu-choice { position: relative; display: flex; cursor: pointer; min-width: 0; }
.edu-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.edu-choice span {
  display: flex; align-items: center; justify-content: center; min-height: 42px;
  padding: .45rem .7rem; border: 1px solid #cbd5e1; border-radius: .65rem;
  background: #fff; color: #475569; font-size: .8125rem; line-height: 1.35; font-weight: 650;
}
.edu-choice:hover span { border-color: #0d9488; }
.edu-choice input:checked + span { background: #e6f5f1; border-color: #0f766e; color: #115e59; box-shadow: inset 0 0 0 1px #0f766e; }
.edu-choice input:focus-visible + span { outline: 3px solid #2dd4bf; outline-offset: 2px; }
.edu-choice input:disabled + span { opacity: .5; cursor: not-allowed; }
body.edu-study-page .edu-choice-row { grid-template-columns: minmax(0,1fr); align-content: start; align-items: start; gap: .65rem; }
body.edu-study-page .edu-choice-row:has(.quiz-num) { grid-template-columns: auto minmax(0,1fr); }
body.edu-study-page .edu-choice-row:has(.quiz-num) .edu-choice-group { grid-column: 2; }
body.edu-study-page .edu-compact-activity { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
body.edu-study-page .edu-compact-activity > :not(.edu-choice-row) { grid-column: 1 / -1; }
@media (max-width: 767px) {
  body.edu-study-page .edu-compact-activity { grid-template-columns: 1fr; }
  body.edu-study-page .study-guide { padding: 1rem; }
}

/* Homepage: same content, ~20% lower visual height (185-200px equivalent) */
.course-card[class] {
  display: flex !important;
  flex-direction: column !important;
  padding: .75rem 1.25rem !important;
}
.course-card > .w-14 {
  width: 2.35rem !important;
  height: 2.35rem !important;
  margin-bottom: .45rem !important;
  font-size: 1.45rem !important;
  border-radius: .75rem !important;
}
.course-card > h3 {
  font-size: 1.0625rem !important;
  line-height: 1.3 !important;
  margin-bottom: .25rem !important;
}
.course-card > p {
  font-size: .8125rem !important;
  line-height: 1.38 !important;
  margin-bottom: .35rem !important;
}
.course-card > .border-t {
  margin-top: auto !important;
  padding-top: .45rem !important;
  font-size: .8125rem !important;
}

/* Practice: keep questions readable and actions reachable on small phones. */
.edu-practice-page .site-header-row h1 { color: #0f172a; }
.edu-practice-page main { padding-top: 1.25rem; }
.edu-practice-page #overview > :first-child { padding: clamp(1rem, 2.5vw, 2rem); margin-bottom: 1.25rem; }
.edu-practice-page #overview h2 { font-size: clamp(1.75rem, 3.2vw, 2.65rem); line-height: 1.18; text-wrap: balance; }
.edu-practice-page #overview p.text-lg { font-size: 1rem; line-height: 1.65; }
.edu-practice-page #practice-panel { margin-top: 1rem; scroll-margin-top: 8rem; }
.edu-practice-page #practice-panel > :first-child { flex-wrap: wrap; }
.edu-practice-page #practice-badge { max-width: 100%; overflow-wrap: anywhere; }
.edu-practice-page #question-list > div { scroll-margin-top: 8rem; }
.edu-practice-page #question-list h3 { min-width: 0; overflow-wrap: anywhere; }
.edu-practice-page .option-card, .edu-practice-page .answer-btn { min-height: 44px; text-align: left; line-height: 1.55; }
.edu-practice-page button:focus-visible, .edu-practice-page a:focus-visible { outline: 3px solid #0f766e; outline-offset: 3px; }
.edu-practice-page button:disabled { cursor: default; }
.edu-practice-page button:disabled:not(.option-card):not(.answer-btn) { opacity: .55; }
.practice-theory-link { margin: .75rem 0; font-weight: 700; color: #0f766e; text-decoration: underline; }
.study-practice-link { display: flex; width: fit-content; align-items: center; min-height: 44px; margin: 1rem auto 0; padding: .5rem 1rem; border-radius: .75rem; background: #0f766e; color: #fff; font-weight: 700; }
.study-practice-link:focus-visible { outline: 3px solid #0f172a; outline-offset: 3px; }
.edu-practice-page #practice-content .sticky { bottom: .5rem; }
.edu-practice-page #practice-content .grid > * { min-width: 0; }
@media (max-width: 639px) {
  .edu-practice-page #practice-content > div > div { padding: 1rem; }
  .edu-practice-page #question-list > div { padding: .875rem; }
  .edu-practice-page #practice-content .sticky { padding: .75rem; gap: .5rem; }
  .edu-practice-page #mistakes-panel .flex.gap-3 { flex-wrap: wrap; }
}