:root{--purple:#6657d9;--ink:#28243e;--muted:#777185;--line:#e6e2ee;--paper:#f8f7fc;--purple-light:#eeebfa;--green:#52776b;--teal:#277c89}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--paper)}body{font-size:15px}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #ada3ef;outline-offset:5px;border-radius:6px}[hidden]{display:none!important}.shell{height:100%;height:100dvh;display:flex;flex-direction:column}.top{min-height:70px;background:#ffffffed;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 28px;flex-shrink:0}.logo{display:flex;align-items:center;gap:10px}.logo>b{background:var(--purple);color:#fff;border-radius:12px;width:40px;height:40px;display:grid;place-items:center;font-size:24px;font-family:STKaiti,KaiTi,serif;font-weight:500}.logo>span{display:flex;flex-direction:column;gap:2px}.logo strong{font-size:18px;letter-spacing:-.5px}.logo small{font-size:8px;letter-spacing:1.8px;font-weight:700;color:var(--muted)}.site-nav{display:flex;align-items:center;gap:4px;margin:0 12px}.site-nav a{font-weight:600;font-size:13.5px;color:#64748b;padding:8px 13px;border-radius:9px;transition:background .15s,color .15s}.site-nav a:hover{background:#f5f3fb;color:var(--purple)}.site-nav a.active{background:var(--purple-light);color:var(--purple);font-weight:700}.profile{display:flex;align-items:center;gap:8px;max-width:230px;font-size:12px;color:var(--muted)}#profileLabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dot{width:7px;height:7px;border-radius:50%;background:#85a696;flex-shrink:0}.view{position:relative;flex:1;min-height:0}.home{height:100%;overflow:auto}.home-inner{max-width:1160px;padding:0 32px;margin:auto}.intro{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;align-items:center;padding:55px 0 45px;min-height:410px}.eyebrow{font-size:10px;color:var(--purple);font-weight:700;letter-spacing:1.6px;display:flex;align-items:center;gap:7px}.eyebrow>span{width:6px;height:6px;border-radius:100%;background:var(--purple)}.greeting{font-size:14px;color:var(--muted);margin:22px 0 12px}.intro h1{font-size:43px;font-weight:750;line-height:1.22;letter-spacing:-1.9px;margin:0 0 19px}.intro h1 em{font-style:normal;color:var(--purple)}.intro-description{color:#736d80;line-height:1.8;font-size:15px;max-width:470px;margin:0 0 24px}.intro-actions{display:flex;align-items:center;gap:24px}.primary-action{display:flex;align-items:center;gap:30px;background:var(--purple);color:white;font-size:13px;font-weight:650;padding:15px 18px;border-radius:10px;box-shadow:0 5px 12px #6657d91a;transition:background .15s,transform .15s}.primary-action:hover{background:#5849c8;transform:translateY(-1px)}.primary-action>span:last-child{font-size:20px;font-weight:400}.text-action{font-size:13px;font-weight:650;display:flex;gap:10px;align-items:center}.text-action:hover{color:var(--purple)}.intro-note{display:flex;align-items:center;gap:7px;margin-top:20px;font-size:11px;color:#8a8398}.intro-art{position:relative;height:310px;isolation:isolate}.art-orbit{position:absolute;border:1px solid #e8e3f3;border-radius:50%;z-index:-1;left:50%;top:50%;transform:translate(-50%,-50%)}.orbit-one{width:285px;height:285px}.orbit-two{width:355px;height:355px;border-style:dashed}.character-card{position:absolute;border-radius:18px;display:flex;align-items:center;justify-content:center;flex-direction:column;width:155px;height:185px;box-shadow:0 16px 36px #4d3d7a10}.character-card>span{font-family:STKaiti,KaiTi,"Noto Serif CJK SC",serif;font-size:100px;font-weight:400;line-height:1.3}.character-card small{font-size:18px;color:#7b729a;letter-spacing:1px}.card-ni{background:#eae5f9;left:9%;top:28px;transform:rotate(-10deg);color:#6b58b0;border:1px solid #dfd5f1}.card-hao{background:#fff;right:7%;top:90px;transform:rotate(9deg);color:#4d705f;border:1px solid #e2e7df}.card-hao small{color:#809187}.art-caption{position:absolute;bottom:5px;left:15%;background:#fff;border:1px solid var(--line);padding:11px 18px;border-radius:30px;font-size:12px;color:#8a8398;box-shadow:0 4px 12px #46345a06}.art-caption span{font-size:15px;color:var(--ink);margin-right:8px}.art-caption i{font-style:normal;margin:0 7px}.art-spark{position:absolute;color:#b2a4d4}.spark-one{right:17%;top:15px;font-size:35px}.spark-two{left:3%;bottom:33px;font-size:25px;color:#e2bc76}.art-seal{position:absolute;right:4%;bottom:10px;border:1px solid #b2a28d;color:#b2a28d;writing-mode:vertical-rl;font-size:16px;padding:6px 3px;font-family:STKaiti,KaiTi,serif;transform:rotate(6deg)}.journey{border:1px solid var(--line);background:#fff;border-radius:13px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;align-items:center;padding:22px 26px;margin-bottom:43px}.journey-label{display:flex;gap:13px;align-items:center}.journey-icon{width:42px;height:42px;display:grid;place-items:center;background:var(--purple-light);color:var(--purple);border-radius:11px;font-size:25px}.journey-label strong{display:block;font-size:13px;font-weight:700}.journey-label small{display:block;font-size:11px;color:#928a9c;margin-top:6px}.journey-stat{padding-left:32px;border-left:1px solid #eeeaf2}.journey-stat>strong{font-size:25px;font-weight:700;display:block;line-height:1}.journey-stat>strong>span{color:#b8b1c6;font-size:17px;font-weight:400}.journey-stat small{color:#928a9c;font-size:11px;display:block;margin-top:8px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.section-kicker{font-size:9px;letter-spacing:1.7px;font-weight:700;color:#9990a6}.section-heading h2{font-size:24px;font-weight:700;letter-spacing:-.65px;margin:8px 0 0}.course-count{font-size:12px;color:#8b8299}.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.course-card{display:flex;flex-direction:column;min-width:0;position:relative;border:1px solid var(--line);background:#fff;border-radius:15px;padding:24px 27px;overflow:hidden}.course-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px}.level-tag{font-size:9px;letter-spacing:1.3px;color:var(--purple);font-weight:700}.course-two .level-tag{color:var(--green)}.course-number{font-size:28px;color:#e9e4f6;letter-spacing:-1px;font-weight:750}.course-two .course-number{color:#e1ece5}.course-card h3{font-size:31px;letter-spacing:-.8px;margin:3px 0 12px}.course-card h3 span{font-size:21px;font-family:STKaiti,KaiTi,serif;font-weight:400;color:#b9b0cd;margin-left:9px}.course-two h3 span{color:#b1c2b6}.course-card>p{font-size:13px;color:#82788f;line-height:1.7;max-width:340px;min-height:44px;margin:0 0 18px}.course-meta{display:flex;flex-wrap:wrap;gap:9px 14px;margin-top:auto;font-size:10px;font-weight:600;color:#8d819f;margin-bottom:26px}.course-meta span{display:flex;align-items:center;gap:6px}.course-meta span:before{content:"";width:4px;height:4px;background:#c9bfdb;border-radius:50%}.course-progress-label{display:flex;justify-content:space-between;font-size:10px;color:#988fa5;margin-bottom:9px}.course-progress-label>b{color:var(--purple);font-weight:600}.course-two .course-progress-label>b{color:var(--green)}.course-progress{height:5px;background:#f1edf7;border-radius:8px;overflow:hidden}.course-progress span{height:100%;width:0;display:block;background:var(--purple);border-radius:8px;transition:width .2s}.course-two .course-progress{background:#edf3ee}.course-two .course-progress span{background:var(--green)}.course-link{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:650;color:var(--purple);background:#f2effb;border:1px solid #ebe6f7;padding:12px 14px;border-radius:8px;margin-top:22px;transition:background .15s}.course-link>span:last-child{font-size:18px}.course-link:hover{background:#e9e3f9}.course-two .course-link{background:#f0f5f1;border-color:#e3ece6;color:var(--green)}.course-two .course-link:hover{background:#e3eee7}.method{margin:40px 0 30px}.method h2{font-size:14px;font-weight:650;margin:0 0 20px}.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.method-grid>div{display:flex;gap:12px}.method-grid>div>span{font-size:10px;width:27px;height:27px;border:1px solid #e6e1ed;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:#a599b2}.method-grid p{margin:0}.method-grid strong{font-size:12px;font-weight:650;display:block;margin:3px 0 6px}.method-grid small{font-size:11px;line-height:1.7;color:#958b9f;display:block;max-width:235px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;padding:22px 0;color:#a096aa;font-size:10px}footer b{font-size:16px;font-weight:400;font-family:STKaiti,KaiTi,serif;color:#857694;margin-right:6px}.course-view{height:100%;position:relative}.frame{width:100%;height:100%;border:0;display:block;background:var(--paper)}
@media(min-width:1500px){.home-inner{max-width:1270px}.intro{padding-top:70px;padding-bottom:60px}.intro h1{font-size:48px}.intro-art{max-width:450px;width:100%;justify-self:center}.course-card{padding:28px 32px}}
@media(max-width:950px){.top{padding:12px 22px;gap:20px}.profile{display:none}.site-nav{margin-left:auto;margin-right:0}.intro h1{font-size:36px;letter-spacing:-1.3px}.intro-actions{gap:16px}.text-action{font-size:11px}.character-card{width:130px;height:165px}.character-card>span{font-size:85px}.card-ni{left:5%}.card-hao{right:1%}.intro-art{height:290px}.orbit-two{width:285px;height:285px}.orbit-one{width:225px;height:225px}.art-caption{left:7%;bottom:0}.journey{padding:21px 20px;grid-template-columns:1.6fr 1fr 1fr 1fr}.journey-stat{padding-left:20px}.journey-label small{display:none}.journey-icon{width:34px;height:34px}.journey-label{gap:9px}.home-inner{padding:0 26px}}
@media(max-width:680px){.top{min-height:72px;padding:10px 15px;gap:10px}.logo>b{width:35px;height:35px;font-size:22px;border-radius:10px}.logo{gap:7px}.logo strong{font-size:16px}.logo small{font-size:6px;letter-spacing:1.1px}.site-nav{gap:2px}.site-nav a{padding:10px 9px;font-size:11px}.home-inner{padding:0 20px}.intro{display:block;padding:34px 0 28px;min-height:0}.intro h1{font-size:35px;letter-spacing:-1.4px}.eyebrow{font-size:8px;letter-spacing:1.1px}.greeting{font-size:12px;margin:18px 0 10px}.intro-description{font-size:13px;line-height:1.8;margin-bottom:20px;max-width:410px}.intro-actions{gap:18px;flex-wrap:wrap}.primary-action{font-size:12px;padding:12px 15px;gap:18px}.text-action{font-size:11px}.intro-note{font-size:9px;margin-top:16px}.intro-art{display:none}.journey{grid-template-columns:repeat(3,1fr);padding:17px 18px;gap:19px 0;margin-bottom:30px}.journey-label{grid-column:1/-1}.journey-label strong{font-size:12px}.journey-label small{display:block;font-size:10px}.journey-icon{width:31px;height:31px;font-size:22px}.journey-stat{padding-left:20px}.journey-stat:nth-child(2){border:0;padding-left:0}.journey-stat>strong{font-size:24px}.journey-stat small{font-size:9px}.section-heading{align-items:start;gap:10px;margin-bottom:16px}.section-heading h2{font-size:21px;line-height:1.4;margin-top:6px}.section-kicker{font-size:8px}.course-count{display:none}.course-grid{grid-template-columns:1fr;gap:16px}.course-card{padding:21px 22px}.course-card>p{min-height:0}.course-meta{margin-bottom:22px}.course-link{margin-top:18px}.method{margin:28px 0}.method-grid{grid-template-columns:1fr;gap:18px}.method-grid small{max-width:none}.method h2{font-size:13px}.method-grid strong{font-size:12px}.method-grid small{font-size:11px}.method-grid>div>span{width:29px;height:29px}footer{flex-direction:column;gap:10px;font-size:9px;padding:18px 0 24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.manage-link{font-size:11px;color:#766a8d;white-space:nowrap;padding:9px 11px;border:1px solid #e5dff0;border-radius:8px}.manage-link:hover{color:#6657d9;background:#f3effa}.top{gap:20px}.profile{max-width:170px}footer [data-sync-status]{max-width:420px;text-align:right}@media(max-width:950px){.manage-link{font-size:10px;padding:8px}.top{gap:12px}}@media(max-width:680px){.top{flex-wrap:wrap;padding-top:10px;padding-bottom:8px;min-height:100px}.site-nav{margin-left:auto}.manage-link{margin-left:auto;padding:4px 7px;font-size:9px;border-color:transparent}.top .profile{display:none}footer [data-sync-status]{text-align:left}}

/* The third course continues the same visual system in a teal tone. */
.course-three .level-tag,.course-three .course-progress-label>b{color:var(--teal)}.course-three .course-number{color:#dcecf0}.course-three h3 span{color:#98b7bf}.course-three .course-progress{background:#e9f3f5}.course-three .course-progress span{background:var(--teal)}.course-three .course-link{background:#edf7f8;border-color:#d8eaed;color:var(--teal)}.course-three .course-link:hover{background:#dceff2}
@media(min-width:681px) and (max-width:900px){.course-grid{grid-template-columns:1fr}.course-card>p{max-width:560px;min-height:0}.course-card{padding:24px 27px}}
@media(max-width:680px){.top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}.logo{grid-column:1;grid-row:1;min-width:0}.site-nav{grid-column:1/-1;grid-row:2;width:100%;margin:0}.site-nav a{flex:1;text-align:center;padding:9px 7px}.manage-link{grid-column:2;grid-row:1;margin:0}.course-meta{margin-top:0}}

.course-exam-cta {
  display: block;
  width: 100%;
  margin-top: 10px;
  background: #f4f2ff;
  border: 1px dashed #cfc8ff;
  color: #6657d9;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
  cursor: pointer;
  text-align: center;
  transition: all .2s ease;
}
.course-exam-cta:hover {
  background: #6657d9;
  color: #fff;
  border-color: #6657d9;
}
.course-three .course-exam-cta {
  background: #edf7f8;
  border-color: #bee3e8;
  color: var(--teal);
}
.course-three .course-exam-cta:hover {
  background: var(--teal);
  color: #fff;
  border-color: var(--teal);
}