*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Arial,sans-serif;background:#0b0e13;color:#e7e7ea}
.container{max-width:560px;margin:0 auto;padding:16px}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
h1{margin:0;font-size:28px}
.stats{display:flex;gap:12px;align-items:center;opacity:.9}
.hard{font-size:14px;cursor:pointer}
.subtitle{opacity:.8;margin-top:4px}
.guess-form{display:flex;gap:8px;margin-top:10px}
.guess-form input{flex:1;padding:12px;border-radius:10px;border:1px solid #2a2f39;background:#0f131a;color:#e7e7ea;font-size:18px;letter-spacing:2px}
.guess-form button{padding:12px 14px;border-radius:10px;border:1px solid #2a2f39;background:#1a2030;color:#fff;cursor:pointer}
.keypad{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;margin-top:10px}
.keypad button{padding:10px 0;border-radius:10px;border:1px solid #2a2f39;background:#121826;color:#e7e7ea;cursor:pointer}
.keypad .wide{grid-column:span 5}
.board{margin-top:16px}
.guesses{list-style:none;padding:0;margin:8px 0 0}
.guesses li{display:flex;justify-content:space-between;padding:8px 12px;border:1px solid #2a2f39;background:#0f131a;border-radius:10px;margin-top:6px}
.result{margin-top:16px;padding:12px;border:1px solid #2a2f39;background:#0f131a;border-radius:12px}
.hidden{display:none}
.buttons{display:flex;gap:8px}
.footer{margin-top:24px;opacity:.7}
.countdown{margin-top:6px;opacity:.8;font-size:14px}