.app{max-width:520px;margin:30px auto;}
.card-game{background:white;border-radius:20px;box-shadow:0 15px 40px rgba(0,0,0,.1);overflow:hidden;}
.headerb{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;text-align:center;padding:20px;}
.headerb h3{margin:0;font-weight:900;}
.body{padding:18px;}
.letters-input{width:100%;height:60px;border-radius:16px;border:2px solid #4f46e5;text-align:center;font-size:22px;font-weight:900;letter-spacing:4px;outline:none;}
.letters-input:focus{border-color:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.25);}
.preview{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:12px;}
.letter{width:36px;height:36px;border-radius:50%;background:#f59e0b;color:white;display:flex;align-items:center;justify-content:center;font-weight:900;}
.actions{display:grid;grid-template-columns:1fr 120px;gap:10px;margin-top:16px;}
.btn-search{background:#4f46e5;color:white;border:none;border-radius:14px;height:50px;font-weight:900;}
.btn-clear{border-radius:14px;border:1px solid #ccc;height:50px;}
.info{display:flex;gap:8px;margin-top:15px;}
.info div{flex:1;background:#f1f5f9;border-radius:12px;padding:10px;text-align:center;font-size:13px;}
.results{margin-top:16px;}
.group{background:#f8fafc;border-radius:14px;padding:12px;margin-bottom:12px;border:1px solid #e2e8f0;}
.group-title{display:flex;justify-content:space-between;font-weight:900;margin-bottom:8px;}
.words{display:flex;flex-wrap:wrap;gap:6px;}
.word{background:white;border-radius:999px;padding:6px 12px;border:1px solid #ddd6fe;font-weight:900;}
.message{text-align:center;padding:20px;color:#64748b;}