:root{--blue:#2563eb;--accent:#138a64;--line:#e1e7ee;--muted:#5b6b80;color:#23354c;background:#fff;font-size:16px;font-family:"Microsoft JhengHei","PingFang TC",system-ui,sans-serif}body{background:#fff}.topbar{height:84px;padding:0 32px;position:sticky;top:0;z-index:8;border-bottom:2px solid #e8edf3}.brand{font-size:1.2rem;letter-spacing:.01em}.brand small{font-size:.875rem}.brand-mark{background:#2563eb;border-radius:16px;box-shadow:0 4px 0 #194baa}.shell{max-width:1510px;grid-template-columns:232px minmax(0,1fr);min-height:calc(100vh - 84px)}.sidebar{background:#fff;border-right:2px solid #e8edf3;padding:24px 16px}.sidebar nav button{font-size:.95rem;font-weight:700;min-height:52px;border:2px solid transparent;border-radius:14px}.sidebar nav button.nav-active{background:#eef5ff;color:#205ac9;border-color:#bed7fe}.sidebar nav button.nav-active span{color:#205ac9}.sidebar nav button span{font-size:1rem;min-width:22px}.sidebar-note{font-size:.875rem;margin-top:30px}.tiny-label{font-size:.8125rem}.sidebar-note p{font-size:.875rem}.offline-note{font-size:.8125rem}main{padding:30px 40px 60px;background:#fbfcfe}.primary{background:#2563eb;border-color:#2563eb}.card{border-radius:20px;box-shadow:0 3px 0 #e8edf3}.prototype-badge{font-size:.8125rem}#journey-stats{display:flex;gap:24px;color:#4d617d;font-size:.9375rem;align-items:center}#journey-stats span:first-child{color:#b97604}#journey-stats strong{font-size:1.125rem}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.j-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:25px}.j-heading h1{font-size:1.85rem;letter-spacing:-.02em;margin:8px 0 10px;line-height:1.4}.j-heading p{color:var(--muted);margin:0;font-size:.9375rem}.j-kicker{font-size:.8125rem;letter-spacing:.04em;font-weight:700;color:#647a96}.j-text-button{background:transparent;border:0;color:#2563eb;padding:12px 8px;font-size:.9375rem;font-weight:700;min-height:44px}.j-primary,.j-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid #2563eb;border-bottom-width:5px;border-radius:14px;font-weight:750;min-height:52px;padding:12px 22px;text-decoration:none;line-height:1.4}.j-primary{background:#2563eb;color:#fff;border-bottom-color:#1848aa}.j-secondary{background:#fff;color:#2563eb;border-color:#d0def5;border-bottom-color:#c0d2ee}.j-primary:hover{background:#1e55ce}.j-secondary:hover{background:#f1f6ff}.j-primary:active,.j-secondary:active{transform:translateY(2px);border-bottom-width:3px}.j-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:24px}.j-layout{display:grid;grid-template-columns:minmax(0,1fr) 288px;gap:28px;align-items:start}.j-map{border:2px solid #e6ebf2;border-radius:24px;background:white;overflow:hidden}.j-unit-banner{display:flex;align-items:center;gap:20px;padding:25px;background:#2463df;color:#fff}.j-unit-banner h2{font-size:1.35rem;margin:7px 0}.j-unit-banner p{font-size:.875rem;color:#e4edff;margin:0}.j-unit-banner small{font-size:.8125rem;color:#dbe8ff}.j-world-number{font-size:2.8rem;font-weight:850;color:#bfdbff;letter-spacing:-.04em}.j-stages{display:flex;gap:8px;overflow-x:auto;margin-bottom:22px;padding-bottom:6px}.j-stages button{border:2px solid #e0e7f0;background:white;border-radius:14px;min-width:76px;min-height:64px;padding:10px 14px;color:#66778e}.j-stages button span{display:block;font-weight:750;font-size:.9375rem;white-space:nowrap}.j-stages button small{font-size:.8125rem;display:block;margin-top:5px}.j-stages button.selected{border-color:#6ba8fd;background:#edf5ff;color:#1d58bd}.j-panel{border:2px solid #e5eaf1;background:white;border-radius:20px;padding:22px;margin-bottom:20px}.j-panel h2{font-size:1.1rem;line-height:1.5;margin:8px 0 12px}.j-panel p{font-size:.9375rem;color:#62728b;line-height:1.7}.j-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0}.j-stat-grid div{display:grid;gap:6px}.j-stat-grid strong{font-size:1.7rem;letter-spacing:-.03em;color:#2c4361}.j-stat-grid span{font-size:.8125rem;color:#6b7d94}.j-muted{font-size:.875rem!important;color:#667990;line-height:1.7}.j-panel .j-muted{margin-bottom:0}.j-badges{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:20px}.j-badge{display:grid;justify-items:center;gap:6px;color:#8999ac;text-align:center}.j-badge>span:first-child{font-size:2rem;display:grid;place-items:center;width:56px;height:56px;border:2px solid #e0e7f0;background:#f5f7fa;border-radius:18px}.j-badge small{font-size:.8125rem}.j-badge.earned{color:#ad740c}.j-badge.earned>span:first-child{background:#fff5d7;border-color:#edca72;color:#c78a10}.j-blue-panel{background:#edf5ff;border-color:#d3e6ff}.j-blue-panel .j-secondary{width:100%}.j-inline-note{font-size:.875rem;line-height:1.8;border:1px solid #d8e3f2;border-radius:14px;padding:18px;margin:20px;color:#586d86;background:#f8fbff}.j-path{list-style:none;padding:26px 20px 10px;margin:0;position:relative}.j-path-stop{display:flex;align-items:center;gap:22px;min-height:130px;position:relative;max-width:470px;margin:auto}.j-path-stop:before{content:"";position:absolute;left:40px;top:87px;height:52px;border-left:5px dotted #dce5ef}.j-path-stop:last-child:before{display:none}.j-path-stop.stop-1,.j-path-stop.stop-2{padding-left:58px}.j-path-stop.stop-1:before,.j-path-stop.stop-2:before{left:98px}.j-path-stop.stop-0:before{transform:rotate(-32deg);transform-origin:top}.j-path-stop.stop-2:before{transform:rotate(32deg);transform-origin:top}.j-node{position:relative;border-radius:50%;border:0;width:82px;height:76px;flex:0 0 82px;box-shadow:0 7px 0 #184cba;background:#3b82f6;color:#fff;font-weight:850;font-size:1.8rem;z-index:1}.j-node:hover{background:#2469dc}.j-node small{position:absolute;top:-14px;left:12px;background:white;color:#2563eb;border:2px solid #bfdbfe;border-radius:9px;font-size:.75rem;padding:3px 8px;white-space:nowrap}.j-node:active{transform:translateY(4px);box-shadow:0 3px 0 #184cba}.j-node-label{display:grid;gap:8px;max-width:250px}.j-node-label strong{font-size:1rem;line-height:1.5}.j-node-label span{font-size:.8125rem;color:#75869b;line-height:1.5}.j-path-stop.complete .j-node{background:#22a978;box-shadow:0 7px 0 #137b55}.j-path-stop.locked .j-node{background:#e4eaf1;box-shadow:0 7px 0 #cdd7e3;color:#8d9baf;opacity:1;cursor:not-allowed}.j-path-stop.locked .j-node-label{color:#8c9aab}.j-finish-line{padding:24px;background:#f5f8fc;text-align:center;font-size:.9375rem;font-weight:650;color:#637998}.j-resume{margin:20px;border:2px solid #acd5c9;background:#f0fcf7;border-radius:16px;padding:17px;display:flex;align-items:center;justify-content:space-between;gap:14px}.j-resume strong{color:#167754;font-size:1rem}.j-resume p{font-size:.875rem;margin:7px 0 0;color:#5e7b70}.j-resume .j-primary{font-size:.875rem;padding:10px 16px;white-space:nowrap}.j-evidence{display:flex;justify-content:space-between;gap:10px;padding:15px 0;border-bottom:1px solid #e7edf4;font-size:.875rem}.j-evidence span{color:#16815c}.j-course-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.j-course-card{border:2px solid #dce7f7;border-radius:24px;padding:30px;display:flex;align-items:flex-start;flex-direction:column;background:#fff;box-shadow:0 5px 0 #e6ecf4}.j-course-card h2{font-size:1.5rem;margin:12px 0}.j-course-card p{line-height:1.9;color:#64758d}.j-course-symbol{font-size:2.3rem;font-weight:850;color:#2563eb;background:#eaf3ff;padding:25px;border-radius:20px;margin-bottom:26px}.j-course-card.junior .j-course-symbol{background:#e9f8f3;color:#0e805c}.j-course-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:.875rem;color:#667991;margin:10px 0 24px}.j-course-card>button{margin-top:auto}.j-focus-card{max-width:730px;margin:22px auto;background:white;border:2px solid #e5ebf3;border-radius:26px;padding:38px}.j-focus-card h1{font-size:1.7rem;line-height:1.7;margin:14px 0 24px}.j-focus-card p{font-size:1.1rem;line-height:1.9;color:#4c627d}.j-step-label{color:#5482ba;font-size:.875rem;font-weight:750}.j-example{padding:24px;border-radius:18px;background:#f1f6ff;margin:28px 0}.j-example>span{color:#3f6ea7;font-size:.875rem;font-weight:750}.j-example p{margin:10px 0 0}.j-run{max-width:860px;margin:auto}.j-run-top{display:flex;gap:20px;align-items:center;margin:0 0 26px;color:#687e99;font-size:.875rem}.j-close{border:0;background:none;color:#7b8da5;font-size:2.2rem;min-width:48px;min-height:48px}.j-run-top progress{width:100%;height:16px;appearance:none;overflow:hidden;border:0;border-radius:20px;background:#e8edf4}.j-run-top progress::-webkit-progress-bar{background:#e8edf4}.j-run-top progress::-webkit-progress-value{background:#2eac83;border-radius:20px}.j-run-top progress::-moz-progress-bar{background:#2eac83}.j-run-label{text-align:center;color:#71839c;font-size:.875rem;margin:8px 0}.j-run-bottom{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.j-choices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0}.j-choices button{display:flex;align-items:center;gap:13px;text-align:left;border:2px solid #dce4ef;border-bottom:5px solid #d1dce9;background:white;border-radius:17px;padding:20px;min-height:84px;font-size:1.4rem;color:#26405f}.j-choices button:hover{border-color:#7cafef;background:#eff6ff}.j-choice-key{font-size:.8125rem;border:1px solid #d0ddeb;border-radius:7px;min-width:27px;height:27px;display:grid;place-items:center;color:#7b90aa}.j-choices button>span:last-child{overflow-wrap:anywhere}.j-hint{background:#fff8e4;border:1px solid #eed590;border-radius:15px;padding:20px}.j-hint p{margin:8px 0}.j-feedback-card,.j-result-card{max-width:730px;margin:24px auto;text-align:center;padding:40px;background:#fff;border:2px solid #e0e9f4;border-radius:26px}.j-feedback-card h1,.j-result-card h1{font-size:1.7rem;line-height:1.6;margin:20px 0}.j-feedback-card p,.j-result-card p{font-size:1.0625rem;line-height:1.9;color:#536c86}.j-feedback-symbol,.j-result-medal{margin:10px auto 20px;display:grid;place-items:center;width:100px;height:100px;border-radius:28px;background:#eaf4ff;color:#2563eb;font-size:3.5rem;font-weight:800}.j-feedback-card.correct .j-feedback-symbol{background:#e2f8ee;color:#15815b}.j-feedback-card.retry .j-feedback-symbol{background:#fff5dc;color:#b47b12}.j-result-medal{background:#fff3ce;color:#d59a1c;border:2px solid #f1d688;box-shadow:0 5px 0 #efd697}.j-result-card .j-actions{justify-content:center}.j-result-score{padding:18px;border-top:1px solid #e4eaf2;border-bottom:1px solid #e4eaf2;margin:24px 0;color:#5d7693}.j-result-score strong{font-size:2.5rem;color:#2463dc}.j-challenge-card{border:2px solid #c6dcfa;background:#eef6ff;border-radius:24px;padding:32px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}.j-challenge-card h2{font-size:1.6rem;line-height:1.6;margin:0}.j-challenge-card p{margin:0;color:#5b7190}.j-challenge-flag{color:#2563eb;font-size:3rem}.j-challenge-card label{margin:8px 0 0}.j-challenge-card select{background:white;max-width:100%}.j-history{margin-top:24px}.j-history table,.j-math-table{border-collapse:collapse;width:100%;font-size:.9375rem}.j-history td,.j-history th,.j-math-table td,.j-math-table th{padding:16px 10px;text-align:left;border-bottom:1px solid #e3eaf3}.j-history th,.j-math-table th{color:#647e9d;font-weight:600}.j-empty{text-align:center;padding:28px 0;color:#8093aa}.j-empty>span{font-size:2rem}.j-parent-row{padding:20px 0;border-top:1px solid #e1e8f1}.j-parent-row input{margin:12px 0}.j-parent-row p{white-space:pre-wrap}.j-math-visual{margin:22px 0;padding:20px;border-radius:18px;background:#f5f9ff}.j-tens{display:flex;gap:8px;flex-wrap:wrap}.j-ten{display:flex;flex-direction:column;gap:2px;padding:4px;background:#d4e7ff;border-radius:5px}.j-ten i,.j-ones i{display:inline-block;background:#4088e8;width:12px;height:12px;border-radius:2px}.j-ones{display:flex;gap:6px;margin-top:14px}.j-dot-groups{display:flex;align-items:center;gap:22px;flex-wrap:wrap;color:#3783e8;font-size:1.6rem}.j-dot-groups span{max-width:260px}.j-array{margin:24px auto;width:max-content;max-width:100%;overflow-x:auto}.j-array>div{display:flex;gap:3px;margin-bottom:3px}.j-array i{width:22px;height:22px;flex:0 0 22px;background:#72abed;border:1px solid #4088de;border-radius:3px}.j-fraction{display:flex;max-width:420px;margin:28px auto;height:70px;border:2px solid #3578ca}.j-fraction i{flex:1;border-right:2px solid #3578ca;background:#fff}.j-fraction i:last-child{border-right:0}.j-fraction i.filled{background:#71b2fd}.j-bars>div{display:flex;align-items:center;margin:14px 0}.j-bars span{font-size:.875rem;min-width:55px}.j-bars i{width:22px;height:24px;border:1px solid #347fdb;background:#92c4ff}.j-bars>div:nth-child(2) i{background:#ffd669;border-color:#cfa432}.j-geometry{display:block;width:240px;max-width:100%;height:120px;margin:20px auto;fill:#d6eaff;stroke:#3680dc;stroke-width:3}
@media(max-width:1200px){main{padding:26px 24px}.j-layout{grid-template-columns:minmax(0,1fr) 250px;gap:20px}.shell{grid-template-columns:200px minmax(0,1fr)}.j-path-stop.stop-1,.j-path-stop.stop-2{padding-left:32px}.j-path-stop.stop-1:before,.j-path-stop.stop-2:before{left:72px}.j-panel{padding:18px}.j-node-label{max-width:205px}.j-unit-banner{padding:22px;gap:15px}.j-world-number{font-size:2.1rem}.j-choices button{padding:16px;font-size:1.2rem}}
@media(max-width:950px){.j-layout{grid-template-columns:minmax(0,1fr)}.j-side{display:grid;grid-template-columns:1fr 1fr;gap:18px}.j-side .j-panel{margin-bottom:0}.j-path-stop{max-width:430px}.j-course-grid{grid-template-columns:1fr}.j-course-card{padding:25px}.j-course-symbol{padding:20px}.j-heading{gap:12px}#journey-stats{gap:14px}.prototype-badge{display:none}}
@media(max-width:850px){.topbar{padding:12px 20px;height:auto;min-height:78px}.shell{display:block}.sidebar{padding:8px 12px;position:sticky;top:78px;z-index:7;background:#fff;border-bottom:2px solid #e8edf3;border-right:0}.sidebar nav{display:flex;gap:5px;overflow-x:auto}.sidebar nav button{min-height:46px;padding:10px 13px;white-space:nowrap;font-size:.875rem}.sidebar-note{display:none}.brand small{display:none}.j-focus-card{padding:30px}.j-heading h1{font-size:1.6rem}.j-path{padding:22px}.card+.card{margin-top:16px}}
@media(max-width:560px){.topbar{padding:12px 14px;min-height:70px}.brand{font-size:1rem}.brand-mark{width:35px;height:35px;border-radius:12px;font-size:1.6rem}.sidebar{top:70px}.sidebar nav button span{display:inline}#journey-stats{gap:12px;font-size:.8125rem}#journey-stats span:last-child{display:none}#journey-stats strong{font-size:1rem}main{padding:22px 14px 45px}.j-heading{display:block}.j-heading>.j-text-button{padding-left:0;margin-top:5px}.j-stages{gap:6px}.j-stages button{min-width:65px;padding:8px 10px}.j-unit-banner{padding:20px 18px}.j-unit-banner h2{font-size:1.15rem}.j-world-number{font-size:1.9rem}.j-path{padding:16px 12px}.j-path-stop{gap:15px;min-height:118px}.j-path-stop.stop-1,.j-path-stop.stop-2{padding-left:28px}.j-node{width:68px;flex-basis:68px;height:64px;font-size:1.5rem}.j-node small{left:7px}.j-path-stop:before{left:34px;top:76px;height:45px}.j-path-stop.stop-1:before,.j-path-stop.stop-2:before{left:62px}.j-node-label strong{font-size:.9375rem}.j-node-label span{font-size:.8125rem}.j-side{grid-template-columns:1fr}.j-resume{margin:14px;flex-direction:column;align-items:stretch}.j-resume .j-primary{width:100%}.j-focus-card{padding:24px 18px;border-radius:20px;margin:18px auto}.j-focus-card h1{font-size:1.35rem;line-height:1.8}.j-focus-card p{font-size:1rem}.j-example{padding:18px}.j-choices{gap:10px;grid-template-columns:1fr}.j-choices button{min-height:65px;padding:14px 18px;font-size:1.25rem}.j-actions .j-primary{width:100%}.j-feedback-card,.j-result-card{padding:28px 20px}.j-feedback-card h1,.j-result-card h1{font-size:1.4rem}.j-run-top{gap:12px}.j-run-bottom{gap:3px}.j-run-bottom button{font-size:.8125rem}.j-challenge-card{padding:25px 20px}.j-challenge-card h2{font-size:1.3rem}.j-course-card h2{font-size:1.35rem}.j-history td,.j-history th{padding:12px 6px;font-size:.875rem}.j-inline-note{margin:16px 0}.j-map>.j-inline-note{margin:14px}.j-array i{width:18px;height:18px;flex-basis:18px}}
@media(prefers-reduced-motion:reduce){.j-primary:active,.j-secondary:active,.j-node:active{transform:none}}
.learner-picker{display:flex;align-items:center;gap:8px;margin:0;font-size:.875rem;flex-shrink:0}.learner-picker select{width:auto;max-width:180px;margin:0;min-height:44px;background:#f5f9ff;border:2px solid #d5e3f6}.j-duel{margin-bottom:28px}.j-duel>select{max-width:260px;display:inline-block;margin-right:16px}.j-leaderboard{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.j-leaderboard article{display:flex;flex-direction:column;gap:10px;padding:20px;border:2px solid #e2e9f4;border-radius:18px}.j-leaderboard article.is-me{background:#eef6ff;border-color:#9fc7fb}.j-leaderboard b{font-size:1.6rem;color:#2563eb}.j-leaderboard small{color:#60738c}.j-match-list{margin-top:24px}.j-match{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid #e2e9f4}.j-match p{margin-bottom:0}.j-match button{flex-shrink:0}
@media(max-width:1100px){.topbar{gap:16px;padding-left:20px;padding-right:20px}.learner-picker>span{display:none}#journey-stats{gap:12px}}
@media(max-width:650px){.topbar{position:static;flex-wrap:wrap;justify-content:space-between;min-height:110px}.sidebar{top:0}.learner-picker{order:2}.learner-picker select{max-width:160px}#journey-stats{order:3;width:100%;justify-content:flex-end}.j-leaderboard{grid-template-columns:1fr}.j-match{align-items:flex-start;flex-direction:column}.j-duel>select{display:block;width:100%;max-width:100%}}
.challenge-selection{display:grid;grid-template-columns:minmax(130px,.7fr) minmax(220px,1.3fr);gap:14px 18px;width:100%;padding:18px;margin:4px 0;border:2px solid #d9e5f2;border-radius:17px;background:#fff;box-sizing:border-box}.challenge-selection legend{padding:0 8px;font-weight:750;color:#3f5874}.challenge-selection>div{min-width:0}.challenge-selection label{display:block;margin:0 0 7px;font-size:.875rem;font-weight:700;color:#506780}.challenge-selection select{width:100%;max-width:none;min-height:50px;margin:0;background:#fff}.duel-setup{margin-top:22px;padding-top:20px;border-top:1px solid #e2e9f4}.duel-setup>div:first-child{max-width:360px}.duel-setup>div:first-child label{display:block;margin-bottom:7px;font-size:.875rem;font-weight:700}.duel-setup>div:first-child select{width:100%;max-width:none;min-height:50px}.duel-selections{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}.duel-selections .challenge-selection{grid-template-columns:1fr}.j-empty-note{padding:16px;border-radius:14px;background:#f7fafc}.j-match-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.j-match-actions button{flex-shrink:0}.adaptive-visual{max-width:520px;margin:22px auto}.adaptive-visual svg{display:block;width:100%;height:auto}.adaptive-visual figcaption{text-align:center;margin-top:8px;color:#667990;font-size:.875rem}
@media(max-width:950px){.duel-selections{grid-template-columns:1fr}.duel-selections .challenge-selection{grid-template-columns:minmax(130px,.7fr) minmax(220px,1.3fr)}}
@media(max-width:650px){.challenge-selection,.duel-selections .challenge-selection{grid-template-columns:1fr;padding:15px}.j-match-actions{width:100%;flex-wrap:wrap}.j-match-actions .j-secondary{flex:1}.bonus-card .challenge-selection{padding:15px}}