body{min-height:100vh;background:linear-gradient(180deg,var(--sky) 0%,var(--sky-light) 60%,var(--grass) 60%,var(--grass-dark) 100%);display:flex;align-items:center;justify-content:center;padding:16px}#root{width:100%;display:flex;justify-content:center}.card{width:min(420px,100%);background:var(--cream);border:3px solid var(--ink);border-radius:22px;padding:28px 24px;box-shadow:0 10px #3b2a1a40;text-align:center}.card .title{margin-bottom:14px;font-size:40px}.state{display:flex;flex-direction:column;gap:12px}.state p{margin:0;line-height:1.5}input{font:inherit;font-size:18px;padding:10px 14px;border:2px solid var(--ink);border-radius:12px;background:#fff}.button{font:inherit;font-size:20px;font-weight:700;cursor:pointer;padding:12px 16px;border:2px solid var(--ink);border-radius:14px;background:var(--pink);color:#fff;text-decoration:none;display:block;box-shadow:0 4px 0 var(--ink)}.button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}.button--light{background:#fff;color:var(--ink)}.link{background:none;border:0;color:var(--ink);font:inherit;font-size:15px;text-decoration:underline;cursor:pointer}.avatar{width:64px;height:64px;margin:0 auto;border-radius:50%;border:3px solid var(--ink);object-fit:cover}.error{color:var(--danger)}.games-link{display:inline-block;margin-top:18px;color:var(--ink);font-size:14px}