@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#111310;--panel:#1b1e19;--muted:#93998d;--line:#30362b;--lime:#d2f680;--white:#f2f3e9}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:0}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--lime);outline-offset:3px}a{color:inherit}.shell{display:grid;grid-template-columns:224px 1fr;min-height:100vh}.sidebar{padding:34px 22px;border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;background:#151712}.brand{display:flex;align-items:center;gap:9px;font:800 23px Manrope;letter-spacing:-1px;margin:0 0 53px}.brand b{font-size:38px;color:var(--lime)}.brand span{color:var(--lime)}.navlabel,.eyebrow{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);font-weight:700}.navlabel{padding:0 14px;margin-bottom:13px}.nav{display:flex;flex-direction:column;gap:8px}.nav button{background:transparent;text-align:left;padding:14px;border-radius:8px;color:#a9afa2;display:flex;gap:13px;align-items:center;font-weight:600}.nav button.active{background:#293320;color:var(--lime)}.nav button:hover{background:#252b20}.nav i{font-style:normal;font-size:20px;width:22px;text-align:center}.sidebottom{margin-top:auto}.sidecard{background:#22271c;border:1px solid #36432b;padding:18px;border-radius:10px;margin-bottom:22px}.sidecard b{font-size:16px}.sidecard p{font-size:12px;line-height:1.6;color:#a5ad99}.sidecard button{font-size:12px;color:var(--lime);padding:0;background:none}.footnote{font-size:11px;color:#6f7766;line-height:1.7}.main{padding:0 40px 32px;max-width:1530px;width:100%;margin:auto}.topbar{height:93px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);margin-bottom:33px}.crumb{color:#9aa08f;font-size:12px}.crumb span{color:var(--white);margin-left:12px}.topactions{display:flex;gap:12px;align-items:center}.pill{border:1px solid var(--line);border-radius:30px;padding:8px 12px;font-size:11px;color:#adb99c}.dot{display:inline-block;width:6px;height:6px;background:var(--lime);border-radius:50%;margin-right:7px}.btn{background:var(--lime);color:#1c2811;font-weight:700;border-radius:7px;padding:13px 19px;display:inline-flex;align-items:center;justify-content:center;gap:12px}.btn:hover{background:#e0ffa5}.btn.secondary{background:#2a3024;color:#e0e4d9;border:1px solid #3c4532}.btn.ghost{background:none;color:#b7bead;border:1px solid var(--line)}.btn.small{font-size:12px;padding:10px 15px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.intro h1{font:700 36px Manrope;letter-spacing:-1.5px;margin:5px 0 9px}.intro p{color:#a2a897;margin:0;line-height:1.6}.intro .edition{font:12px monospace;color:#69745f}.grid{display:grid;grid-template-columns:minmax(440px,1.65fr) minmax(290px,1fr);gap:25px}.playpanel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:21px}.panelhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panelhead h2{margin:0;font-size:15px;font-weight:600}.tag{font-size:10px;border:1px solid #485438;color:#b6cb95;border-radius:5px;padding:5px 8px}.player{display:flex;align-items:center;gap:11px;margin:12px 0}.avatar{height:36px;width:36px;background:#303729;border:1px solid #404b33;display:grid;place-items:center;border-radius:7px;font-size:22px}.playername{font-size:13px;font-weight:700}.playerdetail{font-size:10px;color:var(--muted);margin-top:3px}.player .clock{margin-left:auto;background:#2b3026;padding:10px 14px;border-radius:6px;font:14px monospace;color:#a6ae9a}.boardwrap{position:relative;margin:16px 0}.board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;overflow:hidden;border-radius:3px;box-shadow:0 10px 30px #0002}.square{position:relative;display:grid;place-items:center;padding:0;aspect-ratio:1;border-radius:0;background:#e4e8cd;font-family:Georgia,'DejaVu Sans',serif;font-size:clamp(28px,4.1vw,57px);line-height:1;color:#20261d;user-select:none}.square.dark{background:#7b9166}.square.whitepiece{color:#fffef3;text-shadow:1px 1px 1px #1e271b,-1px -1px 1px #1e271b,1px -1px 1px #1e271b,-1px 1px 1px #1e271b}.square.last{background:#c4d484}.square.dark.last{background:#a5b85c}.square.selected{background:#d5ed7b;box-shadow:inset 0 0 0 4px #edf8b3}.square.legal:after{content:'';position:absolute;width:23%;height:23%;background:#17230e40;border-radius:50%}.square small{position:absolute;font:700 9px sans-serif;color:#3d4c30;left:5px;top:4px;text-shadow:none}.square .file{top:auto;bottom:3px;left:auto;right:5px}.boardtools{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:16px;margin-top:16px;color:var(--muted);font-size:11px}.toolbuttons{display:flex;gap:7px}.toolbuttons button{background:none;color:#b9c2ad;padding:5px}.rightcol{display:flex;flex-direction:column;gap:18px}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px}.tabs{display:flex;background:#10140e;border-radius:8px;padding:4px;gap:4px;margin-bottom:25px}.tabs button{flex:1;padding:11px 7px;background:none;color:#939e86;border-radius:6px;font-size:12px;font-weight:700}.tabs button.active{background:#323d26;color:var(--lime)}.modeicon{font-size:32px;color:var(--lime);margin-bottom:12px}.card h2{font:700 23px Manrope;letter-spacing:-.6px;margin:0 0 9px}.card p{color:#9ea792;font-size:12px;line-height:1.7;margin:0 0 21px}.label{display:block;color:#bfc7b2;font-size:11px;margin:17px 0 10px}.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.level{background:#22271d;border:1px solid #3c4532;border-radius:7px;text-align:left;padding:12px 8px;color:#b8c1ad}.level strong{display:block;font-size:11px}.level small{font-size:9px;color:#7f8c70;display:block;margin-top:6px}.level.active{border-color:var(--lime);background:#303b23;color:var(--lime)}.choices{display:flex;gap:8px}.choice{background:#272e20;padding:7px 19px;border:1px solid #414b35;border-radius:6px;font-size:24px}.choice.active{border-color:var(--lime)}.full{width:100%;margin-top:22px}.hint{text-align:center;font-size:10px;color:#7f8a73;margin-top:11px}.minihead{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.minihead h3{font-size:14px;margin:0}.linkbtn{color:var(--lime);background:none;padding:0;font-size:11px}.rankrow{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #2d3327}.rankrow:last-child{border-bottom:0}.ranknum{font:12px monospace;color:#8f9b7f;width:18px}.rankavatar{border-radius:50%;background:#323b27;width:30px;height:30px;display:grid;place-items:center;color:var(--lime);font-size:12px}.rankname{font-size:12px;flex:1}.rankrating{font:12px monospace;color:var(--lime)}.empty{padding:22px 7px;text-align:center;color:#8b987c;font-size:12px;line-height:1.7}.lower{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:24px}.feature{display:flex;gap:13px;padding:20px 17px;border:1px solid var(--line);border-radius:9px}.feature i{font-style:normal;font-size:23px;color:#b4c29f}.feature h3{font-size:12px;margin:0 0 6px}.feature p{font-size:10px;margin:0;color:#7e8972;line-height:1.6}.status{font-size:12px;color:#c2d5aa;line-height:1.6;min-height:20px}.moves{display:grid;grid-template-columns:35px 1fr 1fr;max-height:180px;overflow:auto;gap:8px;font:12px monospace;margin:15px 0}.moves span:nth-child(3n+1){color:#71835d}.room{padding:12px;border:1px solid var(--line);margin-top:8px;border-radius:7px;display:flex;justify-content:space-between;align-items:center;font-size:12px}input,select{width:100%;border:1px solid #465137;background:#12170e;border-radius:7px;color:var(--white);padding:13px;margin-top:7px}dialog{background:#1e2518;border:1px solid #455438;color:var(--white);padding:28px;border-radius:16px;width:min(430px,92vw)}dialog::backdrop{background:#050803c9;backdrop-filter:blur(5px)}dialog h2{font:700 25px Manrope;margin-top:0}dialog p{font-size:12px;color:#a8b39b;line-height:1.7}dialog label{display:block;font-size:12px;margin-top:15px}dialog .close{float:right;background:none;font-size:23px;color:#9cae8d}dialog .linkbtn{margin-top:17px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#d2f680;color:#18230e;box-shadow:0 5px 30px #0006;border-radius:8px;padding:14px 22px;z-index:20;max-width:90vw;display:none}.error{color:#ffb5a6;font-size:12px;line-height:1.6;margin-top:12px}.table{width:100%;border-collapse:collapse;margin-top:25px}.table td,.table th{padding:18px 15px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}.table th{font-size:10px;color:#98a58a;text-transform:uppercase;letter-spacing:1px}.table td:nth-child(3){color:var(--lime)}.pagecard{max-width:1000px}.badge{color:var(--lime);font-size:11px}.mobilebrand{display:none}@media(min-width:1400px){.main{padding-left:55px;padding-right:55px}.grid{grid-template-columns:minmax(440px,650px) minmax(300px,420px)}.square{font-size:60px}}@media(max-width:1100px){.shell{grid-template-columns:180px 1fr}.sidebar{padding:30px 14px}.brand{font-size:20px}.main{padding:0 25px 25px}.grid{grid-template-columns:minmax(340px,1.4fr) minmax(250px,1fr);gap:16px}.card{padding:17px}.playpanel{padding:15px}.intro h1{font-size:30px}.lower{gap:9px}.feature{padding:14px 10px}}@media(max-width:850px){.shell{display:block}.sidebar{height:auto;position:static;flex-direction:row;align-items:center;justify-content:space-between;padding:13px 20px;border-bottom:1px solid var(--line)}.brand{margin:0;font-size:20px}.brand b{font-size:30px}.nav{flex-direction:row;gap:2px}.nav button{padding:9px;font-size:12px;gap:6px}.navlabel,.sidebottom{display:none}.main{padding:0 20px 25px}.topbar{height:72px;margin-bottom:25px}.square{font-size:clamp(25px,6vw,55px)}.grid{grid-template-columns:minmax(300px,1.3fr) minmax(245px,1fr)}.edition{display:none}}@media(max-width:650px){.main{padding:0 15px 25px}.nav button span{display:none}.nav i{font-size:22px}.topbar .pill{display:none}.intro h1{font-size:29px}.intro p{font-size:12px}.grid{display:flex;flex-direction:column}.rightcol{display:contents}.setup{order:-1}.setup .tabs{margin-bottom:14px}.setup .modeicon,.setup>p{display:none}.setup h2{font-size:20px}.levels{margin-top:8px}.setup .full{margin-top:16px}.playpanel{padding:14px}.square{font-size:10vw}.lower{grid-template-columns:1fr}.feature{padding:17px}.rankcard{margin-top:0}.table td,.table th{padding:12px 8px;font-size:11px}.player .clock{font-size:12px}.topactions{gap:6px}.intro{margin-bottom:22px}.choices{margin-top:5px}}
@media(max-width:1400px){.intro .edition{display:none}}
/* A quiet lobby, a dedicated board once a game begins. */
.lobby-view .grid{display:block;max-width:940px;margin:0 auto}.lobby-view .playpanel,.lobby-view .rightcol>section:last-child,.lobby-view .lower{display:none}.lobby-view .rightcol{display:grid;grid-template-columns:minmax(320px,1.35fr) minmax(260px,1fr);gap:26px;align-items:start}.lobby-view .intro{max-width:940px;margin:45px auto 36px}.lobby-view .intro h1{font-size:40px}.lobby-view .setup{padding:30px}.lobby-view .setup .modeicon{font-size:45px;margin:25px 0 18px}.lobby-view .setup>p{font-size:13px}.lobby-view .level{padding:17px 12px}.lobby-view .rankcard{padding:25px}.lobby-view .full{padding:16px}.back-lobby{margin:0 0 24px;font-size:13px}.game-view .intro,.game-view .setup,.game-view .rankcard,.game-view .lower{display:none}.game-view .grid{grid-template-columns:minmax(360px,620px) minmax(200px,280px);align-items:start;justify-content:center}.game-view .playpanel{padding:19px}.game-view .rightcol{display:block}.game-view .square{font-size:clamp(30px,4vw,58px)}.game-view .moves{max-height:550px}.game-view .topbar{margin-bottom:22px}.lobby-view .sidecard{display:none}@media(max-width:850px){.game-view .grid{grid-template-columns:minmax(310px,1fr) 220px}.lobby-view .intro h1{font-size:34px}.lobby-view .rightcol{grid-template-columns:1.2fr 1fr;gap:18px}}@media(max-width:650px){.lobby-view .rightcol{display:flex;flex-direction:column}.lobby-view .rightcol>section{width:100%}.lobby-view .intro{margin:25px 0}.lobby-view .intro h1{font-size:30px}.lobby-view .setup{padding:23px}.lobby-view .setup .modeicon{display:none}.lobby-view .setup>p{display:block}.game-view .grid{display:flex;flex-direction:column}.game-view .rightcol{display:block;width:100%}.game-view .playpanel{width:100%;padding:12px}.game-view .square{font-size:10vw}.game-view .moves{max-height:140px}}
.game-view .social{display:block;margin-top:18px}.social video{width:100%;border-radius:8px;margin:8px 0;background:#000}.social video[hidden]{display:none}.social p{font-size:12px}.social form{display:flex;gap:6px;align-items:center}.social #chatlog{max-height:220px;overflow:auto;overflow-wrap:anywhere}.social #videoStatus{font-size:11px;margin-top:12px;color:#b9c6a9}.lobby-view .social{display:none}
.chesspiece{width:88%;height:88%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 1px #0003)}
#modal:has(#addfriend){width:min(650px,94vw);max-height:90vh;overflow:auto}.room small{font-size:10px;color:#9fae8d}