:root,body[data-theme=pink]{--bg:#fce4ea;--bg-deep:#f9d3dc;--surface:#fdf6f7;--surface-2:#fbeef1;--elev:#fff;--ink:#2a2025;--ink-soft:#6b5a62;--ink-mute:#a89098;--pink:#e58aa0;--pink-deep:#d56a85;--pink-soft:#f6c8d2;--pink-pale:#fde2e8;--green:#6fc9a3;--green-soft:#d4ecdf;--yellow:#efc758;--yellow-soft:#faecc5;--red:#e07a8c;--red-soft:#f6cdd3;--purple:#b794e8;--purple-soft:#e5d8f5;--radius:18px;--radius-lg:24px;--shadow-soft:0 1px 2px #b464780a, 0 8px 24px #b464780f;--shadow-card:0 1px 2px #b464780f, 0 12px 32px #b4647814;--font-display:var(--font-be-vietnam), "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-hanzi:var(--font-noto-sc), "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif}body[data-theme=mint]{--bg:#e4f1ea;--bg-deep:#cae5d5;--surface:#f3faf6;--surface-2:#e6f2eb;--elev:#fff;--ink:#15241c;--ink-soft:#4a5e54;--ink-mute:#8aa097;--pink:#56b58b;--pink-deep:#2a7754;--pink-soft:#b5dec9;--pink-pale:#d8efe2;--green:#56b58b;--green-soft:#c5e6d6;--yellow:#d9a847;--yellow-soft:#f0dfb0;--red:#d9737a;--red-soft:#f0c8cc;--purple:#6f99c4;--purple-soft:#cad9e8;--shadow-soft:0 1px 2px #1e5a3c0d, 0 8px 24px #1e5a3c12;--shadow-card:0 1px 2px #1e5a3c12, 0 12px 32px #1e5a3c17}body[data-theme=dark]{--bg:#15131a;--bg-deep:#0f0e14;--surface:#1f1c26;--surface-2:#292430;--elev:#2d2834;--ink:#f0e8ed;--ink-soft:#c5b3bc;--ink-mute:#8a7882;--pink:#ee9eb4;--pink-deep:#f5bccc;--pink-soft:#3a2731;--pink-pale:#2a1f26;--green:#82d5b3;--green-soft:#2a4438;--yellow:#f0d075;--yellow-soft:#4a3e1f;--red:#ea8a9a;--red-soft:#4a2a32;--purple:#c3a8eb;--purple-soft:#3a2e4a;--shadow-soft:0 1px 2px #00000040, 0 8px 24px #00000059;--shadow-card:0 1px 2px #0000004d, 0 12px 32px #00000073}body[data-theme=dark] .hsk-card-progress,body[data-theme=dark] .today-bar,body[data-theme=dark] .hist-stack{background:#ffffff0f}body[data-theme=dark] .word-search{background:var(--bg)}body[data-theme=dark] .kbd{background:var(--surface-2);color:var(--ink);border-color:#ffffff14}body[data-theme=dark] .flash-face{border:1px solid #ffffff0a}body[data-theme=dark] .sidebar{background:linear-gradient(180deg, var(--bg-deep) 0%, var(--bg) 100%);border-right:1px solid #ffffff0a}body[data-theme=dark] .nav-item:hover,body[data-theme=dark] .sidebar-footer{background:#ffffff0a}body{transition:background-color .25s,color .25s}.card,.bucket,.hsk-card,.modal,.flash-face,.word-panel,.sidebar,.streak-tile,.today-summary,.range-tab,.flash-btn,.flash-counter,.flash-status{transition:background-color .25s,color .25s,border-color .25s}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--font-display);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-size:14px;overflow:hidden}#root,body>div{height:100vh}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}button:focus-visible{outline:2px solid var(--pink-deep);outline-offset:2px;border-radius:8px}.app{background:var(--bg);grid-template-columns:240px 1fr;height:100vh;display:grid}.sidebar{background:linear-gradient(180deg, var(--bg-deep) 0%, var(--bg) 100%);border-right:1px solid #00000008;flex-direction:column;gap:6px;padding:28px 18px;display:flex}.brand{align-items:center;gap:12px;padding:8px 12px 28px;display:flex}.brand-mark{background:var(--pink);color:#fff;width:38px;height:38px;font-family:var(--font-hanzi);border-radius:12px;place-items:center;font-size:20px;font-weight:700;display:grid;box-shadow:0 4px 12px #d56a8559}.brand-name{letter-spacing:-.01em;font-size:17px;font-weight:700}.brand-sub{color:var(--ink-mute);margin-top:2px;font-size:11px}.nav-item{color:var(--ink-soft);text-align:left;border-radius:14px;align-items:center;gap:12px;width:100%;padding:12px 14px;font-size:14px;font-weight:500;transition:background .15s,color .15s;display:flex}.nav-item:hover{color:var(--ink);background:#7f7f7f14}.nav-item.active{background:var(--elev);color:var(--ink);box-shadow:var(--shadow-soft);font-weight:600}.nav-item .ic{width:20px;height:20px;color:var(--pink-deep);place-items:center;display:grid}.sidebar-footer{color:var(--ink-soft);background:#ffffff80;border-radius:14px;margin-top:auto;padding:14px;font-size:11.5px;line-height:1.6}.kbd{background:var(--elev);color:var(--ink);text-align:center;border:1px solid #0000000f;border-bottom-width:2px;border-radius:5px;min-width:18px;padding:1px 5px;font-family:ui-monospace,monospace;font-size:10.5px;display:inline-block}.main{padding:28px 36px 40px;overflow-y:auto}.main-inner{max-width:1240px;margin:0 auto}.page-head{justify-content:space-between;align-items:flex-end;margin-bottom:20px;display:flex}.page-title{letter-spacing:-.02em;margin:0 0 4px;font-size:24px;font-weight:700}.page-sub{color:var(--ink-soft);margin:0;font-size:13px}.dash-grid{grid-template-columns:1.4fr 1fr;gap:16px;display:grid}.card{background:var(--surface);box-shadow:var(--shadow-card);border-radius:20px;padding:20px}.card-title{letter-spacing:-.01em;margin:0 0 14px;font-size:14px;font-weight:600}.totals-card{grid-template-columns:1fr 1.1fr;align-items:center;gap:18px;padding:18px;display:grid}.donut-wrap{aspect-ratio:1;width:100%;max-width:200px;margin:0 auto;position:relative}.donut-center{text-align:center;place-items:center;display:grid;position:absolute;inset:0}.donut-num{letter-spacing:-.02em;font-size:38px;font-weight:700;line-height:1}.donut-label{color:var(--ink-soft);margin-top:4px;font-size:13px}.bucket-list{flex-direction:column;gap:8px;display:flex}.bucket{background:var(--elev);cursor:pointer;border:1.5px solid #0000;border-radius:12px;align-items:center;gap:12px;padding:10px 14px;transition:transform .12s,box-shadow .12s;display:flex}.bucket:hover{box-shadow:var(--shadow-soft);transform:translate(2px)}.bucket-dot{color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;font-size:14px;font-weight:700;display:grid}.bucket-dot.green{background:var(--green)}.bucket-dot.yellow{background:var(--yellow);color:#5e4a18}.bucket-dot.red{background:var(--red)}.bucket-dot.purple{background:var(--purple)}.bucket-label{flex:1;font-size:14px;font-weight:500}.today-summary{background:var(--elev);border:1.5px dashed var(--pink-soft);border-radius:14px;align-items:center;gap:14px;padding:12px 16px;display:flex}.today-bar{background:var(--pink-pale);border-radius:8px;width:12px;height:76px;position:relative;overflow:hidden}.today-bar-fill{background:var(--pink);border-radius:8px;transition:height .4s;position:absolute;bottom:0;left:0;right:0}.today-stats{flex:1}.today-total{margin-bottom:6px;font-size:15px;font-weight:600}.today-row{color:var(--ink-soft);align-items:center;gap:8px;margin:1px 0;font-size:12.5px;display:flex}.today-row .swatch{border-radius:50%;width:9px;height:9px}.range-tabs{gap:8px;margin:18px 0 14px;display:flex}.range-tab{background:var(--elev);color:var(--ink-soft);border:1px solid var(--pink-pale);border-radius:999px;padding:8px 18px;font-size:13px;font-weight:500}.range-tab.active{background:var(--pink);color:#fff;border-color:var(--pink)}.history-chart{grid-template-columns:repeat(var(--cols,7), 1fr);align-items:end;gap:8px;height:140px;padding:0 8px;display:grid}.hist-col{flex-direction:column;justify-content:end;align-items:center;gap:6px;height:100%;display:flex}.hist-stack{background:var(--pink-pale);border-radius:6px;flex-direction:column-reverse;width:12px;height:100%;display:flex;overflow:hidden}.hist-seg{width:100%;transition:height .4s}.hist-seg.green{background:var(--green)}.hist-seg.yellow{background:var(--yellow)}.hist-seg.red{background:var(--red)}.hist-label{color:var(--ink-soft);font-size:12px}.legend{color:var(--ink-soft);gap:16px;margin-top:12px;font-size:12.5px;display:flex}.legend-item{align-items:center;gap:6px;display:flex}.legend-item .swatch{border-radius:50%;width:10px;height:10px}.streak-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.streak-tile{background:var(--elev);border-radius:12px;padding:12px 14px}.streak-num{letter-spacing:-.02em;font-size:22px;font-weight:700;line-height:1}.streak-tag{color:var(--ink-soft);margin-top:4px;font-size:11px}.hsk-banner{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);align-items:center;gap:14px;margin-bottom:22px;padding:18px 22px;display:flex}.hsk-banner-ic{background:var(--pink-pale);width:42px;height:42px;color:var(--pink-deep);border-radius:12px;place-items:center;display:grid}.hsk-banner-text{color:var(--ink-soft);font-size:14px}.hsk-banner-text strong{color:var(--ink);font-weight:600}.hsk-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.hsk-card{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);cursor:pointer;text-align:left;padding:24px 24px 22px;transition:transform .15s,box-shadow .15s;position:relative;overflow:hidden}.hsk-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #b464780f,0 20px 40px #b464781f}.hsk-card-label{letter-spacing:.1em;color:var(--pink-deep);text-transform:uppercase;margin-bottom:6px;font-size:11px;font-weight:600}.hsk-card-title{letter-spacing:-.02em;margin-bottom:14px;font-size:28px;font-weight:700}.hsk-card-row{justify-content:space-between;align-items:center;display:flex}.hsk-card-meta{color:var(--ink-soft);font-size:13px}.hsk-card-meta strong{color:var(--ink);font-weight:600}.hsk-card-progress{background:var(--pink-pale);border-radius:999px;height:6px;margin-top:14px;overflow:hidden}.hsk-card-progress-fill{background:linear-gradient(90deg, var(--purple) 0%, var(--green) 100%);border-radius:999px;height:100%}.hsk-card-cta{background:var(--pink-pale);width:32px;height:32px;color:var(--pink-deep);border-radius:10px;place-items:center;display:grid}.hsk-card:hover .hsk-card-cta{background:var(--pink);color:#fff}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:50;background:#28141e66;place-items:center;animation:.15s fadeIn;display:grid;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border-radius:24px;width:min(520px,92vw);padding:28px;animation:.2s pop;box-shadow:0 30px 80px #3c142840}@keyframes pop{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.modal-title{text-align:center;letter-spacing:-.01em;margin:0 0 18px;font-size:18px;font-weight:700}.mode-list{flex-direction:column;gap:8px;display:flex}.mode-item{cursor:pointer;text-align:left;border-radius:14px;align-items:center;gap:16px;width:100%;padding:14px 16px;transition:background .12s;display:flex}.mode-item:hover{background:var(--elev)}.mode-ic{color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;display:grid}.mode-ic.all{background:var(--pink)}.mode-ic.green{background:var(--green)}.mode-ic.purple{background:var(--purple)}.mode-ic.yellow{background:var(--yellow);color:#5e4a18}.mode-ic.red{background:var(--red)}.mode-title{font-size:15px;font-weight:600}.mode-sub{color:var(--ink-soft);margin-top:2px;font-size:12.5px}.mode-count{color:var(--ink-soft);background:var(--elev);border-radius:8px;margin-left:auto;padding:4px 10px;font-size:13px;font-weight:600}.modal-close{color:var(--ink-soft);margin:16px auto 0;padding:8px 18px;font-size:13px;display:block}.flash-screen{grid-template-columns:1fr 340px;height:100vh;display:grid}.flash-main{background:var(--bg);flex-direction:column;padding:28px 40px;display:flex;overflow:hidden}.flash-topbar{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.back-btn{color:var(--ink-soft);border-radius:10px;align-items:center;gap:8px;padding:8px 12px;font-size:13.5px;font-weight:500;display:inline-flex}.back-btn:hover{color:var(--ink);background:#ffffff80}.flash-status{border-radius:999px;align-items:center;gap:12px;padding:8px 16px;font-size:13.5px;font-weight:500;display:inline-flex}.flash-status.green{background:var(--green-soft);color:#2f6b50}.flash-status.yellow{background:var(--yellow-soft);color:#7a5b14}.flash-status.red{background:var(--red-soft);color:#963a4d}.flash-status.purple{background:var(--purple-soft);color:#5a3d8a}.flash-status .swatch{opacity:.8;background:currentColor;border-radius:50%;width:10px;height:10px}.flash-counter{color:var(--ink-soft);background:var(--elev);box-shadow:var(--shadow-soft);border-radius:10px;padding:8px 14px;font-size:14px;font-weight:600}.card-stage{perspective:1500px;flex:1;place-items:center;min-height:0;padding:8px 0;display:grid;position:relative}.flash-card{width:min(640px,90%);height:100%;min-height:260px;max-height:440px;transform-style:preserve-3d;cursor:pointer;transition:transform .55s cubic-bezier(.4,.2,.2,1);position:relative}.flash-card.flipped{transform:rotateY(180deg)}.flash-face{background:var(--surface);backface-visibility:hidden;text-align:center;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;padding:40px 48px;display:flex;position:absolute;inset:0;box-shadow:0 1px 2px #b464780f,0 24px 60px #b4647824}.flash-face.back{justify-content:flex-start;padding-top:56px;transform:rotateY(180deg)}.hanzi-big{font-family:var(--font-hanzi);color:var(--ink);letter-spacing:.04em;font-size:clamp(96px,14vw,160px);font-weight:700;line-height:1}.flash-hint{text-align:center;color:var(--ink-mute);justify-content:center;align-items:center;gap:8px;font-size:12px;display:flex;position:absolute;bottom:22px;left:0;right:0}.flash-back-hanzi{font-family:var(--font-hanzi);letter-spacing:.04em;margin-bottom:4px;font-size:64px;font-weight:700}.flash-pinyin{color:var(--pink-deep);margin-bottom:18px;font-size:22px;font-weight:500}.flash-meaning{letter-spacing:-.01em;margin-bottom:28px;font-size:26px;font-weight:600}.flash-example{background:var(--pink-pale);text-align:left;border-radius:16px;width:100%;margin-top:auto;margin-bottom:12px;padding:16px 20px}.flash-example-hanzi{font-family:var(--font-hanzi);margin-bottom:6px;font-size:20px;font-weight:500}.flash-example-pinyin{color:var(--pink-deep);margin-bottom:6px;font-size:14px}.flash-example-trans{color:var(--ink-soft);font-size:13.5px;font-style:italic}.flash-actions{justify-content:center;align-items:center;gap:14px;margin-top:22px;display:flex}.flash-btn{background:var(--elev);max-width:200px;height:64px;color:var(--ink);box-shadow:var(--shadow-soft);border-radius:18px;flex:1;justify-content:center;align-items:center;gap:10px;font-size:14.5px;font-weight:600;transition:transform .1s,box-shadow .12s,background .12s;display:flex;position:relative}.flash-btn:hover{transform:translateY(-1px)}.flash-btn:active{transform:translateY(0)}.flash-btn-ic{color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:32px;height:32px;display:grid}.flash-btn.green .flash-btn-ic{background:var(--green)}.flash-btn.yellow .flash-btn-ic{background:var(--yellow);color:#5e4a18}.flash-btn.red .flash-btn-ic{background:var(--red)}.flash-btn.green:hover{background:var(--green-soft)}.flash-btn.yellow:hover{background:var(--yellow-soft)}.flash-btn.red:hover{background:var(--red-soft)}.flash-btn-key{color:var(--ink-mute);background:#0000000a;border-radius:4px;padding:1px 5px;font-family:ui-monospace,monospace;font-size:10px;position:absolute;top:8px;right:10px}.word-panel{background:var(--surface);border-left:1px solid #0000000a;flex-direction:column;display:flex;overflow:hidden}.word-panel-head{border-bottom:1px solid #0000000a;padding:24px 22px 16px}.word-panel-title{margin:0 0 6px;font-size:14px;font-weight:600}.word-panel-sub{color:var(--ink-soft);margin:0;font-size:12px}.word-search{background:var(--surface-2);border-radius:10px;align-items:center;gap:8px;margin-top:14px;padding:8px 12px;display:flex}.word-search input{font:inherit;color:var(--ink);background:0 0;border:none;outline:none;flex:1;font-size:13px}.word-search input::placeholder{color:var(--ink-mute)}.word-list{flex-direction:column;flex:1;gap:4px;padding:8px 14px 20px;display:flex;overflow-y:auto}.word-row{cursor:pointer;border-radius:12px;align-items:center;gap:12px;padding:10px 12px;transition:background .12s;display:flex}.word-row:hover{background:var(--surface-2)}.word-row.active{background:var(--pink-pale)}.word-idx{background:var(--pink-pale);width:30px;height:30px;color:var(--pink-deep);border-radius:50%;flex-shrink:0;place-items:center;font-size:12px;font-weight:600;display:grid}.word-row.active .word-idx{background:var(--pink);color:#fff}.word-row .status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-left:auto}.status-dot.green{background:var(--green)}.status-dot.yellow{background:var(--yellow)}.status-dot.red{background:var(--red)}.status-dot.purple{background:var(--purple)}.word-info{flex:1;min-width:0}.word-info-hanzi{font-family:var(--font-hanzi);font-size:16px;font-weight:600;line-height:1.2}.word-info-meta{color:var(--ink-soft);white-space:nowrap;text-overflow:ellipsis;margin-top:1px;font-size:12px;overflow:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#b4647833;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#b4647859}::-webkit-scrollbar-track{background:0 0}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}