.c4-container{font-family:sans-serif;text-align:center;margin:0;background-color:#deb887;min-height:100vh;overflow-x:hidden;display:flex;flex-direction:column}.title{background-color:#302e2e;height:100px;color:#fff;display:flex;align-items:center;justify-content:center;width:100%;flex-shrink:0}.title h1{margin:0;font-size:2rem}.game-layout{display:flex;flex-grow:1;align-items:center;justify-content:center;padding:20px;gap:5vw;height:calc(100vh - 227px)}.controls{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:250px;padding:130px}.status{width:230px;margin-bottom:25px;font-size:1.1rem;font-weight:700;text-align:center;background-color:#fff3;padding:10px;border-radius:8px}.control-actions{display:flex;flex-direction:column;gap:12px;width:100%;max-width:250px}button{padding:10px 20px;font-size:1rem;cursor:pointer;background-color:#333;color:#fff;border:none;border-radius:4px;width:100%;transition:background-color .2s ease;height:50px}button:hover{background-color:#555}.board{display:grid;grid-template-columns:repeat(7,6vw);grid-template-rows:repeat(6,6vw);background-color:beige;outline:1px solid black;width:fit-content}.field{border:1px solid black;width:6vw;height:6vw;display:flex;justify-content:center;align-items:center;cursor:pointer}.field:hover{background-color:#c6c5c5}.piece{width:4.5vw;height:4.5vw;border-radius:50%}.piece.blue{background-color:#00f;animation:drop .3s ease-out}.piece.red{background-color:red;animation:drop .3s ease-out}.error-msg{color:#900;margin-top:10px;background:#ffffff80;padding:5px;border-radius:4px}@keyframes drop{0%{transform:translateY(-300%);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:800px){.game-layout{flex-direction:column-reverse;height:auto}.board{grid-template-columns:repeat(7,12vw);grid-template-rows:repeat(6,12vw)}.field{width:12vw;height:12vw}.piece{width:9vw;height:9vw}}