.courseWorkspace{color:#173a2c;scroll-margin-top:90px}.courseWorkspace[hidden]{display:none!important}.courseHead{margin:20px 0}.courseEyebrow{font-size:10px;font-weight:700;letter-spacing:.12em;color:#49715e}.courseHead h2{font-size:36px;letter-spacing:-.045em;margin:8px 0}.courseHead p{font-size:13px;line-height:1.6;max-width:650px;color:#41614f}.courseProgress{display:flex;align-items:center;gap:20px;margin-bottom:22px;font-size:12px}.courseProgress progress{flex:1;height:7px;max-width:450px;accent-color:#087052}.courseLayout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}.courseMenu{background:#ffffff55;border:1px solid #abc6b566;border-radius:18px;padding:12px}.courseMenu summary{font-size:13px;font-weight:600;cursor:pointer;padding:10px}.courseMenu nav{display:grid;gap:5px;margin-top:8px}.courseMenu button{min-height:48px;text-align:left;padding:12px;border:0;border-radius:10px;background:transparent;color:#345744;font:inherit;font-size:13px;cursor:pointer}.courseMenu button[aria-current=step]{background:#173d2d;color:#effff4}.courseLesson{background:linear-gradient(135deg,#fafff5c9,#e2f0e8aa);border:1px solid #ffffffaa;border-radius:22px;padding:30px;box-shadow:0 12px 40px #1a3e2810}.courseLesson h3{font-size:30px;letter-spacing:-.035em;line-height:1.15;margin:12px 0 18px}.courseLesson p,.courseLesson li{font-size:15px;line-height:1.8;color:#294b37}.courseLesson ul{padding-left:20px;margin:18px 0}.courseTask{border-left:3px solid #087052;background:#ffffff55;padding:16px 20px;margin:24px 0;border-radius:0 12px 12px 0}.courseTask p{margin:8px 0 10px}.courseTask small,.courseFine{font-size:11px;line-height:1.6;color:#446451;display:block}.courseComplete,.courseControls button{min-height:44px;padding:11px 16px;border-radius:10px;border:1px solid #52745e55;font:inherit;font-size:13px;cursor:pointer;color:#173a2c;background:#f6fff580}.courseComplete{background:#087052;color:white;border:0}.courseControls{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #52745e33;padding-top:18px;margin-top:24px;margin-bottom:16px}.courseControls button:disabled{opacity:.4;cursor:default}.courseWorkspace :focus-visible{outline:2px solid #087052;outline-offset:3px}.dashboard-panel>.journalNav{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:720px){.dashboard-panel>.journalNav{grid-template-columns:repeat(3,minmax(0,1fr))}.courseHead{margin:12px 0}.courseHead h2{font-size:29px}.courseHead p{font-size:12px}.courseLayout{grid-template-columns:1fr;gap:12px}.courseMenu{padding:5px 10px;border-radius:12px}.courseMenu nav{grid-template-columns:1fr 1fr}.courseMenu button{font-size:12px;padding:10px}.courseLesson{padding:20px 16px;border-radius:17px}.courseLesson h3{font-size:26px}.courseLesson p,.courseLesson li{font-size:14px;line-height:1.7}.courseTask{padding:12px;margin:18px 0}.courseProgress{gap:12px;margin-bottom:12px}.courseComplete{width:100%}.courseControls button{flex:1}.courseFine{font-size:10px}}
/* A quiet, book-like learning desk. */
.courseWorkspace{max-width:1180px;margin:auto}.courseHead{position:relative;padding:25px 0 15px}.courseHead h2{font-size:clamp(32px,4vw,49px);font-weight:600;line-height:1.1;margin:12px 0}.courseHead p{font-size:15px;margin:0 0 18px}.courseMeta{display:inline-block;font-size:11px;letter-spacing:.035em;border:1px solid #829c7d40;background:#ffffff50;border-radius:99px;padding:9px 14px;color:#42604c}.courseProgress{background:#ffffff40;border:1px solid #ffffff90;padding:13px 18px;border-radius:15px;margin:14px 0 28px;max-width:720px}.courseProgress progress{appearance:none;border:0;border-radius:8px;overflow:hidden;background:#9caf972c;max-width:none}.courseProgress progress::-webkit-progress-bar{background:#9caf972c}.courseProgress progress::-webkit-progress-value{background:linear-gradient(90deg,#254d39,#73946a);border-radius:8px;transition:width .4s}.courseProgress progress::-moz-progress-bar{background:#42694d}.coursePercent{font-size:12px}.courseLayout{grid-template-columns:235px minmax(0,1fr);gap:30px;perspective:1600px}.courseMenu{position:sticky;top:25px;background:#ffffff40;border-color:#ffffffb0;padding:14px;border-radius:23px;backdrop-filter:blur(18px)}.courseMenu summary{color:#506249;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.courseMenu button{border-radius:13px;min-height:56px;transition:background .2s,transform .2s}.courseMenu button:hover{background:#ffffff90;transform:translateX(3px)}.courseMenu button[aria-current=step]{background:linear-gradient(120deg,#274c37,#3a6248);color:#f5ffef;box-shadow:0 6px 16px #28402b19}.courseLesson{position:relative;overflow:hidden;transform-origin:left center;background:linear-gradient(105deg,#f1f4e9,#fcfdf5 9%,#f9fbf3 90%,#edf1e3);border:1px solid #fffffff0;border-radius:10px 28px 28px 10px;padding:38px 42px 26px;box-shadow:inset 7px 0 10px #5365430b,0 22px 55px #34522c12,4px 4px 0 #dee6d5,7px 7px 0 #f6faee}.courseLesson:before{content:'';position:absolute;left:16px;top:0;bottom:0;width:1px;background:#82916e16;pointer-events:none}.courseLesson h3{font-size:clamp(28px,3vw,38px);font-weight:600;max-width:620px;letter-spacing:-.045em;margin:16px 0 22px}.courseLesson>p{max-width:680px;font-size:16px;line-height:1.85}.courseLesson ul{list-style:none;padding:0;display:grid;gap:10px;margin:24px 0}.courseLesson li{position:relative;padding-left:25px;font-size:14px}.courseLesson li:before{content:'✓';position:absolute;left:0;color:#638454;font-weight:700}.courseLearningPath{padding:18px 0;border-top:1px solid #7b8f6925}.courseSteps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.courseStep{background:#e5ecdc65;border:1px solid #cbd7bf70;border-radius:13px;padding:13px;display:grid;gap:8px}.courseStep span{color:#708363;font-size:10px;letter-spacing:.1em}.courseStep strong{font-size:13px;font-weight:600}.courseTask{background:#e6eedf8c;border-left-color:#6b8858;border-radius:0 16px 16px 0;padding:21px 24px;margin-top:14px}.courseTask p{font-size:15px;line-height:1.75}.courseTask small{color:#5f7157}.courseComplete{background:#31593e;border-radius:99px;padding:12px 22px;transition:transform .2s,background .2s}.courseComplete:hover{background:#426f4c;transform:translateY(-2px)}.courseControls{align-items:center}.courseControls button{border-radius:99px;background:#ffffff80;padding:12px 20px}.courseControls button:not(:disabled):hover{background:#e0ead6}.courseControls button:disabled{cursor:default}.coursePageNumber{font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.12em;color:#718367}.courseFine{font-size:10px;opacity:.85;max-width:580px}.courseForward{animation:courseTurnForward .5s cubic-bezier(.2,.7,.25,1)}.courseBackward{animation:courseTurnBack .5s cubic-bezier(.2,.7,.25,1)}@keyframes courseTurnForward{from{opacity:.2;transform:rotateY(-9deg) translateX(18px)}to{opacity:1;transform:rotateY(0) translateX(0)}}@keyframes courseTurnBack{from{opacity:.2;transform:rotateY(7deg) translateX(-14px)}to{opacity:1;transform:rotateY(0) translateX(0)}}:where(html[data-motion="reduce"]) .courseForward,:where(html[data-motion="reduce"]) .courseBackward{animation:none}:where(html[data-motion="reduce"]) .courseWorkspace *{transition:none!important}@media(max-width:720px){.courseLayout{grid-template-columns:1fr;gap:16px}.courseMenu{position:static;padding:6px 10px;border-radius:17px}.courseMenu button{min-height:46px}.courseHead{padding-top:10px}.courseHead h2{font-size:32px}.courseProgress{gap:12px;padding:12px;font-size:11px;margin-bottom:18px}.courseLesson{padding:26px 24px 20px;border-radius:8px 22px 22px 8px}.courseLesson:before{left:10px}.courseLesson>p{font-size:14px}.courseSteps{gap:6px}.courseStep{padding:11px 8px}.courseStep strong{font-size:11px}.courseComplete{width:100%}.courseControls button{flex:0 1 auto;padding:11px 14px}.courseTask{padding:16px}.courseMeta{font-size:10px}}
.courseTopTools{display:flex;gap:8px;margin:10px 0 18px}.courseTopTools button{padding:11px 18px;border:1px solid #7b916650;border-radius:99px;background:#ffffff66;color:#34543c;font-size:13px;cursor:pointer}.courseTopTools button[aria-pressed=true]{background:#31593e;color:#fff}.courseMenu{max-height:80vh;overflow-y:auto;scrollbar-width:thin}.courseChapter{border-bottom:1px solid #81957426;padding:4px 0}.courseChapter:last-child{border:0}.courseChapter summary{line-height:1.6;font-size:10px;text-transform:none;letter-spacing:.02em}.courseChapter nav{display:grid;grid-template-columns:1fr}.courseChapter button{min-height:39px;padding:9px 12px;font-size:12px;line-height:1.5}.courseReadTime{font-size:11px;color:#70815f;display:block;margin:-8px 0 24px}.courseText{white-space:pre-line}.courseContent>p:first-child{font-size:11px;font-weight:600;letter-spacing:.04em;color:#6a7d5c;border-bottom:1px solid #83916e26;padding-bottom:15px}.courseContent p,.courseAnswers p{font-size:15px;line-height:1.9;max-width:690px}.courseSectionTitle{font-size:11px;letter-spacing:.08em;color:#547044;margin:28px 0 8px}.courseExercise{background:#e7eedd;border-radius:12px;padding:16px 20px}.courseAnswers{background:#ecf1e4;border:1px solid #ccd9c0;border-radius:14px;padding:16px 20px;margin:22px 0}.courseAnswers summary{cursor:pointer;color:#375e3f;font-size:13px;font-weight:600;line-height:1.5}.courseTask label{display:grid;gap:12px;font-size:13px;line-height:1.6;margin:14px 0 10px}.courseTask textarea{font:inherit;font-size:14px;line-height:1.7;color:#284332;border:1px solid #a4b29466;border-radius:12px;background:#ffffffe0;padding:15px;width:100%;box-sizing:border-box;resize:vertical}.courseTask a{display:inline-block;margin-top:16px;font-size:12px;color:#31593e;text-underline-offset:4px}.courseFigure{margin:28px 0}.courseFigure img{width:100%;height:auto;display:block;border-radius:14px;border:1px solid #9baa8440}.courseFigure figcaption{font-size:11px;color:#637554;line-height:1.7;margin:10px 0}.courseVideoLink{display:inline-block;padding:14px 20px;background:#294b37;color:white!important;border-radius:12px;text-decoration:none;margin:6px 0 20px;font-size:13px}.courseGlossary{background:#f8fbf0c9;border:1px solid #ffffffa0;border-radius:24px;padding:30px}.courseGlossary h3{font-size:30px;letter-spacing:-.04em;margin:0 0 22px}.courseGlossary label{display:grid;gap:8px;font-size:12px;max-width:600px}.courseGlossary input{font:inherit;font-size:15px;border:1px solid #8fa57f60;border-radius:12px;padding:14px;background:#fff;color:#284332;width:100%;box-sizing:border-box}.courseGlossaryList{display:grid;gap:8px;margin-top:18px}.courseGlossaryList details{background:#ffffff90;border:1px solid #8fa57f26;padding:14px 18px;border-radius:12px}.courseGlossaryList summary{cursor:pointer;font-size:14px;font-weight:600;color:#31593e}.courseGlossaryList p{font-size:14px;line-height:1.8;max-width:760px}.courseLanguageNote{font-size:12px!important;background:#e7eedd;padding:12px 16px;border-radius:10px}.courseFinish{background:#ddebd0;padding:18px;border-radius:12px;font-size:14px!important}.courseLesson:focus{outline:none}.courseLesson:focus-visible{outline:2px solid #547344;outline-offset:5px}@media(max-width:720px){.courseMenu{max-height:360px}.courseContent p,.courseAnswers p{font-size:14px;line-height:1.8}.courseChapter nav{grid-template-columns:1fr}.courseGlossary{padding:20px 16px}.courseGlossary h3{font-size:26px}.courseFigure{margin:20px 0}.courseAnswers{padding:14px}.courseText{overflow-wrap:anywhere}.courseHead h2{font-size:32px}}
.courseTopTools,.courseStages{flex-wrap:wrap}.courseStages{display:flex;gap:7px;margin:0 0 16px}.courseStages button{padding:9px 13px;border:1px solid #859a7640;border-radius:10px;background:#ffffff50;color:#4a6442;font-size:11px;cursor:pointer}.courseStages button[aria-pressed=true]{background:#d9e8ca;border-color:#73975d;color:#294c32}.courseLessonSearch{margin:12px 0 24px}.courseLessonSearch label{display:grid;gap:8px;max-width:700px;font-size:11px;color:#5d7452}.courseLessonSearch input{border:1px solid #9bb18b55;border-radius:12px;padding:13px 16px;font:inherit;font-size:14px;background:#ffffffe0;color:#294932;box-sizing:border-box;width:100%}.courseSearchResults{display:grid;gap:5px;max-height:320px;overflow:auto;margin-top:9px}.courseSearchResults button{padding:10px 14px;text-align:left;border:1px solid #a8bb9830;border-radius:10px;background:#ffffff90;color:#325438;font-size:12px;cursor:pointer}.courseSources{border-top:1px solid #90a07c30;margin:20px 0;padding-top:14px}.courseSources summary{font-size:11px;color:#5d7452;cursor:pointer}.courseSources a{display:block;font-size:12px;color:#426841;margin:12px 0;line-height:1.6;overflow-wrap:anywhere}.courseAtlas h3{font-size:32px;letter-spacing:-.04em;margin:18px 0 10px}.courseAtlas>p{font-size:14px;color:#58714d;line-height:1.7}.courseAtlasGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}.courseAtlasCard{padding:10px 10px 16px;border:1px solid #ffffffcc;border-radius:18px;background:#f7faef90;text-align:left;color:#2e5035;cursor:pointer;transition:transform .2s,box-shadow .2s;min-width:0}.courseAtlasCard:hover{transform:translateY(-4px);box-shadow:0 14px 30px #3f5c2915}.courseAtlasCard img{width:100%;height:auto;display:block;border-radius:12px}.courseAtlasCard strong{display:block;font-size:14px;line-height:1.5;margin:14px 8px 6px}.courseAtlasCard span{font-size:11px;color:#657e58;display:block;margin:0 8px}.courseRiskLab{padding:22px;border-radius:16px;background:#e2ecd6;margin:24px 0;border:1px solid #afc39966}.courseRiskLab h4{margin:0;font-size:15px;color:#305333}.courseRiskLab>p{font-size:12px;line-height:1.6}.courseRiskFields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.courseRiskFields label{display:grid;gap:6px;font-size:11px;color:#4f6744}.courseRiskFields input{min-width:0;width:100%;box-sizing:border-box;padding:11px;border:1px solid #9caf8840;border-radius:8px;font:inherit;font-size:14px;background:#fff;color:#294932}.courseRiskLab output{display:block;margin-top:18px;font-size:13px;line-height:1.7;color:#2e5133;font-weight:600}@media(max-width:900px){.courseAtlasGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.courseAtlasGrid{grid-template-columns:1fr}.courseRiskFields{grid-template-columns:repeat(2,minmax(0,1fr))}.courseAtlas h3{font-size:28px}.courseTopTools button{font-size:11px;padding:10px 14px}.courseRiskLab{padding:17px}}

.courseImageCheck{padding:18px 22px;background:#edf2e9;border-top:1px solid #c5d3c0;color:#25372c}.courseImageCheck strong{font-size:13px;text-transform:uppercase;letter-spacing:.08em}.courseImageCheck p{margin:8px 0 0;line-height:1.65}.courseContent>.courseFigure{margin:28px 0 32px}

.courseSectionTitle{font-size:14px;letter-spacing:.035em;line-height:1.5;margin-top:32px}.courseContent .courseText{margin:14px 0}.courseImageCheck{border-radius:14px;padding:18px 22px}.courseFigure a:focus-visible{outline:3px solid #547344;outline-offset:4px;display:block;border-radius:14px}
/* Kybera learning library */
.learningHome{padding-bottom:32px}.learningRank{position:relative;display:grid;grid-template-columns:100px minmax(0,1fr);gap:22px;background:linear-gradient(125deg,#102e24,#284c38);color:#eef5e3;border:1px solid #b6c89a40;border-radius:24px;padding:28px;margin:20px 0;overflow:hidden}.learningRank:after{content:'';position:absolute;right:-70px;top:-110px;width:300px;height:300px;border:1px solid #d9e8b41f;border-radius:50%;pointer-events:none}.learningRankBadge{width:88px;height:100px;display:grid;place-items:center;align-self:center;clip-path:polygon(50% 0,95% 24%,95% 75%,50% 100%,5% 75%,5% 24%);background:linear-gradient(145deg,#e3eabd,#7fa26b);color:#173b2b;font-size:36px;font-weight:600;box-shadow:inset 0 0 24px #f4faca80}.learningRank .courseEyebrow{color:#bace9d}.learningRankInfo strong{display:block;font-size:30px;font-weight:500;letter-spacing:-.04em;margin:6px 0}.learningRankInfo p{font-size:12px;color:#c5d5bb;margin:8px 0}.learningRankInfo progress{display:block;max-width:450px;width:100%;height:5px;accent-color:#c7dda1;margin:14px 0}.learningRankInfo small{font-size:11px;color:#d1dfc0}.learningRankLadder{grid-column:1/-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;border-top:1px solid #d6e6b924;padding-top:20px}.learningRankStep{display:grid;gap:7px;opacity:.55;padding:12px 8px;border-radius:10px;border:1px solid #c5dcac20}.learningRankStep.achieved{opacity:1;background:#d2e7ac0f}.learningRankStep[aria-current=step]{border-color:#d5e6b2a0;background:#d2e7ac19}.learningRankStep span{font-size:10px;color:#b9cf9e}.learningRankStep strong{font-size:12px}.learningRankStep small{font-size:10px;color:#b9cf9e}.learningRankNote{grid-column:1/-1;line-height:1.6;color:#b6c7aa;font-size:10px}.learningResume{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:28px;width:100%;text-align:left;background:#edf3e6;border:1px solid #fff;border-radius:22px;overflow:hidden;padding:0;color:#203f2d;cursor:pointer;margin:30px 0 40px;box-shadow:0 12px 35px #24412d0b;transition:transform .3s,box-shadow .3s}.learningResume img{width:100%;height:210px;object-fit:cover;transition:transform .6s}.learningResume>div{padding:20px 26px 20px 0}.learningResume strong{display:block;font-size:clamp(20px,2.5vw,30px);letter-spacing:-.04em;line-height:1.2;margin:12px 0}.learningResume p{font-size:12px;color:#647557}.learningResumeAction{display:inline-block;background:#31593e;color:#fff;border-radius:99px;padding:12px 20px;font-size:12px;margin-top:6px}.learningResume:hover{transform:translateY(-3px);box-shadow:0 20px 40px #24412d17}.learningResume:hover img{transform:scale(1.05)}.learningSectionTitle{font-size:30px;letter-spacing:-.04em;margin:16px 0 8px}.learningSectionIntro{font-size:13px;color:#5d7452;margin-bottom:24px}.learningModuleGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.learningModuleCard{padding:0;border:1px solid #fff;border-radius:20px;overflow:hidden;background:#f8fbef;color:#24432d;text-align:left;cursor:pointer;min-width:0;box-shadow:0 8px 24px #28402b0a;transition:transform .35s,box-shadow .35s;animation:learningReveal .55s both;animation-delay:calc(var(--card-order)*35ms)}.learningModuleVisual{position:relative;overflow:hidden;background:#17372c;aspect-ratio:1.1}.learningModuleVisual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.7,.3,1),filter .6s}.learningModuleNumber{position:absolute;left:20px;top:20px;color:#dfe8d0;font-size:9px;letter-spacing:.16em}.learningModuleArrow{position:absolute;bottom:18px;right:18px;border:1px solid #d8e8b550;color:#e8efd9;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-size:19px;background:#17372c66;transition:transform .3s}.learningModuleCopy{padding:22px}.learningModuleStage{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#687d58}.learningModuleCopy strong{display:block;font-size:21px;letter-spacing:-.035em;line-height:1.25;min-height:53px;margin:10px 0}.learningModuleCopy small{font-size:11px;color:#6c7d5e}.learningModuleCopy progress{display:block;width:100%;height:4px;margin-top:18px;accent-color:#658950}.learningModuleCard:hover{transform:translateY(-7px);box-shadow:0 22px 40px #28402b20}.learningModuleCard:hover img{transform:scale(1.08);filter:brightness(1.15)}.learningModuleCard:hover .learningModuleArrow{transform:rotate(45deg);background:#b4cf9466}.courseBackLibrary{border:0;border-bottom:1px solid #76935e40;background:transparent;color:#526c43;font:inherit;font-size:12px;cursor:pointer;padding:0 0 10px;margin-bottom:22px}.learningModuleHero{display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:center;margin:0 0 25px;background:#eff4e8;border-radius:22px;overflow:hidden}.learningModuleHero img{width:100%;height:260px;object-fit:cover}.learningModuleHero>div{padding:25px}.learningModuleHero h3{font-size:clamp(25px,3vw,38px);letter-spacing:-.04em;line-height:1.2;margin:14px 0}.learningModuleHero p{font-size:13px;color:#5f7751}.learningLessonList{display:grid;gap:10px}.learningLessonRow{display:grid;grid-template-columns:40px 1fr auto 24px;align-items:center;gap:15px;width:100%;text-align:left;padding:20px;border:1px solid #fff;border-radius:14px;background:#f8fbf0;color:#315439;cursor:pointer;transition:transform .2s,background .2s}.learningLessonRow:hover{transform:translateX(4px);background:#e8f1dd}.learningLessonIndex{font-size:12px;color:#82956c}.learningLessonRow strong{font-size:14px;font-weight:500;line-height:1.5}.learningLessonRow small{font-size:11px;color:#6b7c5c}.learningModuleDetail:focus{outline:none}#dashboardLearningRank{margin:0 0 22px}.learningRankCompact{margin-bottom:10px;padding:22px;border-radius:18px}.learningRankCompact .learningRankBadge{width:70px;height:80px;font-size:27px}.learningRankCompact .learningRankInfo strong{font-size:25px}.dashboardLearnButton{border:0;border-radius:99px;padding:12px 20px;background:#31593e;color:#fff;cursor:pointer;font:inherit;font-size:12px}@keyframes learningReveal{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1000px){.learningModuleGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.learningRankLadder{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.learningRank{padding:20px;grid-template-columns:65px minmax(0,1fr);gap:16px}.learningRankBadge{width:60px;height:70px;font-size:25px}.learningRankInfo strong{font-size:25px}.learningRankLadder{gap:5px}.learningRankStep{padding:10px 6px}.learningRankStep strong{font-size:10px}.learningModuleGrid{gap:12px}.learningModuleCopy{padding:15px}.learningModuleCopy strong{font-size:17px;min-height:64px}.learningModuleNumber{top:14px;left:12px;font-size:8px}.learningModuleArrow{width:30px;height:30px;right:12px;bottom:12px}.learningResume{grid-template-columns:110px 1fr;gap:16px;margin:24px 0}.learningResume img{height:230px}.learningResume>div{padding:16px 12px 16px 0}.learningResume strong{font-size:20px}.learningResumeAction{padding:10px 14px;font-size:11px}.learningModuleHero{grid-template-columns:1fr;gap:0}.learningModuleHero img{height:200px}.learningLessonRow{grid-template-columns:24px 1fr 18px;padding:16px 12px;gap:9px}.learningLessonRow small{display:none}.learningRankCompact .learningRankBadge{width:60px;height:70px}}@media(max-width:360px){.learningModuleGrid{grid-template-columns:1fr}}:where(html[data-motion="reduce"]) .learningModuleCard{animation:none}:where(html[data-motion="reduce"]) .learningHome *,:where(html[data-motion="reduce"]) .learningLessonRow{transition:none!important}:where(html[data-motion="reduce"]) .learningModuleCard:hover,:where(html[data-motion="reduce"]) .learningResume:hover,:where(html[data-motion="reduce"]) .learningLessonRow:hover,:where(html[data-motion="reduce"]) .learningModuleCard:hover img{transform:none}
/* A quiet rank indicator at the top of every course view. */
.courseRankStrip{position:relative;top:auto;overflow:hidden;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 20px;padding:12px 17px;background:#f0f5e8ed;backdrop-filter:blur(16px);border:1px solid #a7ba9445;border-radius:14px;box-shadow:0 5px 20px #28402b08;margin:12px 0 18px;color:#36563e}.courseRankTitle{display:flex;align-items:center;gap:12px;min-width:0}.courseRankTitle span{font-size:9px;letter-spacing:.12em;color:#7a8e69}.courseRankTitle strong{font-size:13px;font-weight:600}.courseRankCount{font-size:10px;font-variant-numeric:tabular-nums;color:#70835f}.courseRankStrip progress{appearance:none;border:0;width:100%;height:3px;border-radius:5px;overflow:hidden;background:#9caf972c;accent-color:#658750}.courseRankStrip progress::-webkit-progress-bar{background:#9caf972c}.courseRankStrip progress::-webkit-progress-value{background:#658750;border-radius:5px}.courseRankStrip progress::-moz-progress-bar{background:#658750}.courseRankNext{font-size:9px;color:#718661;text-align:right}.courseRankStrip+.courseHead{padding-top:8px}@media(max-width:600px){.courseRankStrip{padding:10px 12px;gap:7px 10px;border-radius:12px}.courseRankTitle{gap:8px}.courseRankTitle strong{font-size:12px}.courseRankTitle span{font-size:8px}.courseRankCount{font-size:9px}.courseRankNext{font-size:8px}}@media(max-width:360px){.courseRankTitle span{display:none}}
/* Always available lesson navigation, with explicit completion. */
.courseWorkspace:has(.coursePagerDock){padding-bottom:110px}.courseLesson{scroll-margin-top:100px}.coursePagerDock{position:fixed;z-index:20;bottom:14px;left:50%;transform:translateX(-50%);width:min(920px,calc(100% - 36px));box-sizing:border-box;background:#f6f9efed;backdrop-filter:blur(18px);border:1px solid #c3d0b4;border-radius:18px;padding:12px;box-shadow:0 8px 35px #18352822;gap:10px;margin:0}.coursePagerDock button{flex-shrink:0;min-height:46px;font-size:12px;padding:12px 18px}.coursePagerDock .coursePagerFinish{background:#31593e;color:#fff;border-color:#31593e}.coursePagerDock .coursePagerFinish:hover:not(:disabled){background:#416f49;color:#fff}.coursePagerInfo{display:grid;gap:5px;min-width:0;flex:1;text-align:center}.coursePagerInfo small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:10px;color:#718367}.courseRankMiniBadge{width:34px;height:34px;object-fit:contain;flex-shrink:0}.courseRankTitle{gap:9px}.learningRankBadge{clip-path:none;background:none;box-shadow:none;width:100px;height:110px}.learningBadgeImage{width:100%;height:100%;object-fit:contain}.learningRankCompact .learningRankBadge{width:84px;height:92px}.courseRankPromotion{position:fixed;z-index:40;top:100px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:64px auto;column-gap:14px;align-items:center;padding:16px 25px;border-radius:18px;background:#19382df5;color:#e4edce;border:1px solid #b9cf8d80;box-shadow:0 15px 50px #16332430;pointer-events:none;animation:rankPromotion 4s both}.courseRankPromotion img{grid-row:1/3;width:64px;height:64px;animation:rankBadgeReveal .6s ease-out}.courseRankPromotion span{font-size:11px;color:#b9cf9c}.courseRankPromotion strong{font-size:23px;font-weight:500;letter-spacing:-.03em}@keyframes rankBadgeReveal{from{transform:scale(.6) rotate(-12deg)}to{transform:scale(1) rotate(0)}}@keyframes rankPromotion{0%{opacity:0;translate:0 -15px}12%,80%{opacity:1;translate:0 0}100%{opacity:0;visibility:hidden;translate:0 -8px}}@media(max-width:650px){.coursePagerDock{width:calc(100% - 20px);bottom:calc(10px + env(safe-area-inset-bottom));padding:9px;gap:7px;flex-wrap:wrap;border-radius:15px}.coursePagerDock button{font-size:11px;min-height:42px;padding:10px 14px}.coursePagerInfo{flex:1}.coursePagerInfo small{display:none}.coursePagerDock .coursePagerFinish{flex-basis:100%;width:100%}.courseWorkspace:has(.coursePagerDock){padding-bottom:155px}.courseRankMiniBadge{width:28px;height:28px}.learningRankBadge{width:70px;height:78px}.learningRankCompact .learningRankBadge{width:70px;height:78px}.courseRankTitle span{display:none}.courseRankPromotion{top:85px;padding:12px 18px;white-space:nowrap}.courseRankPromotion strong{font-size:20px}}:where(html[data-motion="reduce"]) .courseRankPromotion{animation:rankPromotionQuiet 4s both}:where(html[data-motion="reduce"]) .courseRankPromotion img{animation:none}@keyframes rankPromotionQuiet{0%,80%{opacity:1}100%{opacity:0;visibility:hidden}}

/* A soft, occasional sheen; rank stays in the normal document flow. */
.courseRankStrip::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(110deg,transparent 40%,#ffffff55 48%,#ffffff18 52%,transparent 60%);transform:translateX(-110%);animation:courseRankSheen 9s ease-in-out infinite}.courseRankMiniBadge{filter:drop-shadow(0 0 3px #bdcc9860)}@keyframes courseRankSheen{0%,65%{transform:translateX(-110%)}90%,100%{transform:translateX(110%)}}:where(html[data-motion="reduce"]) .courseRankStrip::after{animation:none;display:none}
.courseSyncStatus{grid-column:1/-1;justify-self:start;border:0;padding:2px 0;background:none;color:#567246;font:inherit;font-size:10px;line-height:1.5;cursor:pointer}.courseSyncStatus:disabled{opacity:1;cursor:default}.learningRank .courseSyncStatus{color:#c6d9ae}.courseRankCount{white-space:nowrap}@media(max-width:650px){.courseRankStrip{grid-template-columns:minmax(0,1fr);gap:9px;padding:13px 15px}.courseRankTitle{grid-column:1;font-size:13px}.courseRankTitle strong{font-size:14px}.courseRankCount{grid-column:1;font-size:12px;color:#35543b;display:block}.courseRankStrip progress{grid-column:1;display:block;min-width:0;max-width:100%;height:6px}.courseRankNext{grid-column:1;text-align:left;font-size:11px}.courseSyncStatus{font-size:10px}.learningRankCompact{grid-template-columns:70px minmax(0,1fr)}.learningRankInfo progress{min-width:0;width:100%}}

/* Keep the completion action reachable on desktop zoom and narrow windows. */
.coursePagerDock{flex-wrap:wrap}.coursePagerDock .coursePagerFinish{min-width:180px}.coursePagerDock button:last-child:not(.coursePagerFinish){font-size:11px;background:transparent;border-color:transparent;color:#65795b}.coursePagerDock button:focus-visible{outline:3px solid #31593e;outline-offset:3px}
@media(max-width:650px){.coursePagerDock .coursePagerFinish{order:4}.coursePagerDock button:last-child:not(.coursePagerFinish){order:3}.coursePagerDock .coursePagerInfo{order:2}.coursePagerDock button:first-child{order:1}}
/* Clearer modules and a calmer reading experience. */
.courseTopTools{display:flex;gap:7px;padding:7px;border:1px solid #ffffffb0;background:#ffffff45;border-radius:18px;width:fit-content;max-width:100%;box-sizing:border-box}.courseTopTools button{border:0!important;border-radius:12px!important;min-height:44px;transition:background .2s,box-shadow .2s}.courseTopTools button[aria-pressed=true]{background:#284d39!important;color:#f6faed!important;box-shadow:0 4px 12px #24412d19}.learningResume{background:linear-gradient(110deg,#edf4e7,#fafcf5);border-color:#ffffffd9}.learningModuleVisual{aspect-ratio:1.4}.learningModuleStatus{position:absolute;left:18px;bottom:18px;padding:7px 10px;border:1px solid #dfedca50;border-radius:99px;background:#183b2bd9;color:#e4efd6;font-size:10px;backdrop-filter:blur(8px)}.learningModuleCard[data-state=complete]{border-color:#73956470}.learningModuleCard[data-state=complete] .learningModuleStatus{background:#d6e9b9;color:#294d37}.learningModuleCopy strong{min-height:52px}.learningModuleCopy progress{appearance:none;border:0;border-radius:99px;overflow:hidden;background:#dce5d3;height:5px}.learningModuleCopy progress::-webkit-progress-bar{background:#dce5d3}.learningModuleCopy progress::-webkit-progress-value{background:linear-gradient(90deg,#31593e,#91ae6f)}.learningModuleCopy progress::-moz-progress-bar{background:#658950}.learningModuleStart{padding:13px 22px;min-height:46px;border:0;border-radius:99px;background:#31593e;color:#f6faef;font:inherit;font-size:13px;cursor:pointer;transition:background .2s,transform .2s}.learningModuleStart:hover{background:#436e48;transform:translateY(-2px)}.learningModuleProgress{font-variant-numeric:tabular-nums}.learningLessonRow[data-state=complete]{background:#eaf1e2;border-color:#aabe963e}.learningLessonRow[data-state=complete] .learningLessonIndex{color:#31593e;font-weight:700}.learningLessonRow[data-state=current]{border-color:#769a6260;box-shadow:inset 3px 0 #628653}.courseLesson{border-radius:24px;padding:38px 42px;box-shadow:0 15px 45px #34522c0f;background:linear-gradient(130deg,#fbfcf7,#f1f5eb)}.courseLesson:before{display:none}.courseContent{max-width:72ch;margin:auto}.courseContent .courseText{white-space:pre-line;line-height:1.9;font-size:15px}.courseSectionTitle{margin:34px 0 12px;color:#31593e;font-size:12px;font-weight:700;letter-spacing:.08em}.courseKeyPoint{background:#e7efde;border:1px solid #bfd0ab70;border-radius:15px;padding:18px 22px}.coursePracticeTitle{border-top:1px solid #a7b89550;padding-top:25px;color:#31593e}.courseExercise{padding:20px 22px;background:#e5eedc;border:1px solid #b4c6a370;border-radius:15px}.courseReadTime{display:block;font-size:11px;color:#6b7f5e;margin-bottom:25px}.courseAnswers{background:#ffffff90;border:1px solid #bccdab50;border-radius:16px;margin:25px 0}.courseAnswers summary{min-height:44px;display:list-item;box-sizing:border-box;line-height:1.6;cursor:pointer}.courseMenu{max-height:calc(100vh - 70px);overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}.courseMenu summary{line-height:1.7}.courseMenu button{line-height:1.6}.coursePagerDock{box-shadow:0 12px 40px #1835281f}.courseWorkspace button{touch-action:manipulation}.courseLessonSearch{margin-top:26px}.courseSearchResults small{padding:8px 4px;color:#607854;font-size:12px}.courseWorkspace progress{transition:all .25s}.courseFigure img{background:#fff}.courseFigure figcaption{font-size:12px}.courseWorkspace a{overflow-wrap:anywhere}
@media(max-width:900px){.courseLayout{grid-template-columns:200px minmax(0,1fr);gap:16px}.courseLesson{padding:28px 24px}}
@media(max-width:720px){.courseLayout{grid-template-columns:1fr}.courseMenu{position:relative;top:auto;max-height:230px}.courseLesson{padding:24px 20px;border-radius:20px}.courseTopTools{width:100%;display:grid;grid-template-columns:1fr 1fr}.courseTopTools button{font-size:11px;padding:10px}.courseContent .courseText{font-size:14px;line-height:1.85}.courseKeyPoint,.courseExercise{padding:16px}.learningModuleVisual{aspect-ratio:1.2}.learningModuleStatus{left:10px;bottom:10px;font-size:9px;padding:6px 8px}.learningModuleCopy strong{font-size:17px;min-height:64px}.learningModuleHero>div{padding:22px}.courseRankStrip{background:#f4f8eee8}.coursePagerDock .coursePagerFinish{min-height:46px}.courseFigure figcaption{font-size:11px}}
@media(hover:none){.learningModuleCard:hover,.learningResume:hover,.learningLessonRow:hover{transform:none}.learningModuleCard:hover img{transform:none;filter:none}}
:where(html[data-motion="reduce"]) .courseWorkspace *{scroll-behavior:auto!important;transition:none!important}:where(html[data-motion="reduce"]) .learningModuleStart:hover{transform:none}
/* A botanical study space: foliage frames the desk, never the reading area. */
.courseWorkspace{position:relative;isolation:isolate}.courseWorkspace::before,.courseWorkspace::after{content:'';position:absolute;z-index:-1;pointer-events:none;background:url('/account/course-assets/botanical-corner.svg') center/contain no-repeat;width:clamp(180px,25vw,350px);height:420px;opacity:.22;filter:drop-shadow(10px 16px 18px #28412b12)}.courseWorkspace::before{left:-85px;top:45px;transform:rotate(25deg)}.courseWorkspace::after{right:-65px;top:620px;transform:scaleX(-1) rotate(12deg);opacity:.17}.courseHead{border-radius:26px;background:radial-gradient(ellipse at 90% 20%,#c3cda14a,transparent 65%);padding:28px 24px 18px;margin:20px -12px 18px}.courseHead:after{content:'';position:absolute;right:12px;top:-30px;width:155px;height:185px;background:url('/account/course-assets/botanical-corner.svg') center/contain no-repeat;transform:rotate(160deg);opacity:.3;pointer-events:none}.courseHead h2,.courseHead p,.courseHead .courseMeta{position:relative;z-index:1}.courseHead h2{max-width:85%}.courseLesson{background:radial-gradient(ellipse at 100% 0%,#c5d2ad55,transparent 45%),radial-gradient(ellipse at 0% 100%,#ddc8a947,transparent 55%),linear-gradient(135deg,#f4f0e5,#ecf1e3);border-color:#fff8e2a0;box-shadow:0 16px 46px #344b2912,inset 0 1px #fff9}.learningModuleCard{background:linear-gradient(145deg,#f0eddf,#e7eedc);border-color:#fbf7e1a0}.learningModuleCopy{background:radial-gradient(ellipse at 100% 100%,#cbd7b54d,transparent 70%)}.learningResume,.learningModuleHero{background:radial-gradient(ellipse at 100% 0%,#ced6ae66,transparent 70%),linear-gradient(120deg,#e9eedc,#f0eadd);border-color:#faf5df}.learningResume>div,.learningModuleHero>div{position:relative}.learningResume>div:after{content:'';position:absolute;right:-36px;bottom:-65px;width:145px;height:180px;background:url('/account/course-assets/botanical-corner.svg') center/contain no-repeat;opacity:.14;transform:scaleX(-1) rotate(-25deg);pointer-events:none}.learningResume>div>*{position:relative;z-index:1}.courseMenu,.courseGlossary,.courseTopTools{background:linear-gradient(140deg,#eeeaddc4,#e4ecd9b5);border-color:#fff7e09c}.courseRankStrip{background:linear-gradient(110deg,#ecefdedb,#e6ecdadb);border-color:#b7c69b66}.learningLessonRow{background:linear-gradient(110deg,#f0eee2,#e8eedd);border-color:#fff8df99}.courseAnswers{background:#f4efdfb0}.courseKeyPoint,.courseExercise,.courseRiskLab{background:linear-gradient(130deg,#dfe9cc,#e6e8d3)}.courseImageCheck{background:#e4ead8}.coursePagerDock{background:linear-gradient(120deg,#f0eddfef,#e8eeddef);border-color:#b9c5a5}.courseLessonSearch input,.courseGlossary input{background:#f4f1e8e0}.courseFigure img{background:#f4f1e8}.courseLesson,.courseGlossary{overflow-wrap:anywhere}
@media(max-width:720px){.courseWorkspace::before{left:-18px;width:160px;top:100px;opacity:.13}.courseWorkspace::after{right:0;width:135px;opacity:.1}.courseHead{margin:14px 0;padding:22px 16px 14px;overflow:hidden}.courseHead:after{width:105px;height:135px;right:-22px;top:-14px;opacity:.22}.courseHead h2{max-width:90%}.learningResume>div:after{width:95px;height:125px;opacity:.1;right:-18px}.courseLesson{background:radial-gradient(ellipse at 100% 0%,#c5d2ad44,transparent 50%),linear-gradient(145deg,#f3efe4,#eaf0df)}}
@media(prefers-contrast:more){.courseWorkspace::before,.courseWorkspace::after,.courseHead:after,.learningResume>div:after{display:none}.courseLesson{background:#f3f1e8}}
/* Keep decorative edges inside the workspace at every viewport width. */
.courseWorkspace::before{left:0;transform:none}.courseWorkspace::after{right:0;transform:scaleX(-1)}
/* A hint of aurora and slow orbital light around the learning desk. */
.courseHead{isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 8% 20%,#b1d8cd66,transparent 55%),radial-gradient(ellipse at 90% 75%,#c3bfe052,transparent 60%),linear-gradient(120deg,#e6eddc8c,#e1eee580);border:1px solid #f8ffec88;box-shadow:inset 0 1px #fff9,0 10px 40px #536b5010}.courseHead:before{content:'';position:absolute;z-index:-1;inset:-20%;pointer-events:none;background:radial-gradient(ellipse at 20% 35%,#85cbb36b,transparent 38%),radial-gradient(ellipse at 75% 60%,#b5a5d866,transparent 38%),radial-gradient(ellipse at 55% 80%,#dfd1914d,transparent 35%);animation:learningAurora 18s ease-in-out infinite alternate;transform-origin:center}.courseLesson{background:radial-gradient(ellipse at 100% 0%,#b9d9c65c,transparent 48%),radial-gradient(ellipse at 0% 100%,#c7bfdc42,transparent 48%),linear-gradient(135deg,#f1efdf,#e8efdf);border-color:#f6ffe7b0;box-shadow:0 16px 46px #344b2912,inset 0 1px #fff9}.learningModuleCard:nth-child(3n+1){background:linear-gradient(140deg,#eeeedd,#dfece0)}.learningModuleCard:nth-child(3n+2){background:linear-gradient(140deg,#eeedde,#e6e3ec)}.learningModuleCard:nth-child(3n){background:linear-gradient(140deg,#e8eddf,#eee4d2)}.learningModuleCard{position:relative}.learningModuleVisual:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#dfffe019 47%,#f2e7ff12 52%,transparent 67%);transform:translateX(-120%);animation:learningOrbit 13s ease-in-out infinite;animation-delay:calc(var(--card-order)*1.3s)}.learningModuleCard:hover{box-shadow:0 20px 45px #52705a23,0 0 0 1px #a9cda785}.learningModuleCard:focus-visible{box-shadow:0 0 0 4px #bdd7ab70}.learningResume{background:radial-gradient(ellipse at 80% 15%,#bcd4e166,transparent 55%),radial-gradient(ellipse at 45% 100%,#d4c4e54d,transparent 55%),linear-gradient(120deg,#e5edd8,#ece9da)}.learningResumeAction,.learningModuleStart,.coursePagerDock .coursePagerFinish{background:linear-gradient(115deg,#315b44,#47695b)!important;box-shadow:0 4px 16px #4d796128;transition:transform .25s,box-shadow .25s}.learningResume:hover .learningResumeAction,.learningModuleStart:hover,.coursePagerDock .coursePagerFinish:hover:not(:disabled){box-shadow:0 6px 22px #638b5640}.learningModuleHero{background:radial-gradient(ellipse at 100% 10%,#c0d7db70,transparent 60%),linear-gradient(130deg,#e4ecd6,#e9e4dc)}.courseRankStrip{background:linear-gradient(110deg,#e2ebdcd9,#dceae5d9,#e5e1ecd9);box-shadow:0 5px 22px #456c5211,inset 0 1px #fff9}.coursePagerDock{background:linear-gradient(110deg,#efeddfef,#dfebe5f0,#e7e4edf0);box-shadow:0 10px 35px #405b4824,inset 0 1px #fff9}.courseWorkspace::before{animation:learningFoliage 16s ease-in-out infinite alternate;transform-origin:bottom left}.courseWorkspace::after{animation:learningFoliageRight 20s ease-in-out infinite alternate;transform-origin:bottom right}
@keyframes learningAurora{from{transform:translate3d(-2%,-2%,0) scale(1)}to{transform:translate3d(3%,3%,0) scale(1.08)}}@keyframes learningOrbit{0%,55%{transform:translateX(-120%)}90%,100%{transform:translateX(120%)}}@keyframes learningFoliage{from{transform:translateY(0)}to{transform:translateY(-9px)}}@keyframes learningFoliageRight{from{transform:scaleX(-1) translateY(0)}to{transform:scaleX(-1) translateY(-7px)}}
@media(max-width:720px){.courseHead:before{animation-duration:24s}.courseLesson{background:radial-gradient(ellipse at 100% 0%,#bad9c64d,transparent 50%),linear-gradient(145deg,#f0ecdf,#e5eddd)}.learningModuleVisual:after{animation:none;transform:none;background:linear-gradient(115deg,transparent,#def5ed0d,transparent)}}
:where(html[data-motion="reduce"]) .courseHead:before,:where(html[data-motion="reduce"]) .courseWorkspace::before,:where(html[data-motion="reduce"]) .courseWorkspace::after,:where(html[data-motion="reduce"]) .learningModuleVisual:after{animation:none!important}:where(html[data-motion="reduce"]) .courseHead:before{transform:none}:where(html[data-motion="reduce"]) .courseWorkspace::after{transform:scaleX(-1)}:where(html[data-motion="reduce"]) .learningModuleVisual:after{display:none}
.courseSimpleIntro{padding:20px 24px;margin:22px 0 28px;border:1px solid #b4c69d70;border-radius:18px;background:linear-gradient(125deg,#dbe8cf,#dfeae2);box-shadow:inset 0 1px #ffffff70}.courseSimpleIntro p{font-size:17px;line-height:1.8;margin:10px 0 0;max-width:65ch;color:#294b37}.courseNumberExample{padding:14px 18px;background:#e7eadd70;border:1px dashed #a9b79a80;border-radius:12px;margin:18px 0}.courseNumberExample summary{cursor:pointer;font-size:12px;line-height:1.7;color:#516846}.courseNumberExample[open]{background:#eff0e5}.courseNumberExample p{font-size:13px!important}.courseContent>.courseFigure:first-child{margin-top:0}.courseContent .courseText{max-width:68ch}@media(max-width:720px){.courseSimpleIntro{padding:17px 18px}.courseSimpleIntro p{font-size:16px;line-height:1.75}}

/* User-supplied learning illustrations: presentation-only colour styling; source arrows and geometry preserved. */
.courseTeachingFigure{border:1px solid #ffffffa0;border-radius:22px;overflow:hidden;background:radial-gradient(ellipse at 100% 0%,#d7e6d7,transparent 70%),linear-gradient(130deg,#eee9da,#e4eddb);box-shadow:0 12px 36px #294b3712}.courseTeachingFigure>a{display:block;overflow:hidden}.courseTeachingFigure img{border:0;border-radius:0;background:transparent;mix-blend-mode:multiply;filter:sepia(.24) saturate(.68) hue-rotate(12deg) brightness(.98)}.courseTeachingFigure figcaption{padding:0 20px;color:#4a654e}.courseTeachingFigure .courseImageCheck{background:linear-gradient(125deg,#dce8d2,#dce9e2);border-radius:0;padding:18px 20px;border-top:1px solid #aabd9e50}.courseTeachingFigure .courseImageCheck p{font-size:15px;line-height:1.8}.courseOriginalChart{border:1px solid #aabd9e60;border-radius:14px;padding:14px 18px;margin:24px 0;background:#edeedf60}.courseOriginalChart>summary{cursor:pointer;color:#526c49;font-size:12px;line-height:1.7}.courseOriginalChart .courseFigure{margin-bottom:0}@media(max-width:720px){.courseTeachingFigure{border-radius:16px}.courseTeachingFigure figcaption{padding:0 14px}.courseTeachingFigure .courseImageCheck{padding:16px 14px}.courseTeachingFigure .courseImageCheck p{font-size:14px}}

/* Generated Kybera artwork already carries the palette. */
.courseNativeFigure img{filter:none;mix-blend-mode:normal}.courseNativeFigure{background:#efeadd}.courseNativeFigure .courseImageCheck p{max-width:66ch}

.courseImageLegend{padding:0 20px 18px;color:#42604a;font-size:12px}.courseImageLegend summary{cursor:pointer;line-height:1.7}.courseImageLegend p{font-size:13px!important;line-height:1.75!important;margin:10px 0 0}

/* Keep lesson images and grid items inside the phone viewport. */
@media(max-width:720px){
 .courseWorkspace{min-width:0;max-width:100%;overflow-x:clip}
 .courseWorkspace,.courseWorkspace *,.courseWorkspace::before,.courseWorkspace::after{box-sizing:border-box}
 .courseLayout{grid-template-columns:minmax(0,1fr)}
 .courseLayout>*,.courseContent,.courseFigure,.courseFigure>a,.courseMenu nav,.courseGlossary label,.courseLessonSearch label,.courseRiskFields>*,.learningModuleGrid>*,.learningResume>*,.learningModuleHero>*,.learningLessonRow>*{min-width:0;max-width:100%}
 .courseFigure>a{display:block}
 .courseFigure img{width:100%;max-width:100%;height:auto;object-fit:contain}
 .courseWorkspace img,.courseWorkspace input,.courseWorkspace button{max-width:100%}
 .courseMenu nav,.courseTopTools{grid-template-columns:repeat(2,minmax(0,1fr))}
 .courseSteps{grid-template-columns:repeat(3,minmax(0,1fr))}
 .courseWorkspace button,.courseStep{overflow-wrap:anywhere}
 .courseRankPromotion{max-width:calc(100% - 24px);white-space:normal;grid-template-columns:64px minmax(0,1fr)}
}
@media(max-width:600px){
 .learningResume{grid-template-columns:110px minmax(0,1fr)}
 .learningLessonRow{grid-template-columns:24px minmax(0,1fr) 18px}
 .courseControls{flex-wrap:wrap}
 .coursePagerDock button{min-width:0}
 .coursePagerDock .coursePagerFinish{min-width:0}
}
/* Constrain the page itself while the course is open, including iOS viewport scrolling. */
@media(max-width:720px){
 html:has(.courseWorkspace:not([hidden])),body:has(.courseWorkspace:not([hidden])){overflow-x:hidden;overscroll-behavior-x:none}
 .dashboard-panel:has(>.courseWorkspace:not([hidden])){min-width:0;max-width:100%}
 .courseWorkspace{width:100%}
}

/* Mechanical rank assembly: segmented armor locks around the Kybera core. */
.learningRankBadge,.learningRankCompact .learningRankBadge{clip-path:none;background:none;box-shadow:none;overflow:visible}
.learningBadgeImage{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 9px #020d0980)}
.rankBadgeTrigger{display:grid;place-items:center;padding:0!important;border:0!important;background:transparent!important;cursor:pointer;min-height:44px;min-width:44px;border-radius:10px}
.rankBadgeTrigger:hover .courseRankMiniBadge{filter:drop-shadow(0 0 8px #79c7ac);transform:scale(1.12)}
.courseRankMiniBadge{width:42px;height:42px;transition:transform .25s,filter .25s}
.courseRankPromotion{top:90px;display:flex;flex-direction:column;gap:9px;width:340px;max-width:calc(100% - 24px);padding:24px 24px 19px;text-align:center;white-space:normal;pointer-events:auto;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#31564be8,#102920f7 70%);border:1px solid #a5c9b588;box-shadow:0 20px 75px #071a1350,inset 0 1px #e7ffe540;animation:rankAssemblyNotice 6s both;backdrop-filter:none}
.courseRankPromotion>span{font-size:10px;letter-spacing:.18em;color:#b6d6c2}
.courseRankPromotion>strong{font-size:27px;color:#f4f4df;letter-spacing:-.035em}
.rankAssembly{width:210px;height:210px;position:relative;flex:none;isolation:isolate;margin:-10px auto 0;filter:none}
.courseRankPromotion .rankAssembly img{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:contain;animation:none}
.courseRankPromotion .rankAssembly .rankAssemblyPart{animation:rankArmorLock 2.2s cubic-bezier(.22,.72,.28,1) both;transform-origin:50% 50%;will-change:transform,opacity}
.rankPart-top{clip-path:polygon(0 0,100% 0,100% 30%,0 30%);--dx:0px;--dy:-95px;--twist:-12deg;animation-delay:0s!important}
.rankPart-left{clip-path:polygon(0 30%,33% 30%,33% 74%,0 74%);--dx:-110px;--dy:20px;--twist:-12deg;animation-delay:.13s!important}
.rankPart-right{clip-path:polygon(67% 30%,100% 30%,100% 74%,67% 74%);--dx:110px;--dy:20px;--twist:12deg;animation-delay:.26s!important}
.rankPart-bottom{clip-path:polygon(0 74%,100% 74%,100% 100%,0 100%);--dx:0px;--dy:100px;--twist:8deg;animation-delay:.39s!important}
.rankPart-core{clip-path:polygon(33% 30%,67% 30%,67% 74%,33% 74%);--dx:0px;--dy:0px;--twist:18deg;animation-delay:.52s!important}
.courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:rankCoreOnline .35s 1.88s both}
.rankAssemblyPulse{position:absolute;inset:20%;border:1px solid #c5ffe2;border-radius:50%;opacity:0;animation:rankCorePulse .8s 1.9s both;pointer-events:none}
.courseRankPromotion .rankSoundToggle{min-height:36px;padding:8px 13px;border-radius:99px;border:1px solid #adcdb23d;background:#b4dcc20c;color:#c3d7c9;font:inherit;font-size:11px;cursor:pointer;margin-top:3px}
/* Keep clipped SVG pieces in 2D and visible until the complete badge covers them. */
@keyframes rankArmorLock{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--twist))}12%{opacity:1}55%,95%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(0,0) rotate(0)}}
@keyframes rankCoreOnline{from{opacity:0;transform:none}to{opacity:1;transform:none}}
@keyframes rankCorePulse{0%{opacity:.7;transform:scale(.3)}100%{opacity:0;transform:scale(2.1)}}
@keyframes rankAssemblyNotice{0%{opacity:0;transform:translate(-50%,-16px)}7%,85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;visibility:hidden;transform:translate(-50%,-8px)}}
@media(max-width:720px){.courseRankPromotion{top:80px;width:300px;padding:18px}.rankAssembly{width:180px;height:180px}.courseRankMiniBadge{width:38px;height:38px}}
:where(html[data-motion="reduce"]) .courseRankPromotion{animation:rankPromotionQuiet 6s both;transform:translateX(-50%)}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyPart,:where(html[data-motion="reduce"]) .rankAssemblyPulse{display:none}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:none;opacity:1;transform:none}:where(html[data-motion="reduce"]) .rankBadgeTrigger:hover .courseRankMiniBadge{transform:none}
.learningRankBadge[role=button]{cursor:pointer;border-radius:12px}.learningRankBadge[role=button]:focus-visible{outline:2px solid #bce6cb;outline-offset:4px}

/* A real rank-up gets a viewport-sized celebration; badge replay stays compact. */
.courseRankPromotion.rankScreenPromotion{position:fixed;z-index:10000;inset:0;top:0;left:0;width:100%;height:100%;height:100dvh;max-width:none;box-sizing:border-box;transform:none;display:flex;justify-content:center;align-items:center;gap:14px;margin:0;padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom));border:0;border-radius:0;background:radial-gradient(ellipse at 50% 45%,#305d4de8,#081812f5 74%);backdrop-filter:none;box-shadow:none;overflow:hidden;isolation:isolate;animation:rankScreenReveal 6s both}
.rankScreenPromotion .rankAssembly{width:min(380px,55vw,44dvh);height:min(380px,55vw,44dvh);margin:0;filter:none;z-index:1}
.rankScreenPromotion>span{font-size:clamp(11px,1.6vw,16px);letter-spacing:.32em;z-index:1;animation:rankScreenText 1.9s both}
.rankScreenPromotion>strong{font-size:clamp(34px,6vw,70px);line-height:1.1;text-shadow:0 0 28px #a5ecc52b;z-index:1;animation:rankScreenText 2.1s both}
.rankScreenPromotion .rankScreenMilestone{font-size:13px;color:#b6cfbe;z-index:1;animation:rankScreenText 2.2s both}
.rankScreenPromotion .rankSoundToggle{z-index:1;order:5;margin-top:0}
.rankScreenPromotion .rankScreenClose{z-index:1;order:4;font:inherit;font-size:13px;border:1px solid #bde0bf66;border-radius:99px;padding:12px 24px;min-height:44px;color:#e8f5df;background:#a8d5b517;cursor:pointer;margin-top:8px}
.rankScreenClose:hover{background:#a8d5b52b}.rankScreenClose:focus-visible,.rankSoundToggle:focus-visible{outline:2px solid #d6ffde;outline-offset:4px}
.rankScreenEffects{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
.rankScreenRing{position:absolute;left:50%;top:40%;width:min(65vw,65vh);aspect-ratio:1;border:1px solid #b1e8c333;border-radius:50%;animation:rankScreenWave 2.5s .8s both}
.rankScreenRing.ringTwo{border:1px dashed #b1e8c329;animation-delay:1.05s}
.rankScreenBeam{position:absolute;left:50%;top:40%;width:min(700px,90vw);height:1px;background:linear-gradient(90deg,transparent,#a4eac163,transparent);transform-origin:left;animation:rankScreenSweep 2.8s both}
.rankScreenBeam.beamTwo{animation-delay:.25s;opacity:.4}
.rankScreenPromotion .rankPart-left{--dx:-140px;--twist:-12deg}.rankScreenPromotion .rankPart-right{--dx:40vw;--twist:18deg}.rankScreenPromotion .rankPart-top{--dy:-120px}.rankScreenPromotion .rankPart-bottom{--dy:120px}
@keyframes rankScreenReveal{0%{opacity:0}6%,85%{opacity:1}100%{opacity:0;visibility:hidden}}
@keyframes rankScreenText{0%,65%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:none}}
@keyframes rankScreenWave{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}20%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}
@keyframes rankScreenSweep{0%{opacity:0;transform:translateX(-50%) rotate(-25deg)}20%{opacity:.5}100%{opacity:0;transform:translateX(-50%) rotate(25deg)}}
@media(max-width:720px){.rankScreenPromotion .rankAssembly{width:min(290px,75vw,40dvh);height:min(290px,75vw,40dvh)}.rankScreenPromotion>strong{font-size:clamp(32px,9vw,48px)}.rankScreenPromotion>span{font-size:11px;letter-spacing:.2em}}
:where(html[data-motion="reduce"]) .courseRankPromotion.rankScreenPromotion{animation:rankScreenReveal 6s both;transform:none}:where(html[data-motion="reduce"]) .rankScreenEffects{display:none}:where(html[data-motion="reduce"]) .rankScreenPromotion>span,:where(html[data-motion="reduce"]) .rankScreenPromotion>strong,:where(html[data-motion="reduce"]) .rankScreenPromotion .rankScreenMilestone{animation:none;transform:none;opacity:1}
/* Short phone landscapes and small laptop windows keep every control visible. */
@media(max-height:500px){
 .courseRankPromotion.rankScreenPromotion{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto auto;gap:8px 20px;align-content:center;padding:18px max(18px,env(safe-area-inset-right)) 18px max(18px,env(safe-area-inset-left))}
 .rankScreenPromotion .rankAssembly{grid-column:1;grid-row:1/6;justify-self:center;align-self:center;width:min(280px,42vw,70dvh);height:min(280px,42vw,70dvh)}
 .rankScreenPromotion>span{grid-column:2;grid-row:1;font-size:10px;letter-spacing:.12em}
 .rankScreenPromotion>strong{grid-column:2;grid-row:2;font-size:clamp(24px,4vw,40px);overflow-wrap:anywhere}
 .rankScreenPromotion .rankScreenMilestone{grid-column:2;grid-row:3;font-size:11px}
 .rankScreenPromotion .rankScreenClose{grid-column:2;grid-row:4;justify-self:center;margin:0;padding:10px 15px}
 .rankScreenPromotion .rankSoundToggle{grid-column:2;grid-row:5;justify-self:center}
}
@supports not (height:100dvh){.courseRankPromotion.rankScreenPromotion{height:100%}.rankScreenPromotion .rankAssembly{width:min(340px,65vw,38vh);height:min(340px,65vw,38vh)}}

/* Member-only image viewer uses the existing authenticated blob, never a new tab. */
.courseImageViewer{width:min(1200px,96vw);height:min(92vh,1000px);height:min(92dvh,1000px);max-width:96vw;max-height:92vh;margin:auto;padding:0;border:1px solid #a6c4b477;border-radius:22px;background:#eff5ed;color:#1c382b;box-shadow:0 30px 100px #0008;overflow:hidden}
.courseImageViewer[open]{display:flex;flex-direction:column}
.courseImageViewer::backdrop{background:#071611cc;backdrop-filter:blur(8px)}
.courseImageViewerBar{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid #75958240;flex-shrink:0}
.courseImageViewerBar strong{margin-right:auto;font-size:14px}
.courseImageViewerBar button{min-height:40px;border:1px solid #749b8560;border-radius:12px;background:#dceadd;color:inherit;padding:8px 14px;font:inherit;font-size:12px;cursor:pointer}
.courseImageViewerBar button:focus-visible{outline:2px solid #17a77a;outline-offset:3px}
.courseImageViewport{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:16px;display:grid;place-items:center;background:#dae5dc}
.courseImageViewport img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:10px}
.courseImageViewport.is-zoomed{display:block}.courseImageViewport.is-zoomed img{width:200%;max-width:none;max-height:none;height:auto;object-fit:initial}
.courseImageViewerCaption{padding:12px 18px;margin:0;font-size:12px;line-height:1.5;flex-shrink:0;max-height:15vh;overflow:auto}
html[data-theme=dark] .courseImageViewer{background:#202c27;color:#e6f2e9;border-color:#658674}
html[data-theme=dark] .courseImageViewport{background:#101b16}
html[data-theme=dark] .courseImageViewerBar button{background:#304a3a;border-color:#729b7c}
@media(max-width:600px){.courseImageViewer{width:96vw;border-radius:16px}.courseImageViewerBar{gap:6px;padding:10px}.courseImageViewerBar strong{font-size:12px}.courseImageViewerBar button{padding:8px;min-height:44px}.courseImageViewport{padding:8px}}

/* Compact learning introduction on phones */
@media(max-width:720px){body #courseWorkspace .courseHead{margin:8px 0 12px;padding:14px 16px;border-radius:16px;min-height:0}body #courseWorkspace .courseHead h2{font-size:clamp(21px,5.7vw,27px);line-height:1.16;margin:6px 0 8px;letter-spacing:-.035em}body #courseWorkspace .courseHead .courseEyebrow{font-size:9px;letter-spacing:.1em}body #courseWorkspace .courseHead p{font-size:12px;line-height:1.5;margin:0 0 10px;max-width:100%}body #courseWorkspace .courseHead .courseMeta{font-size:10px;line-height:1.4;padding:5px 9px;letter-spacing:0;max-width:100%;box-sizing:border-box}body #courseWorkspace .courseHead:before{animation:none;transform:none;opacity:.45}}

/* Smaller Learning Desk header for phone screens. */
@media(max-width:720px){
 body #courseWorkspace .courseHead{padding:10px 12px;margin:6px 0 10px;border-radius:13px}
 body #courseWorkspace .courseHead h2{font-size:clamp(19px,4.9vw,22px);line-height:1.18;margin:4px 0 5px}
 body #courseWorkspace .courseHead .courseEyebrow{font-size:8px;line-height:1.3;letter-spacing:.08em}
 body #courseWorkspace .courseHead p{font-size:11px;line-height:1.4;margin:0 0 7px}
 body #courseWorkspace .courseHead .courseMeta{font-size:9px;line-height:1.35;padding:4px 7px;border-radius:10px;white-space:normal}
}

/* Staged mechanical transformation: unfold, align, lock, energize. */
.courseRankPromotion .rankAssembly{perspective:850px}
.courseRankPromotion .rankAssembly .rankAssemblyPart{animation-name:rankTransformerLock;animation-duration:2.7s;animation-timing-function:cubic-bezier(.2,.8,.3,1)}
.rankPart-top{--fold:65deg}.rankPart-left{--fold:-70deg}.rankPart-right{--fold:70deg}.rankPart-bottom{--fold:-60deg}.rankPart-core{--fold:0deg}
.courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:rankReactorIgnition .65s 3.25s both}
.rankAssemblyPulse{animation-delay:3.35s;border-width:2px}
@keyframes rankTransformerLock{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--twist)) scale(.72)}12%{opacity:1}38%{transform:translate(calc(var(--dx)*.24),calc(var(--dy)*.24)) rotate(calc(var(--twist)*-.45)) scale(1.09)}57%{transform:translate(calc(var(--dx)*.1),calc(var(--dy)*.1)) rotate(0) scale(1)}72%{transform:translate(0,0) rotate(0) scale(.97)}80%,99%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}100%{opacity:0;transform:none}}
@keyframes rankReactorIgnition{0%{opacity:0;transform:scale(.97);filter:brightness(1)}25%{opacity:1;transform:scale(1.035);filter:brightness(1.8)}100%{opacity:1;transform:scale(1);filter:brightness(1)}}
.rankScreenPromotion .rankPart-right{--dx:140px;--twist:12deg}
.rankScreenPromotion>span,.rankScreenPromotion>strong,.rankScreenPromotion .rankScreenMilestone{animation-delay:1s}
:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:none;opacity:1;filter:none;transform:none}:where(html[data-motion="reduce"]) .rankScreenPromotion>span,:where(html[data-motion="reduce"]) .rankScreenPromotion>strong,:where(html[data-motion="reduce"]) .rankScreenPromotion .rankScreenMilestone{animation:none}
/* Alloy sequence uses separate SVG armor, no cropped duplicates. */
.courseRankPromotion{background:radial-gradient(ellipse at 50% 35%,#1c3446,#080e18 80%);border-color:#7894ae55}
.courseRankPromotion.rankScreenPromotion{background:radial-gradient(ellipse at center,#1b3145 0%,#090f1c 58%,#040810 100%)}
.courseRankPromotion .rankAssembly{perspective:none}
.courseRankPromotion .rankAssembly .rankAssemblyPart{clip-path:none;animation:alloyDock 1.15s cubic-bezier(.16,1,.3,1) both;filter:none}
.rankPart-top{--dx:0px;--dy:-65px;--twist:0deg;animation-delay:0s!important}
.rankPart-left,.rankScreenPromotion .rankPart-left{--dx:-80px;--dy:0px;--twist:-18deg;animation-delay:.22s!important}
.rankPart-right,.rankScreenPromotion .rankPart-right{--dx:80px;--dy:0px;--twist:18deg;animation-delay:.44s!important}
.rankPart-bottom{--dx:0px;--dy:65px;--twist:0deg;animation-delay:.66s!important}
.rankPart-core{--dx:0px;--dy:0px;--twist:0deg;animation-delay:.8s!important}
.courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:alloyOnline .55s 1.92s both}
.rankAssemblyPulse{animation:rankCorePulse .8s 1.92s both;border-color:#bdeaff}
.rankScreenPromotion .rankAssembly{width:min(330px,58vw,40dvh);height:min(330px,58vw,40dvh)}
.rankScreenPromotion>span,.rankScreenPromotion>strong,.rankScreenPromotion .rankScreenMilestone{animation:alloyCaption .55s 1.65s both;color:#e5effa;text-shadow:none}
.rankScreenPromotion>strong{font-size:clamp(32px,5vw,56px);font-weight:500;letter-spacing:.02em}
.rankScreenRing{animation:rankScreenWave 1.3s 1.6s both;border-color:#a4d9ff25}.rankScreenRing.ringTwo{animation-delay:1.78s}.rankScreenBeam{display:none}
@keyframes alloyDock{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--twist)) scale(.94)}10%{opacity:1}58%{transform:translate(calc(var(--dx)*.12),calc(var(--dy)*.12)) rotate(0) scale(1)}76%{transform:translate(0,0) rotate(0) scale(1)}100%{opacity:1;transform:none}}
@keyframes alloyOnline{0%{opacity:0;filter:brightness(1)}35%{opacity:1;filter:brightness(1.45)}100%{opacity:1;filter:none}}
@keyframes alloyCaption{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:720px){.rankScreenPromotion .rankAssembly{width:min(260px,72vw,37dvh);height:min(260px,72vw,37dvh)}}
@media(max-height:500px){.rankScreenPromotion .rankAssembly{width:min(240px,40vw,68dvh);height:min(240px,40vw,68dvh)}}
:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyPart{display:none}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyFinal,:where(html[data-motion="reduce"]) .rankScreenPromotion>span,:where(html[data-motion="reduce"]) .rankScreenPromotion>strong,:where(html[data-motion="reduce"]) .rankScreenPromotion .rankScreenMilestone{animation:none;opacity:1;transform:none;filter:none}:where(html[data-motion="reduce"]) .rankAssemblyPulse{display:none}
/* Seventeen articulated components with distinct travel paths and rotating reactor. */
.courseRankPromotion .rankAssembly{overflow:visible}
.courseRankPromotion .rankAssembly .rankAssemblyPart{animation:mechanismTransform 2.4s cubic-bezier(.2,.75,.2,1) both;transform-origin:50% 50%}
.rankPart-top{--dx:0px;--dy:-80px;--twist:35deg;animation-delay:0s!important}
.rankPart-left{--dx:-100px;--dy:-30px;--twist:-50deg;animation-delay:.08s!important}
.rankPart-right{--dx:100px;--dy:-30px;--twist:50deg;animation-delay:.16s!important}
.rankPart-bottom{--dx:0px;--dy:90px;--twist:45deg;animation-delay:.24s!important}
.rankPart-core{--dx:0px;--dy:0px;--twist:180deg;animation-delay:.4s!important}
.rankPart-wing-l-0{--dx:-115px;--dy:-65px;--twist:-100deg;animation-delay:.15s!important}
.rankPart-wing-r-0{--dx:115px;--dy:-65px;--twist:100deg;animation-delay:.22s!important}
.rankPart-wing-l-1{--dx:-135px;--dy:0px;--twist:-125deg;animation-delay:.28s!important}
.rankPart-wing-r-1{--dx:135px;--dy:0px;--twist:125deg;animation-delay:.35s!important}
.rankPart-wing-l-2{--dx:-110px;--dy:70px;--twist:-145deg;animation-delay:.41s!important}
.rankPart-wing-r-2{--dx:110px;--dy:70px;--twist:145deg;animation-delay:.48s!important}
.rankPart-hinge-l{--dx:-60px;--dy:0px;--twist:-270deg;animation-delay:.3s!important}
.rankPart-hinge-r{--dx:60px;--dy:0px;--twist:270deg;animation-delay:.37s!important}
.rankPart-jaw-l{--dx:-60px;--dy:85px;--twist:-80deg;animation-delay:.44s!important}
.rankPart-jaw-r{--dx:60px;--dy:85px;--twist:80deg;animation-delay:.51s!important}
.rankPart-reactor-a{--dx:0px;--dy:-40px;--twist:180deg;animation-delay:.55s!important}
.rankPart-reactor-b{--dx:0px;--dy:40px;--twist:-180deg;animation-delay:.62s!important}
.rankScreenPromotion .rankPart-left{--dx:-100px;--twist:-50deg}.rankScreenPromotion .rankPart-right{--dx:100px;--twist:50deg}
.rankScreenPromotion .rankPart-top{--dy:-80px}.rankScreenPromotion .rankPart-bottom{--dy:90px}
@keyframes mechanismTransform{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--twist)) scale(.55)}10%{opacity:1}35%{transform:translate(calc(var(--dx)*.42),calc(var(--dy)*.42)) rotate(calc(var(--twist)*.32)) scale(.92)}56%{transform:translate(calc(var(--dx)*.2),calc(var(--dy)*.2)) rotate(calc(var(--twist)*-.14)) scale(1.04)}72%{transform:translate(calc(var(--dx)*.12),calc(var(--dy)*.12)) rotate(0) scale(1)}86%{transform:translate(0,0) rotate(0) scale(.985)}100%{opacity:1;transform:none}}
.courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:alloyOnline .65s 3.05s both;z-index:2}
.rankAssemblyPulse{animation-delay:3.1s;z-index:3}
.rankScreenPromotion .rankAssembly{width:min(440px,64vw,47dvh);height:min(440px,64vw,47dvh)}
.rankOrbit{position:absolute;inset:0;border-radius:50%;pointer-events:none;border:1px solid #9bdcfd22;opacity:0;z-index:-1}
.orbitOuter{inset:-12%;border-width:2px;border-color:#addefd55 transparent #addefd55 transparent;animation:mechanismOrbit 4.8s ease-in-out both}
.orbitInner{inset:8%;border-color:transparent #89c5df44 transparent #89c5df44;animation:mechanismOrbit 4.8s .12s reverse both}
.orbitTicks{inset:-3%;border:2px dashed #a7d8e42b;animation:mechanismOrbit 4.8s .2s both}
.rankIgnitionGlow{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,#a5d9ff25,transparent 65%);opacity:0;animation:reactorGlow 1.2s 2.85s both;z-index:-1}
@keyframes mechanismOrbit{0%{opacity:0;transform:rotate(-150deg) scale(.65)}15%{opacity:.65}65%{opacity:.45;transform:rotate(90deg) scale(1.05)}100%{opacity:0;transform:rotate(160deg) scale(1.15)}}
@keyframes reactorGlow{0%{opacity:0;transform:scale(.6)}35%{opacity:1;transform:scale(1.3)}100%{opacity:.35;transform:scale(1)}}
.rankScreenPromotion>span,.rankScreenPromotion>strong,.rankScreenPromotion .rankScreenMilestone{animation-delay:2.8s}
.courseRankPromotion.rankScreenPromotion{background:radial-gradient(ellipse at 50% 42%,#26394c 0%,#0d1522 48%,#060b13 100%)}
@media(max-width:720px){.rankScreenPromotion .rankAssembly{width:min(330px,74vw,42dvh);height:min(330px,74vw,42dvh)}}
@media(max-height:500px){.rankScreenPromotion .rankAssembly{width:min(270px,40vw,65dvh);height:min(270px,40vw,65dvh)}}
:where(html[data-motion="reduce"]) .rankOrbit,:where(html[data-motion="reduce"]) .rankIgnitionGlow{display:none}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyPart{display:none}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:none;opacity:1;transform:none;filter:none}:where(html[data-motion="reduce"]) .rankScreenPromotion>span,:where(html[data-motion="reduce"]) .rankScreenPromotion>strong,:where(html[data-motion="reduce"]) .rankScreenPromotion .rankScreenMilestone{animation:none;opacity:1;transform:none}
/* Light follows the emblem silhouette, without a surrounding ring. */
.rankScreenPromotion{--rank-glow:#95b5c0}
.rankScreenPromotion[data-rank="1"]{--rank-glow:#56e5ba}
.rankScreenPromotion[data-rank="2"]{--rank-glow:#65cfff}
.rankScreenPromotion[data-rank="3"]{--rank-glow:#aa91ff}
.rankScreenPromotion[data-rank="4"]{--rank-glow:#ffcb70}
.rankScreenPromotion[data-rank="5"]{--rank-glow:#f7eab5}
.rankScreenPromotion .rankIgnitionGlow{display:none}
.courseRankPromotion.rankScreenPromotion .rankAssembly .rankAssemblyPart{filter:drop-shadow(0 0 3px var(--rank-glow))}
.courseRankPromotion.rankScreenPromotion .rankAssembly .rankAssemblyFinal{animation:rankSilhouetteGlow .9s 3.05s both}
@keyframes rankSilhouetteGlow{0%{opacity:0;filter:drop-shadow(0 0 3px var(--rank-glow))}35%{opacity:1;filter:brightness(1.3) drop-shadow(0 0 8px var(--rank-glow)) drop-shadow(0 0 22px var(--rank-glow))}100%{opacity:1;filter:drop-shadow(0 0 5px var(--rank-glow)) drop-shadow(0 0 14px var(--rank-glow))}}
:where(html[data-motion="reduce"]) .courseRankPromotion.rankScreenPromotion .rankAssembly .rankAssemblyFinal{animation:none;opacity:1;filter:drop-shadow(0 0 5px var(--rank-glow)) drop-shadow(0 0 14px var(--rank-glow))}

/* Borderless rank reveal: floating emblem, articulated docking and silhouette light. */
.courseRankPromotion{--rank-glow:#95b5c0;z-index:10001;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none;overflow:visible;padding:18px 22px 14px;gap:7px;animation:rankFloatingNotice 6s both}
.courseRankPromotion[data-rank="1"]{--rank-glow:#56e5ba}.courseRankPromotion[data-rank="2"]{--rank-glow:#65cfff}.courseRankPromotion[data-rank="3"]{--rank-glow:#aa91ff}.courseRankPromotion[data-rank="4"]{--rank-glow:#ffcb70}.courseRankPromotion[data-rank="5"]{--rank-glow:#f7eab5}
.courseRankPromotion:not(.rankScreenPromotion):before{content:'';position:absolute;inset:-12% -30%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#06121bf0 0%,#06121bca 28%,transparent 68%);border:0;border-radius:50%;filter:blur(16px)}
.courseRankPromotion:not(.rankScreenPromotion)>span{font-size:9px;letter-spacing:.23em;color:#bfd1dd;text-shadow:0 1px 5px #000}
.courseRankPromotion:not(.rankScreenPromotion)>strong{font-size:25px;font-weight:500;letter-spacing:.01em;color:#f0f6fc;text-shadow:0 2px 12px #000}
.courseRankPromotion.rankScreenPromotion{background:radial-gradient(ellipse at 50% 41%,#18352fba 0%,#081319ed 48%,#04090ff7 100%)!important;overflow:hidden;animation:rankCinemaReveal 6s both;gap:11px}
.courseRankPromotion .rankAssembly{border:0!important;outline:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;overflow:visible;isolation:isolate}
.courseRankPromotion .rankAssembly:before{content:'';position:absolute;inset:5%;border:0;border-radius:50%;background:radial-gradient(ellipse,var(--rank-glow),transparent 67%);filter:blur(28px);opacity:0;z-index:-1;animation:rankAmbientBloom 3.3s .2s both;pointer-events:none}
.courseRankPromotion .rankAssembly .rankAssemblyPart{animation:rankPrecisionDock 2.15s cubic-bezier(.18,.8,.25,1) both;filter:drop-shadow(0 0 2px var(--rank-glow));will-change:transform,opacity}
.courseRankPromotion .rankAssembly .rankAssemblyFinal{animation:rankEmblemOnline 1.15s 2.75s both;filter:drop-shadow(0 0 6px var(--rank-glow));z-index:2}
.courseRankPromotion .rankUnlockSpark{position:absolute;left:50%;top:50%;width:14px;height:1px;pointer-events:none;z-index:0;border-radius:2px;background:linear-gradient(90deg,var(--rank-glow),transparent);opacity:0;animation:rankUnlockSpark .85s 2.8s ease-out both}
.courseRankPromotion .rankScreenEffects{background:radial-gradient(ellipse at 50% 45%,#61e8bc0c,transparent 60%)}
.courseRankPromotion .rankScreenBeam,.courseRankPromotion .rankOrbit,.courseRankPromotion .rankIgnitionGlow{display:none!important}
.courseRankPromotion .rankScreenMilestone,.courseRankPromotion>span,.courseRankPromotion>strong{animation:rankCaptionRise .65s 2.65s both}
.courseRankPromotion.rankScreenPromotion>span{color:#9bb8b2;font-size:10px;letter-spacing:.3em}
.courseRankPromotion.rankScreenPromotion>strong{color:#f0f7f5;font-size:clamp(34px,5.5vw,60px);font-weight:500;letter-spacing:-.04em;line-height:1.05}
.courseRankPromotion .rankScreenMilestone{font-size:12px;color:#9eb4b1;letter-spacing:.02em}
.courseRankPromotion .rankScreenClose{border:1px solid #c1eddd3a;border-radius:9px;background:#c0e9dd10;padding:11px 23px;font-size:12px;transition:background .2s,transform .2s}
.courseRankPromotion .rankScreenClose:hover{background:#c0e9dd22;transform:translateY(-1px)}
.courseRankPromotion .rankSoundToggle{border:0;background:transparent;color:#93aca6;font-size:10px;padding:4px 8px;min-height:28px;margin:0}
@keyframes rankPrecisionDock{0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--twist)) scale(.7)}12%{opacity:1}52%{transform:translate(calc(var(--dx)*.12),calc(var(--dy)*.12)) rotate(calc(var(--twist)*-.06)) scale(1.025)}70%{transform:translate(0,0) rotate(0) scale(.99)}84%,100%{opacity:1;transform:none}}
@keyframes rankEmblemOnline{0%{opacity:0;transform:scale(.99);filter:brightness(1) drop-shadow(0 0 2px var(--rank-glow))}24%{opacity:1;transform:scale(1.025);filter:brightness(1.3) drop-shadow(0 0 9px var(--rank-glow)) drop-shadow(0 0 20px var(--rank-glow))}100%{opacity:1;transform:none;filter:drop-shadow(0 0 4px var(--rank-glow)) drop-shadow(0 0 12px var(--rank-glow))}}
@keyframes rankAmbientBloom{0%{opacity:0;transform:scale(.6)}55%{opacity:.12}80%{opacity:.28;transform:scale(1.12)}100%{opacity:.1;transform:scale(1)}}
@keyframes rankUnlockSpark{0%{opacity:0;transform:rotate(var(--spark-angle)) translateX(60px) scaleX(.3)}20%{opacity:.7}100%{opacity:0;transform:rotate(var(--spark-angle)) translateX(190px) scaleX(.7)}}
@keyframes rankCaptionRise{from{opacity:0;transform:translateY(10px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@keyframes rankCinemaReveal{0%{opacity:0}8%,88%{opacity:1}100%{opacity:0;visibility:hidden}}
@keyframes rankFloatingNotice{0%{opacity:0;transform:translate(-50%,-8px)}8%,86%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;visibility:hidden;transform:translate(-50%,-4px)}}
@media(max-width:720px){.courseRankPromotion:not(.rankScreenPromotion){top:75px;width:250px;max-width:calc(100% - 32px)}.courseRankPromotion:not(.rankScreenPromotion) .rankAssembly{width:170px;height:170px}.courseRankPromotion.rankScreenPromotion .rankAssembly{width:min(330px,76vw,42dvh);height:min(330px,76vw,42dvh)}}
@media(max-height:500px){.courseRankPromotion.rankScreenPromotion .rankAssembly{width:min(270px,40vw,65dvh);height:min(270px,40vw,65dvh)}}
:where(html[data-motion="reduce"]) .courseRankPromotion{animation:rankPromotionQuiet 6s both}:where(html[data-motion="reduce"]) .courseRankPromotion.rankScreenPromotion{animation:rankCinemaReveal 6s both}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssemblyPart,:where(html[data-motion="reduce"]) .courseRankPromotion .rankUnlockSpark,:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly:before{display:none!important}:where(html[data-motion="reduce"]) .courseRankPromotion .rankAssembly .rankAssemblyFinal,:where(html[data-motion="reduce"]) .courseRankPromotion>span,:where(html[data-motion="reduce"]) .courseRankPromotion>strong,:where(html[data-motion="reduce"]) .courseRankPromotion .rankScreenMilestone{animation:none!important;opacity:1;transform:none;filter:none}

/* Both rank displays mount directly on body, outside animated workspace stacking contexts. */
body>.courseRankPromotion{position:fixed;z-index:2147483000!important;isolation:isolate;pointer-events:auto}
body>.courseRankPromotion:not(.rankScreenPromotion){inset:auto;top:50%;left:50%;width:min(300px,calc(100vw - 36px));max-width:calc(100vw - 36px);max-height:calc(100dvh - 28px);box-sizing:border-box;margin:0;padding:12px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;transform:translate(-50%,-50%);animation:rankCenteredReplay 6s both}
body>.courseRankPromotion:not(.rankScreenPromotion) .rankAssembly{width:min(230px,62vw,44dvh);height:min(230px,62vw,44dvh);margin:0;flex:none}
body>.courseRankPromotion:not(.rankScreenPromotion)>span{font-size:9px;line-height:1.3}
body>.courseRankPromotion:not(.rankScreenPromotion)>strong{font-size:25px;line-height:1.1;margin:0}
body>.courseRankPromotion:not(.rankScreenPromotion) .rankSoundToggle{font-size:10px;min-height:28px;line-height:1.2}
@keyframes rankCenteredReplay{0%{opacity:0;transform:translate(-50%,calc(-50% + 8px))}8%,86%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0;visibility:hidden;transform:translate(-50%,calc(-50% - 4px))}}
:where(html[data-motion="reduce"]) body>.courseRankPromotion:not(.rankScreenPromotion){animation:rankPromotionQuiet 6s both;transform:translate(-50%,-50%)}
