@import "https://fonts.googleapis.com/css2?family=League+Spartan:wght@400;500;600;700;800&display=swap";@font-face{font-family:open-arrow;src:url(/assets/OpenArrow-Regular-BqgIXewj.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+2190-21FF}:root{--font-family:"League Spartan", sans-serif;--font-weight-bold:600;--background:#302e2b;--primary:#262522;--secondary:#211f1d;--accent:#3d3935;--surface:#383531;--surface-muted:#373531;--surface-raised:#45413c;--text:#ffffffeb;--hidden-text:#ffffff94;--text-secondary:var(--hidden-text);--border-soft:#ffffff14;--shadow-soft:0 1.2vh 3vh #00000052;--shadow-bottom-size:.28vh;--shadow-bottom:inset 0 calc(-1 * var(--shadow-bottom-size)) 0 #0000002e;--radius-sm:.65vh;--radius-md:1vh;--radius-lg:1.45vh;--blue:#3a7cd5;--green:#81b64c;--green-dark:#6a9941;--yellow:#f0b65a;--red:#c94f4f;--green-yellow:color-mix(in lch, var(--green), var(--yellow));--yellow-red:color-mix(in lch, var(--yellow), var(--red));--sidebar-margin:2.5vh}*{box-sizing:border-box;color:var(--text);margin:0;padding:0}img,svg{-webkit-user-drag:none;-webkit-user-select:none;user-select:none}::placeholder{color:var(--hidden-text)}body{min-height:100vh;font-family:var(--font-family);background:var(--background)}.screen{z-index:1;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.hidden{display:none!important}input,button,select,textarea{width:100%;font:inherit;display:block}.open-arrow{font-family:"open-arrow", var(--font-family);font-weight:400}#menu-error,#lobby-error{font-weight:var(--font-weight-bold);text-align:center;border-radius:6px;margin-top:15px;padding:10px}#menu-error:empty,#lobby-error:empty{display:none}.hide-scrollbar::-webkit-scrollbar{display:none}.hide-scrollbar{-ms-overflow-style:none;overscroll-behavior:none;scrollbar-width:none}input:not([type=checkbox]),select,textarea{border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-bottom);border:none;outline:none;padding:12px 15px;transition:background .12s,box-shadow .12s;display:flex}input:not([type=checkbox]):focus,textarea:focus{background:var(--surface);box-shadow:var(--shadow-bottom);outline:none}:where(button:not(.button-flat),.button-3d){--button-color:var(--surface-raised);--button-edge:color-mix(in srgb, var(--button-color), black 18%);background:var(--button-color);box-shadow:0 var(--shadow-bottom-size) 0 var(--button-edge);transition:filter .12s,transform .12s,background .12s,box-shadow .12s}:where(button,.button-3d){cursor:pointer;border-radius:var(--radius-md);border:none}:is(button,.button-3d){font-weight:var(--font-weight-bold)}button{padding:12px 20px;font-size:15px}button:disabled{cursor:not-allowed;opacity:.65}strong,b{font-weight:var(--font-weight-bold)}:is(button:not(.button-flat),.button-3d):hover:not(:disabled){filter:brightness(1.06)}:is(button:not(.button-flat),.button-3d):active:not(:disabled){box-shadow:none;transform:translateY(var(--shadow-bottom-size))}#menu{background:var(--background)}#menu:before{content:"";z-index:0;pointer-events:none;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0}#menu:after{content:"";z-index:5;pointer-events:none;background:#0000004d;position:absolute;inset:0}#menu-boardscape{--gallery-lanes:3;--gallery-column-gap:2vw;--gallery-gap:4vh;--square-size:calc((100vw - 2vw - (var(--gallery-column-gap) * 2)) / 24);z-index:1;grid-template-columns:repeat(var(--gallery-lanes), minmax(0, 1fr));gap:var(--gallery-column-gap);pointer-events:none;padding:0 1vw;display:grid;position:absolute;inset:0;overflow:hidden}.menu-gallery-definitions,.menu-piece-probe{width:0;height:0;position:absolute;overflow:hidden}.menu-gallery-lane{min-width:0;height:100%;overflow:hidden}.menu-gallery-strip{will-change:transform;flex-direction:column;width:100%;display:flex}.menu-gallery-lane.moves-up .menu-gallery-strip{animation:60s linear infinite menu-gallery-up}.menu-gallery-lane.moves-down .menu-gallery-strip{animation:60s linear infinite menu-gallery-down}.menu-gallery-sequence{align-items:center;gap:var(--gallery-gap);padding:calc(var(--gallery-gap) / 2) 0;flex-direction:column;flex:none;display:flex}.menu-gallery-board{width:calc(var(--square-size) * 8);height:calc(var(--square-size) * 8);flex:none;display:block}@keyframes menu-gallery-up{0%{transform:translateY(0)}to{transform:translateY(-50%)}}@keyframes menu-gallery-down{0%{transform:translateY(-50%)}to{transform:translateY(0)}}#menu{justify-content:center;align-items:center;width:100%;min-height:100vh;padding:24px;display:flex;position:relative;overflow:hidden}#menu-stack{z-index:10;width:min(380px,100vw - 42px);position:relative}#menu-stack:has(#menu-shell.help-mode){width:min(440px,100vw - 42px)}#menu-stack:has(#menu-shell.stats-mode){width:min(460px,100vw - 42px)}#menu-stack:has(#menu-shell.settings-mode){width:min(420px,100vw - 42px)}#menu-shell{--menu-control-gap:14px;--menu-control-height:54px;--menu-compact-button-height:42px;z-index:1;border-radius:var(--radius-lg);background:var(--primary);width:100%;position:relative;overflow:hidden}#menu-shell.join-mode,#menu-shell.name-mode,#menu-shell.help-mode,#menu-shell.stats-mode{width:100%}#menu-shell.settings-mode{width:100%;overflow:visible}#menu-header{border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--accent);border-bottom:.16vh solid #00000061;align-items:center;gap:10px;padding:8px 18px;display:flex}#logo{width:22px;height:22px}#menu-header strong{color:var(--text);font-size:18px}#menu-container{border-radius:0 0 var(--radius-lg) var(--radius-lg);background:var(--primary);padding:22px}#section{align-items:stretch;gap:var(--menu-control-gap);flex-direction:column;justify-content:flex-start;display:flex}.menu-view{width:100%}#player-panel{gap:var(--menu-control-gap);grid-template-columns:1fr;margin-bottom:0;display:grid}#player-panel span{color:var(--text);font-size:16px;font-weight:var(--font-weight-bold)}#player-name-input{height:var(--menu-control-height);background:var(--surface);color:var(--text);padding:0 14px;font-size:20px}#join-section,#name-section{padding:0}#join-view-topbar{grid-template-columns:42px;align-items:center;margin-bottom:16px;display:grid}.menu-view-topbar{grid-template-columns:42px minmax(0,1fr);align-items:center;gap:12px;margin-bottom:16px;display:grid}#back-to-menu-btn,#back-from-name-btn,#back-from-help-btn,#back-from-stats-btn,#back-from-settings-btn{width:42px;height:42px;color:var(--text);text-align:center;padding:0;font-size:0;line-height:1;position:relative}#back-to-menu-btn:before,#back-from-name-btn:before,#back-from-help-btn:before,#back-from-stats-btn:before,#back-from-settings-btn:before{content:"";background:currentColor;width:19px;height:19px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20288%20288'%3e%3cpath%20d='M57.5-96%20118.25-34.375c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625C116.332-17.043%20113.832-16%20110.75-16s-5.582-1.043-7.5-3.125l-78.875-80c-2.082-2.082-3.125-4.625-3.125-7.625s1.043-5.543%203.125-7.625l78.875-80c1.918-2.082%204.418-3.125%207.5-3.125s5.582%201.043%207.5%203.125c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625L57.5-117.5l166.5.125c2.918%200%205.418%201.043%207.5%203.125s3.125%204.625%203.125%207.625c0%202.918-1.043%205.418-3.125%207.5S226.918-96%20224-96Z'%20transform='translate(16%20251)'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20288%20288'%3e%3cpath%20d='M57.5-96%20118.25-34.375c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625C116.332-17.043%20113.832-16%20110.75-16s-5.582-1.043-7.5-3.125l-78.875-80c-2.082-2.082-3.125-4.625-3.125-7.625s1.043-5.543%203.125-7.625l78.875-80c1.918-2.082%204.418-3.125%207.5-3.125s5.582%201.043%207.5%203.125c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625L57.5-117.5l166.5.125c2.918%200%205.418%201.043%207.5%203.125s3.125%204.625%203.125%207.625c0%202.918-1.043%205.418-3.125%207.5S226.918-96%20224-96Z'%20transform='translate(16%20251)'/%3e%3c/svg%3e") 50%/contain no-repeat}.menu-settings-form{flex-direction:column;gap:12px;display:flex}.menu-settings-form .settings-field{grid-template-columns:1fr 160px}.menu-settings-form .settings-field input,.menu-settings-form .settings-field select,.menu-settings-form .settings-picker-button{height:38px;font-size:15px}.menu-settings-form .settings-range-field input[type=range]{accent-color:var(--blue);padding:0}.menu-settings-form .settings-picker-menu{width:max(100%,190px);max-height:260px}.menu-settings-form .settings-toggle-grid{gap:8px}.menu-settings-form .settings-toggle{box-shadow:none;padding:9px;font-size:13px}#join-form,#name-form{align-items:stretch;gap:var(--menu-control-gap);flex-direction:column;display:flex}.join-field{gap:6px;display:grid}.join-field span{color:var(--text);font-weight:var(--font-weight-bold);font-size:16px}.join-field input{height:var(--menu-control-height);background:var(--surface);color:var(--text);padding:0 14px;font-size:20px}#join-room-code-input{text-transform:uppercase}#submit-join-btn,#submit-action-name-btn{width:100%;height:var(--menu-control-height);font-size:22px}.game-action-btn{--button-color:var(--green);height:var(--menu-control-height);font-size:22px}#join-game-btn,.secondary-action{--button-color:var(--red)}.form-group{gap:var(--menu-control-gap);grid-template-columns:repeat(4,1fr);display:grid}.util-btns{height:var(--menu-compact-button-height);--button-color:var(--surface);justify-content:center;align-items:center;padding:0;text-decoration:none;display:flex}.util-btns svg,.util-btns:before{width:22px;height:22px;color:var(--hidden-text)}.util-btns svg path{fill:var(--hidden-text)}#setting-btn:before,#info-btn:before,#stats-btn:before{content:"";background:var(--hidden-text);display:block}#setting-btn:before{-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19.4%2013.5c.1-.5.1-1%20.1-1.5s0-1-.1-1.5l2-1.5-2-3.5-2.4%201a7.8%207.8%200%200%200-2.6-1.5L14%202.4h-4l-.4%202.6A7.8%207.8%200%200%200%207%206.5l-2.4-1-2%203.5%202%201.5c-.1.5-.1%201-.1%201.5s0%201%20.1%201.5l-2%201.5%202%203.5%202.4-1a7.8%207.8%200%200%200%202.6%201.5l.4%202.6h4l.4-2.6a7.8%207.8%200%200%200%202.6-1.5l2.4%201%202-3.5-2-1.5ZM12%2015.5a3.5%203.5%200%201%201%200-7%203.5%203.5%200%200%201%200%207Z'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19.4%2013.5c.1-.5.1-1%20.1-1.5s0-1-.1-1.5l2-1.5-2-3.5-2.4%201a7.8%207.8%200%200%200-2.6-1.5L14%202.4h-4l-.4%202.6A7.8%207.8%200%200%200%207%206.5l-2.4-1-2%203.5%202%201.5c-.1.5-.1%201-.1%201.5s0%201%20.1%201.5l-2%201.5%202%203.5%202.4-1a7.8%207.8%200%200%200%202.6%201.5l.4%202.6h4l.4-2.6a7.8%207.8%200%200%200%202.6-1.5l2.4%201%202-3.5-2-1.5ZM12%2015.5a3.5%203.5%200%201%201%200-7%203.5%203.5%200%200%201%200%207Z'/%3e%3c/svg%3e") 50%/contain no-repeat}#info-btn:before{-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M11%2018h2v-7h-2v7Zm1-16a10%2010%200%201%200%200%2020%2010%2010%200%200%200%200-20Zm0%2018a8%208%200%201%201%200-16%208%208%200%200%201%200%2016Zm-1-11h2V6h-2v3Z'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M11%2018h2v-7h-2v7Zm1-16a10%2010%200%201%200%200%2020%2010%2010%200%200%200%200-20Zm0%2018a8%208%200%201%201%200-16%208%208%200%200%201%200%2016Zm-1-11h2V6h-2v3Z'/%3e%3c/svg%3e") 50%/contain no-repeat}#stats-btn:before{-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M5%2019h14v2H3V3h2v16Zm2-2V9h3v8H7Zm5%200V5h3v12h-3Zm5%200v-6h3v6h-3Z'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M5%2019h14v2H3V3h2v16Zm2-2V9h3v8H7Zm5%200V5h3v12h-3Zm5%200v-6h3v6h-3Z'/%3e%3c/svg%3e") 50%/contain no-repeat}#stats-content{gap:16px;display:grid}.stats-hero{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.stats-hero div{border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-bottom);gap:4px;padding:14px;display:grid}.stats-hero strong{color:var(--text);font-size:24px;line-height:1}.stats-hero span{color:var(--hidden-text);font-size:14px;line-height:1.2}#help-content{gap:16px;display:grid}.help-block{gap:8px;display:grid}.help-block h2,.help-block h3{color:var(--text);line-height:1.15}.help-block h2{font-size:24px}.help-block h3{font-size:17px}.help-block p,.help-block li{color:var(--hidden-text);font-size:15px;line-height:1.45}.help-block ol,.help-block ul{gap:6px;padding-left:20px;display:grid}#github-link{min-height:46px;color:var(--text);justify-content:center;align-items:center;padding:12px 16px;text-decoration:none;display:flex}#menu-error{z-index:2;border:1px solid #c94f4f6b;border-left:4px solid var(--red);border-radius:var(--radius-md);background:var(--surface-raised);box-shadow:var(--shadow-bottom), 0 12px 28px #0000003d;color:var(--text);font-weight:var(--font-weight-bold);text-align:left;pointer-events:none;opacity:0;margin-top:0;padding:12px 14px;font-size:15px;line-height:1.25;transition:opacity .18s,transform .18s;position:absolute;bottom:calc(100% + 12px);left:0;right:0;transform:translateY(-4px)}#menu-error.visible{opacity:1;transform:translateY(0)}#menu-error.fading{opacity:0;transform:translateY(4px)}#menu-error:empty{display:none}#game{background:var(--background);flex-direction:row;justify-content:flex-start;align-items:center;width:100vw;max-width:none;height:100vh;padding:0;display:flex}#game-area-wrapper{flex-direction:column;flex:1;width:100%;height:100%;display:flex;position:relative;overflow:hidden}#game-area{--square-size:8.85vh;--board-size:calc(var(--square-size) * 8);--plaque-height-board-ratio:.05;justify-content:flex-start;align-items:center;gap:calc(var(--square-size) * .235);padding:calc(var(--square-size) * .235);background-color:var(--background);background-image:none;flex:1;width:100%;height:100%;margin:auto;display:flex;position:relative;overflow-x:auto}#game-area.grid-mode{place-content:center;display:grid;overflow:hidden auto}#game-area.grid-mode.dual-board-ui{align-items:center}#game-area.grid-mode .match-container{margin-block:var(--plaque-height);min-width:unset;min-height:unset}.match-container{--plaque-height:calc(var(--board-size) * var(--plaque-height-board-ratio));filter:drop-shadow(var(--shadow-soft));border-radius:var(--radius-lg);background:var(--primary);min-width:calc(var(--square-size) * 8);min-height:calc(var(--square-size) * 10);flex-direction:column;display:flex;overflow:visible}.pocket-row{background:var(--surface);align-items:stretch;width:100%;display:flex;position:relative}.pocket-area{flex:1;min-width:0;display:flex;position:relative}.pocket-row:first-child{border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:inset 0 -.12vh 0 var(--border-soft)}.pocket-row:last-child{border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:inset 0 .12vh 0 var(--border-soft)}.pocket-row:first-child .pocket,.pocket-row:first-child .pocket-area{border-radius:var(--radius-lg) 0 0 0}.pocket-row:first-child .player-info{border-radius:0 var(--radius-lg) 0 0}.pocket-row:last-child .pocket,.pocket-row:last-child .pocket-area{border-radius:0 0 0 var(--radius-lg)}.pocket-row:last-child .player-info{border-radius:0 0 var(--radius-lg) 0}.pocket{align-items:center;gap:calc(var(--square-size) * .059);background:var(--surface);padding:calc(var(--square-size) * .0295);width:auto;min-height:var(--square-size);flex-wrap:wrap;flex:1;display:flex}.pocket-row-bottom .pocket{justify-content:flex-start}.pocket-row-top .pocket{justify-content:flex-end}.pocket-piece{width:calc(var(--square-size) * .941);height:calc(var(--square-size) * .941);justify-content:center;align-items:center;display:flex;position:relative}.pocket-piece .piece{width:calc(var(--square-size) * .941);height:calc(var(--square-size) * .941)}.pocket-piece.highlight{border-radius:var(--radius-sm);box-shadow:var(--shadow-bottom);background-color:#f5c54ad1}.pocket-count{top:0;right:calc(var(--square-size) * .029);background:var(--red);padding:calc(var(--square-size) * .015) calc(var(--square-size) * .059);font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .147);box-shadow:var(--shadow-bottom);border-radius:999px;position:absolute}.player-name-plaque{z-index:2;border-radius:var(--radius-sm);background:var(--secondary);padding:calc(var(--square-size) * .075) calc(var(--square-size) * .28);min-width:calc(var(--square-size) * 2.65);height:var(--plaque-height);max-width:calc(100% - (var(--square-size) * .32));font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .28);justify-content:center;align-items:center;gap:calc(var(--square-size) * .1);text-align:center;white-space:nowrap;pointer-events:none;line-height:1;display:flex;position:absolute;left:50%;overflow:hidden}.player-plaque-name{text-overflow:ellipsis;min-width:0;overflow:hidden}.player-plaque-badges{align-items:center;gap:calc(var(--square-size) * .06);flex:none;display:inline-flex}.player-plaque-badge{width:calc(var(--square-size) * .24);height:calc(var(--square-size) * .24);flex:none;display:block}.player-plaque-crown{object-fit:contain}.player-plaque-disconnected{background:var(--yellow);-webkit-mask:var(--player-plaque-disconnected-icon) center / contain no-repeat;-webkit-mask:var(--player-plaque-disconnected-icon) center / contain no-repeat;mask:var(--player-plaque-disconnected-icon) center / contain no-repeat}.player-name-plaque[hidden]{display:none}.pocket-row-top .player-name-plaque{border-radius:var(--radius-sm) var(--radius-sm) 0 0;top:0;transform:translate(-50%,-100%)}.pocket-row-bottom .player-name-plaque{border-radius:0 0 var(--radius-sm) var(--radius-sm);bottom:0;transform:translate(-50%,100%)}.board{--board-light:#e9d7b4;--board-dark:#b18967;--board-image:none;grid-template-rows:repeat(8, var(--square-size));grid-template-columns:repeat(8, var(--square-size));display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 .18vh #0000002e}.arrow-annotations{z-index:3;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.annotation-arrow{fill:#ffaa00c7}.square{width:var(--square-size);height:var(--square-size);justify-content:center;align-items:center;display:flex;position:relative}.square.light{background:var(--board-light)}.square.dark{background:var(--board-dark)}.board.board-image-theme .square{background-image:var(--board-image);background-size:800% 800%;background-position:calc(var(--board-file) * -100%) calc(var(--board-rank) * -100%)}.square.highlight:before,.square.premoved:before{content:"";pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.square.highlight:before{background:#f5c54a94}.square.last-move:before{content:"";pointer-events:none;z-index:1;background:#f5c54a61;width:100%;height:100%;position:absolute;top:0;left:0}.square.premoved:before{background:#c94f4f8a}.square:after{opacity:0;pointer-events:none;content:"";background-color:#1c1a172e;border-radius:50%;width:33%;height:33%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.square.legal-move:after{opacity:1}.square.legal-move:hover:after{width:40%;height:40%}.square.legal-move.has-piece:after{border:calc(var(--square-size) * .06) solid #1c1a172e;background-color:#0000;width:90%;height:90%}.square.legal-move.has-piece:hover:after{width:95%;height:95%}.rank-label{top:calc(var(--square-size) * .05);left:calc(var(--square-size) * .05);pointer-events:none;font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .2);-webkit-user-select:none;user-select:none;position:absolute}.file-label{right:calc(var(--square-size) * .05);bottom:calc(var(--square-size) * .05);pointer-events:none;font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .2);-webkit-user-select:none;user-select:none;position:absolute}.square.light .rank-label,.square.light .file-label{color:#b18967}.square.dark .rank-label,.square.dark .file-label{color:#e9d7b4}.square .piece,.pocket-piece .piece{z-index:2;width:calc(var(--square-size) * .941);height:calc(var(--square-size) * .941);pointer-events:auto;-webkit-user-select:none;user-select:none;filter:none;background-position:50%;background-repeat:no-repeat;background-size:contain;transition:none;position:relative}.piece.animating,.pocket-piece .piece.animating{z-index:5;pointer-events:none;transition:transform var(--piece-move-duration,.3s) cubic-bezier(.2, 0, 0, 1);will-change:transform}.dragged-piece{opacity:1;z-index:9999;cursor:grabbing;pointer-events:none;-webkit-user-select:none;user-select:none;background-position:50%;background-repeat:no-repeat;background-size:contain;position:fixed}.player-info{box-sizing:border-box;justify-content:center;gap:calc(var(--square-size) * .04);padding:calc(var(--square-size) * .1);width:calc(var(--square-size) * 2);height:var(--square-size);background:0 0;flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.player-time-difference{height:calc(var(--square-size) * .2);color:var(--text-secondary);font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .15);text-overflow:ellipsis;white-space:nowrap;background:0 0;justify-content:center;align-items:center;display:flex;overflow:hidden}.player-time-display{border-radius:var(--radius-sm);padding:0 calc(var(--square-size) * .14);height:calc(var(--square-size) * .56);font-weight:var(--font-weight-bold);font-size:calc(var(--square-size) * .32);box-shadow:var(--shadow-bottom);justify-content:center;align-items:center;line-height:1;display:flex}.player-time-display.white-clock{color:#62605e;background:#979695}.player-time-display.black-clock{color:#82807f;background:#2b2926}.player-time-display.white-clock.active-clock{color:#302e2b;background:#fff}.player-time-display.black-clock.active-clock{color:#fff;background:#262421}.clock-value{color:currentColor;font-variant-numeric:tabular-nums}.player-info.own-player-seat{cursor:pointer}.player-info.own-player-seat:hover,.player-info.own-player-seat:focus-visible{background:var(--surface-raised);outline:none}#game-sidebar{--sidebar-section-gap:1.5vh;--sidebar-margin:var(--sidebar-section-gap);z-index:10;background:var(--secondary);flex-direction:column;width:calc(32vh + 2px);height:100vh;padding:0;display:flex;box-shadow:.9vh 0 2.4vh #00000038}#sidebar-header{border-bottom:.16vh solid var(--primary);background:var(--secondary);padding:1.63vh var(--sidebar-margin);grid-template-columns:3.75vh minmax(0,1fr) 3.75vh;align-items:center;gap:1.25vh;display:grid}#game-title{text-align:center;min-width:0;margin-bottom:0}#game-room-code{width:100%;box-shadow:none;color:var(--text);font-weight:var(--font-weight-bold);text-overflow:ellipsis;background:0 0;padding:.25vh .5vh;font-size:2.5vh;line-height:1;overflow:hidden}#leave-game-btn{--button-color:var(--red);width:3.75vh;height:3.75vh;color:var(--text);justify-content:center;align-items:center;padding:0;font-size:0;line-height:1;display:flex;position:relative}#leave-game-btn:before{content:"";background:currentColor;width:1.9vh;height:1.9vh;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20288%20288'%3e%3cpath%20d='M57.5-96%20118.25-34.375c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625C116.332-17.043%20113.832-16%20110.75-16s-5.582-1.043-7.5-3.125l-78.875-80c-2.082-2.082-3.125-4.625-3.125-7.625s1.043-5.543%203.125-7.625l78.875-80c1.918-2.082%204.418-3.125%207.5-3.125s5.582%201.043%207.5%203.125c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625L57.5-117.5l166.5.125c2.918%200%205.418%201.043%207.5%203.125s3.125%204.625%203.125%207.625c0%202.918-1.043%205.418-3.125%207.5S226.918-96%20224-96Z'%20transform='translate(16%20251)'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20288%20288'%3e%3cpath%20d='M57.5-96%20118.25-34.375c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625C116.332-17.043%20113.832-16%20110.75-16s-5.582-1.043-7.5-3.125l-78.875-80c-2.082-2.082-3.125-4.625-3.125-7.625s1.043-5.543%203.125-7.625l78.875-80c1.918-2.082%204.418-3.125%207.5-3.125s5.582%201.043%207.5%203.125c2.082%202.082%203.125%204.625%203.125%207.625s-1.043%205.543-3.125%207.625L57.5-117.5l166.5.125c2.918%200%205.418%201.043%207.5%203.125s3.125%204.625%203.125%207.625c0%202.918-1.043%205.418-3.125%207.5S226.918-96%20224-96Z'%20transform='translate(16%20251)'/%3e%3c/svg%3e") 50%/contain no-repeat}.ping-indicator{vertical-align:middle;flex-direction:column;justify-self:end;align-items:center;gap:.25vh;width:3.75vh;display:inline-flex}.ping-bars{align-items:baseline;gap:.125vh;display:flex}.ping-bar{opacity:.3;background-color:var(--surface);border-radius:999px;width:.5vh}.ping-bar:first-child{height:.625vh}.ping-bar:nth-child(2){height:1.125vh}.ping-bar:nth-child(3){height:1.625vh}.ping-bar:nth-child(4){height:2.125vh}.ping-text{text-align:center;font-size:1.4vh}#sidebar-tabs{--sidebar-tab-padding:.5vh;--sidebar-tab-gap:.5vh;--sidebar-pill-x:0;gap:var(--sidebar-tab-gap);margin:var(--sidebar-section-gap) var(--sidebar-margin) 0;border-radius:var(--radius-md);background:var(--primary);padding:var(--sidebar-tab-padding);grid-template-columns:1fr 1fr;display:grid;position:relative}#sidebar-tabs:before{content:"";top:var(--sidebar-tab-padding);left:var(--sidebar-tab-padding);border-radius:var(--radius-sm);background:var(--surface-muted);width:calc((100% - (var(--sidebar-tab-padding) * 2) - var(--sidebar-tab-gap)) / 2);height:calc(100% - (var(--sidebar-tab-padding) * 2));box-shadow:var(--shadow-bottom);transform:translateX(var(--sidebar-pill-x));transition:transform .18s,box-shadow .12s;position:absolute}#sidebar-tabs.settings-active:before{--sidebar-pill-x:calc(100% + var(--sidebar-tab-gap))}.sidebar-tab{z-index:1;border-radius:var(--radius-sm);box-shadow:none;color:var(--hidden-text);background:0 0;padding:.75vh 0;font-size:1.7vh;transition:color .18s;position:relative}.sidebar-tab.active{color:inherit}.sidebar-tab-panel{flex-shrink:0;min-height:0}#settings-tab-panel{flex-shrink:0;overflow:hidden}#settings-tab-panel.more-settings-open{flex:auto;min-height:0;display:flex}#settings-tab-panel.more-settings-open #room-settings{flex:1;min-height:0}#player-list{padding:var(--sidebar-section-gap) var(--sidebar-margin);flex-direction:column;gap:.5vh;display:flex}.player-item{border-radius:var(--radius-md);background:var(--surface);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-bottom);border:none;align-items:center;gap:.75vh;padding:.85vh 1vh;font-size:1.85vh;line-height:1.1;display:flex}.player-item.status-disconnected{background:var(--surface)}.player-item.own{background:var(--green-dark)}.player-item.teammate{background:var(--blue)}.player-item.status-spectating{background:var(--surface);opacity:.4;border:none}.spectating-icon{flex:none;width:2vh;height:2vh}.disconnected-icon{background:var(--yellow);flex:none;width:2vh;height:2vh;-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3e%3cpath%20fill='%23000'%20d='M285.756%2097.425C279.314%2087.074%20268.191%2080.895%20256%2080.895s-23.314%206.179-29.756%2016.531L51.938%20377.543c-6.821%2010.965-7.151%2024.248-.879%2035.535%206.271%2011.288%2017.723%2018.027%2030.636%2018.027h348.609c12.913%200%2024.365-6.739%2030.636-18.027%206.272-11.287%205.942-24.57-.879-35.535L285.756%2097.425zM256.012%20385.494h-.024c-9.254%200-16.756-7.502-16.756-16.756%200-9.255%207.502-16.757%2016.756-16.757h.024c9.255%200%2016.757%207.502%2016.757%2016.757%200%209.254-7.502%2016.756-16.757%2016.756zM272.769%20309.219c0%209.255-7.502%2016.757-16.757%2016.757h-.024c-9.254%200-16.756-7.502-16.756-16.757V195.931c0-9.254%207.502-16.756%2016.756-16.756h.024c9.255%200%2016.757%207.502%2016.757%2016.756v113.288z'/%3e%3c/svg%3e") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3e%3cpath%20fill='%23000'%20d='M285.756%2097.425C279.314%2087.074%20268.191%2080.895%20256%2080.895s-23.314%206.179-29.756%2016.531L51.938%20377.543c-6.821%2010.965-7.151%2024.248-.879%2035.535%206.271%2011.288%2017.723%2018.027%2030.636%2018.027h348.609c12.913%200%2024.365-6.739%2030.636-18.027%206.272-11.287%205.942-24.57-.879-35.535L285.756%2097.425zM256.012%20385.494h-.024c-9.254%200-16.756-7.502-16.756-16.756%200-9.255%207.502-16.757%2016.756-16.757h.024c9.255%200%2016.757%207.502%2016.757%2016.757%200%209.254-7.502%2016.756-16.757%2016.756zM272.769%20309.219c0%209.255-7.502%2016.757-16.757%2016.757h-.024c-9.254%200-16.756-7.502-16.756-16.757V195.931c0-9.254%207.502-16.756%2016.756-16.756h.024c9.255%200%2016.757%207.502%2016.757%2016.756v113.288z'/%3e%3c/svg%3e") 50%/contain no-repeat}.player-stats{color:var(--text-secondary);align-items:center;gap:.75vh;margin-left:auto;display:inline-flex}.host-badge{color:var(--text-secondary);font-weight:var(--font-weight-regular)}.winner-crown{object-fit:contain;flex:none;align-self:center;width:1.8vh;height:auto;max-height:1.8vh;display:block}.player-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}#room-settings{padding:var(--sidebar-section-gap) var(--sidebar-margin);flex-direction:column;gap:1.25vh;max-height:100%;display:flex;overflow-y:auto}#more-room-settings{flex-direction:column;gap:1.25vh;display:flex}.room-settings-more-btn{--button-color:var(--surface);width:100%;padding:.9vh 1vh;font-size:1.7vh}.room-settings-more-btn[aria-expanded=true]{--button-color:var(--surface-raised)}.settings-field{font-weight:var(--font-weight-bold);grid-template-columns:1fr minmax(10vh,12vh);align-items:center;gap:1vh;font-size:1.85vh;display:grid}.settings-field input,.settings-field select{border-radius:var(--radius-md);background:var(--primary);width:100%;min-width:0;color:inherit;border:none;padding:.85vh 1vh;font-size:1.85vh}.settings-field select{appearance:none;cursor:pointer;background-color:var(--surface);background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:calc(100% - 1.25vh),calc(100% - .85vh);background-repeat:no-repeat;background-size:.42vh .42vh,.42vh .42vh;padding-right:2.4vh}.settings-field select option{color:inherit}.native-hover-select{display:none}.settings-picker{min-width:0;position:relative}.settings-picker.open{z-index:1000}.settings-picker-button{--button-color:var(--surface);width:100%;min-width:0;height:100%;color:inherit;text-align:left;white-space:nowrap;text-overflow:ellipsis;justify-content:space-between;align-items:center;padding:.85vh 2.4vh .85vh 1vh;font-size:1.65vh;line-height:1.1;display:flex;overflow:hidden}.settings-picker-button:after{content:"";pointer-events:none;border-top:.52vh solid;border-left:.42vh solid #0000;border-right:.42vh solid #0000;position:absolute;right:.95vh}.settings-picker-button:disabled:after{display:none}.settings-field input[type=number]:disabled{appearance:textfield}.settings-field input[type=number]:disabled::-webkit-inner-spin-button{appearance:none;margin:0}.settings-field input[type=number]:disabled::-webkit-outer-spin-button{appearance:none;margin:0}.settings-picker-menu{z-index:1001;border-radius:var(--radius-md);background:var(--secondary);width:max(100%,16vh);max-height:32vh;box-shadow:var(--shadow-soft);gap:.25vh;padding:.45vh;display:grid;position:absolute;top:calc(100% + .35vh);right:0;overflow-y:auto}.settings-picker-option{border-radius:var(--radius-sm);color:inherit;text-align:left;background:0 0;padding:.75vh .9vh;font-size:1.65vh;line-height:1.1}.settings-picker-option:hover{background:var(--surface)}.settings-picker-option.selected{background:var(--green);color:var(--text)}.settings-picker-option.selected:hover{background:var(--green)}.settings-field input:disabled,.settings-field select:disabled{opacity:.65;cursor:not-allowed}.settings-toggle-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75vh;display:grid}.settings-toggle{border-radius:var(--radius-md);background:var(--primary);min-width:0;font-weight:var(--font-weight-bold);box-shadow:var(--shadow-bottom);border:none;outline:none;align-items:center;gap:.65vh;padding:.7vh;font-size:1.5vh;line-height:1.1;display:flex}.settings-toggle span{min-width:0}.settings-toggle input{width:1.75vh;height:1.75vh;accent-color:var(--blue);flex:none}.room-settings-toggle{justify-content:flex-start}.shared-team-clock-toggle{box-shadow:none;background:0 0;justify-content:center}.room-variants-btn{--button-color:var(--blue);width:100%;padding:.9vh 1vh;font-size:1.7vh}.room-variants-btn[aria-expanded=true]{--button-color:color-mix(in srgb, var(--blue), white 12%)}.room-variant-buttons{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:1.25vh;min-height:0;display:grid}.room-variant-button{--button-color:var(--surface);justify-content:center;align-items:center;width:100%;min-width:0;height:7.25vh;padding:1vh;font-size:2vh;font-weight:800;line-height:1;display:flex}.room-variant-button[aria-pressed=true]{--button-color:var(--green);color:var(--text)}.settings-divider{border-top:.16vh solid var(--primary);margin:.75vh 0 .25vh}#room-settings-note{min-height:3.5vh;color:var(--hidden-text);font-size:1.6vh;line-height:1.25}#room-settings-note:empty{display:none}#lobby-action-row{margin:var(--sidebar-section-gap) var(--sidebar-margin) 0 var(--sidebar-margin);width:calc(100% - (var(--sidebar-margin) * 2));gap:1vh;display:flex}#ready-btn{--button-color:var(--green);flex:auto;padding:1vh 0;font-size:2vh}#spectator-btn{flex:0 0 4.4vh;justify-content:center;align-items:center;width:4.4vh;min-width:4.4vh;padding:0;display:flex}#spectator-btn img{opacity:.86;width:2.35vh;height:2.35vh}#ready-btn.waiting,#ready-btn:disabled{--button-color:var(--surface-raised);cursor:default;color:var(--hidden-text)}#resign-btn{--button-color:var(--red);margin:var(--sidebar-section-gap) var(--sidebar-margin) 0 var(--sidebar-margin);width:calc(100% - (var(--sidebar-margin) * 2));padding:1vh 0;font-size:2vh;display:none}#chat-section{border-top:.16vh solid var(--primary);background:var(--secondary);padding:var(--sidebar-section-gap) var(--sidebar-margin);flex-direction:column;flex:1;min-height:0;display:flex}#chat-messages{border-radius:var(--radius-md);background:var(--primary);padding:var(--sidebar-section-gap);flex-direction:column;flex:1;min-height:0;display:flex;overflow-y:auto}#chat-message-list{flex:1}.chat-message{border-radius:var(--radius-md);word-wrap:break-word;background:var(--primary);box-shadow:var(--shadow-bottom);border:none;margin-bottom:1.25vh;padding:.85vh 1vh;font-size:1.85vh}.chat-message.own{background:var(--green-dark)}.chat-message.teammate{background:var(--blue)}.chat-message.opponent,.chat-message.server,.chat-message:not(.own):not(.teammate):not(.opponent):not(.server){background:var(--surface)}.chat-sender{font-weight:var(--font-weight-bold);align-items:center;gap:.5vh;margin-bottom:.25vh;font-size:1.7vh;display:flex}.chat-badge{flex:none;width:1.7vh;height:1.7vh}.chat-text{white-space:pre-line}#chat-input-container{background:var(--primary);gap:1vh;width:100%;padding-top:.625vh;display:flex;position:sticky;bottom:0}#chat-input{border-radius:var(--radius-md);background:var(--surface);outline:none;flex:1;padding:1.25vh 1.5vh;font-size:1.85vh}.scroll-controls{background:var(--primary);font-weight:var(--font-weight-bold);justify-content:center;align-items:center;gap:2vh;padding:1.5vh;display:flex;box-shadow:0 .45vh 1.4vh #0000002e}.scroll-btn{justify-content:center;align-items:center;width:6vh;height:4vh;padding:0;font-size:2vh;display:flex}.scroll-btn:disabled{opacity:.3}.scroll-indicator{background:var(--secondary);border:none;border-radius:999px;padding:.75vh 1.5vh;font-size:2.5vh}#grid-toggle-btn{justify-content:center;align-items:center;width:4vh;height:4vh;margin:0;padding:0;font-size:0;display:flex;overflow:hidden}#grid-toggle-btn svg{width:2.5vh;height:2.5vh}.promotion-dialog{border:.2vh solid var(--border-soft);border-radius:var(--radius-lg);background:var(--primary);z-index:1000;box-shadow:var(--shadow-soft);gap:15px;padding:20px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.promotion-option{--button-color:var(--surface);background-position:50%;background-repeat:no-repeat;background-size:contain;width:80px;height:80px;padding:6px;display:block}