:root{--bg: #f6e3cf;--card: #fffaf2;--ink: #4a3b35;--muted: #8a776c;--accent: #e8898f;--accent-dark: #c96a71;--blue: #7fa7c9;--shadow: 0 10px 30px rgba(74, 59, 53, .18);--ui: 1}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;color:var(--ink);background:linear-gradient(160deg,#e9dde6,#ddd3dd 45%,#e8dfe4);font-family:Fredoka,"Baloo 2",system-ui,sans-serif;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;touch-action:none}canvas{display:block;touch-action:none}[hidden]{display:none!important}.card{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(calc(380px * var(--ui)),calc(100vw - 32px));max-height:calc(100dvh - 24px);overflow:auto;background:#fffaf2e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:calc(24px * var(--ui));padding:calc(22px * var(--ui)) calc(22px * var(--ui)) calc(18px * var(--ui));box-shadow:var(--shadow);text-align:center;display:flex;flex-direction:column;gap:calc(10px * var(--ui));z-index:5}@media(min-width:700px){.card{left:max(3vw,env(safe-area-inset-left,0px));transform:translateY(-50%);width:min(calc(360px * var(--ui)),36vw)}}@media(max-width:699px){.card{top:auto;bottom:calc(12px + env(safe-area-inset-bottom,0px));transform:translate(-50%);max-height:70dvh}}#vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 50% 45%,transparent 60%,rgba(90,70,100,.18) 100%)}h1{margin:0;font-size:calc(34px * var(--ui));line-height:1}h1 span{color:var(--accent);display:block;font-size:calc(44px * var(--ui))}h2{margin:0;font-size:calc(22px * var(--ui))}.sub,p{margin:0;color:var(--muted);font-size:calc(16px * var(--ui))}button{font:inherit;cursor:pointer;border:0}.big{background:var(--accent);color:#fff;font-size:calc(19px * var(--ui));font-weight:600;padding:calc(13px * var(--ui)) calc(16px * var(--ui));border-radius:calc(16px * var(--ui));box-shadow:0 4px 0 var(--accent-dark);transition:transform .08s}.big:active{transform:translateY(3px);box-shadow:0 1px 0 var(--accent-dark)}.big.alt{background:var(--blue);box-shadow:0 4px #5f87a9}.big:disabled{opacity:.6}.link{background:none;color:var(--muted);text-decoration:underline;font-size:calc(15px * var(--ui));padding:4px}.code{font-size:calc(46px * var(--ui));font-weight:700;letter-spacing:8px;color:var(--ink)}.stars{font-size:calc(40px * var(--ui));color:#f2c14e;letter-spacing:4px}.recipes{list-style:none;padding:0;margin:4px 0;text-align:left;font-size:calc(14px * var(--ui));color:var(--muted);display:grid;gap:4px}.recipes b{color:var(--ink);display:inline-block;min-width:calc(72px * var(--ui))}#join-form{display:flex;flex-direction:column;gap:10px}#join-code{font:inherit;font-size:calc(40px * var(--ui));font-weight:700;text-align:center;letter-spacing:10px;text-transform:uppercase;border:3px solid #ead7c3;border-radius:16px;padding:8px;color:var(--ink);background:#fff;width:100%;user-select:text;-webkit-user-select:text}#hud{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));left:0;right:0;display:flex;justify-content:center;gap:6px;pointer-events:none;z-index:3;flex-wrap:wrap;padding:0 12px}.pill{background:#fffaf2eb;border-radius:999px;padding:calc(4px * var(--ui)) calc(12px * var(--ui));font-weight:600;font-size:calc(18px * var(--ui));box-shadow:0 3px 10px #4a3b351f;min-width:calc(52px * var(--ui));text-align:center}.pill.small{font-size:calc(13px * var(--ui));color:var(--muted);align-self:center}#hud-time.low{color:#d65f5f;animation:pulse .6s infinite alternate}@keyframes pulse{to{transform:scale(1.08)}}#toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%);background:var(--ink);color:#fff;padding:calc(10px * var(--ui)) calc(18px * var(--ui));border-radius:999px;z-index:10;font-size:calc(16px * var(--ui));max-width:calc(100vw - 32px);text-align:center}.howto{margin-top:4px}.steps{margin:0;padding-left:22px;text-align:left;font-size:calc(14px * var(--ui));color:var(--muted);display:grid;gap:4px}.steps b{color:var(--ink)}#hint{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translate(-50%);background:#fffaf2f2;color:var(--ink);padding:calc(8px * var(--ui)) calc(18px * var(--ui));border-radius:999px;font-size:calc(18px * var(--ui));box-shadow:0 3px 12px #4a3b3526;pointer-events:none;display:none;z-index:3;max-width:calc(100vw - 32px);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:600px){#hint{white-space:normal;width:max-content;border-radius:18px;line-height:1.25}}#hint:empty{display:none!important}#hint b{color:var(--accent-dark)}body.playing #hint{display:block}body.touch #hint{top:calc(52px + env(safe-area-inset-top,0px));bottom:auto;font-size:15px}@media(orientation:landscape){body.touch #hint{top:auto;bottom:calc(14px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 280px)}}#labels{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;display:none}body.playing #labels{display:block}.tag{position:absolute;left:0;top:0;transform:translate(-50%,-100%);white-space:nowrap;background:#4a3b35c7;color:#fff;font-size:calc(12px * var(--ui));padding:calc(2px * var(--ui)) calc(8px * var(--ui));border-radius:999px}#touch{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;display:none}#action-btn{display:none}body.touch.playing #touch{display:block}body.touch.playing #action-btn{display:grid;place-items:center;position:fixed;z-index:4;right:calc(24px + env(safe-area-inset-right,0px));bottom:calc(28px + env(safe-area-inset-bottom,0px));width:92px;height:92px;border-radius:50%;font-size:40px;background:#e8898fe6;color:#fff;box-shadow:0 5px 0 var(--accent-dark),var(--shadow);touch-action:none}#action-btn.down{transform:translateY(4px);box-shadow:0 1px 0 var(--accent-dark)}#stick-base{position:absolute;left:0;top:0;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#fffaf259;border:3px solid rgba(255,250,242,.8);display:none;pointer-events:none}#stick-base.on{display:block}#stick-knob{position:absolute;left:33px;top:33px;width:54px;height:54px;border-radius:50%;background:#fffaf2f2;box-shadow:0 3px 8px #0003}#stats{position:fixed;left:8px;bottom:8px;z-index:20;font:12px ui-monospace,monospace;background:#0009;color:#fff;padding:3px 8px;border-radius:6px;pointer-events:none}.edge{position:absolute;left:0;top:0;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:#fffaf2f2;border:3px solid var(--c);box-shadow:0 3px 10px #4a3b3540}.edge .arr{position:absolute;left:50%;top:50%;width:0;height:0;margin:-7px 0 0 -5px;border:7px solid transparent;border-left:10px solid var(--c);border-right:0;transform:rotate(var(--a)) translate(30px)}.edge.urgent{animation:nudge .35s infinite alternate}@keyframes nudge{to{scale:1.12}}.tag .ico{display:none}@media(max-width:600px),(max-height:520px){.tag{font-size:15px;padding:1px 5px}.tag .ico{display:inline}.tag .txt{display:none}}