body { margin:0; font-family:Arial; background:#2e5a1e; color:white; display:flex; justify-content:center; align-items:center; min-height:100vh; }
.screen { display:none; width:100%; max-width:700px; padding:20px; box-sizing:border-box; text-align:center; }
.screen.active { display:block; }
.auth-form { margin:10px 0; }
.auth-form input { display:block; margin:10px auto; padding:8px; width:200px; }
.hidden { display:none; }
.error { color:#ff6666; }
button { padding:10px 20px; margin:5px; cursor:pointer; }
.board-container { background:#d49c6b; border-radius:10px; padding:10px; }
canvas { width:100%; height:auto; cursor:pointer; }
.controls { margin-top:10px; }
#dice-container { margin:10px 0; }
.die { display:inline-block; width:40px; height:40px; background:white; color:black; line-height:40px; font-size:24px; margin:5px; border-radius:5px; }