:root{--bg: #0d1115;--bg-gradient: radial-gradient(circle at 50% 8%, #19212a 0%, #0d1115 100%);--panel: #161c22;--panel-elevated: #1e252d;--panel-hover: #262f38;--line: #293440;--line-subtle: #1f2730;--ink: #eef3f7;--ink-dim: #8b9baa;--ink-faint: #566472;--board-a: #232c35;--board-b: #181f26;--white-piece: #f4efe6;--white-piece-ring: #cfc4b2;--white-piece-text: #1a1e23;--black-piece: #282f37;--black-piece-ring: #14171a;--black-piece-text: #e6ebf0;--accent: #58a6ff;--accent-fg: #0b1116;--accent-glow: rgba(88, 166, 255, .25);--accent-warm: #e69138;--legal: #4ec9b0;--capture: #f85149;--capture-bg: rgba(248, 81, 73, .15);--last-move: rgba(230, 145, 56, .22);--board-shadow: 0 12px 36px rgba(0, 0, 0, .55);--font-serif: "Cinzel", Georgia, serif;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}[data-theme=light]{--bg: #f4f6f9;--bg-gradient: radial-gradient(circle at 50% 8%, #ffffff 0%, #edf1f6 100%);--panel: #ffffff;--panel-elevated: #f4f6f9;--panel-hover: #eaeef3;--line: #d3dbe3;--line-subtle: #e2e8f0;--ink: #19212a;--ink-dim: #5c6c7d;--ink-faint: #8e9ca9;--board-a: #dbe3eb;--board-b: #c5d2de;--white-piece: #ffffff;--white-piece-ring: #b8c4d1;--white-piece-text: #111827;--black-piece: #222b35;--black-piece-ring: #0d1217;--black-piece-text: #f8fafc;--accent: #0969da;--accent-fg: #ffffff;--accent-glow: rgba(9, 105, 218, .25);--accent-warm: #d97706;--legal: #0d9488;--capture: #d1242f;--capture-bg: rgba(209, 36, 47, .15);--last-move: rgba(217, 119, 6, .24);--board-shadow: 0 12px 32px rgba(90, 105, 120, .2)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);background-image:var(--bg-gradient);background-attachment:fixed;color:var(--ink);font-family:var(--font-sans);min-height:100vh;min-height:-webkit-fill-available;display:flex;flex-direction:column;align-items:center;touch-action:manipulation;overflow-x:hidden}#root{width:100%;display:flex;justify-content:center;padding:16px 16px 36px}.app-wrapper{width:100%;max-width:1200px;display:flex;flex-direction:column;align-items:center}.header{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:20px;width:100%}.header-top{width:100%;display:flex;align-items:center;justify-content:center;position:relative;min-height:40px}.title-row{display:flex;align-items:center;gap:10px}.header-actions{position:absolute;right:0;display:flex;align-items:center;gap:8px}.theme-toggle-btn{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:8px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease}.theme-toggle-btn:hover{border-color:var(--accent);background:var(--panel-elevated);color:var(--accent)}h1{font-family:var(--font-serif);font-size:1.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-shadow:0 2px 12px rgba(0,0,0,.25)}.version-badge{font-size:.65rem;font-weight:700;letter-spacing:.06em;background:var(--panel-elevated);border:1px solid var(--line);color:var(--accent);padding:2px 8px;border-radius:9999px;text-transform:uppercase}.tagline{color:var(--ink-dim);font-size:.84rem;line-height:1.45;max-width:480px;margin-top:6px}.app-logo-icon{color:var(--accent);filter:drop-shadow(0 2px 6px var(--accent-glow))}.rules-sidebar-btn,.replay-sidebar-btn{width:100%;margin-top:10px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 14px;color:var(--ink);font-weight:600;font-size:.84rem;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:all .15s ease}.rules-sidebar-btn:hover,.replay-sidebar-btn:hover{background:var(--panel-elevated);border-color:var(--accent);color:var(--accent);box-shadow:0 2px 10px var(--accent-glow)}.rules-sidebar-btn svg,.replay-sidebar-btn svg{color:var(--accent)}.main-layout{width:100%;display:flex;flex-direction:column;align-items:center;gap:18px}.layout-col{width:100%;display:flex;flex-direction:column}.player-bar{width:100%;display:flex;justify-content:space-between;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 12px;transition:all .2s ease}.player-bar.active{border-color:var(--accent);box-shadow:0 0 10px #58a6ff26}.player-identity{display:flex;align-items:center;gap:10px}.player-avatar{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line)}.player-avatar.w{background:var(--white-piece);border-color:var(--white-piece-ring)}.player-avatar.b{background:var(--black-piece);border-color:#556270}.player-details{display:flex;flex-direction:column}.player-name-row{display:flex;align-items:center;gap:6px}.player-name{font-weight:600;font-size:.88rem;color:var(--ink)}.player-subtitle{font-size:.72rem;color:var(--ink-dim)}.active-tag{font-size:.62rem;font-weight:700;color:#3fb950;background:#3fb9501f;border:1px solid rgba(63,185,80,.3);padding:1px 5px;border-radius:4px;text-transform:uppercase}.thinking-tag{font-size:.62rem;font-weight:700;color:var(--accent);background:#58a6ff1f;border:1px solid rgba(88,166,255,.3);padding:1px 5px;border-radius:4px;text-transform:uppercase;animation:pulse-glow 1.2s infinite ease-in-out}.captured-tray{display:flex;align-items:center;gap:4px;flex-wrap:wrap;max-width:50%;justify-content:flex-end}.captured-chip{display:inline-flex;align-items:center;font-family:var(--font-serif);font-size:.72rem;font-weight:700;padding:2px 5px;border-radius:4px;border:1px solid var(--line)}.captured-chip.w{background:var(--white-piece);color:#1a1e23;border-color:var(--white-piece-ring)}.captured-chip.b{background:var(--black-piece);color:var(--ink);border-color:#434d58}.chip-multiplier{font-family:var(--font-sans);font-size:.62rem;margin-left:2px;opacity:.8}.center-stage{align-items:center;gap:8px;max-width:460px}.board-container{width:100%;display:flex;justify-content:center;position:relative}.board{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);width:min(92vw,440px);height:min(92vw,440px);border-radius:12px;overflow:hidden;border:2px solid var(--line);box-shadow:var(--board-shadow),inset 0 0 0 1px #ffffff0a}.sq{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;transition:background-color .15s ease}.sq.a{background:var(--board-a)}.sq.b{background:var(--board-b)}.sq.last-move{background-color:var(--last-move)}.sq.selected{box-shadow:inset 0 0 0 3px var(--accent);background:#58a6ff26}.sq.legal:after{content:"";position:absolute;width:26%;height:26%;border-radius:50%;background:var(--legal);opacity:.75;box-shadow:0 0 8px #4ec9b066;pointer-events:none}.sq.capture{background:var(--capture-bg)}.sq.capture:after{content:"";position:absolute;top:10%;right:10%;bottom:10%;left:10%;border-radius:50%;border:2.5px solid var(--capture);background:transparent;opacity:.85;box-shadow:0 0 10px #f8514966;pointer-events:none;animation:capture-pulse 1.4s infinite ease-in-out}@keyframes capture-pulse{0%,to{transform:scale(.96);opacity:.75}50%{transform:scale(1.02);opacity:1}}.piece{width:80%;height:80%;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-weight:700;font-size:1.18rem;pointer-events:none;box-shadow:0 3px 8px #00000073;transition:transform .12s cubic-bezier(.34,1.56,.64,1);z-index:2}.piece.w{background:linear-gradient(135deg,#fff,#e2dac9);color:var(--white-piece-text);border:2px solid var(--white-piece-ring)}.piece.b{background:linear-gradient(135deg,#373f4b,#20252c);color:var(--black-piece-text);border:2px solid #5a6472}.piece-symbol{transform:translateY(-1px)}.sq-coord{position:absolute;bottom:2px;right:4px;font-size:.55rem;font-weight:600;color:var(--ink-faint);opacity:.6;pointer-events:none}.statusbar{width:100%;display:flex;justify-content:space-between;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 14px;box-shadow:0 4px 14px #0003}.turn-pill{display:flex;align-items:center;gap:9px;font-size:.88rem;font-weight:600}.turn-dot{width:12px;height:12px;border-radius:50%;transition:all .2s ease}.turn-dot.w{background:var(--white-piece);border:2px solid var(--white-piece-ring);box-shadow:0 0 8px #f4efe680}.turn-dot.b{background:var(--black-piece);border:2px solid #55606d;box-shadow:0 0 8px #0009}.turn-dot.thinking{animation:pulse-glow 1.2s infinite ease-in-out}@keyframes pulse-glow{0%,to{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}.status-badge{font-size:.78rem;font-weight:600;padding:4px 9px;border-radius:6px;background:var(--panel-elevated);border:1px solid var(--line);color:var(--ink-dim)}.status-badge.win-w{color:#3fb950;border-color:#3fb95066;background:#3fb9501a}.status-badge.win-b{color:var(--accent);border-color:#58a6ff66;background:#58a6ff1a}.controls-panel{width:100%;display:flex;flex-direction:column;gap:8px;margin-top:10px}.button-row{display:flex;gap:8px;width:100%}.mode-toggle-group{display:flex;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:2px;gap:2px;flex:1.8}.mode-btn{flex:1;background:transparent;border:none;border-radius:6px;padding:6px 8px;font-size:.8rem;font-weight:600;color:var(--ink-dim);cursor:pointer;transition:all .15s ease;white-space:nowrap}.mode-btn:hover{color:var(--ink)}.mode-btn.active{background:var(--panel-elevated);color:var(--accent);box-shadow:0 1px 4px #00000026}.new-game-btn,.copy-match-btn{flex:1;white-space:nowrap}.mobile-action-row{display:flex;gap:8px;width:100%;justify-content:center;margin-top:8px}@media (min-width: 768px){.mobile-action-row{display:none}}select,button{font-family:var(--font-sans);font-size:.85rem;padding:10px 14px;border-radius:8px;border:1px solid var(--line);background:var(--panel);color:var(--ink);transition:all .15s ease;outline:none}select{flex:1.8;cursor:pointer;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b99a7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 10px center;background-size:14px;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:32px}select:hover,select:focus{border-color:var(--accent);background-color:var(--panel-elevated)}select:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.7);pointer-events:none}button{cursor:pointer;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}button.primary:hover{filter:brightness(1.1);box-shadow:0 0 12px var(--accent-glow)}button.secondary{background:var(--panel);border:1px solid var(--line);color:var(--ink);flex:1}button.secondary:hover{background:var(--panel-elevated);border-color:#3e4d5d}button:active{transform:scale(.98)}.move-history-card{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:10px;display:flex;flex-direction:column;gap:8px}.card-header{display:flex;justify-content:space-between;align-items:center}.card-header h3{font-size:.88rem;font-weight:600;color:var(--ink)}.card-badge{font-size:.7rem;background:var(--panel-elevated);padding:2px 6px;border-radius:4px;color:var(--ink-dim)}.log-box{width:100%;background:var(--panel-elevated);border:1px solid var(--line-subtle);border-radius:6px;padding:8px 10px;height:180px;overflow-y:auto;font-size:.78rem;color:var(--ink-dim);display:flex;flex-direction:column-reverse;gap:4px}.log-entry{line-height:1.45;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.log-entry.latest{color:var(--ink);font-weight:600}.log-entry.win{color:#58a6ff;font-weight:700}.rules-panel-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:14px}.rules-card-header h3{font-family:var(--font-serif);font-size:1rem;font-weight:700;color:var(--ink)}.rules-card-subtitle{font-size:.72rem;color:var(--accent-warm);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.chain-flow{display:flex;flex-direction:column;gap:6px;align-items:center}.chain-node{display:flex;align-items:center;gap:8px;width:100%;background:var(--panel-elevated);border:1px solid var(--line-subtle);border-radius:7px;padding:6px 10px}.node-badge{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-family:var(--font-serif);font-size:.8rem;font-weight:700;background:var(--panel);border:1px solid var(--line);color:var(--accent)}.node-text{display:flex;flex-direction:column;line-height:1.25}.node-text b{font-size:.82rem;color:var(--ink)}.node-text small{font-size:.7rem;color:var(--ink-dim)}.chain-split{display:flex;gap:6px;width:100%}.chain-split .chain-node{flex:1;padding:6px 8px}.chain-arrow{font-size:.75rem;font-weight:700;color:var(--ink-faint)}.rules-mini-summary{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line-subtle);padding-top:12px;font-size:.76rem;color:var(--ink-dim);line-height:1.45}.mini-rule{display:flex;gap:6px;align-items:flex-start}.mini-rule b{color:var(--ink)}.badge-k{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--accent-warm);color:#0f1317;font-family:var(--font-serif);font-weight:700;font-size:.72rem;flex-shrink:0}.mini-rule.warning{color:#e69138;background:#e6913814;border:1px solid rgba(230,145,56,.25);padding:6px 8px;border-radius:6px}.mobile-only-legend{display:block;font-size:.74rem;color:var(--ink-dim);text-align:center;line-height:1.4;margin-top:6px;padding:8px 12px;background:var(--panel);border:1px solid var(--line-subtle);border-radius:8px;width:100%}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0d10bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}.modal-content{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;width:100%;max-width:420px;box-shadow:0 16px 40px #0009;display:flex;flex-direction:column;gap:16px}.modal-header{display:flex;justify-content:space-between;align-items:center}.modal-title{font-family:var(--font-serif);font-size:1.25rem;font-weight:700;color:var(--ink)}.close-btn{background:transparent;border:none;color:var(--ink-dim);font-size:1.2rem;padding:4px 8px;cursor:pointer}.close-btn:hover{color:var(--ink)}.rule-item{display:flex;flex-direction:column;gap:4px;font-size:.82rem;color:var(--ink-dim);border-bottom:1px solid var(--line-subtle);padding-bottom:8px}.rule-item:last-child{border-bottom:none;padding-bottom:0}.rule-piece{font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px}.badge{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;font-size:.72rem;font-weight:700;background:var(--panel-elevated);border:1px solid var(--line);color:var(--accent)}.replay-container{width:100%;display:flex;flex-direction:column;align-items:center;gap:16px}.replay-top-bar{width:100%;max-width:860px;display:flex;justify-content:space-between;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 16px;gap:12px;flex-wrap:wrap}.replay-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.replay-tag{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:#58a6ff26;border:1px solid var(--accent);color:var(--accent);padding:2px 8px;border-radius:9999px}.replay-diff-badge,.replay-result-badge{font-size:.75rem;font-weight:600;background:var(--panel-elevated);border:1px solid var(--line);color:var(--ink-dim);padding:2px 8px;border-radius:6px}.replay-result-badge{color:var(--accent-warm)}.replay-actions{display:flex;align-items:center;gap:8px}.sm-btn{padding:6px 12px;font-size:.78rem;border-radius:6px;flex:none}.replay-main-layout{width:100%;display:flex;flex-direction:column;align-items:center;gap:18px}.replay-board-stage{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:460px}.replay-current-info{width:100%;display:flex;justify-content:space-between;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 14px}.step-counter{font-size:.88rem;font-weight:700;color:var(--accent)}.step-desc{font-size:.82rem;font-weight:600;color:var(--ink);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.replay-nav-controls{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:6px}.nav-btn{min-width:44px;height:40px;font-size:1rem;padding:0 12px;flex:none}.nav-btn.play-pause{min-width:110px;font-weight:700;font-size:.88rem}.replay-sidebar{width:100%;max-width:460px;display:flex;flex-direction:column}.replay-moves-scroll{width:100%;background:var(--panel-elevated);border:1px solid var(--line-subtle);border-radius:6px;padding:6px;height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:3px}.timeline-item{width:100%;text-align:left;justify-content:flex-start;background:transparent;border:1px solid transparent;border-radius:5px;padding:6px 10px;font-size:.78rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:var(--ink-dim);cursor:pointer;transition:all .12s ease;flex:none}.timeline-item:hover{background:var(--panel-hover);color:var(--ink)}.timeline-item.active{background:var(--panel);border-color:var(--accent);color:var(--accent);font-weight:700;box-shadow:0 1px 4px #00000026}.replay-export-row{display:flex;gap:8px;width:100%;margin-top:6px}.import-textarea{width:100%;background:var(--panel-elevated);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.78rem;line-height:1.4;resize:vertical;min-height:140px}.import-textarea:focus{outline:none;border-color:var(--accent)}.import-error{color:var(--capture);background:var(--capture-bg);border:1px solid var(--capture);border-radius:6px;padding:8px 10px;font-size:.78rem}.modal-actions-col{display:flex;flex-direction:column;gap:8px}.sidebar-left{display:none}@media (min-width: 768px) and (max-width: 1079px){.main-layout,.replay-main-layout{flex-direction:row;align-items:flex-start;justify-content:center;gap:20px}.center-stage{flex:1;max-width:440px}.sidebar-right,.replay-sidebar{width:320px;flex-shrink:0}.sidebar-left{display:none}.mobile-only-legend{display:block}.log-box{height:240px}}@media (min-width: 1080px){.main-layout,.replay-main-layout{flex-direction:row;align-items:flex-start;justify-content:center;gap:28px}.sidebar-left{display:flex;width:280px;flex-shrink:0}.center-stage,.replay-board-stage{flex:1;max-width:470px}.board{width:460px;height:460px}.sidebar-right,.replay-sidebar{width:340px;flex-shrink:0}.mobile-only-legend{display:none}.log-box{height:260px}.replay-moves-scroll{height:380px}}.footer{width:100%;margin-top:28px;padding-top:14px;border-top:1px solid var(--line-subtle);display:flex;justify-content:center;align-items:center;font-size:.74rem;color:var(--ink-faint);letter-spacing:.03em}.creator-link{color:var(--ink-dim);text-decoration:none;font-weight:500;transition:all .15s ease;border-bottom:1px dotted var(--line);padding-bottom:1px}.creator-link:hover{color:var(--accent);border-bottom-color:var(--accent)}