@font-face{font-family:UKai Deck;src:url(/fonts/ukai-cn-subset.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--bg: #ffffff;--fg: #1a1a1a;--muted: #6b7280;--card-bg: #ffffff;--border: #e5e7eb;--accent: #c1272d;--link: #c1272d;--tone-1: #c62828;--tone-2: #2e7d32;--tone-3: #1565c0;--tone-4: #7b1fa2;--tone-5: #5f6368;--ui-font: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans SC", sans-serif;--panel-border: 1px;--hanzi-font: "UKai Deck", "Kaiti SC", STKaiti, KaiTi, "AR PL UKai CN", "Noto Serif CJK SC", "Noto Serif SC", "Songti SC", SimSun, serif;--sp-1: .25rem;--sp-2: .5rem;--sp-3: .75rem;--sp-4: 1rem;--sp-5: 1.5rem;--sp-6: 2rem;color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #0f1115;--fg: #f3f4f6;--muted: #9ca3af;--card-bg: #171a21;--border: #262b36;--link: #ff6b6b;--tone-1: #ff8a80;--tone-2: #81c784;--tone-3: #7cb7f0;--tone-4: #ce93d8;--tone-5: #bdc1c6}}*{box-sizing:border-box}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}body{margin:0;font-family:var(--ui-font);background:var(--bg);color:var(--fg)}.app{max-width:640px;margin:0 auto;padding:1rem;padding-bottom:env(safe-area-inset-bottom)}.app-header{display:flex;align-items:baseline;justify-content:space-between}.app-header h1{font-size:1.25rem;color:var(--link);margin:.5rem 0}.progress{display:inline-flex;align-items:center;gap:.5rem;color:var(--muted);font-variant-numeric:tabular-nums}.header-right{display:flex;align-items:center;gap:.6rem}.chip.install{border-color:var(--link);color:var(--link)}.kbd-hint{text-align:center;color:var(--muted);font-size:.8rem;margin-top:.75rem}@media(pointer:coarse){.kbd-hint{display:none}}.update-toast{position:fixed;left:50%;bottom:calc(1rem + env(safe-area-inset-bottom));transform:translate(-50%);z-index:50;display:flex;align-items:center;gap:1rem;max-width:calc(100% - 2rem);padding:.75rem 1rem;border:1px solid var(--border);border-radius:12px;background:var(--card-bg);box-shadow:0 4px 16px #0000004d}.update-actions{display:flex;gap:.5rem;flex-shrink:0}.card{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:1.5rem;box-shadow:0 1px 3px #0000000f}.listen-btn{display:inline-flex;align-items:center;gap:.25rem;margin:.75rem auto 0;font-size:.95rem;padding:.4rem .9rem;border-radius:999px;border:1px solid var(--border);background:var(--bg);color:var(--fg);cursor:pointer}.listen-btn.sm{font-size:.95rem;justify-content:center;min-width:2rem;min-height:2rem;padding:.25rem;margin:0 0 0 .4rem;vertical-align:middle}.reveal-btn{display:block;width:100%;margin-top:1.5rem;padding:.75rem;font-size:1rem;border:none;border-radius:10px;background:var(--accent);color:#fff;cursor:pointer}.card-back{margin-top:1.25rem}.pinyin-row{display:flex;gap:.4rem;justify-content:center;font-size:1.4rem;font-weight:600}.tone-1{color:var(--tone-1)}.tone-2{color:var(--tone-2)}.tone-3{color:var(--tone-3)}.tone-4{color:var(--tone-4)}.tone-5{color:var(--tone-5)}.english{display:flex;flex-direction:column;gap:var(--sp-1);margin:var(--sp-2) auto var(--sp-4);max-width:40ch;text-align:center}.english-primary{font-size:1.05rem;color:var(--fg)}.english-more{font-size:.9rem;color:var(--muted)}.stroke-order{text-align:center;margin-top:var(--sp-4)}.stroke-canvases{display:flex;gap:var(--sp-2);justify-content:center;flex-wrap:wrap}.stroke-char{position:relative;box-sizing:content-box;border:var(--panel-border) solid var(--border);border-radius:10px;background:color-mix(in srgb,var(--fg) 4%,transparent);touch-action:none}.stroke-char svg{display:block}.type-glyph{position:absolute;top:0;right:0;bottom:0;left:0;font-family:var(--hanzi-font)}.icon{width:1em;height:1em;flex:none}.stroke-controls{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:center;margin-top:var(--sp-3)}.stroke-controls .listen-btn{margin:0}.stroke-controls .link-btn{display:inline-flex;align-items:center;gap:.4em}.stroke-status{margin:.4rem 0 0;font-size:.9rem;color:var(--link)}.search{width:100%;padding:.7rem .9rem;font-size:1rem;border:1px solid var(--border);border-radius:10px;background:var(--card-bg);color:var(--fg)}.filters{display:flex;flex-wrap:wrap;gap:.4rem;margin:.75rem 0}.chip{display:inline-flex;align-items:center;gap:.4em;padding:.35rem .8rem;font-size:.85rem;border:1px solid var(--border);border-radius:999px;background:var(--card-bg);color:var(--fg);cursor:pointer}.chip.on{background:var(--accent);border-color:var(--accent);color:#fff}.result-bar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:.25rem 0 .5rem}.result-count{color:var(--muted);font-size:.85rem;margin:0}.word-list{list-style:none;margin:0;padding:0}.word-row{display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;padding:.6rem .5rem;border:none;border-bottom:1px solid var(--border);background:none;color:var(--fg);cursor:pointer}.word-row:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}.row-hanzi{font-size:1.6rem;min-width:2.4em}.row-body{display:flex;flex-direction:column;flex:1;min-width:0}.row-pinyin{font-weight:600}.row-english{color:var(--muted);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-meta{display:flex;align-items:center;gap:.4rem;flex-shrink:0}.hsk-badge{font-size:.72rem;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:.1rem .35rem}.has-ex{display:inline-flex;color:var(--tone-2);font-size:.9rem}.empty{text-align:center;color:var(--muted);margin-top:2rem}.link-btn.back{font-size:.95rem}.link-btn{background:none;border:none;color:var(--link);cursor:pointer;font-size:.85rem;margin-top:.4rem}.examples{text-align:center;max-width:46ch;margin-inline:auto}.examples h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:var(--sp-5) 0 var(--sp-2)}.example{padding:var(--sp-3) 0;border-top:1px solid var(--border)}.example-hanzi{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--sp-1);font-size:1.6rem;line-height:1.5}.example-pinyin{color:var(--muted);margin:var(--sp-1) 0}.example-english{color:var(--fg);font-size:1.05rem}.loading{text-align:center;color:var(--muted);margin-top:3rem}.site-footer{display:flex;flex-wrap:wrap;gap:var(--sp-4);align-items:center;margin-top:var(--sp-6);padding-top:var(--sp-4);border-top:1px solid var(--border);color:var(--muted);font-size:.85rem}.site-footer a{color:var(--muted)}.reveal-btn.compact{width:auto;margin:0;padding:.55rem 1.1rem;white-space:nowrap}.reveal-btn.grow{flex:1}.goal-card{padding:var(--sp-5) var(--sp-4);margin:var(--sp-4) 0;border:1px solid var(--border);border-radius:16px;background:var(--card-bg);text-align:center}.goal-status{margin:0;font-size:1.3rem;font-weight:700}.goal-sub{color:var(--muted);font-size:.9rem;margin:var(--sp-2) 0 0}.goal-card .reveal-btn{margin-top:var(--sp-4)}.goal-bar{display:flex;gap:var(--sp-1);justify-content:center;margin-top:var(--sp-3)}.goal-seg{width:3rem;height:.4rem;border-radius:999px;background:color-mix(in srgb,var(--fg) 12%,transparent)}.goal-seg.on{background:var(--accent)}.home-stats{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sp-2) var(--sp-4);margin:0 0 var(--sp-4);color:var(--muted);font-size:.85rem}.home-stats strong{color:var(--fg)}.onboard-step h2{font-size:1.4rem;line-height:1.3;margin:var(--sp-5) 0 var(--sp-2)}.onboard-sub{color:var(--muted);font-size:.9rem;margin:0 0 var(--sp-4)}.onboard-points{margin:var(--sp-4) 0;padding-left:1.1rem;line-height:1.6;color:var(--muted)}.onboard-points li+li{margin-top:var(--sp-3)}.onboard-points strong{color:var(--fg)}.choice-list{display:flex;flex-direction:column;gap:var(--sp-2)}.choice{display:flex;flex-direction:column;gap:.15rem;padding:var(--sp-3) var(--sp-4);text-align:left;border:1px solid var(--border);border-radius:12px;background:var(--card-bg);color:var(--fg);cursor:pointer}.choice.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--card-bg))}.choice-title{font-weight:600}.choice-blurb{color:var(--muted);font-size:.85rem}.choice-group{margin-bottom:var(--sp-5)}.choice-group h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 var(--sp-2)}.chip-row{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.goal-summary{padding:var(--sp-3);border-radius:10px;background:color-mix(in srgb,var(--fg) 4%,transparent);text-align:center;font-size:.95rem}.onboard-actions{display:flex;align-items:stretch;gap:var(--sp-2);margin-top:var(--sp-5)}.onboard-actions .chip{padding-inline:1rem}.onboard-dots{display:flex;gap:var(--sp-2);justify-content:center;margin-top:var(--sp-4)}.onboard-dots .dot{width:.5rem;height:.5rem;border-radius:999px;background:color-mix(in srgb,var(--fg) 18%,transparent)}.onboard-dots .dot.on{background:var(--accent)}.level-select{padding:.4rem .5rem;max-width:60%;border:1px solid var(--border);border-radius:8px;background:var(--card-bg);color:var(--fg);font-size:.85rem}.card-footer{margin-top:1.5rem;border-top:1px solid var(--border);padding-top:1rem}.rating{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.rate{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.6rem .3rem;border:1px solid var(--border);border-radius:10px;background:var(--card-bg);color:var(--fg);font-size:.95rem;font-weight:600;cursor:pointer}.rate small{font-weight:400;font-size:.72rem;color:var(--muted)}.rate.again{border-color:color-mix(in srgb,var(--tone-1) 55%,var(--border))}.rate.hard{border-color:color-mix(in srgb,var(--tone-4) 45%,var(--border))}.rate.good{border-color:color-mix(in srgb,var(--tone-2) 55%,var(--border))}.rate.easy{border-color:color-mix(in srgb,var(--tone-3) 55%,var(--border))}.rate:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin:1rem 0 1.5rem}.stat{border:1px solid var(--border);border-radius:12px;padding:.85rem .5rem;text-align:center;background:var(--card-bg)}.stat-value{font-size:1.5rem;font-weight:700}.stat-label{font-size:.78rem;color:var(--muted);margin-top:.15rem}.stat-sub{font-size:.7rem;color:var(--muted);opacity:.8}.settings{border-top:1px solid var(--border);padding-top:1rem;margin-top:1rem}.settings h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 .6rem}.setting-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-3)}.backup-actions{display:flex;flex-wrap:wrap;gap:.5rem}.chip.danger{border-color:var(--tone-1);color:var(--tone-1)}.small{font-size:.85rem}.msg{margin-top:.6rem;color:var(--tone-2);font-size:.9rem}.msg.error{color:var(--link)}.auth-form{display:flex;flex-direction:column;gap:.5rem;margin:.5rem 0}.auth-form .reveal-btn.compact{width:100%}.account .setting-row{flex-wrap:wrap;gap:.5rem}.auth-links{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;align-items:center}.review.done{text-align:center;margin-top:3rem}.done-emoji{font-size:3rem;margin:0}.done-sub{color:var(--muted);margin-bottom:1.5rem}.examples-pending{color:var(--muted);font-style:italic}.card-nav{display:flex;align-items:stretch;gap:.75rem;margin-top:1.25rem}.card-nav>*{flex:1 1 0}.nav-arrow{display:flex;align-items:center;justify-content:center;min-height:3.25rem;border:1px solid var(--border);border-radius:12px;background:var(--card-bg);color:var(--fg);cursor:pointer}.nav-arrow .icon{width:2rem;height:2rem;stroke-width:2.5}.nav-arrow:disabled{color:var(--muted);background:transparent;border-style:dashed;cursor:default}.nav-reveal{min-height:3.25rem;font-size:1.05rem;font-weight:600;border:none;border-radius:12px;background:var(--accent);color:#fff;cursor:pointer}.review-controls{display:flex;align-items:stretch;gap:var(--sp-2)}.review-controls .rating,.review-controls .reveal-btn{flex:1;margin:0}.nav-arrow.sm{width:2.5rem;min-height:0;border-radius:10px}.nav-arrow.sm .icon{width:1.25rem;height:1.25rem}.done-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);justify-content:center;margin-top:var(--sp-3)}@media(min-width:1024px){.app{max-width:920px}.card-back{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:var(--sp-6);align-items:start}.card-back>.examples{grid-column:2;grid-row:1 / span 2}.card-back>.examples h3{margin-top:0}}