:root,:root[data-theme=paper]{color-scheme:light;--bg: #f6f1e6;--bg-image: linear-gradient(#e9e1cf 1px, transparent 1px), linear-gradient(90deg, #e9e1cf 1px, transparent 1px);--bg-size: 22px 22px;--surface: #fffdf8;--surface-2: #f2ebdc;--text: #2a2621;--text-muted: #85796a;--line: #ddd3bf;--line-strong: #bdb097;--accent: #2d5bd1;--accent-text: #ffffff;--highlight: #ffe36e;--highlight-text: #2a2621;--good: #2f8f4e;--bad: #c8453b;--star: #e8a90c;--star-empty: #d9cfbb;--card: #ffffff;--card-line: #cfc5b1;--block: #cbbf9f;--block-lit: #ffcf33;--board: #efe6d3;--ink-stamp: #c8453b}:root[data-theme=chalk]{color-scheme:dark;--bg: #25302a;--bg-image: none;--bg-size: auto;--surface: #2d3932;--surface-2: #34413a;--text: #eef0e6;--text-muted: #a9b3a6;--line: #435048;--line-strong: #5d6d63;--accent: #f2d65c;--accent-text: #25302a;--highlight: #f2d65c;--highlight-text: #25302a;--good: #9fdc9f;--bad: #f3978a;--star: #f2d65c;--star-empty: #4a574f;--card: #ffffff;--card-line: #8e9c92;--block: #5b6c61;--block-lit: #f2d65c;--board: #1f2823;--ink-stamp: #f3978a}:root[data-theme=vivid]{color-scheme:dark;--bg: #16181d;--bg-image: radial-gradient(120% 90% at 50% 0%, #26202e 0%, #16181d 55%);--bg-size: auto;--surface: #1f2229;--surface-2: #282c35;--text: #e8eaed;--text-muted: #9aa0aa;--line: #30343e;--line-strong: #454b58;--accent: #ff8ab4;--accent-text: #1a1114;--highlight: #4ed0c0;--highlight-text: #0e2724;--good: #4ed0c0;--bad: #ff7b8a;--star: #ffd166;--star-empty: #3a3f4a;--card: #ffffff;--card-line: #3a3f4a;--block: #3b4356;--block-lit: #4ed0c0;--board: #111317;--ink-stamp: #ff8ab4}:root{--radius: 12px;--radius-sm: 8px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", "Noto Sans TC", "Noto Sans SC", "PingFang TC", "Microsoft JhengHei", sans-serif;--cell: min(96px, calc((min(100vw, 520px) - 64px)/4) )}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background-color:var(--bg);background-image:var(--bg-image);background-size:var(--bg-size);background-attachment:fixed;color:var(--text);font:16px/1.5 var(--font-family);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}.app{max-width:520px;margin:0 auto;min-height:100dvh;padding:max(12px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.screen{display:flex;flex-direction:column;gap:16px;flex:1}.topbar{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;min-height:44px}.topbar-title{text-align:center;font-weight:600;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-right{justify-self:end}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:none;background:none;border-radius:50%;cursor:pointer;color:var(--text)}.icon-btn:hover{background:var(--surface-2)}.icon{width:22px;height:22px;flex:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:var(--radius);border:1.5px solid var(--line-strong);background:var(--surface);cursor:pointer;font-weight:600}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.btn:disabled{opacity:.4;cursor:default}.btn:disabled:hover{border-color:var(--line-strong)}.btn-primary:disabled:hover{border-color:var(--accent)}.btn-block{width:100%}.btn:focus-visible,.icon-btn:focus-visible,.card-btn:focus-visible,.option:focus-visible,.key:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.brand{text-align:center;padding:8px 0 4px}.brand h1{margin:0;font-size:34px;letter-spacing:.02em;line-height:1.2}.brand-sub{font-size:15px;font-weight:700;letter-spacing:.08em;color:var(--text-muted)}.brand p{margin:6px 0 0;color:var(--text-muted)}.section-title{margin:8px 0 0;font-size:15px;font-weight:700;color:var(--text-muted);letter-spacing:.04em}.domain-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card-btn{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;padding:14px;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--surface);cursor:pointer;min-height:150px}.card-btn:hover:not(:disabled){border-color:var(--accent)}.card-btn:disabled{cursor:default}.card-btn .name{font-weight:700;font-size:17px}.card-btn .desc{font-size:13px;color:var(--text-muted);flex:1}.domain-icon{width:36px;height:36px;color:var(--accent)}.meter{width:100%;display:grid;gap:4px;font-size:12px;color:var(--text-muted)}.meter-track{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}.meter-fill{height:100%;background:var(--star);border-radius:3px}.soon-list{display:grid;gap:10px}.soon{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--radius);border:1.5px dashed var(--line-strong);color:var(--text-muted)}.soon .name{font-weight:700;color:var(--text)}.soon .desc{font-size:13px}.badge{margin-left:auto;flex:none;font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px;background:var(--surface-2);color:var(--text-muted)}.level-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.level-tile{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px;min-height:72px;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--surface);cursor:pointer;text-align:left}.level-tile:hover:not(:disabled){border-color:var(--accent)}.level-tile:disabled{cursor:default;background:transparent;border-style:dashed;color:var(--text-muted)}.level-tile .num{font-weight:700;font-size:17px}.stars{display:inline-flex;gap:2px}.star{width:18px;height:18px}.stars-lg .star{width:52px;height:52px}.play-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;color:var(--text-muted)}.dots{display:flex;gap:6px}.dot{width:10px;height:10px;border-radius:50%;background:var(--surface-2);border:1.5px solid var(--line-strong)}.dot.is-current{border-color:var(--accent)}.dot.is-good{background:var(--good);border-color:var(--good)}.dot.is-bad{background:var(--bad);border-color:var(--bad)}.timer{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums}.timer .icon{width:16px;height:16px}.prompt{margin:0;font-size:17px;font-weight:600;text-align:center}.qcard{width:var(--cell);height:var(--cell);background:var(--card);border:1.5px solid var(--card-line);border-radius:var(--radius-sm);display:grid;place-items:center;position:relative;padding:0}.qcard svg{width:100%;height:100%;display:block}.qcard-question{font-size:calc(var(--cell) * .42);font-weight:700;color:#8a8175;border-style:dashed}.matrix-grid{display:grid;grid-template-columns:repeat(3,var(--cell));gap:6px;justify-content:center}.options{display:grid;grid-template-columns:repeat(4,var(--cell));gap:8px;justify-content:center}.option{cursor:pointer}.option:disabled{cursor:default}.option.is-correct{outline:4px solid var(--good);outline-offset:2px}.option.is-wrong{outline:4px solid var(--bad);outline-offset:2px}.option .mark{position:absolute;top:-10px;right:-10px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff}.option.is-correct .mark{background:var(--good)}.option.is-wrong .mark{background:var(--bad)}.option .mark .icon{width:16px;height:16px}.rotation-ref{display:grid;justify-items:center;gap:6px;font-size:13px;color:var(--text-muted)}.rotation-ref .qcard{width:calc(var(--cell) * 1.6);height:calc(var(--cell) * 1.6)}.series{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.term{min-width:48px;padding:9px 6px;text-align:center;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;background:var(--card);color:#1a1a1a;border:1.5px solid var(--card-line);border-radius:var(--radius-sm)}.term-answer{border-style:dashed;border-color:var(--accent);min-width:56px}.term-answer.is-correct{border:3px solid var(--good)}.term-answer.is-wrong{border:3px solid var(--bad)}.term-answer .typed-wrong{text-decoration:line-through;color:var(--bad);font-size:16px;margin-right:6px}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:320px;width:100%;margin:0 auto}.key{min-height:52px;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--surface);font-size:22px;font-weight:600;cursor:pointer;display:grid;place-items:center}.key:active:not(:disabled){background:var(--surface-2)}.key:disabled{opacity:.45;cursor:default}.key-enter{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.corsi-board{width:min(100%,360px);aspect-ratio:1;margin:0 auto;display:block;background:var(--board);border-radius:var(--radius);touch-action:manipulation}.corsi-block{fill:var(--block);transition:fill 90ms}.corsi-block.is-lit{fill:var(--block-lit)}.corsi-block.is-bad{stroke:var(--bad);stroke-width:1.6}.corsi-hit{cursor:pointer}.corsi-order{font-size:7px;font-weight:800;fill:var(--text);pointer-events:none}.feedback{display:grid;gap:12px;padding:16px;border-radius:var(--radius);background:var(--surface);border:1.5px solid var(--line)}.feedback-title{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:800}.feedback.is-wrong .feedback-title{color:var(--bad)}.feedback ul{margin:0;padding-left:20px;display:grid;gap:4px;font-size:15px}.feedback ul li:first-child:last-child{list-style:none;margin-left:-20px}.hl{position:relative;z-index:0;padding:0 4px;color:var(--highlight-text)}.hl:before{content:"";position:absolute;top:12%;right:-2px;bottom:8%;left:-2px;background:var(--highlight);z-index:-1;border-radius:3px 6px 4px 7px;transform:skew(-8deg)}.result{display:grid;justify-items:center;gap:12px;text-align:center;padding-top:24px}.result h2{margin:0;font-size:28px}.result .muted{color:var(--text-muted)}.result-actions{display:grid;gap:10px;width:100%;margin-top:12px}.stamp{display:inline-block;padding:2px 10px;border:2.5px solid var(--ink-stamp);color:var(--ink-stamp);border-radius:6px;font-weight:800;font-size:14px;transform:rotate(-6deg);letter-spacing:.05em}.settings-group{display:grid;gap:8px}.settings-group h2{margin:8px 0 0;font-size:15px;color:var(--text-muted)}.choice-list{display:grid;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface);overflow:hidden}.choice{display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:52px;cursor:pointer;border-top:1px solid var(--line)}.choice:first-child{border-top:none}.choice input{accent-color:var(--accent);width:18px;height:18px;margin:0}.choice .hint{display:block;font-size:12px;color:var(--text-muted)}.swatch{margin-left:auto;display:inline-flex;width:44px;height:26px;border-radius:6px;overflow:hidden;border:1px solid var(--line-strong)}.swatch span{flex:1}.about{font-size:13px;color:var(--text-muted);display:grid;gap:6px}.dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:grid;place-items:center;padding:20px;z-index:10}.dialog{width:min(100%,360px);background:var(--surface);border-radius:var(--radius);padding:20px;display:grid;gap:16px;box-shadow:0 10px 40px #0000004d}.dialog p{margin:0}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.center{text-align:center}.muted{color:var(--text-muted)}.small{font-size:12px}.select{width:100%;min-height:48px;padding:0 12px;font:inherit;font-size:17px;color:var(--text);background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--radius)}.age-screen{display:grid;gap:16px;padding-top:12vh}.age-screen h2{margin:12px 0 0;text-align:center;font-size:20px}.age-screen p{margin:0;font-size:13px;text-align:center}.notice-card{display:grid;gap:10px;padding:16px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius)}.age-screen .pilot-body{font-size:15px;text-align:left}.age-screen .pilot-body.muted{font-size:13px}.formal-card{min-height:0;border-width:2px;border-color:var(--accent)}.rules{margin:0;padding:16px 16px 16px 34px;display:grid;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius)}.locked-note{text-align:center;padding:12px;border:1.5px dashed var(--line-strong);border-radius:var(--radius);color:var(--text-muted)}.option.is-selected{outline:4px solid var(--accent);outline-offset:2px}.timebar{display:flex;align-items:center;gap:10px;min-height:18px}.timebar-track{flex:1;height:5px;border-radius:3px;background:var(--surface-2);overflow:hidden}.timebar-fill{height:100%;background:var(--accent);transform-origin:left center;transition:transform .2s linear}.timebar-text{font-size:13px;font-variant-numeric:tabular-nums;min-width:4em;text-align:right}.timebar.is-warn .timebar-fill{background:var(--bad)}.timebar.is-warn .timebar-text{color:var(--bad);font-weight:700}.formal{position:relative}.formal.is-timeup>:not(.timeup):not(.topbar){opacity:.35;pointer-events:none}.timeup{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);padding:14px 28px;border-radius:var(--radius);background:var(--surface);border:2px solid var(--bad);color:var(--bad);font-size:22px;font-weight:800;z-index:5}.report{display:grid;gap:12px}.report-head{display:flex;justify-content:space-between;align-items:center}.report-score{text-align:center}.big-score{font-size:40px;font-weight:800;line-height:1.25;letter-spacing:.01em;font-variant-numeric:tabular-nums}.bell{width:100%;display:block}.bell-curve{fill:var(--surface-2);stroke:var(--line-strong);stroke-width:1.5}.bell-band{fill:var(--highlight)}.bell-mid{stroke:var(--text);stroke-width:1.5;stroke-dasharray:3 3}.bell-axis{stroke:var(--line-strong)}.bell-tick{font-size:10px;fill:var(--text-muted)}.report-card{display:grid;gap:4px;padding:12px 14px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius)}.report-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}.report-card-head .muted{font-size:12px}.radar{width:100%;display:block}.radar-grid{fill:none;stroke:var(--line)}.radar-shape{fill:var(--accent);fill-opacity:.18;stroke:var(--accent);stroke-width:2;stroke-linejoin:round}.radar-label{font-size:11px;fill:var(--text)}.tags{display:flex;flex-wrap:wrap;gap:6px}.tag{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--surface-2);color:var(--text)}.level-meter{display:flex;gap:4px;justify-content:center}.level-meter span{width:22px;height:10px;border-radius:3px;background:var(--star-empty)}.level-meter span.on{background:var(--star)}.report-note{font-size:12px;color:var(--text-muted);padding:10px 12px;border:1.5px dashed var(--line-strong);border-radius:var(--radius)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.screen-enter{animation:fade-up .22s ease-out both}@keyframes fade-up{0%{opacity:0;transform:translateY(8px)}}.fx .hl:before{transform-origin:left center;animation:highlight-sweep .38s 80ms cubic-bezier(.2,.7,.2,1) both}@keyframes highlight-sweep{0%{transform:skew(-8deg) scaleX(0)}to{transform:skew(-8deg) scaleX(1)}}.fx .check-draw path{stroke-dasharray:30;stroke-dashoffset:30;animation:check-draw .36s .26s ease-out forwards}@keyframes check-draw{to{stroke-dashoffset:0}}.fx .shake{animation:shake .26s ease-in-out}@keyframes shake{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.fx .pop{animation:pop .32s cubic-bezier(.3,1.6,.5,1) both}@keyframes pop{0%{opacity:0;transform:scale(.4)}}.fx .stars-lg .star:nth-child(2){animation-delay:.14s}.fx .stars-lg .star:nth-child(3){animation-delay:.28s}.fx .stamp{animation:stamp .36s .52s cubic-bezier(.3,1.4,.5,1) both}@keyframes stamp{0%{opacity:0;transform:rotate(-6deg) scale(1.8)}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}.fx .check-draw path{stroke-dashoffset:0}}
