html,body{margin:0;padding:0;background:#1f2430;color:#e6e6e6;font-family:system-ui,sans-serif;height:100%}#app{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px;align-items:stretch;padding:16px;min-height:100%;box-sizing:border-box}#board{display:flex;align-items:center;justify-content:center}#panel{background:#2a2f3a;border:1px solid #3a4150;border-radius:8px;padding:14px;box-sizing:border-box;display:flex;flex-direction:column;font-size:13px;min-width:0}@media (max-width: 720px){#app{grid-template-columns:1fr}#panel{font-size:12px}}.panel{display:contents}.panel-status{font-weight:600;padding:8px 10px;background:#1f2430;border-radius:6px;display:flex;align-items:center;gap:8px}.panel-status.over{background:#3a2a2a;color:#ffcdd2}.dot{width:10px;height:10px;border-radius:50%;border:1px solid #5a6478}.dot-w{background:#fafafa}.dot-b{background:#1a1a1a}.panel-ai{margin-top:10px;padding:8px 10px;background:#1f2430;border-radius:6px;display:flex;flex-direction:column;gap:6px}.ai-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.ai-row select,.ai-row input[type=range]{flex:1 1 auto}.ai-row select{background:#2a2f3a;border:1px solid #3a4150;color:#e6e6e6;padding:4px 6px;border-radius:4px;font-family:inherit;font-size:12.5px;cursor:pointer}.ai-diff-val{display:inline-block;width:14px;text-align:right;font-variant-numeric:tabular-nums;color:#ffd166}.ai-thinking{height:16px;font-size:12px;color:#ffd166;font-style:italic}.ai-thinking.dim{color:#9ad0ff}.ai-thinking.on:before{content:"⟳ ";display:inline-block;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.panel-eval{margin-top:8px;display:flex;align-items:center;gap:8px}.eval-bar{flex:1 1 auto;height:14px;background:#1a1a1a;border-radius:7px;overflow:hidden;position:relative}.eval-bar-white{height:100%;background:#fafafa;transition:width .3s}.eval-num{font-variant-numeric:tabular-nums;font-size:12px;color:#c9d4ee;min-width:38px;text-align:right}.tag{display:inline-block;font-weight:700;margin-left:2px;padding:0 3px;border-radius:3px;font-size:11px}.mode-row{margin-bottom:4px;padding:8px 10px;background:#1f2430;border-radius:6px}.panel-puzzle{margin-top:4px;padding:10px;background:#1f2430;border-radius:6px;display:flex;flex-direction:column;gap:8px}.puzzle-theme{font-weight:600;font-size:13px;color:#9ad0ff}.puzzle-msg{font-size:12.5px;color:#c9d4ee;min-height:16px;font-style:italic}.puzzle-msg.solved{color:#6cd97e;font-style:normal;font-weight:600}.puzzle-msg.wrong{color:#ff6b6b;font-style:normal}.puzzle-msg.hint{color:#ffd166;font-style:normal}.panel-lesson{margin-top:4px;padding:10px;background:#1f2430;border-radius:6px;display:flex;flex-direction:column;gap:10px;max-height:60vh;overflow-y:auto}.lesson-current{display:flex;flex-direction:column;gap:6px}.lesson-title{font-weight:700;color:#9ad0ff}.lesson-intro{font-size:12.5px;line-height:1.5;color:#c9d4ee}.lesson-hint{font-size:12px;color:#ffd166;font-style:italic}.lesson-msg.solved,.lesson-done{color:#6cd97e;font-weight:600}#btn-lesson-next{align-self:flex-start;padding:6px 12px;background:#2e7d32;border:1px solid #4caf50;color:#fff;border-radius:6px;cursor:pointer}#btn-lesson-next:hover{background:#4caf50}.chapter{display:flex;flex-direction:column;gap:4px}.chapter-title{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#7a869a;margin-top:6px}.lesson-card{display:flex;align-items:center;gap:8px;padding:6px 8px;background:transparent;border:1px solid #3a4150;color:#e6e6e6;border-radius:4px;cursor:pointer;text-align:left;font:inherit;font-size:12.5px}.lesson-card:hover{background:#2a2f3a}.lesson-card.current{border-color:#9ad0ff;background:#2a3447}.lesson-card.done{color:#95c5a4}.lesson-mark{display:inline-block;width:16px;text-align:center;color:#6cd97e}.lesson-card:not(.done) .lesson-mark{color:#5a6478}.tag-best{color:#6cd97e}.tag-good{color:#95c5a4}.tag-inacc{color:#ffd166;background:#ffd1661f}.tag-mistake{color:#ff9e57;background:#ff9e572e}.tag-blunder{color:#ff6b6b;background:#ff6b6b38}.panel-captures{margin-top:10px;display:flex;flex-direction:column;gap:4px}.cap-row{min-height:24px;font-size:22px;line-height:1;padding:4px 6px;background:#1f2430;border-radius:6px}.panel-moves{margin-top:10px;flex:1 1 auto;overflow-y:auto;background:#1f2430;border-radius:6px;padding:6px 8px;font-family:ui-monospace,JetBrains Mono,monospace;font-size:12.5px;min-height:100px;max-height:280px}.move-row{display:grid;grid-template-columns:32px 1fr 1fr;gap:4px;padding:2px 0;border-bottom:1px solid #2a2f3a}.move-num{color:#7a869a}.move-san{color:#e6e6e6}.move-empty{color:#7a869a;padding:4px 0}.panel-buttons{margin-top:10px;display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.panel-buttons button{padding:8px 6px;background:#3a4150;border:1px solid #4a5363;color:#e6e6e6;border-radius:6px;cursor:pointer;font-size:13px;font-family:inherit}.panel-buttons button:hover:not(:disabled){background:#4a5363}.panel-buttons button:disabled{opacity:.45;cursor:not-allowed}