:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0e080c;--surface:#181019;--surface-2:#231724;--surface-3:#2f2030;--border:#3a2736;--ink:#f7eef3;--muted:#a894a1;--accent:#ff4d8d;--accent-hover:#ff6ba0;--accent-ink:#17030d;--green:#3ecf87;--red:#ff7a6e;--chart:#d9a45b;--stage:#3b0c28;--board-light:#f0e1c4;--board-dark:#6d4a2f;--board-frame:#2b1a14;--font-display:"Work Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-text:"Work Sans", system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--text-xs:.72rem;--text-sm:.8125rem;--text-md:.9375rem;--text-lg:1.125rem;--text-xl:1.5rem;--text-2xl:2rem;--space-1:4px;--space-2:8px;--space-3:16px;--space-4:24px;--space-5:40px;--space-6:64px;--radius:6px;--radius-lg:14px;--cell:min(64px, calc((100vw - 6.5rem) / 8));--ease-out:cubic-bezier(.22, 1, .36, 1);--t-press:.14s;--t-hover:.18s;--t-ui:.24s;font-family:Work Sans,system-ui,-apple-system,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{background:var(--bg);color:var(--ink);line-height:1.5;font-size:var(--text-md);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}h1,h2,h3{font-family:var(--font-display);text-wrap:balance;-webkit-hyphens:none;hyphens:none;line-height:1.2}p{margin:0}button{font:inherit;color:inherit}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes feedback-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes modal-in{0%{opacity:0;transform:translateY(10px)scale(.98)}to{opacity:1;transform:none}}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:no-preference){.header-brand{animation:rise-in .52s var(--ease-out) backwards}.header>.btn{animation:rise-in .52s 80ms var(--ease-out) backwards}.sidebar{animation:rise-in .52s .12s var(--ease-out) backwards}.main{animation:rise-in .52s .18s var(--ease-out) backwards}.stats-panel{animation:rise-in .52s .24s var(--ease-out) backwards}.feedback{animation:feedback-in .26s var(--ease-out)}.modal-backdrop{animation:backdrop-in .16s var(--ease-out)}.modal{animation:modal-in .22s var(--ease-out)}.toast{animation:toast-in .3s var(--ease-out)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app{max-width:1180px;margin:0 auto;padding:clamp(16px,2.5vw,32px) clamp(12px,2.5vw,32px) 64px}.header{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.header-brand{align-items:center;gap:12px;min-width:0;display:flex}.logo{background:var(--chart);color:#2a1608;border-radius:var(--radius);-webkit-user-select:none;user-select:none;flex:none;place-items:center;width:42px;height:42px;font-size:24px;line-height:1;display:grid}.header-main{min-width:0}.header h1{font-size:var(--text-xl);letter-spacing:-.02em;margin:0;font-weight:700;line-height:1.15}.subtitle{color:var(--muted);font-size:var(--text-sm);margin:2px 0 0;line-height:1.45}.btn{background:var(--surface-2);color:var(--ink);border-radius:var(--radius);font-size:var(--text-sm);cursor:pointer;white-space:nowrap;transition:background var(--t-hover) var(--ease-out), color var(--t-hover) var(--ease-out), transform var(--t-press) var(--ease-out);border:0;justify-content:center;align-items:center;padding:9px 16px;font-weight:500;line-height:1.2;text-decoration:none;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-3)}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--accent-ink);font-weight:600}.btn-primary:hover:not(:disabled){background:var(--accent-hover);color:var(--accent-ink)}.btn-ghost{color:var(--muted);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--surface);color:var(--ink)}.btn-danger{color:var(--red);background:#ff7a6e1f}.btn-danger:hover:not(:disabled){color:#ffb0a6;background:#ff7a6e3d}.btn-small{font-size:var(--text-xs);padding:5px 10px}.icon-btn{color:var(--muted);cursor:pointer;border-radius:var(--radius);transition:background var(--t-hover) var(--ease-out), color var(--t-hover) var(--ease-out);background:0 0;border:0;padding:4px 8px;font-size:1.3rem;line-height:1}.icon-btn:hover{color:var(--ink);background:var(--surface)}.link-btn{color:#ff9fc8;cursor:pointer;font:inherit;text-align:left;text-underline-offset:.18em;transition:text-decoration-color var(--t-hover) var(--ease-out);background:0 0;border:0;padding:0;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;text-decoration-thickness:.07em}.link-btn:disabled{color:var(--muted);cursor:default}.link-btn:hover:not(:disabled){text-decoration-color:currentColor}.banner{justify-content:space-between;align-items:flex-start;gap:var(--space-2);border-radius:var(--radius);margin-bottom:var(--space-3);font-size:var(--text-sm);padding:12px 14px;display:flex}.banner-warn{color:#f2d797;background:#3a2c14}.banner-text{flex-direction:column;flex:1;gap:3px;display:flex}.layout{gap:var(--space-4);grid-template-columns:260px minmax(0,1fr);align-items:start;display:grid}.sidebar{min-width:0}.main{flex:auto;min-width:0}.sidebar h2{font-size:var(--text-sm);color:var(--muted);margin:var(--space-4) 0 var(--space-2);letter-spacing:0;font-weight:600}.filters{background:var(--surface);border-radius:var(--radius-lg);padding:var(--space-3);font-size:var(--text-sm);color:var(--muted);flex-direction:column;gap:6px;display:flex}.filters label{justify-content:space-between;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--muted);flex-wrap:wrap;display:flex}.filters label.check{justify-content:flex-start;gap:var(--space-2)}.filters select{background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius);max-width:100%;font-size:var(--text-sm);padding:5px 8px}.filters select:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:#0000}.filters input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px;margin:0}.pill{background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:0 8px;font-size:.7rem;font-weight:600;line-height:1.6}.puzzle-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.puzzle-item{text-align:left;width:100%;color:inherit;border-radius:var(--radius);cursor:pointer;transition:background var(--t-hover) var(--ease-out), transform var(--t-press) var(--ease-out);background:0 0;border:0;border-left:3px solid #0000;flex-direction:column;gap:3px;padding:10px 12px 10px 10px;display:flex}.puzzle-item:hover{background:var(--surface)}.puzzle-item:active{transform:scale(.99)}.puzzle-item.active{background:var(--surface-2);border-left-color:var(--accent)}.puzzle-title{font-weight:600;font-size:var(--text-sm);align-items:center;gap:6px;display:flex}.puzzle-meta{font-size:var(--text-xs);color:var(--muted)}.badge{display:inline-block}.badge-done{background:var(--green);border-radius:50%;flex:none;width:8px;height:8px}.empty{color:var(--muted);font-size:var(--text-sm);margin:4px 0}.empty-block{background:var(--surface);border-radius:var(--radius-lg);padding:var(--space-4);gap:var(--space-2);flex-direction:column;align-items:flex-start;display:flex}.empty-hint{color:var(--muted);font-size:var(--text-xs);margin:0}.puzzle-info{margin-bottom:var(--space-3)}.puzzle-info h2{font-size:var(--text-xl);letter-spacing:-.015em;margin:0 0 4px;font-weight:700}.puzzle-sub{margin:0 0 var(--space-2);font-size:var(--text-sm);color:var(--muted)}.puzzle-info .fen code{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--muted);word-break:break-all}.nav-actions{gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.board-wrap{background:var(--stage);border-radius:var(--radius-lg);justify-content:center;padding:clamp(14px,3vw,28px);display:flex;overflow:hidden}.board[data-ui]{grid-template-columns:repeat(8, var(--cell));grid-template-rows:repeat(8, var(--cell));border:4px solid var(--board-frame);-webkit-user-select:none;user-select:none;touch-action:manipulation;border-radius:4px;display:grid;overflow:hidden}.square{cursor:pointer;font-size:calc(var(--cell) * .74);transition:filter var(--t-hover) var(--ease-out);border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:flex;position:relative}.square.light{background:var(--board-light)}.square.dark{background:var(--board-dark)}.square:hover{filter:brightness(1.08)}.square.selected{outline:3px solid var(--green);outline-offset:-3px}.square.highlight{outline:3px solid var(--accent);outline-offset:-3px}.board[data-ui] .glyph{color:#f9f4ee;text-shadow:0 1px 2px #0000008c,0 0 1px #0006;pointer-events:none;transition:transform var(--t-press) var(--ease-out)}.board[data-ui] .glyph.black{color:#14100e;text-shadow:0 1px 2px #ffffff47,0 0 1px #ffffff40}.square.selected .glyph{transform:scale(1.14)}.coord{opacity:.75;pointer-events:none;font-size:10px;font-weight:600;position:absolute}.square.light .coord{color:#5a3d28}.square.dark .coord{color:#f0e1c4}.coord.rank{top:2px;left:3px}.coord.file{bottom:2px;right:3px}.feedback{margin-top:var(--space-3);border-radius:var(--radius);min-height:1.6em;font-weight:600;font-size:var(--text-sm);background:var(--surface);color:var(--muted);padding:12px 14px}.feedback.wrong{color:var(--red);background:#381512}.feedback.correct{color:var(--green);background:#12301f}.feedback.finished{color:var(--accent);background:#33122a}.moves{margin-top:var(--space-2);gap:var(--space-2);font-size:var(--text-sm);color:var(--muted);flex-wrap:wrap;align-items:center;display:flex}.moves code{background:var(--surface-2);color:var(--ink);font-family:var(--font-mono);font-size:var(--text-xs);border-radius:6px;padding:4px 8px}.moves .empty{margin:0}.actions{margin-top:var(--space-3);gap:var(--space-2);flex-wrap:wrap;display:flex}.error{color:var(--red)}.section-head{justify-content:space-between;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.stats-panel{margin-top:var(--space-5)}.stats-panel h2,.data-panel h2{font-size:var(--text-lg);margin:0 0 var(--space-3);letter-spacing:-.01em;font-weight:700}.stats-panel h3{font-size:var(--text-sm);margin:var(--space-4) 0 var(--space-2);color:var(--muted);font-weight:600}.stats-row{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(140px,1fr));display:grid}.stat{background:var(--surface);border-radius:var(--radius);transition:background var(--t-hover) var(--ease-out), transform var(--t-press) var(--ease-out);flex-direction:column;gap:4px;padding:14px 16px;display:flex}.stat:hover{background:var(--surface-2)}.stat:active{transform:scale(.98)}.stat-label{font-size:var(--text-xs);color:var(--muted)}.stat-value{font-size:var(--text-xl);color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em;align-items:baseline;gap:6px;font-weight:700;display:flex}.stat.hero .stat-value{color:var(--accent);font-size:var(--text-2xl)}.stat-sub{font-size:var(--text-xs);color:var(--muted);font-weight:400}.theme-bars{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.theme-bars li{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.bar-label{font-size:var(--text-sm);color:var(--muted);flex:0 0 170px}.bar-track{background:var(--surface-2);border-radius:999px;flex:120px;min-width:80px;height:10px;overflow:hidden}.bar-fill{background:var(--accent);height:100%;transition:width .4s var(--ease-out);border-radius:999px;display:block}.bar-note{font-size:var(--text-xs);color:var(--muted);flex:none}.table-scroll{overflow-x:auto}.history-table{border-collapse:collapse;width:100%;font-size:var(--text-sm)}.history-table th,.history-table td{text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 12px}.history-table th{color:var(--muted);font-weight:600;font-size:var(--text-xs)}.history-table td{color:var(--ink)}.result-done,.result-fail{align-items:center;gap:6px;display:inline-flex}.result-done:before,.result-fail:before{content:"";border-radius:50%;width:7px;height:7px}.result-done:before{background:var(--green)}.result-fail:before{background:var(--muted)}.data-panel{margin-top:var(--space-5)}.data-actions{gap:var(--space-2);margin-top:var(--space-2);flex-wrap:wrap;display:flex}.data-note{margin-top:var(--space-2);gap:var(--space-2);font-size:var(--text-sm);color:var(--muted);background:var(--surface);border-radius:var(--radius);flex-wrap:wrap;align-items:center;padding:10px 12px;display:flex}.modal-backdrop{z-index:50;background:#050204b8;justify-content:center;align-items:flex-start;padding:24px 12px;display:flex;position:fixed;inset:0;overflow-y:auto}.modal{background:var(--surface);border-radius:var(--radius-lg);width:100%;max-width:560px}.modal-wide{max-width:720px}.modal-head{justify-content:space-between;align-items:center;padding:18px 20px 0;display:flex}.modal-head h2{font-size:var(--text-lg);margin:0;font-weight:700}.modal-body{padding:16px 20px 20px}.manager-actions{align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.manager-count{font-size:var(--text-xs);color:var(--muted);margin-left:auto}.manager-list{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.manager-item{justify-content:space-between;align-items:center;gap:var(--space-2);background:var(--surface-2);border-radius:var(--radius);transition:background var(--t-hover) var(--ease-out);flex-wrap:wrap;padding:10px 12px;display:flex}.manager-item:hover{background:var(--surface-3)}.manager-info{flex-direction:column;flex:200px;gap:2px;min-width:160px;display:flex}.manager-title{font-weight:600;font-size:var(--text-sm)}.manager-meta{font-size:var(--text-xs);color:var(--muted)}.manager-item-actions{flex-wrap:wrap;gap:6px;display:flex}.puzzle-form h3{margin:0 0 var(--space-3);font-size:var(--text-md);font-weight:700}.form-grid{gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(160px,1fr));display:grid}.field{margin-bottom:var(--space-3);font-size:var(--text-sm);color:var(--muted);flex-direction:column;gap:4px;display:flex}.field input,.field textarea{background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius);font:inherit;resize:vertical;width:100%;transition:border-color var(--t-hover) var(--ease-out), background var(--t-hover) var(--ease-out);padding:8px 10px}.field textarea{font-family:var(--font-mono);font-size:var(--text-xs)}.field input:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:#0000}.field-error{color:var(--red);font-size:var(--text-xs);font-style:normal}.fen-preview{border:2px solid var(--board-frame);width:max-content;margin-bottom:var(--space-3);border-radius:4px;grid-template-rows:repeat(8,26px);grid-template-columns:repeat(8,26px);font-size:18px;line-height:1;display:grid;overflow:hidden}.preview-cell{justify-content:center;align-items:center;display:flex}.preview-cell.light{background:var(--board-light);color:#14100e}.preview-cell.dark{background:var(--board-dark);color:#f5efe6}.form-actions{gap:var(--space-2);margin-top:var(--space-1);display:flex}.toast-host{gap:var(--space-2);z-index:80;flex-direction:column;max-width:min(92vw,360px);display:flex;position:fixed;bottom:16px;right:16px}.toast{align-items:center;gap:var(--space-2);background:var(--surface-2);border-left:3px solid var(--muted);border-radius:var(--radius);font-size:var(--text-sm);color:var(--ink);padding:10px 12px;display:flex}.toast-success{border-left-color:var(--green)}.toast-error{border-left-color:var(--red)}.toast-info{border-left-color:#7fb2e8}.toast-text{flex:1}.toast-action{background:var(--surface-3);border-radius:var(--radius);color:var(--accent);cursor:pointer;font-size:var(--text-xs);transition:background var(--t-hover) var(--ease-out), transform var(--t-press) var(--ease-out);border:0;padding:3px 8px}.toast-action:hover{background:#3b2839}.toast-action:active{transform:scale(.97)}.toast-close{color:var(--muted);cursor:pointer;border-radius:var(--radius);transition:color var(--t-hover) var(--ease-out), background var(--t-hover) var(--ease-out);background:0 0;border:none;padding:0 2px;font-size:1rem;line-height:1}.toast-close:hover{color:var(--ink);background:var(--surface)}@media (width>=861px){.sidebar{top:var(--space-3);max-height:calc(100vh - 32px);position:sticky;overflow-y:auto}}@media (width<=860px){.layout{gap:var(--space-3);grid-template-columns:1fr}.puzzle-list{max-height:300px;overflow-y:auto}}@media (width<=520px){:root{--cell:min(58px, calc((100vw - 5rem) / 8))}.header h1{font-size:1.2rem}.logo{width:36px;height:36px;font-size:20px}.bar-label{flex:100%}.toast-host{max-width:none;left:12px;right:12px}}
