body{background:#f9fafb;justify-content:center;min-height:100vh;margin:0;display:flex}#root{width:100%}.app{flex-direction:column;align-items:center;padding:20px;font-family:system-ui,sans-serif;display:flex}h1{margin-bottom:16px;font-size:2rem}.toolbar{align-items:center;gap:12px;margin-bottom:16px;display:flex}.new-game{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:8px;padding:10px 24px;font-size:1rem;transition:background .2s}.new-game:hover{background:#4338ca}.status{font-size:.85rem;font-weight:500}.status.online{color:#16a34a}.status.offline{color:#dc2626}.win-message{color:#16a34a;margin-bottom:16px;font-size:1.25rem;font-weight:600;animation:.3s ease-out pop}@keyframes pop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.board{-webkit-user-select:none;user-select:none;border:3px solid #1e293b;border-radius:4px;grid-template-rows:repeat(9,48px);grid-template-columns:repeat(9,48px);display:grid}.cell{cursor:pointer;border:1px solid #cbd5e1;justify-content:center;align-items:center;font-size:1.25rem;transition:background .1s;display:flex}.cell:hover{background:#f1f5f9}.cell.selected{background:#c7d2fe}.cell.initial{color:#1e293b;cursor:default;background:#f8fafc;font-weight:700}.cell.wrong{color:#dc2626;background:#fef2f2}.cell.border-right{border-right:3px solid #1e293b}.cell.border-bottom{border-bottom:3px solid #1e293b}