:root{--page: #f5f6f2;--surface: #ffffff;--surface-muted: #eef1ea;--surface-strong: #e1e7dc;--ink: #20241f;--ink-soft: #626b5f;--ink-muted: #879082;--line: #d9dfd4;--line-strong: #c4cebe;--accent: #2f6f4f;--accent-dark: #214f39;--accent-soft: #dcecdf;--warning: #bc3f37;--warning-soft: #f4d9d6;--focus: #2f5f98;--board-light: #e7ede1;--board-dark: #6f8a67;--selected: #f0c84b;--valid-move: rgba(47, 111, 79, .72);--capture: rgba(188, 63, 55, .78);--last-move: rgba(47, 95, 152, .22);--check: rgba(188, 63, 55, .26);--shadow-sm: 0 1px 2px rgba(32, 36, 31, .07);--shadow-md: 0 12px 30px rgba(32, 36, 31, .1);--radius: 8px}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{position:relative;overflow-x:hidden;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--page)}button,select,.square{font:inherit}button,select{-webkit-tap-highlight-color:transparent}.ambient,.board-aura,.app-hidden,.main-menu.menu-hidden,body[data-screen=menu] #game-app,body[data-screen=game] #main-menu{display:none}.main-menu,.app{position:relative;z-index:1;width:min(1360px,100%);margin:0 auto;padding:clamp(16px,2.4vw,28px)}.main-menu{min-height:100vh;display:grid;grid-template-columns:minmax(320px,468px) minmax(420px,640px);gap:clamp(24px,4vw,44px);justify-content:center;align-items:center}.app{min-height:100vh;display:grid;place-items:center;gap:18px;padding-block:clamp(16px,2vw,28px) 32px}.menu-panel,.menu-preview,.hero-bar,.panel,.board-stage,.promotion-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.menu-panel{width:100%;max-width:468px;padding:28px;display:grid;gap:24px}.menu-panel h1{max-width:7ch}.menu-copy,.menu-options,.control-group,.capture-panel,.capture-stack,.history-panel,.panel-header,.section-heading,.history-header,.controls{display:grid;gap:12px}.menu-preview{width:100%;padding:18px;display:grid;place-items:center;background:#ffffffe0}.menu-preview-board{width:min(100%,548px);aspect-ratio:1;margin:0 auto;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);overflow:hidden;border:8px solid #3f473f;border-radius:var(--radius);box-shadow:var(--shadow-md)}.menu-preview-board span{display:grid;place-items:center;color:#202820;font-family:Segoe UI Symbol,Noto Sans Symbols,serif;font-size:clamp(2.2rem,5vw,3.7rem);line-height:1}.menu-preview-board span:nth-child(16n+1),.menu-preview-board span:nth-child(16n+3),.menu-preview-board span:nth-child(16n+5),.menu-preview-board span:nth-child(16n+7),.menu-preview-board span:nth-child(16n+10),.menu-preview-board span:nth-child(16n+12),.menu-preview-board span:nth-child(16n+14),.menu-preview-board span:nth-child(16n+16){background:var(--board-light)}.menu-preview-board span:nth-child(16n+2),.menu-preview-board span:nth-child(16n+4),.menu-preview-board span:nth-child(16n+6),.menu-preview-board span:nth-child(16n+8),.menu-preview-board span:nth-child(16n+9),.menu-preview-board span:nth-child(16n+11),.menu-preview-board span:nth-child(16n+13),.menu-preview-board span:nth-child(16n+15){background:var(--board-dark)}.hero-bar{display:none}.hero-copy,.match-summary .hero-copy{display:grid;gap:6px}.hero-metrics,.match-summary .hero-metrics{display:grid;grid-template-columns:repeat(4,minmax(112px,1fr));gap:8px}.metric-card,.rule-card,.history-row,.capture-row,.status-card,.promotion-button,.player-ribbon{background:var(--surface-muted);border:1px solid var(--line);border-radius:var(--radius)}.metric-card,.match-summary .metric-card{min-height:0;min-width:0;padding:12px;display:grid;gap:6px}.eyebrow,.panel-kicker,.status-label,.control-label,.metric-label,.rule-label,.capture-label,.player-seat{margin:0;color:var(--ink-muted);font-size:.75rem;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{overflow-wrap:anywhere}h1,h2,h3{color:var(--ink)}h1{margin:0;max-width:13ch;font-size:3.25rem;line-height:1;letter-spacing:0}.match-summary h1{font-size:1.9rem}.panel-header h2,.history-header h2,.section-heading h3{margin:0;font-size:1.2rem;line-height:1.2}.subtitle,.panel-copy,.control-note,.history-note,.promotion-subtitle,.stage-copy,.section-heading p,.turn-indicator,.mode-indicator,.draw-rule-status,.history-empty{margin:0;color:var(--ink-soft);line-height:1.55}.metric-value{color:var(--ink);font-size:1.02rem;line-height:1.1}.game-shell{display:grid;grid-template-columns:minmax(0,1220px);justify-content:center;align-items:start;width:100%}.board-stage{position:relative;width:100%;max-width:1220px;padding:clamp(14px,2vw,22px);display:grid;gap:14px;align-content:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.board-topbar{display:grid;grid-template-columns:minmax(250px,300px) minmax(0,1fr);gap:12px;align-items:stretch}.board-status-card{height:100%}.board-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.board-workbench{display:grid;grid-template-columns:minmax(190px,220px) minmax(0,1fr) minmax(200px,230px);width:100%;gap:14px;align-items:start}.board-side,.board-center{min-width:0}.board-side{display:grid;gap:10px;align-content:start}.board-center{display:grid;gap:10px}.panel{padding:12px;display:grid;gap:12px}.status-card{padding:12px;display:grid;gap:6px}.status-topline{display:flex;align-items:center;justify-content:space-between;gap:12px}.status-pulse{width:10px;height:10px;border-radius:999px;background:var(--accent)}body[data-position-state=check] .status-pulse,body[data-position-state=game-over] .status-pulse{background:var(--warning)}body[data-position-state=thinking] .status-pulse{background:var(--focus)}body[data-position-state=promotion] .status-pulse{background:var(--selected)}.status-message{margin:0;color:var(--ink);font-size:1.05rem;font-weight:800;line-height:1.2}.control-button,.difficulty-select{width:100%;border-radius:var(--radius);border:1px solid var(--line-strong);transition:background-color .14s ease,border-color .14s ease,color .14s ease,transform .14s ease,opacity .14s ease}.control-button{padding:10px 12px;cursor:pointer;color:#fff;background:var(--accent);font-weight:800;box-shadow:none}.control-button:hover:not(:disabled){background:var(--accent-dark);transform:translateY(-1px)}.control-button:active:not(:disabled){transform:translateY(0)}.control-button:disabled{opacity:.48;cursor:not-allowed}.control-button.secondary,.control-button.tertiary{color:var(--ink);background:var(--surface)}.control-button.secondary:hover:not(:disabled),.control-button.tertiary:hover:not(:disabled){color:var(--accent-dark);background:var(--accent-soft);border-color:var(--accent)}.control-button.active{color:var(--accent-dark);background:var(--accent-soft);border-color:var(--accent)}.menu-start-button{min-height:52px}.difficulty-select{appearance:none;padding:12px 14px;color:var(--ink);background:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%),var(--surface);background-position:calc(100% - 18px) 52%,calc(100% - 12px) 52%,0 0;background-size:6px 6px,6px 6px,100% 100%;background-repeat:no-repeat}.capture-row{padding:10px;display:grid;gap:6px}.capture-pieces{min-height:22px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;color:var(--ink);font-size:1.05rem}.board-panel{position:relative;display:grid;width:100%;justify-items:center;gap:10px}.clock-card{width:100%;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.clock-card.active{border-color:var(--accent);border-left-color:var(--accent);background:var(--accent-soft)}.clock-card.low-time{border-color:var(--warning);border-left-color:var(--warning)}.clock-player{color:var(--ink-soft);font-size:.76rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.clock-time{min-width:5ch;text-align:right;font-family:Consolas,Courier New,monospace;font-size:1.15rem;line-height:1}.board-frame{width:min(100%,760px);padding:clamp(10px,1.4vw,14px);display:grid;gap:8px;background:var(--surface-muted);border:1px solid var(--line);border-radius:var(--radius)}.board-label{display:grid;grid-template-columns:repeat(8,1fr);width:calc(100% - 48px);margin-left:48px;color:var(--ink-muted);font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}.board-label span{text-align:center}.board-label-top{margin-bottom:2px}.board-label-bottom{margin-top:2px}.board-with-ranks{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:stretch}.rank-labels{display:grid;grid-template-rows:repeat(8,1fr);color:var(--ink-muted);font-size:.78rem;font-weight:700;letter-spacing:0}.rank-labels span{display:grid;place-items:center}.board{width:100%;max-width:680px;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);overflow:hidden;border:10px solid #3a4138;border-radius:var(--radius);box-shadow:var(--shadow-md)}.board.disabled .square{cursor:wait}.square{position:relative;border:0;padding:0;display:grid;place-items:center;cursor:pointer;transition:filter .12s ease}.square:hover:not(:disabled){filter:brightness(1.06)}.square.light{background:var(--board-light)}.square.dark{background:var(--board-dark)}.square.selected{outline:4px solid var(--selected);outline-offset:-4px}.square.valid-move:after{content:"";width:24%;height:24%;border-radius:50%;background:var(--valid-move)}.square.capture-move:after{width:calc(100% - 14px);height:calc(100% - 14px);background:transparent;border:4px solid var(--capture)}.square.last-move{box-shadow:inset 0 0 0 999px var(--last-move)}.square.checked-king{box-shadow:inset 0 0 0 999px var(--check)}.square.last-move.checked-king{box-shadow:inset 0 0 0 999px var(--check),inset 0 0 0 8px var(--last-move)}.piece{position:relative;z-index:1;font-family:Segoe UI Symbol,Noto Sans Symbols,serif;font-size:3.15rem;line-height:1;-webkit-user-select:none;user-select:none;transition:transform .14s ease}.square.selected .piece{transform:translateY(-2px)}.piece.white-piece{color:#fffdfa;text-shadow:1px 1px 0 rgba(24,32,24,.88),-1px 1px 0 rgba(24,32,24,.88),1px -1px 0 rgba(24,32,24,.88),-1px -1px 0 rgba(24,32,24,.88),0 2px 4px rgba(24,32,24,.18)}.piece.black-piece{color:#182018}.player-ribbon{padding:8px 10px;display:grid;gap:2px}.stage-banner,.stage-footer{display:grid;gap:8px;align-items:center}.stage-banner{grid-template-columns:minmax(150px,180px) minmax(0,1fr)}.stage-footer{grid-template-columns:minmax(150px,180px) minmax(160px,190px);justify-content:space-between}.player-name{color:var(--ink);font-size:.95rem;line-height:1.15}.stage-copy{max-width:34ch;font-size:.92rem}.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.legend p{margin:0;padding:8px 10px;border-radius:var(--radius);display:flex;align-items:center;gap:8px;background:var(--surface-muted);color:var(--ink-soft);border:1px solid var(--line)}.legend-dot{width:12px;height:12px;border-radius:999px;display:inline-block}.selected-dot{background:var(--selected)}.move-dot{background:var(--valid-move)}.capture-dot{background:var(--capture)}.move-trail-dot{background:var(--last-move);border:1px solid var(--focus)}.check-dot{background:var(--check);border:1px solid var(--warning)}.rule-card{padding:12px;display:grid;gap:6px}.legend-board{padding-top:4px;border-top:1px solid var(--line)}.board-ai-toggle{display:block}.board-controls{display:grid;grid-template-columns:1fr;gap:8px}.history-panel{min-height:0}.move-history{max-height:320px;overflow:auto;padding-right:4px;display:grid;gap:6px}.move-history::-webkit-scrollbar{width:8px}.move-history::-webkit-scrollbar-thumb{border-radius:999px;background:var(--line-strong)}.history-row{padding:8px 10px;display:grid;grid-template-columns:34px 1fr 1fr;gap:8px;align-items:center}.move-number{color:var(--ink-muted);font-weight:800}.history-move{color:var(--ink);font-family:Consolas,Courier New,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.promotion-dialog{position:fixed;inset:0;padding:20px;display:grid;place-items:center;background:#20241f73}.promotion-dialog.hidden{display:none}.promotion-card{width:min(420px,100%);padding:22px;box-shadow:var(--shadow-md)}.promotion-title{margin:0;color:var(--ink);font-size:1.45rem;font-weight:800}.promotion-subtitle{margin-top:8px}.promotion-options{margin-top:18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.promotion-button{padding:14px;color:var(--ink);display:flex;align-items:center;gap:10px;cursor:pointer}.promotion-button:hover{background:var(--accent-soft);border-color:var(--accent)}.promotion-piece{font-size:1.8rem}.difficulty-select:focus-visible,.control-button:focus-visible,.square:focus-visible,.promotion-button:focus-visible{outline:3px solid rgba(47,95,152,.34);outline-offset:3px}@media(max-width:1240px){.app{width:min(1180px,100%)}.board-topbar{grid-template-columns:1fr}.board-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.board-workbench{grid-template-columns:minmax(190px,220px) minmax(0,1fr)}.board-side-right{grid-column:1 / -1;grid-template-columns:minmax(190px,220px) minmax(0,1fr);align-items:start}.history-panel{min-height:100%}}@media(max-width:980px){.main-menu,.app{padding:18px}.main-menu{min-height:auto;grid-template-columns:1fr;gap:18px}.menu-panel{max-width:none}.menu-preview{max-width:640px;justify-self:center}.board-workbench{grid-template-columns:1fr}.board-side-left,.board-side-right{grid-template-columns:1fr 1fr}.board-center{order:-1}.stage-banner,.stage-footer{grid-template-columns:1fr}}@media(max-width:680px){.main-menu,.app{padding:12px}.menu-panel,.menu-preview,.hero-bar,.panel,.promotion-card{padding:14px}.board-stage{padding:12px;gap:12px}.board-metrics,.board-side-left,.board-side-right{grid-template-columns:1fr}h1{font-size:2.35rem}.match-summary h1{font-size:1.65rem}.hero-metrics,.match-summary .hero-metrics{grid-template-columns:1fr 1fr}.menu-preview-board,.board{border-width:6px}.board-label{width:calc(100% - 32px);margin-left:32px;font-size:.75rem}.board-with-ranks{grid-template-columns:24px minmax(0,1fr);gap:8px}.rank-labels{font-size:.75rem}.status-message{font-size:.98rem}.clock-time{font-size:1.05rem}.piece,.menu-preview-board span{font-size:2.2rem}.history-row{grid-template-columns:34px 1fr 1fr;gap:8px}.promotion-options{grid-template-columns:1fr}}@media(max-width:420px){.board-label,.rank-labels{display:none}.board-with-ranks{grid-template-columns:1fr}.piece,.menu-preview-board span{font-size:1.85rem}}
