:root{color:#202229;font-synthesis:none;text-rendering:optimizelegibility;background:#f4f5f1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{min-width:320px;min-height:100%;margin:0}body{min-height:100vh}button{font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline-offset:2px;outline:2px solid #1e6e59}.game-header{justify-content:space-between;align-items:center;gap:20px;height:60px;padding:12px 24px;display:flex}.game-brand{align-items:center;gap:12px;min-width:0;display:flex}.game-brand img{border-radius:4px;width:42px;height:42px}.game-brand h1,.game-brand p{margin:0}.game-brand h1{font-size:1rem;line-height:1.2}.game-brand p{color:#6d706b;margin-top:3px;font-size:.76rem}.connection-status{color:#686b66;flex:none;align-items:center;gap:7px;font-size:.78rem;font-weight:700;display:inline-flex}.connection-status:before{content:"";background:#a7aaa4;border-radius:50%;width:8px;height:8px}.connection-status[data-mode=live]:before{background:#1d9a66;box-shadow:0 0 0 4px #d9f0e7}.connection-status[data-mode=error]:before{background:#d3443d;box-shadow:0 0 0 4px #f8dedb}.icon-button-content{justify-content:center;align-items:center;gap:8px;display:inline-flex}.icon-button-content svg{stroke-width:2.4px;width:19px;height:19px}.round-icon-button{width:var(--round-button-size,44px);height:var(--round-button-size,44px);color:inherit;cursor:pointer;transition:background-color var(--round-button-transition-duration,.12s) ease;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.round-icon-button>svg,.round-icon-button>svg.lucide{width:var(--round-button-icon-size,20px);height:var(--round-button-icon-size,20px)}@media (hover:hover) and (pointer:fine){.round-icon-button:hover:not(:disabled){background-color:var(--round-button-hover-background,#2022290a)}.round-icon-button:active:not(:disabled){background-color:var(--round-button-active-background,#20222914)}}@media (prefers-reduced-motion:reduce){.round-icon-button{transition:none}}.game-header{background:0 0;border:0;justify-content:center;align-items:center;height:60px;min-height:60px;padding:0 20px;display:flex}.game-header h1{text-align:center;margin:0;font-size:16px;line-height:1.2}@media (width>=901px){.game-header{display:none}}:root{color:#eeece7;--green:#315448;--muted:#b9b6af;background:#302e2b}html,body{min-width:0;height:100%;min-height:0;overflow:hidden}body.chess-game{color:#eeece7;height:100dvh;min-height:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#302e2b;flex-direction:column;display:flex}.chess-settings-button{--round-button-hover-background:#ffffff14;--round-button-active-background:#ffffff29;z-index:3;top:calc(env(safe-area-inset-top) + 68px);right:calc(env(safe-area-inset-right) + 12px);color:var(--muted);position:fixed}.chess-settings-surface{--settings-padding:24px;color:#202229;width:min(400px,100%);max-height:100%}.chess-settings-heading{height:60px;padding:0 var(--settings-padding);border:0}.chess-settings-close{--round-button-size:34px;--round-button-icon-size:17px;color:#555851}.chess-settings-content{background:#f5f5f5;display:grid}.chess-settings-content .settings-list{background:#fff;margin:16px 0;padding:0;list-style:none}.chess-settings-content .setting-field{min-width:0;min-height:62px;padding:0 var(--settings-padding);cursor:pointer;align-items:center;gap:14px;font-size:.9rem;transition:background-color .12s;display:flex;position:relative}.chess-settings-content .setting-title{flex-shrink:0;font-weight:600}.chess-settings-content .setting-value{color:#777970;text-align:right;text-overflow:ellipsis;white-space:nowrap;min-width:0;margin-left:auto;overflow:hidden}.chess-settings-content .setting-chevron{color:#a9aba3;flex-shrink:0;width:18px;height:18px}.chess-settings-content :is(.setting-title,.setting-value,.setting-chevron){pointer-events:none}.chess-settings-content select{inset:0 var(--settings-padding) 0 auto;width:min(240px, calc(100% - 90px - 2 * var(--settings-padding)));opacity:0;cursor:pointer;height:100%;font:inherit;border:0;outline:0;margin:0;font-size:16px;position:absolute}.chess-settings-content .setting-field:focus-within{background-color:#2022290a}@media (hover:hover) and (pointer:fine){.chess-settings-content .setting-field:hover{background-color:#2022290a}.chess-settings-content .setting-field:active{background-color:#20222914}}.chess-layout{flex:1;grid-template-columns:minmax(0,1fr) 280px;gap:24px;width:min(1080px,100%);min-width:0;min-height:0;margin:0 auto;padding:16px 20px;display:grid}.board-column{--player-height:44px;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;min-height:0;display:grid}.board-status:empty{height:0}.player-card{height:var(--player-height);align-items:center;gap:9px;min-width:0;display:flex}.player-info{flex-shrink:1;min-width:0}.player-info strong{text-overflow:ellipsis;white-space:nowrap;max-width:180px;font-size:12px;display:block;overflow:hidden}.player-detail{color:#b9b6af;margin-top:3px;font-size:10px;display:block}.player-avatar{background:#e5e8de;border:1px solid #d4dacd;border-radius:6px;flex-shrink:0;place-items:center;width:30px;height:30px;display:grid}.player-avatar .piece{width:25px;height:25px}.turn-tag{white-space:nowrap;color:#44623d;visibility:hidden;background:#e0eadb;border-radius:4px;margin-left:auto;padding:4px 7px;font-size:10px}.player-card.is-current .turn-tag{visibility:visible}.player-card.is-current strong{color:#b7d69b}.captured{flex-wrap:wrap;align-items:center;gap:0;min-width:0;max-width:180px;max-height:32px;display:flex;overflow:hidden}.captured .piece{width:18px;height:20px;margin-left:-4px}.board-stage{place-items:center;min-width:0;min-height:0;display:grid;container-type:size}.board-stack{width:min(100cqw, calc(100cqh - var(--player-height) - var(--player-height)));min-width:0}.board-frame{aspect-ratio:1;background:#e8ac73;border-radius:5px;grid-template-rows:clamp(16px,3cqw,24px) minmax(0,1fr) clamp(16px,3cqw,24px);grid-template-columns:clamp(16px,3cqw,24px) minmax(0,1fr) clamp(16px,3cqw,24px);width:100%;display:grid;box-shadow:0 8px 18px -12px #25372c66}.chess-board{grid-area:2/2;grid-template-rows:repeat(8,minmax(0,1fr));grid-template-columns:repeat(8,minmax(0,1fr));width:100%;height:100%;display:grid}.square{touch-action:manipulation;background:#ffcd9e;border:none;border-radius:0;place-items:center;min-width:0;min-height:0;padding:0;display:grid;position:relative}.square.dark{background:#d08b47}.square:disabled{opacity:1}.square.is-last{background:#d9df99}.square.dark.is-last{background:#a3b46e}.square.is-selected{background:#c6d775;box-shadow:inset 0 0 0 3px #315448}.piece{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.square .piece{z-index:1;filter:drop-shadow(0 2px 1px #20302333);width:82%;height:82%;transform:rotate(var(--piece-rotation,0deg));transition:transform .13s;position:relative}.square.is-upside-down{--piece-rotation:180deg}.square.is-moving{z-index:3}.square.is-moving .piece{will-change:transform;transition:none}@media (hover:hover){.square:hover:not(:disabled) .piece{transform:translateY(-2px) rotate(var(--piece-rotation,0deg))}}.square.is-target:after{content:"";background:#264d4270;border-radius:50%;width:22%;height:22%;position:absolute}.square.is-capture:after{background:0 0;border:3px solid #30534780;width:90%;height:90%}.square.is-check{background:#d89a7c}.square:focus-visible{outline-offset:-3px;z-index:2;outline:3px solid #e7b54e}.board-ranks,.board-files{color:#6e4624;pointer-events:none;font-size:clamp(10px,2cqw,12px);font-weight:700;display:grid}.board-ranks{grid-area:2/1;grid-template-rows:repeat(8,minmax(0,1fr))}.board-files{grid-area:3/2;grid-template-columns:repeat(8,minmax(0,1fr))}.board-ranks span,.board-files span{place-items:center;display:grid}.board-toolbar{justify-content:center;align-items:center;gap:6px;min-height:48px;padding-top:4px;display:flex}.board-toolbar .toolbar-button{color:#b9b6af}.board-toolbar .toolbar-button:hover:not(:disabled){background:#ffffff14}.chess-layout .rules-link{color:#b9b6af}.toolbar-button,.text-button{color:#5c7360;white-space:nowrap;background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;gap:6px;min-height:44px;padding:8px 12px;font-size:12px;display:inline-flex}.toolbar-button:hover:not(:disabled),.text-button:hover{background:#e3e9dc}.details-button{display:none}.attention-dot{background:#ad663f;border-radius:50%;width:6px;height:6px}svg.lucide{flex-shrink:0;width:16px;height:16px}.match-panel{overscroll-behavior:contain;flex-direction:column;gap:14px;min-width:0;min-height:0;display:flex;overflow-y:auto}.players-strip:empty{display:none}.status-panel{color:#273d34;background:#fcfcf6;border:1px solid #dbe1d3;border-radius:8px;flex-shrink:0;padding:18px}.eyebrow{letter-spacing:1px;color:#6b846e;margin:0 0 8px;font-size:10px;font-weight:800}.status-panel h2{letter-spacing:-.5px;margin:0 0 8px;font-size:22px}.status-panel>p:last-of-type{color:#7a837a;margin:0;font-size:12px;line-height:1.6}.notice{color:#a65734;margin-top:8px;font-size:12px;line-height:1.4}.history-panel{color:#273d34;background:#fcfcf6;border:1px solid #dbe1d3;border-radius:8px;flex-direction:column;flex:1;min-height:100px;display:flex;overflow:hidden}.panel-heading{flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.panel-heading h3{margin:0;font-size:13px}.panel-heading>span{color:#879280;font-size:11px}.history-columns,.history-row{grid-template-columns:38px 1fr 1fr;gap:6px;padding:8px 16px;font-size:12px;display:grid}.history-columns{color:#8a9384;background:#f1f3e9;flex-shrink:0;font-size:10px}.history-row:nth-child(2n){background:#f6f7ef}.history-row>span:first-child{color:#9ba18f}.history-row>span:not(:first-child){font-variant-numeric:tabular-nums}.history-list{overscroll-behavior:contain;flex:1;min-height:0;overflow-y:auto}.history-empty{text-align:center;color:#9ba18f;margin:0;padding:36px 10px;font-size:11px}.actions{flex-shrink:0;gap:8px;display:grid}.action-row{gap:8px;display:flex}.action-row>button{flex:1}.secondary-action,.primary-action{white-space:nowrap;border-radius:5px;justify-content:center;align-items:center;gap:6px;min-height:44px;padding:9px 12px;font-size:12px;font-weight:600;display:flex}.secondary-action{color:#5b6b59;background:#f8f9f1;border:1px solid #d1d9c9}.primary-action{color:#f3f4e8;background:#315448;border:1px solid #315448}.secondary-action:hover:not(:disabled){background:#e6ecdf}.primary-action:hover:not(:disabled){background:#264338}button:disabled:not(.square){opacity:.45}.draw-response{color:#273d34;background:#eaf0e2;border:1px solid #c6d4ba;border-radius:6px;grid-template-columns:1fr 1fr;gap:8px;padding:12px;display:grid}.draw-response p{grid-column:1/-1;margin:0 0 4px;font-size:12px}.rules-link{color:#6d8068;flex-shrink:0;align-items:center;gap:7px;min-height:44px;padding:8px 2px;font-size:11px;text-decoration:none;display:flex}.rules-link>svg:last-child{width:13px;margin-left:auto}dialog:where(:not(.overlay-dialog)){color:#273d34;width:min(400px,100% - 24px);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);overscroll-behavior:contain;background:#fafbf3;border:1px solid #c4d0bb;border-radius:12px;padding:24px;overflow-y:auto;box-shadow:0 20px 90px #142e3255}dialog:where(:not(.overlay-dialog))::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#132b2599}dialog:where(:not(.overlay-dialog)) h2{margin:0 0 12px;font-size:22px}dialog:where(:not(.overlay-dialog)) p{color:#7a837a;font-size:12px}.promotion-options{grid-template-columns:repeat(4,1fr);gap:8px;margin:20px 0;display:grid}.promotion-options button{color:#315448;background:#eaf0e2;border:1px solid #cbd6c2;border-radius:6px;padding:10px 3px;font-size:12px}.promotion-options .piece{width:45px;margin:0 auto 8px;display:block}.details-dialog{width:min(480px,100% - 24px);height:min(600px, calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px));padding:0;overflow:hidden}.details-dialog[open]{flex-direction:column;display:flex}.details-heading{border-bottom:1px solid #dbe1d3;flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 12px 8px 20px;display:flex}.details-heading h2{margin:0;font-size:16px}.details-heading .toolbar-button{width:44px;padding:0}.details-content{flex:1;min-height:0;padding:16px}.details-content>.match-panel{height:100%}@media (width<=900px) and (height>=481px),(width<=559px){.chess-layout{grid-template-columns:minmax(0,1fr);gap:0;max-width:760px;padding:8px 12px 4px}.board-status .status-panel{color:#eeece7;background:0 0;border:0;border-radius:0;padding:8px 2px 10px}.board-status .eyebrow{display:none}.board-status h2{margin-bottom:3px;font-size:16px}.board-status .status-panel>p:last-of-type{color:#b9b6af;font-size:11px;line-height:1.4}.board-status .notice{color:#efa882;margin-top:3px;font-size:11px}.board-column{--player-height:40px}.player-info strong,.captured{max-width:140px}.captured .piece{width:16px;height:18px}.board-toolbar{justify-content:space-evenly}.toolbar-button,.board-toolbar .primary-action{padding:8px;font-size:11px}.details-button{display:inline-flex}}@media (height<=560px){.chess-layout{gap:16px;padding-block:4px}.board-column{--player-height:32px}.player-detail{display:none}.player-avatar{width:26px;height:26px}.player-avatar .piece{width:22px;height:22px}.match-panel{gap:6px}.status-panel{padding:10px 12px}.status-panel h2{margin-bottom:4px;font-size:18px}.status-panel .eyebrow{margin-bottom:4px}.panel-heading{padding-block:8px}.history-empty{padding-block:12px}.rules-link{min-height:36px;padding-block:4px}.board-status .status-panel{padding-block:2px 4px}.board-status .status-panel h2{font-size:14px}.board-status .status-panel>p:last-of-type{font-size:10px}.draw-response{gap:4px;padding:6px}.draw-response p{margin:0}.details-heading{padding-block:2px}.details-content{padding:10px}}@media (width>=901px){.chess-settings-button{top:calc(env(safe-area-inset-top) + 8px)}}@media (prefers-reduced-motion:reduce){.square .piece{transition:none}}@media (width>=560px) and (height<=480px){.chess-layout{grid-template-columns:minmax(0,1fr) 220px;gap:12px;padding-inline:12px}.board-column{--player-height:0px}.players-strip{flex-shrink:0;gap:8px;display:flex}.players-strip .player-card{flex:1;gap:4px;min-width:0;height:32px}.players-strip .player-info strong{max-width:65px;font-size:11px}.players-strip .captured,.players-strip .turn-tag{display:none}.players-strip .is-current .player-avatar{background:#dae8d1;border-color:#6f9667}.match-panel .status-panel .eyebrow,.match-panel .status-panel>p:last-of-type{display:none}.match-panel .status-panel h2{margin:0}.match-panel .history-panel{min-height:70px}}
