:root{--bg:#10233f;--panel:#172f52;--panel2:#214675;--text:#f8fbff;--muted:#adbad0;--gold:#ffd166;--pink:#78d7ff;--mint:#8df0b7;--line:rgba(255,255,255,.1)}.app{width:min(100%,980px);max-width:980px;padding:0 22px}.hero-icons span{font-size:34px}.screen.welcome,.screen.game,.screen.result{max-width:860px;margin:0 auto}.letter-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;max-width:760px;margin:18px auto 0;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:rgba(23,47,82,.55)}.letter-button{aspect-ratio:1;min-width:0;border:1px solid var(--line);border-radius:14px;color:white;background:rgba(23,47,82,.92);font-size:18px;font-weight:800;cursor:pointer;display:grid;place-items:center}.letter-button.selected{border-color:var(--gold);background:rgba(255,209,102,.22);color:var(--gold)}.letter-button.solved{border-color:var(--mint);background:rgba(141,240,183,.22);color:var(--mint)}.current-word{margin:18px auto 0;color:var(--gold);font-size:18px;font-weight:800;min-height:28px;max-width:760px}.game .secondary-button,.screen.result .secondary-button{max-width:380px;margin:16px auto 0}@media(max-width:720px){.app{padding:0 18px}.letter-grid{gap:6px;padding:12px}.hero-icons{gap:10px}.hero-icons span{width:72px;height:72px;font-size:30px}.hero-icons span:nth-child(2){width:84px;height:84px}}@media(max-width:560px){.app{padding:0 12px}.letter-grid{gap:4px;padding:10px}.letter-button{font-size:14px;border-radius:10px}.current-word{font-size:16px}.hero-icons{gap:8px}.hero-icons span{width:62px;height:62px;font-size:26px}.hero-icons span:nth-child(2){width:74px;height:74px}}