:root{--ink:#3a2418;--cream:#fff7ea;--pom:#c8193a;--font:"Fredoka", ui-rounded, "SF Pro Rounded", system-ui, sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%;font-family:var(--font);color:var(--ink);-webkit-user-select:none;user-select:none;background:#a9d4ef;margin:0;overflow:hidden}#app,canvas{width:100%;height:100%;display:block}.vignette{pointer-events:none;background:radial-gradient(#0000 55%,#28140a47 100%);position:fixed;inset:0}.hud{pointer-events:none;gap:12px;display:flex;position:fixed;top:18px;left:20px}.pill{font-variant-numeric:tabular-nums;background:#fff7eae6;border-radius:999px;align-items:center;gap:8px;padding:6px 16px 6px 8px;font-size:22px;font-weight:700;display:flex;box-shadow:0 4px #3a24182e,0 10px 24px #3a241826}.pill svg{width:32px;height:32px}.hearts{gap:2px;padding-left:10px}.heart{transition:transform .2s,opacity .2s;width:26px!important;height:26px!important}.heart.lost{opacity:.22;transform:scale(.8)}.controls{pointer-events:none;background:#fff7eac7;border-radius:14px;flex-wrap:wrap;justify-content:center;gap:6px 14px;max-width:calc(100% - 24px);padding:8px 18px;font-size:14px;font-weight:500;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}kbd{background:var(--cream);min-width:22px;font-family:var(--font);text-align:center;border:1px solid #3a241840;border-bottom-width:3px;border-radius:6px;margin-right:3px;padding:1px 6px;font-size:12px;font-weight:600;display:inline-block}.overlay{cursor:pointer;background:radial-gradient(#fff0d78c,#5a321973);place-items:center;display:grid;position:fixed;inset:0}.card{text-align:center;background:var(--cream);border-radius:28px;max-width:min(520px,100% - 32px);padding:28px 44px 30px;box-shadow:0 8px #3a241833,0 30px 60px #3a24184d}.card h1{letter-spacing:1px;color:var(--ink);text-shadow:0 5px #e9b36a;margin:0;font-size:clamp(56px,12vw,96px);line-height:1}.card h2{color:var(--pom);margin:0 0 6px;font-size:40px}.card p{margin:12px 0 0;font-size:18px;font-weight:500}.card .sub{opacity:.7;font-size:15px}.cta{background:var(--pom);color:#fff;border-radius:999px;margin-top:18px;padding:10px 26px;font-size:20px;font-weight:700;animation:1.4s ease-in-out infinite bob;display:inline-block;box-shadow:0 5px #8a0f26}.toast{color:var(--cream);pointer-events:none;background:#3a2418d1;border-radius:999px;padding:8px 20px;font-size:18px;font-weight:600;transition:opacity .3s;position:fixed;top:84px;left:50%;transform:translate(-50%)}.name-field{text-align:left;flex-direction:column;gap:6px;max-width:260px;margin:18px auto 0;font-size:14px;font-weight:600;display:flex}.name-field input{font:600 18px var(--font);color:var(--ink);background:#fff;border:2px solid #3a241833;border-radius:12px;outline:none;padding:10px 14px}.name-field input:focus{border-color:var(--pom)}.cta{cursor:pointer}.room{background:#fff7eae6;border-radius:16px;min-width:190px;padding:10px 14px;font-size:15px;font-weight:600;position:fixed;top:18px;right:20px;box-shadow:0 4px #3a24182e,0 10px 24px #3a241826}.room-head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.dot{background:#999;border-radius:50%;width:10px;height:10px}.room[data-status=online] .dot{background:#2f9e44;box-shadow:0 0 0 3px #2f9e4440}.room[data-status=connecting] .dot{background:#f7c325}.room[data-status=offline] .dot{background:#b0a79c}.room[data-status=offline] [data-invite]{display:none}.room button{background:var(--pom);color:#fff;font:600 12px var(--font);cursor:pointer;border:0;border-radius:999px;margin-left:auto;padding:3px 10px}.roster{gap:4px;margin:8px 0 0;padding:0;font-weight:500;list-style:none;display:grid}.roster li{align-items:center;gap:8px;display:flex}.roster li:before{content:"";background:var(--accent);border-radius:4px;width:12px;height:12px}.tag-layer{pointer-events:none;position:fixed;inset:0;overflow:hidden}.name-tag{background:var(--accent);color:#fff;white-space:nowrap;border-radius:999px;padding:2px 10px;font-size:13px;font-weight:600;position:absolute;top:0;left:0;box-shadow:0 2px #0003}@media (width<=640px){.room{top:auto;bottom:110px;right:12px}.controls{font-size:12px}}@keyframes bob{50%{transform:translateY(-4px)}}