:root{--bg:#262421;--panel:#302e2b;--panel-border:#3d3a37;--text:#e8e6e3;--text-dim:#9b9893;--accent:#81b64c;--danger:#e8423d;--shadow:#00000059;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:system-ui,Segoe UI,Roboto,sans-serif}:root[data-theme=light]{--bg:#efece4;--panel:#fff;--panel-border:#ddd8cc;--text:#2b2926;--text-dim:#837e74;--shadow:#0000001f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0}#root{min-height:100vh}.app{max-width:960px;margin:0 auto;padding:16px}.app-header{align-items:baseline;gap:12px;margin-bottom:16px;display:flex}.app-header h1{margin:0;font-size:24px;font-weight:700}.subtitle{color:var(--text-dim);font-size:14px}.app-main{align-items:flex-start;gap:24px;display:flex}.board-column{flex:auto;min-width:0;max-width:620px}.board-wrap{touch-action:manipulation;width:100%;position:relative}.player-bar{align-items:center;gap:8px;padding:8px 4px;font-size:15px;display:flex}.player-name{color:var(--text-dim)}.player-name.active{color:var(--text);font-weight:600}.turn-indicator{background:var(--panel-border);border-radius:50%;flex:none;width:10px;height:10px}.turn-indicator.active{background:var(--accent);box-shadow:0 0 6px var(--accent)}.check-label{color:var(--danger);border:1px solid var(--danger);border-radius:4px;padding:1px 8px;font-size:13px;font-weight:700}.clock{font-variant-numeric:tabular-nums;background:var(--panel-border);color:var(--text-dim);border-radius:6px;margin-left:auto;padding:2px 10px;font-size:15px;font-weight:700}.clock.active{background:var(--accent);color:#16200f}.clock.low{background:var(--danger);color:#fff;animation:1s ease-in-out infinite pulse}.theme-toggle{flex:none}.thinking-label{color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:1px 8px;font-size:13px;font-weight:600;animation:1.2s ease-in-out infinite pulse}.thinking-label.failed{color:var(--danger);border-color:var(--danger);animation:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.setup{flex-direction:column;gap:8px;display:flex}.setup-field{justify-content:space-between;align-items:center;gap:8px;font-size:14px;display:flex}.setup-field span{color:var(--text-dim)}.setup-field select{background:var(--panel-border);color:var(--text);border:1px solid var(--panel-border);border-radius:6px;min-width:140px;padding:6px 8px;font-size:14px}.side-panel{flex-direction:column;flex:0 0 260px;gap:16px;display:flex}.panel-section{background:var(--panel);border:1px solid var(--panel-border);border-radius:8px;padding:12px 14px}.panel-section h2{text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);margin:0 0 10px;font-size:12px}.move-list{font-variant-numeric:tabular-nums;max-height:260px;font-size:14px;overflow-y:auto}.move-list-empty{color:var(--text-dim);font-size:13px}.move-row{grid-template-columns:34px 1fr 1fr;gap:4px;padding:3px 0;display:grid}.move-row:nth-child(odd){background:#ffffff08}.move-number{color:var(--text-dim)}.move-san{font-weight:500}.captured-trays{flex-direction:column;gap:6px;min-height:40px;display:flex}.captured-tray{flex-wrap:wrap;align-items:center;gap:2px;min-height:22px;display:flex}.captured-piece svg{width:22px;height:22px;display:block}.material-diff{color:var(--accent);margin-left:4px;font-size:13px;font-weight:700}.controls{flex-direction:column;gap:8px;display:flex}.controls-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.btn{cursor:pointer;touch-action:manipulation;border:none;border-radius:6px;padding:8px 12px;font-size:14px;font-weight:600;transition:background .15s,opacity .15s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:#1b2b11}.btn-primary:hover:not(:disabled){background:#8fc75b}.btn-secondary{background:var(--panel-border);color:var(--text)}.btn-secondary:hover:not(:disabled){background:#4a4744}.confirm-row{color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:flex}.confirm-row .btn{padding:4px 10px;font-size:13px}.promotion-overlay,.game-over-overlay{z-index:10;background:#00000080;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.promotion-panel,.game-over-panel{background:var(--panel);border:1px solid var(--panel-border);box-shadow:0 12px 30px var(--shadow);border-radius:10px;flex-direction:column;align-items:center;gap:12px;padding:16px 20px;display:flex}.promotion-panel h3,.game-over-panel h2{margin:0}.game-over-panel h2{font-size:22px}.game-over-panel p{color:var(--text-dim);margin:0}.promotion-choices{gap:8px;display:flex}.promotion-choice{background:var(--panel-border);border:1px solid var(--panel-border);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:56px;height:56px;padding:6px;display:flex}.promotion-choice:hover{background:#4a4744}.promotion-choice svg{width:44px;height:44px}.update-toast{z-index:50;background:var(--panel);border:1px solid var(--accent);box-shadow:0 12px 30px var(--shadow);border-radius:8px;flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;font-size:14px;display:flex;position:fixed;top:16px;right:16px}.offline-badge{border:1px solid var(--text-dim);color:var(--text-dim);border-radius:4px;margin-left:auto;padding:2px 10px;font-size:12px}.resume-banner{background:var(--panel);border:1px solid var(--accent);border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;padding:10px 14px;font-size:14px;display:flex}.resume-actions{gap:8px;display:flex}.archive-empty{color:var(--text-dim);margin:0;font-size:13px}.archive-list{flex-direction:column;gap:10px;max-height:220px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.archive-entry{background:#80808014;border-radius:6px;flex-direction:column;gap:6px;padding:8px 10px;display:flex}.archive-info{flex-direction:column;gap:2px;display:flex}.archive-result{font-size:13px;font-weight:600}.archive-meta{color:var(--text-dim);font-size:12px}.archive-actions{gap:6px;display:flex}.btn-small{padding:4px 10px;font-size:12px}@media (width<=760px){.app{padding:12px}.app-main{flex-direction:column}.board-column{width:100%;max-width:100%;margin:0 auto}.side-panel{flex-flow:wrap;flex:auto;width:100%}.panel-section{flex:220px}}@media (width<=480px){.app-header h1{font-size:20px}.player-bar{font-size:14px}.clock{padding:2px 8px;font-size:14px}.panel-section{flex:100%}.controls-row{gap:6px}.btn{padding:10px 12px}}