:root{color-scheme:dark;--cream:#f5e7c9;--muted:#bdc8cb;--gold:#efd393;--mint:#9fe3ce;--ink:#111e27;--scale:1;font-family:Segoe UI,Arial,sans-serif;color:var(--cream);background:#000;font-synthesis:none}
*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;min-height:100%;background:#000}body{display:flex;align-items:center;justify-content:center;min-height:100dvh;overflow:hidden}button{font:inherit;touch-action:manipulation;cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}button,.focusable{-webkit-tap-highlight-color:transparent}.hidden,[hidden]{display:none!important}#app{position:relative;width:600px;height:600px;flex-shrink:0;transform:scale(var(--scale));transform-origin:center}.screen{position:absolute;inset:0;display:flex;flex-direction:column;background:linear-gradient(145deg,#172733,#080e13 75%);overflow:hidden}.screen:after{content:"";position:absolute;inset:8px;border:1px solid #65766b55;pointer-events:none}.focusable{outline:none}.focusable:focus-visible,.focusable:focus{outline:3px solid var(--mint);outline-offset:3px}.focusable:disabled:focus{outline:none}
.menu-wrap{padding:30px 40px 22px;display:flex;flex-direction:column;height:100%}.menu-eyebrow{display:flex;justify-content:space-between;font-size:12px;letter-spacing:2px;color:var(--gold);border-bottom:1px solid #b69d6440;padding-bottom:16px}.menu-eyebrow span{color:#9eafb4;font-size:11px}.brand{position:relative;display:flex;align-items:center;height:270px}.brand-copy{z-index:1}.brand-sub{font-size:14px;color:var(--muted);margin-bottom:14px}.brand-title{font-family:Georgia,serif;font-weight:400;font-size:65px;line-height:.99;letter-spacing:-2px}.brand-title em{font-weight:400;color:var(--gold)}.brand-caption{color:#a8b8bb;font-size:10px;letter-spacing:2.2px;margin-top:20px}.brand-mark{position:absolute;right:-5px;top:24px;width:235px;height:238px;background:linear-gradient(145deg,transparent 55%,#b5956220 55%,#70857b17 80%,transparent 80%)}.brand-mark .piece{position:absolute;width:155px;height:155px;top:60px;left:8px;filter:drop-shadow(6px 12px 6px #0006);transform:rotate(-5deg)}.brand-mark .piece:nth-child(2){width:185px;height:185px;top:3px;left:76px;transform:rotate(5deg)}.brand-mark .piece:nth-child(3){width:106px;height:106px;top:129px;left:116px;transform:none}.menu-list{display:flex;flex-direction:column;gap:12px;width:100%}.menu-btn{padding:13px 19px;min-height:50px;background:linear-gradient(110deg,#263945,#182630);border:1px solid #778b8970;border-radius:7px;font-size:17px;line-height:1.2;font-weight:600;text-align:left;display:flex;justify-content:space-between;align-items:center}.menu-btn.primary{background:linear-gradient(110deg,#f1d69a,#d5b67a);border-color:#ffe8b6;color:#182630}.menu-btn:hover:not(:disabled),.opt-btn:hover{filter:brightness(1.12)}.menu-hint{font-size:12px;color:#aebec0;text-align:center;margin-top:auto;padding-top:18px}.screen-header{height:85px;display:flex;align-items:center;gap:18px;padding:22px 28px 12px}.screen-header h2{font-family:Georgia,serif;font-size:31px;font-weight:400;letter-spacing:-.5px}.back-btn{width:42px;height:42px;border:1px solid #75877e;border-radius:7px;background:#20333d;font-size:23px}.opt-list{display:flex;flex-direction:column;justify-content:center;gap:18px;padding:8px 34px 32px;flex:1}.opt-list-compact{gap:12px}.opt-btn{border:1px solid #72898377;border-radius:7px;background:linear-gradient(110deg,#293f49,#14232b);padding:19px 22px;text-align:left}.opt-list-compact .opt-btn{padding:15px 20px}.opt-title{font-size:22px;font-weight:600}.opt-sub{font-size:14px;color:#b8c6c8;margin-top:5px}.opt-row{display:flex;justify-content:space-between;align-items:center}.opt-elo{font-size:11px;letter-spacing:1.3px;color:var(--gold)}#side .opt-btn{min-height:100px;padding-left:112px;position:relative}#side .side-art{width:90px;height:90px;position:absolute;left:10px;top:4px}#side .side-art .piece{width:100%;height:100%}
#game{background:#050a0d}#game:after{display:none}.game-top{height:58px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:8px 24px 4px;gap:12px}.game-brand{font-family:Georgia,serif;font-size:20px;color:var(--gold);letter-spacing:2px}.game-brand span{display:block;font:9px Segoe UI,Arial,sans-serif;letter-spacing:1.5px;color:#aebfc2;margin-top:3px}.turn-pill{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}.turn-dot{width:12px;height:12px;flex-shrink:0;border-radius:50%;background:#f3e1b8;border:1px solid #ffeac1}.turn-pill.black .turn-dot{background:#507d9e;border:2px solid #b6d4ea}.turn-pill.thinking{color:#b7cbd0}.icon-btn{height:38px;padding:0 11px;display:flex;gap:7px;align-items:center;font-size:14px;border-radius:6px;background:#22353e;border:1px solid #7c969580}.icon-bars{font-size:16px}.board-wrap{height:508px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.board{position:relative;width:500px;height:500px;flex-shrink:0;border-radius:5px;overflow:hidden;box-shadow:0 3px 0 #090f14,0 6px 0 #56432f;touch-action:none}.board:focus,.board:focus-visible{outline:none}#board-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.board-squares{position:absolute;inset:14px;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr)}.sq{position:relative;touch-action:manipulation}.sq.last:before{content:"";position:absolute;inset:2px;border:2px solid #f5dd8bcc;background:#efce6526;pointer-events:none}.sq.check{background:#e3375555}.sq.check:before{content:"!";position:absolute;right:2px;top:1px;color:#fff;background:#bb2945;border:1px solid #ffc1a2;border-radius:50%;width:16px;height:16px;font:bold 13px Arial;text-align:center;z-index:4}.sq.selected{box-shadow:inset 0 0 0 4px #a5efd2;background:#98f2cb22}.sq.selected:before{content:"";position:absolute;left:4px;top:4px;width:7px;height:7px;border-radius:50%;background:#dbfff0}.sq.cursor:after{content:"";position:absolute;inset:3px;border:3px solid #effffe;outline:1px solid #182c2d;border-radius:3px;z-index:5;pointer-events:none}.board:not(:focus) .sq.cursor:after{border-color:#c9e3dd90}.sq .dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:16px;height:16px;background:#bcffe2;border:2px solid #184f43;box-shadow:0 0 0 2px #eeffedaa;border-radius:50%;pointer-events:none}.sq .dot.capture{width:52px;height:52px;background:transparent;border:3px dashed #ffebb4;box-shadow:0 0 0 2px #5d3126}.captured-col{width:30px;height:492px;display:flex;flex-direction:column;align-items:center;gap:1px;padding:3px 0;overflow:hidden;pointer-events:none}.captured-piece{width:27px;height:28px;display:flex;align-items:center}.captured-piece .piece{width:100%;height:100%}.game-bottom{height:34px;display:flex;justify-content:space-between;align-items:center;padding:2px 28px 8px;font-size:13px;color:#b8c9c8;gap:10px}.last-move{white-space:nowrap;color:var(--gold);font-variant-numeric:tabular-nums}.status-text{text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-text.alert{color:#ffaeb6}.status-text.win{color:var(--mint)}
.modal{position:absolute;inset:0;background:#02080eee;z-index:20;display:flex;align-items:center;justify-content:center}.modal-card{width:366px;padding:24px;display:flex;flex-direction:column;gap:10px;border:1px solid #b0a16f;border-radius:10px;background:linear-gradient(130deg,#263b45,#101e28);box-shadow:0 10px 30px #0008}.modal-kicker{text-align:center;letter-spacing:2px;font-size:10px;color:var(--gold)}.modal-title{font-family:Georgia,serif;text-align:center;font-size:30px;margin:1px 0 10px}.modal-card .menu-btn{padding:10px 16px;min-height:44px;font-size:16px}.promote-row{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.promote-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#344d58;border:1px solid #8faca58c;border-radius:6px;padding:4px 0 10px;font-size:14px}.promote-svg{width:65px;height:72px}.promote-svg .piece{width:100%;height:100%}#promote .modal-card{width:424px}.over-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;padding:70px;gap:22px}.over-result{font-family:Georgia,serif;font-size:52px;text-align:center;color:var(--gold)}.over-detail{font-size:22px;margin-bottom:24px}.how-content{padding:14px 32px;display:flex;flex-direction:column;gap:18px}.how-row{display:flex;align-items:center;gap:22px;border-bottom:1px solid #6e89824d;padding:14px 0;font-size:17px;line-height:1.5}.how-key{width:84px;flex-shrink:0;color:var(--gold);font-size:15px;font-weight:600}.how-tip{display:block;border:none;font-size:14px;color:#b9c9c8;line-height:1.6}.phone-hint{display:none}.piece{object-fit:contain;pointer-events:none}
@media(prefers-reduced-motion:no-preference){button{transition:background-color .15s,filter .15s}}@media(forced-colors:active){button{border:1px solid ButtonText}.sq.cursor:after{border-color:Highlight}.sq.selected{outline:3px solid Highlight}}
body{height:100dvh;min-height:0}
@media(max-width:599px) and (orientation:portrait){
 #app{width:100vw;height:min(600px,100dvh);transform:none}.screen:after{inset:7px}.menu-wrap{padding:24px}.menu-eyebrow{font-size:9px;letter-spacing:1px}.menu-eyebrow span{font-size:8px}.brand{height:240px}.brand-sub{font-size:12px;max-width:160px}.brand-title{font-size:48px;letter-spacing:-1px}.brand-caption{font-size:8px;letter-spacing:1px;max-width:155px;line-height:1.6}.brand-mark{right:-4px;top:40px;transform:scale(.68);transform-origin:right top}.brand-copy{max-width:180px}.menu-btn{font-size:16px;min-height:48px}.menu-hint{font-size:11px;line-height:1.5}.screen-header{padding:22px 22px 10px;height:84px;gap:12px}.screen-header h2{font-size:25px;line-height:1.1}.back-btn{flex-shrink:0}.opt-list{padding:12px 24px 24px;gap:14px}.opt-list-compact{gap:10px}.opt-list-compact .opt-btn{padding:13px 14px}.opt-list-compact .opt-title{font-size:18px}.opt-sub{font-size:13px;line-height:1.4}.opt-elo{font-size:8px;letter-spacing:1px}.opt-title{font-size:21px}#side .opt-btn{padding-left:93px;min-height:108px}#side .side-art{width:78px;height:90px}.game-top{height:64px;padding:10px 12px 4px;gap:8px}.game-brand{font-size:16px;letter-spacing:1px}.game-brand span{font-size:8px;letter-spacing:.7px}.turn-pill{font-size:13px;gap:5px}.turn-dot{width:10px;height:10px}.icon-btn{font-size:14px;height:42px;padding:0 8px;gap:5px}.icon-bars{display:none}#game{justify-content:center}.board-wrap{height:auto;padding:8px 0}.board{width:calc(100vw - 36px);height:calc(100vw - 36px)}.board-squares{inset:2.8%}.captured-col{width:18px;height:calc(100vw - 44px)}.captured-piece{width:18px;height:18px}.sq.cursor:after{border-width:2px;inset:2px}.sq.selected{box-shadow:inset 0 0 0 3px #a5efd2}.sq .dot{width:12px;height:12px;border-width:1px;box-shadow:0 0 0 1px #eeffedaa}.sq .dot.capture{width:88%;height:88%;border-width:2px}.game-bottom{height:49px;padding:7px 18px;font-size:12px;align-items:flex-start}.status-text{white-space:normal;max-width:60%;line-height:1.3}.modal-card{width:calc(100% - 36px);padding:19px;gap:10px}.modal-title{font-size:27px}.modal-card .menu-btn{font-size:16px;min-height:44px}#promote .modal-card{width:calc(100% - 24px);padding:17px 12px}.promote-row{gap:6px}.promote-svg{width:55px;height:65px}.promote-btn{font-size:14px}.modal-kicker{font-size:9px;letter-spacing:1.1px}.over-wrap{padding:30px;gap:16px}.over-result{font-size:40px}.how-content{padding:12px 24px;gap:10px}.how-row{font-size:14px;padding:13px 0;gap:14px}.how-key{width:65px;font-size:13px}.how-tip{font-size:12px}
}