*{box-sizing:border-box}body{align-items:center;background-color:#f0f0f0;display:flex;font-family:Arial,sans-serif;justify-content:center;margin:0;min-height:100vh;padding:16px}.container{background-color:#fff;border-radius:10px;box-shadow:0 0 10px #0000001a;max-width:calc(100vw - 32px);padding:20px;text-align:center}.header{align-items:center;display:flex;gap:10px;justify-content:center;margin-bottom:20px}.header svg{height:clamp(40px,15vw,64px);width:clamp(40px,15vw,64px)}.header-title{font-size:clamp(18px,6vw,24px);font-weight:700}.color-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:20px}.color-button{border:2px solid gray;border-radius:50%;cursor:pointer;height:clamp(32px,9vw,40px);width:clamp(32px,9vw,40px)}.grid{grid-gap:1px;aspect-ratio:1;display:grid;gap:1px;grid-template-columns:repeat(20,1fr);grid-template-rows:repeat(20,1fr);margin:0 auto 20px;width:min(400px,calc(100vw - 72px))}.grid-cell{height:100%;width:100%}.win-message{animation:celebrate 1s ease-in-out infinite;color:green;font-size:clamp(18px,5vw,24px);font-weight:700;margin-top:20px}.refresh-button{align-items:center;background-color:#fff;border:2px solid gray;border-radius:50%;cursor:pointer;display:flex;height:40px;justify-content:center;margin:20px auto 0;width:40px}.refresh-button svg{height:24px;width:24px}@keyframes celebrate{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.boards{margin-top:16px}.boards-container{align-items:flex-start;display:flex;flex-wrap:wrap;gap:24px;justify-content:center;margin-top:16px}.board-wrapper{align-items:center;display:flex;flex-direction:column;gap:6px}.board-caption{color:#555;font-size:14px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.actionButton{border-radius:4px;color:#444;cursor:pointer;font-weight:500;padding:4px 8px;text-decoration:underline;transition:background-color .15s ease,color .15s ease}.actionButton:hover{background-color:#e8e8e8}.actionButton:active{background-color:#d0d0d0;color:#111}