*,:before,:after{box-sizing:border-box}body{background:#111827;margin:0}#root{width:100%;min-height:100svh}.game{color:#f9fafb;-webkit-user-select:none;user-select:none;background:#111827;flex-direction:column;align-items:center;min-height:100svh;font-family:system-ui,Segoe UI,sans-serif;display:flex}.header{text-align:center;border-bottom:1px solid #1f2937;width:100%;padding:24px 16px 12px}.title{letter-spacing:.35em;color:#f9fafb;margin:0;font-size:2rem;font-weight:800}.date{color:#6b7280;letter-spacing:.05em;text-transform:capitalize;margin:4px 0 0;font-size:.8rem}.toast{color:#111827;z-index:100;white-space:nowrap;background:#f9fafb;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;animation:.15s fadeIn;position:fixed;top:80px;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #00000080}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%)translateY(-6px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.board-wrap{flex-direction:column;flex:1;justify-content:center;align-items:center;padding:24px 16px;display:flex}.board{flex-direction:column;gap:8px;display:flex}.alphabet-key{flex-wrap:wrap;justify-content:center;gap:8px;max-width:480px;margin-top:32px;display:flex}.alphabet-key__letter{color:#9ca3af;border-radius:6px;justify-content:center;align-items:center;width:40px;height:46px;font-size:1.1rem;font-weight:700;transition:color .15s,opacity .15s,background .15s;display:inline-flex}.alphabet-key__letter--untried{color:#f9fafb}.alphabet-key__letter--red{color:#fee2e2;background:#991b1b}.alphabet-key__letter--yellow{color:#fef3c7;background:#92400e}.alphabet-key__letter--none{opacity:.35;color:#6b7280}.row{gap:8px;display:flex}.row--active .tile--active{border-color:#9ca3af}.tile{letter-spacing:.02em;border:2px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:58px;height:58px;font-size:1.6rem;font-weight:800;transition:background .1s,border-color .1s;display:flex}.tile--empty{color:#0000;background:0 0;border-color:#374151}.tile--active{color:#f9fafb;background:#1f2937;border-color:#6b7280}.tile--none{color:#9ca3af;background:#374151}.tile--yellow{color:#fef3c7;background:#92400e;border-color:#d97706}.tile--red{color:#fee2e2;background:#991b1b;border-color:#dc2626}.end-banner{letter-spacing:.02em;text-align:center;border-radius:10px;margin-bottom:24px;padding:14px 28px;font-size:1.05rem;font-weight:700}.end-banner--won{color:#bbf7d0;background:#14532d;border:1px solid #16a34a}.end-banner--lost{color:#9ca3af;background:#1f2937;border:1px solid #374151}.end-banner p{margin:0 0 12px}.share-btn{color:inherit;cursor:pointer;background:#ffffff26;border:1px solid #ffffff4d;border-radius:8px;justify-content:center;align-items:center;padding:10px 20px;font-size:.9rem;font-weight:600;transition:background .15s,border-color .15s;display:inline-flex}.share-btn:hover{background:#fff3;border-color:#fff6}.footer-hint{color:#4b5563;letter-spacing:.05em;text-transform:uppercase;margin-bottom:16px;padding:12px;font-size:.78rem}.loading,.api-error{color:#6b7280;margin:auto;font-size:1rem}.api-error{color:#f87171;text-align:center;padding:20px}@media (width<=480px){.tile{width:46px;height:46px;font-size:1.3rem}.board,.row{gap:6px}.alphabet-key{gap:6px;max-width:340px;margin-top:24px}.alphabet-key__letter{width:32px;height:38px;font-size:.95rem}}