:root{--red:#d93636;--yellow:#f4c95d;--green:#368a62;--text:#252525;--cream:#fff8ec;--card:#fff;--muted:#6b6259;--line:#eadfcd;--font:"Noto Sans SC", "Noto Sans", "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--cream);color:var(--text);font-family:var(--font);line-height:1.45}main{max-width:960px;margin:0 auto;padding:8px 16px 16px}a{color:var(--red)}:focus-visible{outline:3px solid var(--text);outline-offset:2px}.site-header{border-bottom:2px solid var(--line);background:var(--card);justify-content:space-between;align-items:center;gap:12px;padding:6px 16px;display:flex}.brand{letter-spacing:.06em;color:var(--red);font-weight:800;text-decoration:none}.user-nav{flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:.95rem;display:flex}.user-nav a{color:var(--text);font-weight:600;text-decoration:none}.user-nav a:hover{color:var(--red)}.btn{font:inherit;border:2px solid var(--text);background:var(--card);color:var(--text);cursor:pointer;border-radius:12px;min-height:44px;padding:10px 18px;font-weight:700}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--red);border-color:var(--red);color:#fff}.btn-yellow{background:var(--yellow);border-color:#c99a2a}.btn-green{background:var(--green);border-color:var(--green);color:#fff}.btn-ghost{border-color:var(--line);min-height:36px;padding:6px 12px}.btn-dev{border-style:dashed;font-size:.9rem}.auth-card{background:var(--card);border:2px solid var(--line);border-radius:16px;max-width:420px;margin:32px auto;padding:24px}.auth-card h1{margin-top:0}.field{flex-direction:column;gap:4px;margin-bottom:14px;display:flex}.field input{font:inherit;border:2px solid var(--line);border-radius:10px;padding:10px 12px}.field small{color:var(--muted)}.error{color:var(--red);font-weight:600}.lesson-list{gap:12px;padding:0;list-style:none;display:grid}.lesson-item a{background:var(--card);border:2px solid var(--line);color:var(--text);border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:16px;text-decoration:none;display:flex}.lesson-item a:hover{border-color:var(--red)}.tag{background:var(--cream);border:1px solid var(--line);border-radius:8px;padding:2px 8px;font-size:.85rem}.game{flex-direction:column;gap:8px;display:flex}.hud{background:var(--card);border:2px solid var(--line);border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:4px 12px;display:flex}.hud-stats{flex-wrap:wrap;gap:16px;font-weight:700;display:flex}.stage{border:2px solid var(--line);background:var(--cream);border-radius:14px;width:100%;height:200px;overflow:hidden}.progress{background:var(--line);border-radius:6px;height:10px;overflow:hidden}.progress>div{background:var(--green);height:100%;transition:width .4s}.target{text-align:center;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:6px}.hanzi{font-size:clamp(2.2rem,8vw,3.4rem);font-weight:700;line-height:1.1}.pinyin{color:var(--red);font-size:1.3rem;font-weight:600}.meaning{color:var(--muted)}.feedback{text-align:center;min-height:1.5em;margin:0;font-weight:600}.feedback.ok{color:var(--green)}.feedback.warn{color:var(--red)}.controls{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.dev-panel{border:2px dashed var(--muted);border-radius:12px;flex-wrap:wrap;justify-content:center;gap:6px;padding:4px 8px 8px;display:flex}.dev-panel span{text-align:center;width:100%;color:var(--muted);font-size:.85rem}.notice{text-align:center;color:var(--muted);font-size:.95rem}.tabs{flex-wrap:wrap;gap:6px;margin:8px 0;display:flex}.tabs a{border:2px solid var(--line);background:var(--card);color:var(--text);border-radius:10px;padding:6px 12px;font-weight:600;text-decoration:none}.tabs a[aria-current=page]{border-color:var(--red);color:var(--red);text-underline-offset:4px;font-weight:800;text-decoration:underline}.table{border-collapse:collapse;background:var(--card);border:2px solid var(--line);border-radius:12px;width:100%}.table th,.table td{border-bottom:1px solid var(--line);text-align:left;padding:6px 10px}.table td.num,.table th.num{text-align:right}.table tr.me{background:#fdf1d3;font-weight:700}.cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;display:grid}.card{background:var(--card);border:2px solid var(--line);border-radius:12px;padding:10px 14px}.card strong{font-size:1.5rem;display:block}.settings label{align-items:center;gap:10px;margin:10px 0;display:flex}.privacy{color:var(--muted);text-align:left;font-size:.92rem}dialog.dialog{background:var(--card);color:var(--text);text-align:center;border:3px solid var(--yellow);border-radius:18px;width:100%;max-width:min(420px,100vw - 32px);padding:24px}dialog.dialog::backdrop{background:#25252573}.dialog h2{margin-top:0}.dialog .controls{margin-top:16px}.reward{color:var(--red);font-size:2rem;font-weight:800}.results dl{text-align:left;grid-template-columns:1fr auto;gap:6px 16px;display:grid}.results dd{text-align:right;margin:0;font-weight:700}.filters{flex-wrap:wrap;align-items:flex-end;gap:8px 12px;margin:8px 0;display:flex}.filters label{flex-direction:column;gap:2px;font-size:.9rem;display:flex}.filters input,.filters select{font:inherit;border:2px solid var(--line);background:var(--card);border-radius:10px;padding:8px 10px}.scroll{overflow-x:auto}.facts{grid-template-columns:max-content 1fr;gap:4px 16px;display:grid}.facts dt{font-weight:700}.facts dd{margin:0}.breakdown{padding-left:1.2em}.breakdown h3{margin-bottom:4px;font-size:1.05rem}.totals th{text-align:left}.bar-cell{align-items:center;gap:6px;min-width:120px;display:flex}.bar{background:var(--green);border-radius:4px;height:12px;display:inline-block}.pager{gap:16px;margin:12px 0;display:flex}.admin-actions{margin:12px 0}.ok{color:var(--green);font-weight:600}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:600px){main{padding:4px 8px 8px}.site-header{gap:8px;padding:2px 8px}.brand{white-space:nowrap;font-size:.85rem}.user-nav{white-space:nowrap;flex-wrap:nowrap;gap:10px;font-size:.9rem;overflow-x:auto}.user-nav .btn-ghost{min-height:40px}.game{gap:6px}.stage{height:150px}.btn{padding:8px 12px}.btn-dev{min-height:40px;padding:6px 10px}.hud{flex-wrap:nowrap;gap:4px 8px;padding:2px 8px;font-size:.85rem}.hud-stats{gap:2px 10px}.hud>strong{display:none}.hud .btn-ghost{min-height:40px;padding:4px 10px}.wide-only{display:none}.feedback{font-size:.92rem}.game .notice{margin:0;font-size:.85rem}}