@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#101715;--line:#2b3631;--muted:#8e9c94;--green:#98e4b5;--gold:#d6bd7a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#eef1e9;font:15px 'DM Sans',sans-serif}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit;color:inherit;cursor:pointer}button{background:none;border:1px solid var(--line);border-radius:8px;padding:12px 18px}button:hover{border-color:var(--green);background:#ffffff08}button:focus-visible,a:focus-visible{outline:3px solid var(--gold)}aside{position:fixed;width:230px;height:100vh;border-right:1px solid var(--line);padding:36px 24px;background:#0d1311}.brand{display:flex;gap:12px;color:var(--green);text-decoration:none;font:700 20px 'Space Grotesk';letter-spacing:2px}.brand small{display:block;font:9px 'DM Sans';letter-spacing:1.8px;margin-top:8px;color:var(--muted)}nav{margin-top:65px;display:grid;gap:10px}nav button{text-align:left;border:0;color:var(--muted)}nav button.active{color:var(--green);background:#21372b}.sidebottom{position:absolute;bottom:30px;color:#a9b7ae;font-size:12px;line-height:2.2}.sidebottom small{color:var(--muted)}hr{border:0;border-top:1px solid var(--line);margin:20px 0}.dot{display:inline-block;background:var(--gold);width:6px;height:6px;border-radius:50%;margin-right:6px}main{margin-left:230px;padding:0 48px;max-width:1600px}header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}header>span{font-size:10px;letter-spacing:2px;color:var(--muted)}header button{font-size:12px}.notice{margin-top:24px;border:1px solid #4b4530;background:#26261c;padding:12px 16px;font-size:10px;letter-spacing:1px;color:var(--gold);border-radius:6px;display:flex;gap:20px;align-items:center}.notice span{letter-spacing:0;color:#b7b5a4;font-size:12px}.notice b{margin-left:auto;font-size:10px;font-weight:400}.intro{display:flex;justify-content:space-between;align-items:center;padding:50px 20px 44px 0}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--green);margin:0 0 20px}h1{font:500 64px/1.04 'Space Grotesk',sans-serif;letter-spacing:-3px;margin:0}h1 em{font-style:normal;color:var(--green)}.intro p:not(.eyebrow){color:var(--muted);line-height:1.7}.tags{display:flex;gap:22px;font-size:11px;color:#b9c6bd;margin-top:25px}.heroart{width:350px;height:250px;transform:rotate(-9deg);display:flex;flex-direction:column;justify-content:center;align-items:center;background:repeating-conic-gradient(#263b2e 0% 25%,#1c2b23 0% 50%) 50%/90px 90px;border:10px solid #354638;box-shadow:18px 18px 0 #0b110e;border-radius:10px;font-size:66px;line-height:1.25;color:#e6d9b4;text-shadow:0 6px 0 #101a13}.heroart small{font:10px 'DM Sans';letter-spacing:3px;background:#17251c;padding:8px 18px;color:var(--green)}.sectiontitle{display:flex;justify-content:space-between;align-items:center}h2{font:500 22px 'Space Grotesk'}h2 small{font:10px 'DM Sans';letter-spacing:1px;color:var(--muted);margin-left:15px}.sectiontitle>span{font-size:11px;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{text-align:left;padding:24px;border-radius:12px;overflow:hidden}.chess{background:linear-gradient(130deg,#203a2b,#17231c)}.ttt{background:linear-gradient(130deg,#383424,#24251c)}.rps{background:linear-gradient(130deg,#2a303e,#1e252c)}.pill{font-size:9px;letter-spacing:1.5px;border:1px solid #ffffff25;border-radius:4px;padding:5px 8px;color:#c9d6cb}.art{font-size:88px;height:138px;display:flex;align-items:center;justify-content:center;color:#bddec6}.ttt .art{font:100px 'Space Grotesk';color:#dac68f;gap:14px}.art i{font-style:normal;color:#819d87}.rps .art{font-size:63px;filter:grayscale(1)}h3{font:500 21px 'Space Grotesk';margin:15px 0 8px}h3 span{float:right;color:var(--green)}.card p{font-size:12px;color:#a8b5ac;margin-bottom:24px}.card>small{font-size:10px;color:#85998b}.coming{border:1px solid var(--line);border-radius:10px;margin:28px 0;padding:10px 24px;display:flex;align-items:center;justify-content:space-between}.coming h3{font-size:17px}.coming p{color:var(--muted);font-size:12px}.coming>span{font-size:9px;color:var(--gold);letter-spacing:1px}.solohead{margin-top:35px}#solo{display:flex;gap:8px;flex-wrap:wrap}#solo button{font-size:12px;color:var(--muted)}footer{border-top:1px solid var(--line);margin-top:50px;padding:25px 0;font-size:10px;letter-spacing:1px;color:#76897b;display:flex;justify-content:space-between}footer span{letter-spacing:0}#table{padding-top:30px}.tablehead{display:flex;align-items:center;justify-content:space-between;margin:30px 0}.tablehead h1{font-size:42px}.playlayout{display:grid;grid-template-columns:minmax(280px,600px) 1fr;gap:30px}#board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;border:8px solid #35483a;border-radius:8px;overflow:hidden;align-self:start}.square{border:0;border-radius:0;padding:0;position:relative;background:#b5c6ad;color:#101a13;font-size:clamp(25px,4.4vw,66px);font-family:Georgia;line-height:1;aspect-ratio:1}.square.dark{background:#4a6b55}.square:hover{background:#8ba57a}.square.selected{background:#d2bd71}.square.legal:after{content:'';width:24%;height:24%;border-radius:50%;background:#102e2766;position:absolute;left:38%;top:38%}.square small{position:absolute;bottom:2px;left:3px;font:9px sans-serif;color:#13291d}.whitepiece{color:#fff6df;text-shadow:0 1px 2px #000,1px 0 #233}.panel{padding:24px;background:#18221c;border:1px solid var(--line);border-radius:10px}.panel h2{margin-top:26px}.hint{font-size:12px;line-height:1.7;color:var(--muted)}.panel button{margin:5px 0;width:100%;font-size:12px}select{padding:8px;background:#263b2e;border:1px solid var(--line);border-radius:6px}#history{max-height:180px;overflow:auto;color:#b8c8bc;font-size:13px;line-height:1.8}#board.tttboard{grid-template-columns:repeat(3,1fr)}.tttboard button{font:64px 'Space Grotesk';border:1px solid #7e9b84;border-radius:0;background:#2c4936}.rpsboard{display:flex!important;align-items:center;justify-content:center;flex-wrap:wrap}.rpsboard button{font-size:50px}.panel label{font-size:12px}dialog{background:#1b2b21;border:1px solid #537b5e;color:#e4eee6;border-radius:14px;padding:30px;max-width:460px}dialog::backdrop{background:#000a}dialog p{line-height:1.7;color:#b5c8ba}#other{min-height:450px;padding:60px 0}#other p{color:var(--muted);line-height:1.8}@media(max-width:1000px){aside{width:180px;padding:30px 16px}main{margin-left:180px;padding:0 24px}.heroart{width:230px;height:210px;font-size:50px}h1{font-size:50px}.card{padding:16px}.playlayout{grid-template-columns:1fr}.notice b{display:none}}@media(max-width:700px){aside{position:static;width:100%;height:auto;padding:20px;border-right:0;border-bottom:1px solid var(--line)}nav{margin:20px 0 0;display:flex;gap:2px;overflow:auto}nav button{font-size:11px;padding:10px}.sidebottom{display:none}main{margin:0;padding:0 20px}header{height:70px}header>span{font-size:8px}.notice{gap:10px}.notice span{font-size:10px}.intro{padding:35px 0}.heroart{width:120px;height:150px;font-size:31px;border-width:5px}.heroart small{display:none}h1{font-size:43px}.eyebrow{font-size:8px}.tags{display:block;font-size:10px}.tags span{display:block;margin-top:10px}.cards{grid-template-columns:1fr}.card .art{float:right;width:35%;height:130px}.card h3{margin-top:30px}.card h3 span{display:none}.sectiontitle>span,h2 small{display:none}.coming{display:block;padding-bottom:18px}.coming>span{font-size:8px}footer{display:block;line-height:2}footer span{display:block}.square{font-size:38px}.tablehead h1{font-size:32px}}
.network-panel{padding-top:30px}.network-panel h1{margin:20px 0}.network-panel input{font:inherit;color:inherit;border:1px solid #41614b;background:#112117;padding:12px;border-radius:6px;max-width:100%;margin:8px}.network-panel form{margin:20px 0}.network-panel form input{display:inline-block}.network-panel button{margin:6px}#network-board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;align-self:start;border:6px solid #35483a;border-radius:8px;overflow:hidden}#network-board button{margin:0}#network-board.net-ttt{grid-template-columns:repeat(3,1fr)}.net-ttt button{border:1px solid #7e9b84;font-size:60px;border-radius:0}button:disabled{opacity:.45;cursor:not-allowed}#network-message{padding:16px;background:#1a3022;border-radius:8px;line-height:1.6}#network-clock{color:#d6bd7a}.network-panel .eyebrow{margin-top:25px}#open-network{font-size:12px;color:#98e4b5}