:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Noto Sans TC,sans-serif;color:#182235;background:#eef2f6;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,textarea,input,select{font:inherit}main{width:min(100% - 32px,720px);margin:0 auto;padding:48px 0 80px}header{margin-bottom:24px}.eyebrow{color:#177363;font-size:.75rem;font-weight:800;letter-spacing:.14em;margin:0 0 10px}h1{font-size:clamp(2.2rem,8vw,4rem);line-height:1;margin:0;letter-spacing:-.05em}h2{margin:4px 0 14px;font-size:1.4rem}.intro{color:#627083;line-height:1.6}button{border:0;border-radius:10px;font-weight:750;cursor:pointer}button:disabled{opacity:.6;cursor:wait}.primary{padding:12px 18px;color:#fff;background:#172234}.secondary{padding:8px 12px;color:#126557;background:#e8f5f1}.secondary:hover:not(:disabled){background:#d7eee8}.mode-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:14px;padding:5px;border-radius:13px;background:#dde5eb}.mode-tabs button{padding:10px 12px;color:#647184;background:transparent}.mode-tabs button.active{color:#172234;background:#fff;box-shadow:0 2px 8px #19293a17}.method-switch{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px;padding:12px 14px;border:1px solid #d5dee6;border-radius:13px;background:#f8fafc}.method-switch>div:first-child{display:grid;gap:2px}.method-switch span{color:#354255;font-size:.82rem;font-weight:800}.method-switch small{color:#758296;font-size:.7rem}.method-switch [role=group]{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:10px;background:#e4eaf0}.method-switch button{padding:8px 11px;color:#647184;background:transparent;font-size:.8rem}.method-switch button.active{color:#172234;background:#fff;box-shadow:0 2px 7px #19293a17}form,.results,.practice-card{background:#fff;border:1px solid #dce3ea;border-radius:18px;box-shadow:0 12px 32px #19293a12;padding:20px}.scramble-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}label,legend{font-weight:750}textarea{width:100%;resize:vertical;color:#172234;background:#f8fafc;border:1px solid #cdd6df;border-radius:10px;padding:13px;line-height:1.5}textarea:focus,input:focus{outline:3px solid rgb(23 115 99 / 16%);border-color:#177363}form>.primary{width:100%;margin-top:12px}.error{color:#a72c2c;background:#fff0f0;border:1px solid #f2caca;border-radius:10px;padding:12px 14px}.results{margin-top:18px;padding:4px 20px}.result{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0;border-bottom:1px solid #e6ebf0}.result span{color:#69778a;font-size:.9rem}.result strong{font-size:1.1rem;text-align:right;letter-spacing:.035em}.result .accent{color:#b15a0a}details{padding:18px 0;color:#566579}summary{cursor:pointer;font-weight:700;color:#324156}dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px;font-size:.85rem;overflow-wrap:anywhere}dt{font-weight:700}dd{margin:0}.practice-card{padding:24px}.status-card{color:#627083;text-align:center}.step-label{margin:0 0 8px;color:#177363;font-size:.78rem;font-weight:800;letter-spacing:.09em}.practice-scramble{margin:18px 0 22px;padding:18px;border:1px solid #d6dee6;border-radius:12px;color:#172234;background:#f7f9fb;font-size:1.12rem;font-weight:650;line-height:1.65;letter-spacing:.02em}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.button-row button{padding:12px 14px}.practice-mode-switch{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:-4px 0 24px;padding-bottom:18px;border-bottom:1px solid #e5eaf0}.practice-mode-switch>span{color:#69778a;font-size:.82rem;font-weight:750}.practice-mode-switch [role=group]{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:10px;background:#e8edf2}.practice-mode-switch button{padding:8px 12px;color:#647184;background:transparent}.practice-mode-switch button.active{color:#172234;background:#fff;box-shadow:0 2px 7px #19293a17}.practice-focus-details{margin:-7px 0 20px;padding:0;border-bottom:1px solid #e5eaf0;color:inherit}.practice-focus-details summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:2px 2px 16px;color:#536174;list-style:none}.practice-focus-details summary::-webkit-details-marker{display:none}.practice-focus-details summary:after{content:"⌄";color:#7a8798;font-size:1rem;transition:transform .18s ease}.practice-focus-details[open] summary:after{transform:rotate(180deg)}.practice-focus-details summary>span{font-size:.82rem;font-weight:750}.practice-focus-details summary>strong{margin-left:auto;color:#126557;font-size:.78rem}.practice-focus-switch{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 0 18px}.focus-select{display:grid;gap:7px}.focus-select>span{color:#69778a;font-size:.82rem;font-weight:750}.focus-select select{width:100%;min-width:0;padding:10px 34px 10px 11px;border:1px solid #cdd6df;border-radius:10px;color:#263348;background:#f8fafc}.focus-select select:focus{outline:3px solid rgb(23 115 99 / 16%);border-color:#177363}.practice-focus-summary{display:flex;justify-content:center;gap:6px;margin:0 0 16px}.practice-focus-summary span{padding:4px 9px;border-radius:999px;color:#126557;background:#e8f5f1;font-size:.75rem;font-weight:750}.screen-ready-note{min-height:88px;display:grid;place-items:center;margin:14px 0 18px;padding:18px;border-radius:12px;color:#69778a;background:#f2f5f8;text-align:center;line-height:1.6}.practice-form{padding:0;border:0;border-radius:0;box-shadow:none}.answer-field{margin-top:18px}.answer-field label{display:block;margin-bottom:7px}.answer-field input{width:100%;padding:11px 12px;border:1px solid #cdd6df;border-radius:9px;color:#172234;background:#f8fafc}.answer-field input:disabled{color:#354255;opacity:1}.answer-field small,fieldset small{display:block;margin-top:6px;color:#748195;font-size:.78rem;line-height:1.45}fieldset{display:flex;flex-wrap:wrap;gap:10px 22px;margin:20px 0 0;padding:13px 14px 12px;border:1px solid #d9e0e7;border-radius:10px}fieldset legend{padding:0 5px}fieldset label{display:flex;align-items:center;gap:6px}fieldset small{flex-basis:100%}.invalid-field input,fieldset.invalid-field{border-color:#cf4d4d;background:#fff5f5}.invalid-field small{color:#ad3030}.verdict{display:flex;align-items:center;gap:12px;margin:14px 0 4px;padding:14px 16px;border-radius:11px}.verdict strong{font-size:1.12rem}.verdict span{font-size:.85rem}.verdict.correct{color:#116454;background:#e9f6f2}.verdict.incorrect{color:#9c2929;background:#fff0f0}.answer-key{margin-top:18px;padding:16px 0 4px;border-top:1px solid #e2e7ec}.answer-list{margin-bottom:0}.next-question{width:100%;margin-top:18px}.memorize-card{text-align:center}.memorize-card h2{margin-top:16px}.memo-timer{display:block;margin:22px 0 8px;color:#172234;font-size:clamp(2.8rem,12vw,5rem);font-weight:820;letter-spacing:-.055em;font-variant-numeric:tabular-nums}.timer-note{margin:0 auto 24px;color:#6c798b;font-size:.9rem;line-height:1.5}.finish-memo{width:100%;padding:14px 18px}.three-d-cube{margin:18px 0 20px}.three-d-host{--cube-size: 230px;height:390px;display:grid;place-items:center;overflow:hidden;border-radius:14px;background:radial-gradient(circle,#fff 0,#f2f5f8 68%);touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.three-d-host:active{cursor:grabbing}.cube-scene{width:var(--cube-size);height:var(--cube-size);perspective:760px}.cube-object{position:relative;width:100%;height:100%;transform-style:preserve-3d}.three-d-face{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:4px;padding:5px;border-radius:8px;background:#111827;backface-visibility:hidden}.three-d-face-f{transform:translateZ(calc(var(--cube-size) / 2))}.three-d-face-b{transform:rotateY(180deg) translateZ(calc(var(--cube-size) / 2))}.three-d-face-r{transform:rotateY(90deg) translateZ(calc(var(--cube-size) / 2))}.three-d-face-l{transform:rotateY(-90deg) translateZ(calc(var(--cube-size) / 2))}.three-d-face-u{transform:rotateX(90deg) translateZ(calc(var(--cube-size) / 2))}.three-d-face-d{transform:rotateX(-90deg) translateZ(calc(var(--cube-size) / 2))}.three-d-face>i{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.three-d-sticker{display:grid;place-items:center;min-width:0;border-radius:6px;box-shadow:inset 0 0 0 1px #11182752}.three-d-sticker b{font-size:1.05rem;line-height:1;text-shadow:0 1px 2px rgb(255 255 255 / 55%)}.three-d-sticker small{font-size:.76rem;font-style:normal;font-weight:850;line-height:1;opacity:.72}.color-u{color:#172234;background:#f9fafb}.color-d{color:#172234;background:#ffd83d}.color-f{color:#fff;background:#22a866}.color-b{color:#fff;background:#3478d4}.color-r{color:#fff;background:#dc4545}.color-l{color:#172234;background:#f08a32}.three-d-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}.three-d-controls label{display:flex;align-items:center;gap:7px;color:#536174;font-size:.82rem;cursor:pointer}.three-d-controls input{width:17px;height:17px}.statistics{display:grid;gap:14px}.stats-heading,.stats-filter-details,.trend-card,.field-stats-card,.history-card{background:#fff;border:1px solid #dce3ea;border-radius:18px;box-shadow:0 12px 32px #19293a12}.stats-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px}.stats-heading h2,.history-card h2{margin:2px 0 0}.danger-secondary{padding:8px 12px;color:#a72c2c;background:#fff0f0}.danger-secondary:hover{background:#f9dede}.stats-filter-details{padding:0;color:inherit}.stats-filter-details summary{display:flex;align-items:center;gap:12px;padding:17px 22px;color:#536174;list-style:none}.stats-filter-details summary::-webkit-details-marker{display:none}.stats-filter-details summary:after{content:"⌄";color:#7a8798;transition:transform .18s ease}.stats-filter-details[open] summary:after{transform:rotate(180deg)}.stats-filter-details summary>span{flex:0 0 auto;font-size:.84rem;font-weight:800}.stats-filter-details summary>strong{margin-left:auto;color:#126557;font-size:.74rem;text-align:right}.stats-filters{display:grid;gap:14px;padding:0 22px 18px}.filter-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.filter-row>span{flex:0 0 auto;color:#536174;font-size:.82rem;font-weight:750}.filter-row [role=group]{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px;padding:4px;border-radius:10px;background:#e8edf2}.filter-row button{padding:7px 10px;color:#647184;background:transparent;font-size:.78rem}.filter-row button.active{color:#172234;background:#fff;box-shadow:0 2px 7px #19293a17}.legacy-note{margin:0;color:#7a6642;font-size:.76rem;line-height:1.5}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stat-card{min-width:0;padding:16px;border:1px solid #dce3ea;border-radius:14px;background:#fff;box-shadow:0 7px 20px #19293a0d}.stat-card span{display:block;margin-bottom:8px;color:#718095;font-size:.78rem}.stat-card strong{font-size:1.25rem;font-variant-numeric:tabular-nums}.trend-card{padding:20px 22px}.trend-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.trend-heading h2{margin:0 0 4px}.trend-heading span{color:#718095;font-size:.78rem}.trend-heading label{display:grid;gap:5px;color:#718095;font-size:.72rem;font-weight:700}.trend-heading select{min-width:150px;padding:8px 30px 8px 10px;border:1px solid #cdd6df;border-radius:9px;color:#263348;background:#f8fafc}.chart-wrap{margin-top:14px}.trend-chart{display:block;width:100%;height:auto;overflow:visible}.chart-grid{stroke:#e4eaf0;stroke-width:1}.chart-axis-label{fill:#7a8798;font-size:11px;font-variant-numeric:tabular-nums}.accuracy-line,.memo-line,.ao5-line{fill:none;stroke-linecap:round;stroke-linejoin:round}.accuracy-line{stroke:#177363;stroke-width:3}.accuracy-point{fill:#fff;stroke:#177363;stroke-width:2.5}.memo-line{stroke:#8aa0b3;stroke-width:2}.memo-point{fill:#fff;stroke:#6f879b;stroke-width:2}.ao5-line{stroke:#177363;stroke-width:3.5}.ao5-point{fill:#fff;stroke:#177363;stroke-width:2.5}.dnf-mark line{stroke:#c23d3d;stroke-width:3;stroke-linecap:round}.chart-legend{display:flex;justify-content:flex-end;gap:16px;color:#667589;font-size:.72rem}.chart-legend span:before{content:"";display:inline-block;width:18px;height:3px;margin-right:6px;border-radius:2px;vertical-align:middle;background:#8aa0b3}.chart-legend .ao5-legend:before{height:4px;background:#177363}.chart-legend .dnf-legend:before{display:none}.chart-legend .dnf-legend{color:#b43131;font-weight:750}.chart-note,.empty-chart{margin:10px 0 0;color:#718095;font-size:.78rem;line-height:1.5}.empty-chart{padding:34px 10px;border-radius:10px;background:#f5f7f9;text-align:center}.field-stats-card{padding:20px 22px}.field-stats-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px}.field-stats-heading h2{margin:0}.field-stats-heading>span{color:#718095;font-size:.78rem}.field-stats-list{display:grid;gap:15px;margin-top:20px}.field-stat-summary{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:7px}.field-stat-summary strong{font-size:.9rem}.field-stat-summary span{color:#718095;font-size:.78rem}.field-stat-summary b{color:#172234;font-size:.9rem;font-variant-numeric:tabular-nums}.accuracy-track{height:8px;overflow:hidden;border-radius:999px;background:#e5ebef}.accuracy-track span{display:block;height:100%;border-radius:inherit;background:#177363;transition:width .25s ease}.history-card{padding:20px 22px}.empty-history{margin:16px 0 2px;color:#6d7a8d;line-height:1.6}.history-list{margin-top:12px}.history-row{padding:16px 0;border-top:1px solid #e5eaf0}.history-row:first-child{border-top:0}.history-summary{display:flex;align-items:baseline;gap:12px}.history-summary strong{font-size:.9rem}.history-summary .passed{color:#126557}.history-summary .failed{color:#a72c2c}.history-summary span,.history-summary time{color:#6f7c8d;font-size:.8rem}.history-summary time{margin-left:auto}.history-row p{margin:10px 0;color:#2c384b;font-size:.9rem;line-height:1.5;overflow-wrap:anywhere}.check-list{display:flex;flex-wrap:wrap;gap:6px}.check-list span{padding:3px 7px;border-radius:999px;font-size:.7rem;font-weight:700}.check-pass{color:#126557;background:#e8f5f1}.check-fail{color:#a72c2c;background:#fff0f0}@media(max-width:480px){main{width:min(100% - 22px,720px);padding-top:30px}.result{align-items:flex-start;flex-direction:column;gap:7px}.result strong{text-align:left}dl{grid-template-columns:1fr}dd{margin-bottom:8px}.practice-card{padding:19px}.button-row{grid-template-columns:1fr}.button-row .primary{order:-1}.practice-mode-switch{align-items:flex-start;flex-direction:column;gap:9px}.practice-mode-switch [role=group]{width:100%}.practice-focus-switch{grid-template-columns:1fr}.three-d-host{--cube-size: 195px;height:330px}.three-d-controls{align-items:stretch;flex-direction:column}.verdict{align-items:flex-start;flex-direction:column;gap:4px}.mode-tabs button{padding-inline:5px;font-size:.86rem}.method-switch{align-items:stretch;flex-direction:column;gap:9px}.method-switch [role=group]{width:100%}.stats-grid{grid-template-columns:1fr 1fr}.stats-heading{align-items:flex-start}.stats-filter-details summary{align-items:flex-start;padding:15px 18px}.stats-filter-details summary>strong{max-width:210px;line-height:1.45}.filter-row{align-items:flex-start;flex-direction:column;gap:7px}.filter-row [role=group]{width:100%;justify-content:stretch}.filter-row button{flex:1}.trend-heading{align-items:stretch;flex-direction:column}.trend-heading select{width:100%}.field-stats-heading{align-items:flex-start;flex-direction:column;gap:5px}}
