:root{--paper: #b0c6b3;--paper-2: #bfd2c1;--paper-3: #d7e2d8;--sheet: #e9efe9;--ink: #16211b;--ink-2: rgba(22, 33, 27, .62);--ink-3: rgba(22, 33, 27, .38);--line: rgba(22, 33, 27, .9);--hairline: rgba(22, 33, 27, .22);--accent: #db3356;--accent-soft: rgba(219, 51, 86, .12);--amber: #b8860b;--ease: cubic-bezier(.22, 1, .36, 1);--serif: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;--sans: "Space Grotesk", -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--sans);color:var(--ink);background-color:var(--paper);background-image:repeating-linear-gradient(0deg,transparent 0 27px,rgba(22,33,27,.055) 27px 28px),repeating-linear-gradient(90deg,transparent 0 27px,rgba(22,33,27,.055) 27px 28px),repeating-linear-gradient(0deg,transparent 0 139px,rgba(22,33,27,.1) 139px 140px),repeating-linear-gradient(90deg,transparent 0 139px,rgba(22,33,27,.1) 139px 140px);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}::selection{background:var(--accent);color:#fff}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#16211b59;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#16211b8c}#app{height:100vh;display:flex;flex-direction:column;overflow:hidden}.masthead{display:flex;align-items:stretch;border-bottom:1.5px solid var(--line);background:var(--paper);flex:0 0 auto}.brand{padding:14px 22px 12px;border-right:1.5px solid var(--line);display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:280px}.brand .kicker{font-size:10px;letter-spacing:.32em;font-weight:700;text-transform:uppercase;color:var(--ink-2)}.brand h1{font-family:var(--serif);font-weight:900;font-size:21px;letter-spacing:.04em}.brand h1 em{font-style:normal;color:var(--accent)}.mast-stats{flex:1;display:flex;align-items:stretch}.mstat{flex:1;padding:10px 18px 8px;border-right:1px solid var(--hairline);display:flex;flex-direction:column;justify-content:center;gap:3px}.mstat:last-child{border-right:none}.mstat .k{font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3);font-weight:700}.mstat .v{font-family:var(--mono);font-size:19px;font-weight:700;line-height:1}.mstat .v small{font-size:11px;color:var(--ink-3);font-weight:400}.mstat.accent .v{color:var(--accent)}.layout{flex:1;display:flex;min-height:0}.sidebar{width:280px;flex:0 0 280px;border-right:1.5px solid var(--line);background:var(--paper-2);overflow-y:auto;display:flex;flex-direction:column}.side-sec{border-bottom:1px solid var(--hairline);padding:14px 0 12px}.side-sec>.kicker{display:block;padding:0 20px 10px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);font-weight:700}.side-sec>.kicker i{font-style:normal;margin-left:6px;letter-spacing:.1em}.sec-toggle{width:100%;text-align:left;background:none;border:none;cursor:pointer;font-family:var(--sans);display:flex;align-items:center}.sec-toggle .chev{margin-left:auto;width:7px;height:7px;flex:0 0 7px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:rotate(45deg);transition:transform .3s var(--ease)}.side-sec.collapsed .sec-toggle .chev{transform:rotate(-45deg)}.side-sec.collapsed .sec-body{display:none}@media (min-width: 981px){.side-sec.collapsed .sec-body{display:block}.sec-toggle{cursor:default}}.lv-item{display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:9px 20px 10px;border-left:3px solid transparent;transition:background .25s var(--ease),border-color .25s var(--ease)}.lv-item:hover{background:#e9efe98c}.lv-item.active{background:var(--sheet);border-left-color:var(--accent)}.lv-top{display:flex;align-items:baseline;gap:8px}.lv-no{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--accent);letter-spacing:.05em}.lv-item.active .lv-no,.lv-item:hover .lv-no{color:var(--accent)}.lv-name{font-family:var(--serif);font-weight:700;font-size:14.5px;letter-spacing:.03em}.lv-count{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}.lv-title{font-size:11px;color:var(--ink-2);margin-top:2px}.lv-bar{margin-top:7px;height:3px;background:#16211b24}.lv-bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .6s var(--ease)}.st-item{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;cursor:pointer;text-align:left;padding:7px 20px;font-size:12.5px;color:var(--ink);transition:background .25s var(--ease)}.st-item:hover{background:#e9efe98c}.st-item.active{background:var(--sheet);font-weight:700}.st-dot{width:8px;height:8px;border:1.5px solid var(--ink);flex:0 0 8px}.st-dot.known{background:var(--accent);border-color:var(--accent)}.st-dot.fuzzy{background:var(--amber);border-color:var(--amber)}.st-item .n{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}.cat-wrap{display:flex;flex-wrap:wrap;gap:6px;padding:0 20px}.cat-chip{border:1px solid var(--ink);background:none;cursor:pointer;font-size:11.5px;padding:4px 11px;color:var(--ink);border-radius:999px;transition:all .25s var(--ease)}.cat-chip:hover{background:var(--sheet)}.cat-chip.active{background:var(--ink);color:var(--sheet)}.side-foot{margin-top:auto;padding:14px 20px 16px;font-size:10px;color:var(--ink-3);line-height:1.7;border-top:1px solid var(--hairline)}.stage{flex:1;min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:34px 40px 26px;gap:22px}.stage:before{content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);width:14px;height:320px;background-image:radial-gradient(circle 5.5px at 7px 7px,var(--ink) 98%,transparent);background-size:14px 64px;background-repeat:repeat-y;opacity:.85}.deck-meta{display:flex;align-items:baseline;gap:14px;font-size:11px;color:var(--ink-2);letter-spacing:.06em}.deck-meta .kicker{font-size:9px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;color:var(--ink-3)}.deck-meta b{font-family:var(--mono);font-size:13px;color:var(--ink)}.card-scene{width:min(760px,100%);flex:1;min-height:300px;max-height:480px;perspective:1600px}.card{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .65s var(--ease);cursor:pointer}.card.flipped{transform:rotateY(180deg)}.card.swap-out{animation:swapOut .18s var(--ease) forwards}.card.swap-in{animation:swapIn .3s var(--ease)}@keyframes swapOut{to{opacity:0;transform:translateY(10px) rotateY(var(--ry, 0deg))}}@keyframes swapIn{0%{opacity:0;transform:translateY(-12px) rotateY(var(--ry, 0deg))}}.face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--sheet);border:1.5px solid var(--line);display:flex;flex-direction:column;padding:26px 34px 22px;overflow:hidden}.face.back{transform:rotateY(180deg)}.face-head{display:flex;align-items:center;gap:12px;border-bottom:1.5px solid var(--line);padding-bottom:12px;flex:0 0 auto}.face-head .q-kicker{font-size:10px;letter-spacing:.34em;text-transform:uppercase;font-weight:700}.face-head .q-cn{font-family:var(--serif);font-size:12px;color:var(--ink-2);letter-spacing:.3em}.face-head .stamp{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:.08em;border:1px solid var(--ink-3);color:var(--ink-2);padding:3px 9px;border-radius:999px;white-space:nowrap}.face-head .stamp.known{border-color:var(--accent);color:var(--accent)}.face-head .stamp.fuzzy{border-color:var(--amber);color:var(--amber)}.face-tags{display:flex;gap:8px;flex-wrap:wrap;padding:12px 0 0;flex:0 0 auto}.tag{font-size:10.5px;letter-spacing:.08em;border:1px solid var(--ink);padding:2.5px 10px;border-radius:999px}.tag.lv{background:var(--ink);color:var(--sheet);border-color:var(--ink)}.tag.src{border-style:dashed;color:var(--ink-2);border-color:var(--ink-3)}.q-body{flex:1;display:flex;align-items:center;justify-content:center;padding:18px 6px;overflow-y:auto}.q-text{font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.6vw,27px);line-height:1.75;letter-spacing:.02em;text-align:center}.a-body{flex:1;overflow-y:auto;padding:16px 4px 10px}.a-text{font-size:15.5px;line-height:2.05;letter-spacing:.015em;color:var(--ink)}.a-text:first-letter{color:var(--accent)}.face-foot{flex:0 0 auto;border-top:1px solid var(--hairline);padding-top:10px;display:flex;align-items:center;gap:14px;font-size:10.5px;color:var(--ink-3);letter-spacing:.06em}.face-foot .hint-keys{font-family:var(--mono)}.face-foot .art-title{font-family:var(--serif);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.link-btn{background:none;border:none;cursor:pointer;font-size:11px;color:var(--accent);border-bottom:1px solid var(--accent);padding:0 0 1px;letter-spacing:.05em;transition:opacity .2s var(--ease);white-space:nowrap}.link-btn:hover{opacity:.65}.controls{display:flex;align-items:center;gap:14px;flex:0 0 auto}.ctl-btn{border:1.5px solid var(--ink);background:var(--sheet);color:var(--ink);font-family:var(--sans);font-size:12.5px;letter-spacing:.1em;height:44px;padding:0 20px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:transform .2s var(--ease),background .2s var(--ease),color .2s var(--ease)}.ctl-btn:hover{background:var(--ink);color:var(--sheet)}.ctl-btn:active{transform:translateY(1px)}.ctl-btn .key{font-family:var(--mono);font-size:9px;opacity:.55;border:1px solid currentColor;border-radius:3px;padding:1px 4px}.ctl-btn.mark-known{border-color:var(--accent);color:var(--accent)}.ctl-btn.mark-known:hover{background:var(--accent);color:#fff}.ctl-btn.mark-fuzzy{border-color:var(--amber);color:var(--amber)}.ctl-btn.mark-fuzzy:hover{background:var(--amber);color:#fff}.flip-btn{width:64px;height:64px;border-radius:50%;border:1.5px solid var(--ink);background:var(--accent);color:#fff;cursor:pointer;position:relative;transition:transform .5s var(--ease),background .25s var(--ease);transform:rotate(0)}.flip-btn:hover{background:#c22347}.flip-btn.flipped{transform:rotate(135deg)}.flip-btn svg{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:22px;height:22px}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#16211b73;display:flex;align-items:center;justify-content:center;padding:4vh 4vw;animation:maskIn .3s var(--ease)}@keyframes maskIn{0%{opacity:0}}.modal{background:var(--sheet);border:1.5px solid var(--line);width:min(820px,100%);max-height:100%;display:flex;flex-direction:column;animation:modalIn .45s var(--ease)}@keyframes modalIn{0%{opacity:0;transform:translateY(26px)}}.modal-head{display:flex;align-items:baseline;gap:12px;padding:18px 28px 14px;border-bottom:1.5px solid var(--line)}.modal-head .kicker{font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);font-weight:700}.modal-head h3{font-family:var(--serif);font-size:19px;font-weight:900;flex:1;line-height:1.5}.modal-close{border:1.5px solid var(--ink);background:none;cursor:pointer;width:34px;height:34px;font-size:15px;flex:0 0 34px;transition:all .2s var(--ease)}.modal-close:hover{background:var(--ink);color:var(--sheet)}.modal-body{overflow-y:auto;padding:22px 34px 34px}.md h1{font-family:var(--serif);font-size:23px;font-weight:900;margin:6px 0 14px;line-height:1.5}.md h2{font-family:var(--serif);font-size:18.5px;font-weight:700;margin:26px 0 10px;padding-left:12px;border-left:3px solid var(--accent);line-height:1.5}.md h3,.md h4{font-family:var(--serif);font-size:16px;font-weight:700;margin:20px 0 8px}.md p{font-size:14.5px;line-height:2.05;margin:10px 0;letter-spacing:.015em}.md strong{color:var(--accent);font-weight:700}.md blockquote{border-left:3px solid var(--ink);margin:14px 0;padding:4px 0 4px 16px;color:var(--ink-2)}.md blockquote p{margin:4px 0}.md ul,.md ol{margin:10px 0 10px 22px}.md li{font-size:14.5px;line-height:2}.md hr{border:none;border-top:1px dashed var(--hairline);margin:20px 0}.md em{font-style:normal;background:var(--accent-soft);padding:0 3px}.empty{text-align:center;color:var(--ink-2);font-family:var(--serif);font-size:17px;line-height:2}.empty b{color:var(--accent)}.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%);background:var(--ink);color:var(--sheet);font-size:12px;letter-spacing:.1em;padding:9px 20px;z-index:80;animation:toastIn .3s var(--ease);pointer-events:none}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,8px)}}@media (max-width: 980px){.masthead{flex-direction:column}.brand{border-right:none;border-bottom:1.5px solid var(--line);min-width:0;padding:10px 16px 9px}.brand h1{font-size:18px}.mast-stats{flex-wrap:wrap}.mstat{flex:1 1 50%;padding:6px 16px 5px;border-bottom:1px solid var(--hairline)}.mstat .v{font-size:15px}.layout{flex-direction:column;overflow-y:auto}.stage{order:-1;padding:18px 16px 14px;min-height:0;gap:12px;border-bottom:1.5px solid var(--line)}.sidebar{width:100%;flex:0 0 auto;border-right:none;border-bottom:none;overflow-y:visible}.side-sec{padding:6px 0 8px}.side-sec>.kicker{padding:6px 16px;font-size:10px}.lv-item,.st-item{padding-left:16px;padding-right:16px}.cat-wrap{padding:2px 16px 8px}.side-foot{display:none}.stage:before{display:none}.card-scene{max-height:46vh;min-height:260px}.controls{flex-wrap:wrap;justify-content:center;gap:10px}.ctl-btn{height:40px;padding:0 14px;font-size:12px}.flip-btn{width:56px;height:56px}.face{padding:16px 18px 12px}.face-tags{padding-top:8px}.q-body{padding:10px 2px}.a-text{font-size:14px;line-height:1.9}.face-foot{font-size:10px;gap:10px}.modal-mask{padding:2vh 3vw}.modal-body{padding:16px 20px 24px}}