
:root {
  --bg:#fffaf8; --surface:#fff; --soft:#f8f0ee; --rose-soft:#f5e3e3;
  --lavender-soft:#eee9f2; --sage-soft:#eaf0ea; --rose:#b97a78;
  --rose-dark:#865654; --lavender:#88738e; --sage:#6e806b;
  --ink:#3d3337; --muted:#76696d; --border:#e9ddda; --danger:#95504c;
  --danger-bg:#fff0ee; --display:"Playfair Display",serif; --body:"DM Sans",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--ink);line-height:1.7;background:radial-gradient(circle at 4% 8%,rgba(245,227,227,.6),transparent 22rem),var(--bg)}
a{color:inherit}
button{font:inherit;cursor:pointer}
.topbar{
  position:sticky;top:0;z-index:100;min-height:74px;padding:9px 24px;
  display:grid;grid-template-columns:230px 1fr 120px;align-items:center;gap:24px;
  background:rgba(255,250,248,.93);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)
}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--rose-soft);color:var(--rose-dark);font-family:var(--display);font-size:1.2rem}
.brand>span:last-child{display:grid;line-height:1.1}.brand strong{font-family:var(--display)}.brand small{color:var(--muted);margin-top:3px}
.back{text-align:right;text-decoration:none;color:var(--muted)}
.global-progress{width:min(550px,100%);justify-self:center}
.global-progress>span{display:block;text-align:center;color:var(--muted);font-size:.77rem;margin-bottom:5px}
.progress-track{height:7px;border-radius:999px;background:#eee3e0;overflow:hidden}
#progressBar{height:100%;width:0;background:linear-gradient(90deg,var(--rose),var(--rose-dark));transition:.3s}

.shell{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:calc(100vh - 74px)}
.sidebar{
  position:sticky;top:74px;height:calc(100vh - 74px);overflow:auto;
  border-right:1px solid var(--border);background:rgba(248,240,238,.64);padding:28px 17px 45px
}
.sidebar-head{padding:0 10px 20px}.eyebrow{color:var(--rose-dark);font-size:.72rem;text-transform:uppercase;letter-spacing:.11em;font-weight:700}
.sidebar-head h2{font-family:var(--display);font-size:1.65rem;margin-top:3px}.sidebar-head p{color:var(--muted);font-size:.84rem;margin-top:5px}
.module-nav{display:grid;gap:6px}
.module-nav button{
  width:100%;display:grid;grid-template-columns:32px 1fr auto;gap:9px;align-items:center;
  border:1px solid transparent;background:transparent;padding:10px;border-radius:14px;text-align:left;color:var(--ink)
}
.module-nav button:hover,.module-nav button.active{background:#fff;border-color:var(--border)}
.module-nav button.active{box-shadow:0 8px 20px rgba(83,61,68,.05)}
.mod-no{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--rose-soft);color:var(--rose-dark);font-weight:700;font-size:.76rem}
.mod-copy strong{display:block;font-size:.84rem;line-height:1.25}.mod-copy small{color:var(--muted);font-size:.68rem}.done{color:var(--sage);font-weight:700}

.lesson-wrap{width:min(900px,calc(100% - 52px));margin:0 auto;padding:56px 0 90px}
.module-header{padding-bottom:28px;border-bottom:1px solid var(--border)}
.module-chip{display:inline-flex;padding:7px 11px;border-radius:999px;background:var(--rose-soft);color:var(--rose-dark);font-size:.78rem;font-weight:700}
.module-header h1{font-family:var(--display);font-size:clamp(2.7rem,5vw,4.8rem);line-height:1.04;letter-spacing:-.03em;margin-top:14px}
.module-header .subtitle{color:var(--muted);font-size:1.08rem;margin-top:10px}
.objective{margin-top:22px;padding:18px 20px;border-left:3px solid var(--rose);border-radius:0 15px 15px 0;background:rgba(245,227,227,.53)}
.objective span{display:block;color:var(--rose-dark);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:700}

.lesson-tabs{display:flex;flex-wrap:wrap;gap:8px;padding:24px 0}
.lesson-tab{border:1px solid var(--border);border-radius:999px;padding:9px 13px;background:#fff;color:var(--muted)}
.lesson-tab.active{background:var(--rose-dark);border-color:var(--rose-dark);color:#fff}

.lesson-content{padding:14px 0 12px}
.lesson-content h2{font-family:var(--display);font-size:2.15rem;line-height:1.14}
.lesson-content p{color:#54484b;font-size:1.02rem;margin-top:17px}
.key-card{margin-top:26px;padding:22px;border-radius:20px;background:var(--sage-soft);border:1px solid rgba(110,128,107,.15)}
.key-card h3,.clinical-card h3{font-family:var(--display);font-size:1.25rem}
.key-card ul,.clinical-card ul{padding-left:20px;margin-top:10px}.key-card li+li,.clinical-card li+li{margin-top:6px}

.clinical-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:34px}
.clinical-card{padding:22px;border:1px solid var(--border);border-radius:21px;background:#fff}
.clinical-card p{color:var(--muted);margin-top:9px}
.clinical-card.approach{background:var(--lavender-soft)}
.clinical-card.warning{background:var(--danger-bg);border-color:#efd0cd}.clinical-card.warning ul{color:#744542}

.studies-section,.quiz-section,.refs-section{margin-top:52px;padding-top:36px;border-top:1px solid var(--border)}
.section-title h2{font-family:var(--display);font-size:2rem}.section-title p{color:var(--muted);margin-top:6px}
.study-list{display:grid;gap:11px;margin-top:20px}
.study-card{display:block;padding:18px;border-radius:18px;background:#fff;border:1px solid var(--border);text-decoration:none;transition:.2s}
.study-card:hover{transform:translateY(-2px);border-color:var(--rose);box-shadow:0 12px 28px rgba(83,61,68,.06)}
.study-top{display:flex;justify-content:space-between;gap:15px;align-items:start}
.study-card h3{font-family:var(--display);font-size:1.12rem}
.study-card .meta{color:var(--rose-dark);font-size:.76rem;font-weight:700;white-space:nowrap}
.study-card p{color:var(--muted);font-size:.88rem;margin-top:7px}
.study-card .open{display:inline-block;color:var(--rose-dark);font-size:.78rem;font-weight:700;margin-top:9px}

.quiz-list{display:grid;gap:15px;margin-top:20px}
.question{padding:21px;border:1px solid var(--border);border-radius:20px;background:#fff}
.question h3{font-size:1rem}
.options{display:grid;gap:8px;margin-top:13px}
.option{display:flex;gap:10px;text-align:left;padding:11px 13px;border-radius:13px;border:1px solid var(--border);background:#fffdfc;color:var(--ink)}
.option.selected{border-color:var(--rose);background:var(--rose-soft)}
.quiz-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px}
.quiz-submit,.control{border:0;border-radius:999px;padding:12px 18px;font-weight:700}
.quiz-submit,.control.primary{background:var(--rose-dark);color:#fff}
.control.secondary{background:#fff;border:1px solid var(--border);color:var(--ink)}
.quiz-result{display:none;margin-top:17px;padding:19px;border-radius:17px}.quiz-result.show{display:block}.quiz-result.pass{background:var(--sage-soft)}.quiz-result.retry{background:var(--danger-bg)}
.explanation{padding-top:9px;margin-top:9px;border-top:1px solid rgba(0,0,0,.07)}

.ref-list{display:grid;gap:8px;margin-top:17px}
.ref-list a{display:block;padding:12px 14px;border:1px solid var(--border);border-radius:13px;background:#fff;text-decoration:none}
.ref-list strong{display:block}.ref-list span{color:var(--muted);font-size:.75rem}

.module-controls{display:flex;justify-content:space-between;gap:14px;margin-top:48px;padding-top:27px;border-top:1px solid var(--border)}
.control:disabled{opacity:.35;cursor:not-allowed}

.disclaimer{margin-top:24px;color:var(--muted);font-size:.78rem;padding:15px;border-radius:14px;background:var(--soft)}

@media(max-width:900px){
  .topbar{grid-template-columns:1fr auto}.global-progress{display:none}
  .shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--border);padding:16px}
  .sidebar-head{display:none}.module-nav{grid-template-columns:repeat(6,1fr)}.module-nav button{display:block;text-align:center;padding:8px 3px}.mod-copy,.done{display:none}.mod-no{margin:auto}
}
@media(max-width:620px){
  .topbar{padding:9px 13px}.brand small{display:none}.back{font-size:.8rem}
  .module-nav{grid-template-columns:repeat(4,1fr)}
  .lesson-wrap{width:min(100% - 28px,900px);padding-top:38px}
  .module-header h1{font-size:3rem}.clinical-grid{grid-template-columns:1fr}.study-top{display:block}.study-card .meta{display:block;margin-top:5px}
  .module-controls{flex-direction:column}.control{width:100%}
}
