:root{font-family:system-ui,-apple-system,"Microsoft JhengHei","Noto Sans TC",sans-serif;color:#19324e;background:#f2f5f9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.43;cursor:not-allowed}.hidden{display:none!important}.header{background:#172d47;color:white;display:flex;gap:14px;align-items:center;padding:17px max(18px,calc((100vw - 1160px)/2));box-shadow:0 3px 15px #12294212}.logo{height:50px;width:50px;display:grid;place-items:center;border-radius:14px;background:#2a4664;font-size:29px}.heading{flex:1}.heading h1{font-size:22px;margin:0 0 3px}.heading p{font-size:13px;margin:0;color:#cfdaea}.header-link{color:white;border:1px solid #58708c;padding:10px 15px;border-radius:10px;text-decoration:none;font-size:14px}.page{width:min(1100px,100% - 36px);margin:27px auto 52px}.welcome{background:linear-gradient(120deg,#1a395e,#254c77);color:white;border-radius:18px;padding:31px 34px;margin-bottom:18px}.welcome h2{font-size:30px;line-height:1.4;margin:10px 0}.welcome p{max-width:780px;color:#dce9f9;line-height:1.8;margin:0}.eyebrow{font-size:12px;letter-spacing:.08em;color:#729bc5;font-weight:800}.welcome .eyebrow{color:#a2c4ec}.profilebar{background:white;border:1px solid #dee8f2;border-radius:14px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px}.profilebar>div{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}.profilebar small,.summary small{font-size:13px;color:#728095}.profilebar strong{font-size:18px}.profilebar span{font-size:12px;color:#8593a5}.section-title{font-size:18px;margin:28px 2px 15px}.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.mode{text-align:left;display:flex;flex-direction:column;gap:7px;border:1px solid #dbe4ef;background:white;border-radius:16px;padding:23px 24px;min-height:170px;color:#163653;transition:transform .15s,border-color .15s,box-shadow .15s}.mode:hover,.mode:focus-visible{border-color:#4295dc;box-shadow:0 7px 20px #173d6b13;transform:translateY(-1px)}.mode-badge{width:max-content;background:#e4f1ff;color:#1b5e98;padding:5px 10px;border-radius:16px;font-size:12px;font-weight:800}.muted-badge{background:#f0f3f6;color:#5d6d7f}.mode-icon{font-size:27px}.mode b{font-size:19px}.mode>span:last-child{font-size:13px;color:#69798c}.home-row{display:flex;align-items:center;gap:12px;margin:21px 0}.home-row label{font-weight:700}.home-row select{flex:1;max-width:430px;border:1px solid #cbd8e7;padding:11px;border-radius:9px;background:white;color:#1c3652}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.summary>div{background:white;border:1px solid #dce6f2;border-radius:12px;padding:17px;display:grid;gap:4px}.summary strong{font-size:29px;font-variant-numeric:tabular-nums}.footnote{color:#8593a3;font-size:12px;line-height:1.7;margin:20px 2px}.quiz,.finished{max-width:830px;margin:0 auto}.quiz-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:5px 0 13px}.text-btn{background:transparent;border:0;color:#3974aa;padding:10px 0}.quiz-mode{font-size:14px;font-weight:700}.quiz-bar strong{font-variant-numeric:tabular-nums}.track{height:8px;background:#dce5ee;border-radius:99px;overflow:hidden;margin-bottom:17px}.track span{height:100%;width:0;background:#317fc0;display:block;transition:width .2s}.question-card{background:white;border:1px solid #dce6f2;border-radius:18px;padding:28px 30px;box-shadow:0 12px 30px #1d416912}.question-top{display:flex;justify-content:space-between;align-items:center;gap:14px}.pill{background:#eff5fa;color:#4e779a;border-radius:99px;padding:6px 11px;font-size:12px}.question-card h2{font-size:27px;line-height:1.5;margin:15px 0 9px;overflow-wrap:anywhere}.question-card>p{color:#687d92;margin:0 0 25px;line-height:1.6}.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.choice{border:1.5px solid #d5e1ec;border-radius:12px;background:#fff;color:#203c55;min-height:68px;text-align:center;font-size:19px;font-weight:750;padding:14px 10px}.choice:hover:not(:disabled){background:#f2f8ff;border-color:#89bbe7}.choice.selected{border-color:#247fc3;background:#e9f4ff}.choice.correct{background:#e8f6ed;border-color:#46a86a;color:#176d39}.choice.incorrect{background:#fef0ef;border-color:#d86c65;color:#a2312c}.quiz-actions{display:flex;gap:10px;margin-top:25px;flex-wrap:wrap}.primary,.ghost{border-radius:10px;padding:12px 19px;min-height:46px;font-size:15px;font-weight:750}.primary{background:#216baf;color:white;border:1px solid #216baf}.primary:hover:not(:disabled){background:#15548b}.ghost{border:1px solid #c9d8e8;background:white;color:#28679e}.ghost:hover:not(:disabled){background:#f0f6fd}.feedback{background:#eef5fb;border-left:4px solid #2d78b5;color:#244562;padding:14px 17px;line-height:1.65;margin-top:18px;border-radius:4px}.feedback.good{border-color:#4aa16e;background:#f0faf3}.feedback.bad{border-color:#d49a47;background:#fffbf0}.feedback b{display:block}.feedback .f-sub{font-size:13px;color:#587085}.question-footer{font-size:12px;color:#8998a8;text-align:center;margin:15px 0}.blind-map{border:1px solid #dce5ee;border-radius:14px;background:#f8fbfe;margin-top:14px;padding:10px;overflow:hidden}.blind-map svg{width:100%;max-height:480px;display:block;touch-action:manipulation}.village-shape{fill:#cad8e5;stroke:white;stroke-width:1.3;cursor:pointer;transition:fill .13s}.village-shape:hover{fill:#98bad5}.village-shape.is-selected{fill:#5c9bcb;stroke:#255a89;stroke-width:2}.village-shape.is-right{fill:#51b17c;stroke:#176b3e;stroke-width:2.3}.village-shape.is-wrong{fill:#e5a09b}.village-text{fill:#17344f;font-size:10px;font-weight:800;pointer-events:none}.map-note{font-size:12px;text-align:center;color:#637990}.route-think{display:flex;flex-direction:column;gap:11px}.route-think label{font-size:17px;font-weight:750}.route-think input{min-height:50px;border:1px solid #adc2d5;border-radius:10px;padding:10px 14px;max-width:100%}.route-think p{font-size:13px;color:#78899a;line-height:1.6}.route-think .route-location{border-radius:12px;background:#eef5fb;padding:14px}.route-think .route-location svg{width:100%;max-height:370px;display:block}.route-think .route-location a{color:#155c91;display:inline-block;margin-top:8px}.finished{background:white;border:1px solid #dae6f0;border-radius:18px;padding:40px;text-align:center}.finish-icon{font-size:60px}.finished h2{font-size:29px}.finish-score{font-size:46px;color:#1c6cad;font-variant-numeric:tabular-nums}.finished p{color:#718095;line-height:1.7}.finish-actions{display:flex;gap:10px;justify-content:center}.review{text-align:left;margin-top:28px}.review h3{font-size:18px}.review-item{border-top:1px solid #e5ebf0;padding:13px 4px}.review-item b{display:block;margin-bottom:5px}.review-item span{color:#697d91;font-size:13px}.footer{text-align:center;border-top:1px solid #d8e1eb;color:#77879b;font-size:12px;padding:20px 16px;line-height:1.7}.footer a{color:#266aab}.dialog-body{padding:23px 28px 25px;min-width:min(360px,85vw);display:grid;gap:13px}.dialog-body h2{margin:0}.dialog-body p{color:#667e93;font-size:14px;line-height:1.6;margin:0}.dialog-body label{font-weight:700}.dialog-body input{padding:12px;border:1px solid #acc0d5;border-radius:9px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:10px}dialog{border:1px solid #dce5ef;border-radius:15px;box-shadow:0 25px 65px #14253b44}dialog::backdrop{background:#14263b99}@media(max-width:700px){.header{padding:13px 15px}.logo{height:42px;width:42px;font-size:24px}.heading h1{font-size:17px}.heading p{font-size:11px}.header-link{font-size:12px;padding:7px 8px}.page{width:calc(100% - 22px);margin:13px auto 36px}.welcome{padding:21px}.welcome h2{font-size:22px}.mode-grid{grid-template-columns:1fr;gap:10px}.mode{min-height:124px;padding:17px;gap:5px}.mode-icon{font-size:23px}.mode b{font-size:18px}.profilebar{padding:14px;align-items:center}.profilebar>div{gap:5px;flex-direction:column}.home-row{display:block}.home-row label{display:block;margin-bottom:8px}.home-row select{width:100%;max-width:none}.question-card{padding:20px 15px}.question-card h2{font-size:21px}.choices{gap:8px}.choice{min-height:61px;font-size:17px;padding:10px 5px}.quiz-bar{font-size:12px}.summary>div{padding:11px}.summary strong{font-size:25px}.summary small{font-size:11px}.finished{padding:26px 17px}.finish-actions{flex-wrap:wrap}}@media(max-width:390px){.header-link{font-size:11px}.heading h1{font-size:16px}.logo{display:none}.choice{font-size:16px}}

/* v0.8.1: clear road interaction and responsive inline map */
.home-row-count{flex-wrap:wrap;margin-top:-7px}.home-row-count small{width:100%;margin-left:0;color:#7c8b9b;font-size:12px}
.multi-choices .choice{font-size:17px;min-height:61px}.multi-hint{font-size:13px;color:#71879a;margin:12px 0 2px}
.road-add-row{display:flex;gap:8px;align-items:center}.road-add-row input{flex:1;min-width:0}.road-add-row button{white-space:nowrap}
.selected-roads{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}.road-chip{border:1px solid #8ebde4;background:#eaf4ff;border-radius:99px;padding:9px 12px;font-size:14px;color:#215c89}.road-chip:hover{background:#d3eaff}
.route-feedback{background:#f2f7fc;border-color:#307cbd}.route-feedback p{margin:8px 0 10px}.route-live-status{color:#1c5c8a;font-size:14px;font-weight:700}.inline-street-map{width:100%;height:340px;background:#e9eef5;border:1px solid #c9dbe9;border-radius:12px;overflow:hidden;margin:12px 0}
.reference-sequence{background:white;border:1px solid #cfdfed;border-radius:10px;padding:12px;margin:12px 0;font-size:14px}.reference-sequence strong{display:block}.reference-sequence p{color:#71869a;font-size:13px;margin:7px 0}
.road-comparison{font-weight:700;margin:10px 0}.route-warning{color:#a86021!important}.fallback-map{padding:10px 12px;background:#fff;border-radius:10px;margin:12px 0}.fallback-map summary{cursor:pointer;color:#2668a1;font-size:13px;font-weight:700}.fallback-map svg{display:block;width:100%;max-height:360px;margin-top:6px}
.route-pin{border-radius:50%;border:2px solid #fff;min-width:22px;height:22px;display:grid;place-items:center;color:#e55c34;background:#fff;box-shadow:0 1px 5px #0004;font-size:20px}
@media(max-width:700px){.road-add-row{flex-wrap:wrap}.road-add-row input{width:100%;flex-basis:100%}.road-add-row button{width:100%}.inline-street-map{height:310px}.home-row-count small{line-height:1.5}}

.home-row-count input{background:white;color:#1c3652;border:1px solid #cbd8e7;border-radius:9px;padding:11px 14px;width:110px;flex:0 0 110px}
.road-quick-picks{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:3px 0 0}.road-quick-picks small{width:100%;color:#788b9d;font-size:12px}.quick-road{border:1px solid #bbd6ec;background:#f8fbff;border-radius:8px;color:#1e669d;padding:8px 10px;font-size:13px}.quick-road:hover{background:#e1f0fd}

/* V0.8.2 - selectable village filters and four modes */
.village-selector{background:#fff;border:1px solid #dbe6f0;border-radius:16px;padding:22px 23px;margin:23px 0 12px}
.village-selector-head h3{font-size:18px;margin:0 0 6px;color:#18354f;display:flex;gap:10px;align-items:center}
.village-selector-head p{font-size:13px;line-height:1.6;color:#6a8093;margin:0 0 14px}
.selected-village-count{font-size:13px;font-weight:700;color:#1c70ac;background:#e9f4fc;border-radius:100px;padding:4px 9px}
.warm-star{color:#cd9225;font-size:16px}
.village-presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px}
.village-presets button{min-height:38px;padding:7px 13px;font-size:13px}
.village-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.village-option{min-height:46px;border:1.5px solid #d7e3ee;background:#fafcfe;border-radius:10px;color:#4a6276;display:flex;justify-content:center;align-items:center;gap:4px;font-size:15px;font-weight:700;white-space:nowrap}
.village-option.checked{background:#eaf4ff;border-color:#8abce6;color:#235e90;box-shadow:inset 0 0 0 1px #bdd9f2}
.village-option:hover,.village-option:focus-visible{border-color:#2c81c4;outline-offset:2px}
.village-notice{font-size:12px;color:#68829a;margin:12px 0 0;line-height:1.5}
.mode-mixed{background:linear-gradient(150deg,#f7fbff,#fff);border-color:#bcd6ec}
@media(max-width:900px){.village-options{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:600px){.village-selector{padding:16px 13px}.village-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.village-option{font-size:14px;min-height:48px}.village-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.village-presets button{padding:8px 3px;min-height:42px}.village-selector-head h3{font-size:17px}}

/* V0.8.3 - clearer navigation, practice score, and guarded reset */
.back-home-button{border:1.5px solid #b6d2e8;border-radius:12px;background:#e5f1fc;color:#155c95;font-weight:800;font-size:16px;min-height:46px;padding:10px 18px;box-shadow:0 1px 3px #10457212;cursor:pointer;white-space:nowrap}
.back-home-button:hover,.back-home-button:focus-visible{background:#cce7fc;border-color:#4f95c7;outline-offset:2px}
.score-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:14px 0 5px;flex-wrap:wrap}
.score-toolbar p{color:#6b8195;font-size:12px;line-height:1.7;margin:0;flex:1 1 280px}
.danger-outline{color:#a83c35;border:1px solid #d9a59e;background:#fff9f8;border-radius:10px;padding:10px 15px;font-weight:750;min-height:42px;cursor:pointer}
.danger-outline:hover,.danger-outline:focus-visible{background:#ffe9e7;border-color:#c56a61}
.danger-solid{color:white;background:#a62824;border:1px solid #a62824;border-radius:10px;padding:12px 16px;font-weight:750;min-height:44px;cursor:pointer}
.danger-solid:disabled{background:#b3b7bf;border-color:#b3b7bf;cursor:not-allowed}
.reset-dialog h2{color:#a62824;font-size:22px}
.reset-danger-notice{background:#fff0ec;border:1px solid #eeb8ab;border-radius:10px;padding:12px;color:#8c302b!important}
.reset-check{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.5}
.reset-check input{width:20px;height:20px;accent-color:#b53731;flex:0 0 20px}
.route-grade{background:#e7f4ec;border:1px solid #96caae;color:#184d34;border-radius:11px;padding:14px;margin:13px 0}
.route-grade strong{font-size:17px}
.route-grade p{color:#355e4b;font-size:13px;margin:7px 0!important}
.bypass-route{font-size:12px;padding:9px 12px;min-height:38px}
.summary{grid-template-columns:repeat(4,minmax(0,1fr))}
.summary small{line-height:1.5}
@media(max-width:900px){.summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.quiz-bar{flex-wrap:wrap}.back-home-button{font-size:15px;min-height:44px;padding:9px 13px}.summary{gap:8px}.summary>div{min-width:0}.summary strong{font-size:24px}.score-toolbar{align-items:stretch}.danger-outline{width:100%}}

/* V0.8.4 · game-style personal growth and local podium */
.growth-dashboard{display:grid;grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);gap:15px;align-items:stretch;margin-bottom:21px}
.growth-card,.leaderboard-card{background:#fff;border:1px solid #dce6f0;border-radius:17px;box-shadow:0 5px 20px #163b5e08;padding:20px}
.growth-hero{display:flex;gap:21px;align-items:center}.avatar-button{position:relative;flex:0 0 123px;display:grid;place-items:center;border:0;background:transparent;width:123px;height:123px;padding:0}
.avatar-exp-ring{width:119px;height:119px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#34b58a var(--exp-percent,0%),#e0eaf2 0);transition:background .2s;box-shadow:0 0 0 1px #cce0e8}
.avatar-exp-ring:before{content:"";position:absolute;width:103px;height:103px;background:#fff;border-radius:50%}
.avatar-exp-ring img{width:93px;height:93px;object-fit:contain;position:relative;border-radius:50%;z-index:1}
.avatar-edit{position:absolute;right:2px;bottom:7px;width:27px;height:27px;background:#196ea7;color:#fff;border:2px solid white;border-radius:50%;display:grid;place-items:center;font-size:14px;z-index:2}
.growth-person{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;flex:1}.growth-person>small{font-size:12px;color:#758ba0}.growth-person>strong{font-size:23px;overflow-wrap:anywhere}
.equipped-title{border:1px solid #d4e4f2;color:#20658e;background:#eaf4fb;border-radius:99px;padding:5px 11px;font-weight:750;font-size:13px;max-width:100%}
.level-label{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.level-label span:first-child{font-weight:900;font-size:20px;color:#2176ab}.level-label span:last-child{font-size:13px;color:#536e84;font-variant-numeric:tabular-nums}
.growth-person p{margin:0;color:#71869a;font-size:12px;line-height:1.5}.growth-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;border-top:1px solid #edf2f6;padding-top:13px}.growth-actions span{font-size:11px;color:#8495a7;text-align:right}
.leaderboard-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.leaderboard-head h3{margin:0;font-size:17px}.leaderboard-head h3 span{font-size:11px;color:#a27823;background:#fff3d7;border-radius:50px;padding:4px 8px}.board-local{background:#edf2f8;border-radius:50px;padding:4px 10px;font-size:11px;color:#667f97}
.leaderboard-rows{display:grid;gap:6px;margin-top:11px}.leaderboard-person{display:flex;gap:9px;align-items:center;border-radius:10px;padding:5px 7px;background:#f7fafc}.leaderboard-person.top1{background:#fff9e9}.leaderboard-rank{font-weight:800;font-size:14px;color:#9e7740;min-width:20px;text-align:center}.leaderboard-person img{width:41px;height:41px;border-radius:50%;background:#ecf3f8}.leaderboard-info{flex:1;min-width:0}.leaderboard-info strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.leaderboard-info small{font-size:11px;color:#71849a}.leaderboard-level{font-weight:800;color:#165f9c;font-size:13px;white-space:nowrap}.board-empty{color:#798b9a;font-size:13px;line-height:1.6;margin:10px 0}.board-note{font-size:11px;color:#8898a8;line-height:1.55;margin:10px 0 0}
.custom-dialog{width:min(560px,90vw)}.avatar-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.avatar-choice{display:flex;flex-direction:column;align-items:center;gap:4px;border:1.5px solid #d7e3ee;border-radius:12px;background:#f8fbff;padding:8px 4px;min-width:0;color:#35516a}.avatar-choice img{width:65px;height:65px;max-width:100%;border-radius:50%}.avatar-choice span{font-size:11px;white-space:nowrap}.avatar-choice.active{border-color:#2b91c9;background:#e5f3fc;box-shadow:inset 0 0 0 1px #7bb9dc}.avatar-choice:focus-visible,.equipped-title:focus-visible{outline:2px solid #1c7cb4;outline-offset:3px}
.title-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.title-choice{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px;border:1.5px solid #d6e3ee;background:#f9fbfd;border-radius:10px;color:#24516f;font-size:14px;font-weight:750;text-align:left}.title-choice small{font-size:11px;color:#7d94a6}.title-choice.active{background:#e7f4fb;border-color:#4598d0}.title-choice:disabled{opacity:.55}
.level-up-dialog{align-items:center;text-align:center;padding:30px 26px;width:min(390px,88vw);background:radial-gradient(circle at 50% 22%,#fff4cb,#fff 67%)}.level-up-dialog h2{font-size:27px;color:#aa7621}.level-mini{letter-spacing:.17em;font-size:12px;font-weight:900;color:#c99633}.level-stars{font-size:25px;letter-spacing:8px;animation:twinkle 1s ease-in-out infinite alternate}.new-level{font-size:54px;font-weight:900;line-height:1;color:#b78224;text-shadow:0 2px #fff0b0}.level-up-dialog #newTitleUnlock{font-size:16px;font-weight:800;color:#7f602f}.level-up-dialog .primary{width:100%;margin-top:10px}
.xp-gain{background:#fff2d7;border:1px solid #f1d399;border-radius:8px;font-size:13px;font-weight:800;color:#96621f;padding:7px 10px;display:inline-block;margin:7px 0}.xp-gain.zero{background:#f5f6f8;color:#8997a4;border-color:#e3e9ed}
@keyframes twinkle{from{transform:scale(.93);opacity:.65}to{transform:scale(1.08);opacity:1}}
@media(prefers-reduced-motion:reduce){.level-stars{animation:none}}
@media(max-width:780px){.growth-dashboard{grid-template-columns:1fr}}
@media(max-width:480px){.growth-card,.leaderboard-card{padding:13px}.growth-hero{gap:12px}.avatar-button{width:104px;height:104px;flex-basis:104px}.avatar-exp-ring{width:103px;height:103px}.avatar-exp-ring:before{height:88px;width:88px}.avatar-exp-ring img{width:80px;height:80px}.growth-person>strong{font-size:20px}.growth-actions{flex-wrap:wrap}.growth-actions span{text-align:left}.avatar-choices{gap:5px}.avatar-choice{padding:7px 2px}.avatar-choice img{width:50px;height:50px}.avatar-choice span{font-size:10px}.title-choices{grid-template-columns:1fr}}

/* V0.8.5: simplify home screen while keeping functional indicators accessible. */
.welcome{padding-bottom:2px}
.score-toolbar{justify-content:flex-end}
.score-toolbar .danger-outline{margin-left:auto}
[hidden]{display:none!important}