@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Libre+Caslon+Display&display=swap";:root{color:#233a32;font-synthesis:none;background:#f5f4ee;font-family:DM Sans,system-ui,sans-serif;font-size:15px;font-weight:400}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline-offset:5px;outline:3px solid #b55734}.site-shell{max-width:1280px;margin:auto;padding:0 64px}.topbar{border-bottom:1px solid #dadcd2;justify-content:space-between;align-items:center;gap:20px;height:102px;display:flex}.wordmark{letter-spacing:-1.2px;align-items:center;gap:10px;font-size:26px;font-weight:650;display:flex}.wordmark-dot{color:#bc633e;margin-left:-10px}.logo{background:#1d483c;border-radius:7px;place-items:center;width:29px;height:29px;display:grid}.logo .mark-x:before,.logo .mark-x:after{background:#f5f4ee;width:18px;height:2.5px}.header-note,.eyebrow,.footer{letter-spacing:1.55px;font-size:10px;font-weight:600}.header-note{color:#6e766d}.history-link{align-items:center;gap:16px;font-size:12px;display:flex}.history-link span{font-size:18px}.intro{text-align:center;padding:53px 0 39px}.eyebrow{justify-content:center;align-items:center;gap:9px;display:flex}.live-dot{background:#35674d;border-radius:50%;flex-shrink:0;width:5px;height:5px;display:inline-block}h1{letter-spacing:-2.3px;margin:22px 0 19px;font-family:Libre Caslon Display,Georgia,serif;font-size:76px;font-weight:400;line-height:.97}h1 em{color:#526b51;font-weight:400}h1 br{display:none}.intro p{color:#72766b;margin:0;font-size:13px;line-height:1.7}.mobile-break{display:none}.game-layout{grid-template-columns:minmax(300px,1fr) minmax(300px,.8fr);gap:75px;max-width:895px;margin:0 auto;display:grid}.play-panel{width:100%;max-width:420px;padding:0 14px}.player-strip{justify-content:space-between;align-items:center;gap:15px;padding:18px 0 29px;display:flex}.player{align-items:center;gap:12px;font-size:12px;font-weight:600;display:flex}.player-role{letter-spacing:1.4px;color:#8a8d80;margin-top:5px;font-size:8px;font-weight:500;display:block}.versus{color:#8e9487;font-family:Georgia,serif;font-size:11px;font-style:italic}.mark{width:72px;height:72px;display:inline-block;position:relative}.mark-x:before,.mark-x:after{content:"";background:#285341;border-radius:5px;width:100%;height:7px;position:absolute;top:50%;left:0;transform:translateY(-50%)rotate(45deg)}.mark-x:after{transform:translateY(-50%)rotate(-45deg)}.mark-o{border:7px solid #bf734b;border-radius:50%;width:65px;height:65px}.mark-small{width:24px;height:24px}.mark-x.mark-small:before,.mark-x.mark-small:after{height:3px}.mark-o.mark-small{border-width:3px;width:24px;height:24px}.board{aspect-ratio:1;background:#d3d8ca;border-radius:5px;grid-template-columns:repeat(3,1fr);gap:1px;display:grid;overflow:hidden;box-shadow:0 0 0 1px #d3d8ca}.square{background:#efefe6;border:0;place-items:center;min-width:0;min-height:0;padding:0;transition:background .2s;display:grid}.square:not(:disabled):hover{background:#e7ebde}.square.winning{background:#e0e6d7}.hover-mark{color:#29523b;opacity:0;font-size:64px;font-weight:300;line-height:1}.square:not(:disabled):hover .hover-mark,.square:not(:disabled):focus-visible .hover-mark{opacity:.22}.square.pending .mark{opacity:.5}.game-status{text-align:center;min-height:105px;padding-top:25px}.status-dot{vertical-align:middle;background:#446545;border-radius:50%;width:5px;height:5px;margin-right:8px;display:inline-block}.game-status h2{letter-spacing:-.25px;font-size:15px;font-weight:500;display:inline}.game-status p{color:#7b8174;margin:8px 0 0;font-size:11px;line-height:1.5}.new-game{color:#f4f3e9;text-align:left;background:#214b3d;border:0;border-radius:5px;justify-content:space-between;align-items:center;width:100%;padding:14px 19px;font-size:12px;display:flex}.new-game:hover{background:#315d49}.new-game:disabled{opacity:.55}.new-game span{font-size:18px;line-height:1}.board-footnote{text-align:center;color:#777e6e;margin:13px 0 0;font-size:9px;line-height:1.7}.error-message{color:#8d3523;margin-bottom:14px;font-size:12px;line-height:1.6}.error-message button{color:inherit;background:0 0;border:0;padding:0 3px;text-decoration:underline}.score-panel{background:#f0f0e7;border:1px solid #daddd1;border-radius:7px;align-self:start;min-width:0;margin-top:11px;padding:27px 27px 0}.score-heading{justify-content:space-between;align-items:center;gap:8px;display:flex}.score-heading .eyebrow{letter-spacing:1.15px;white-space:nowrap;font-size:8px}.global-badge{letter-spacing:.7px;white-space:nowrap;color:#6d7766;border:1px solid #d4d9c9;border-radius:3px;padding:4px 6px;font-size:7px}.score-panel>h2{letter-spacing:-.4px;margin:24px 0 14px;font-family:Libre Caslon Display,Georgia,serif;font-size:42px;font-weight:400;line-height:.99}.score-description{color:#7b8072;font-size:11px;line-height:1.7}.stats{grid-template-columns:repeat(3,1fr);gap:13px;margin:30px 0 25px;display:grid}.stats>div{flex-direction:column;min-width:0;display:flex}.stats strong{font-family:Libre Caslon Display,Georgia,serif;font-size:40px;font-weight:400;line-height:1}.stats span{color:#6a7363;white-space:nowrap;margin:8px 0 14px;font-size:9px}.stat-line{width:100%;height:2px}.green{background:#4d7751}.sand{background:#aaa981}.orange{background:#be7b54}.recent-heading{border-top:1px solid #d9ddcf;justify-content:space-between;align-items:center;padding-top:17px;display:flex}.recent-heading h3{letter-spacing:.2px;margin:0;font-size:10px;font-weight:500}.recent-heading button{color:#64795e;background:0 0;border:0;padding:4px 0 4px 8px;font-size:19px}.match-list{scrollbar-width:thin;max-height:244px;margin:5px 0 0;padding:0;list-style:none;overflow-y:auto}.match-list li{border-bottom:1px solid #dce0d2;align-items:center;gap:12px;padding:13px 0;display:flex}.match-list li:last-child{border-bottom:none}.match-list li>div{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.match-list strong{font-size:10px;font-weight:500}.match-list li>div>span{color:#818976;font-size:8px}.mini-board{flex-shrink:0;grid-template-columns:repeat(3,1fr);gap:2px;width:25px;height:25px;display:grid}.mini-board>span{background:#d9dece;border-radius:1px}.mini-board .mini-x{background:#5c7854}.mini-board .mini-o{background:#b58461}.result-tag{letter-spacing:.6px;color:#728063;border:1px solid #d6ddc9;border-radius:3px;padding:4px 6px;font-size:7px}.result-tag.loss{color:#97613e;border-color:#ddd3bf}.result-tag.win{color:#2d603e}.empty-history{text-align:center;color:#7e8873;padding:25px 0 29px}.empty-history>span{color:#a0aa8f;font-size:26px;font-weight:400}.empty-history p{margin:8px 0 0;font-size:11px;line-height:1.8}.score-footer{color:#77816c;border-top:1px solid #d9ddcf;align-items:center;gap:8px;margin:15px -27px 0;padding:15px 27px;font-size:9px;display:flex}.score-footer .live-dot{width:4px;height:4px}.history-error,.loading-history{color:#887548;padding:15px 0;font-size:11px;line-height:1.7}.how-to{text-align:center;padding:55px 0 43px}.how-to .eyebrow{letter-spacing:1.4px;color:#6c795f;font-size:8px}.how-to p{margin:13px 0 0;font-size:11px;line-height:1.8}.how-to p>span{color:#8a8f7e}.footer{letter-spacing:1px;color:#7d8575;border-top:1px solid #dadcd2;justify-content:space-between;align-items:center;gap:20px;padding:24px 0 30px;font-size:8px;display:flex}.footer>span:nth-child(2),.footer>span:last-child{letter-spacing:0;font-size:10px;font-weight:400}.footer>span:last-child>span{color:#8d9a7d;margin-left:10px}.pulsing{animation:1s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.3}}@media (width>=1400px){.intro{padding-top:67px;padding-bottom:47px}.topbar{height:110px}.how-to{padding-top:65px}}@media (width<=950px){.site-shell{padding:0 30px}.game-layout{gap:35px}.header-note{display:none}h1{font-size:66px}.score-panel{padding:24px 20px 0}.score-footer{margin-left:-20px;margin-right:-20px;padding:15px 20px}.stats span{font-size:8px}.global-badge{display:none}.mark{width:60px;height:60px}.mark-o{width:56px;height:56px}.mark-small,.mark-o.mark-small{width:24px;height:24px}}@media (width<=650px){.site-shell{max-width:480px;padding:0 23px}.topbar{height:80px}.wordmark{font-size:24px}.history-link{gap:8px;font-size:10px}.intro{padding:35px 0 27px}h1{letter-spacing:-1.5px;margin-top:22px;font-size:67px;line-height:.94}h1 br{display:block}.intro .eyebrow{letter-spacing:1.4px;font-size:8px}.intro p{font-size:12px;line-height:1.7}.mobile-break{display:block}.game-layout{flex-direction:column;gap:35px;display:flex}.play-panel{max-width:none;padding:0 8px}.player-strip{padding-top:9px;padding-bottom:24px}.mark{width:65px;height:65px}.mark-o{width:59px;height:59px}.mark-small,.mark-o.mark-small{width:24px;height:24px}.score-panel{width:100%;margin-top:0;padding:25px 25px 0}.score-heading .eyebrow{font-size:9px}.global-badge{display:block}.score-panel>h2{font-size:44px}.score-description{font-size:12px}.stats span{font-size:10px}.score-footer{margin-left:-25px;margin-right:-25px;padding:17px 25px}.match-list strong{font-size:12px}.match-list li>div>span{font-size:10px}.match-list{max-height:282px}.result-tag{font-size:8px}.recent-heading h3{font-size:12px}.how-to{padding:39px 0 32px}.footer{flex-wrap:wrap;justify-content:center;gap:13px;padding:22px 0 27px}.footer>span:first-child{text-align:center;width:100%}.footer>span:last-child{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
