:root{font:100%/1.5 system-ui;color:#f1eddf;background:#15212e;color-scheme:dark}body{margin:0;padding:1rem}main{max-width:30rem;margin:auto}h1{font-size:1.5rem;margin:.2rem 0}p{margin:.5rem 0}#board{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:1rem 0}button{font:inherit;min-height:3rem;border:2px solid #92c6c0;border-radius:.4rem;background:#243342;color:#fff;cursor:pointer}button:focus-visible{outline:3px solid #ecd1a0;outline-offset:2px}button:disabled{opacity:.5;cursor:default}#restart{padding:.5rem 1rem}@media(prefers-color-scheme:light){:root{color:#243342;background:#f8f6f0;color-scheme:light}button{background:#fff;color:#243342;border-color:#237b79}}

*{box-sizing:border-box}html,body,main,#board{min-width:0;width:100%}main{max-width:30rem}#board{grid-template-columns:repeat(3,minmax(0,1fr))}button{min-width:0;max-width:100%;overflow-wrap:anywhere}body{padding:clamp(.5rem,3vw,1rem)}p{overflow-wrap:anywhere}