:root{--bg:#1b1626;--panel:#241d33;--fg:#f3eefa;--muted:#a79fbd;--line:#3b3152;--accent:#ffd23a;--accent-ink:#2b2140;--bubble:#fff;--bubble-ink:#2b2140;--bad:#ff7a7a;--good:#7ee08f;--display:"Pixelify Sans", "IBM Plex Sans Thai", "Noto Sans Thai", "Leelawadee UI", sans-serif;--body:"IBM Plex Sans Thai", "Noto Sans Thai", "Leelawadee UI", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;overflow:hidden}#app{grid-template-rows:auto 1fr auto;height:100%;display:grid}.bar{padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));padding-block:max(8px, env(safe-area-inset-top,0px)) 8px;background:var(--panel);border-bottom:2px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;display:flex}.bar h1{font-family:var(--display);margin:0 auto 0 0;font-size:20px;line-height:1.2}.btn{font-family:var(--display);background:var(--bg);color:var(--fg);border:2px solid var(--line);cursor:pointer;touch-action:manipulation;border-radius:0;min-height:44px;padding:4px 12px;font-size:15px}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.45;cursor:default;border-color:var(--line)}.btn:focus-visible,#msg:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn.primary,#exitBtn{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}#fps{font-family:var(--display);color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;min-width:56px;font-size:13px}#stage{background:var(--sky,linear-gradient(#8fd0f0, #d6f0ff 70%));min-height:0;position:relative;overflow:hidden}#stage.night{background:radial-gradient(120% 90% at 50% 40%,#3a2d52 0%,#1b1626 70%)}#gl{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#gl.px{image-rendering:pixelated;image-rendering:crisp-edges}.labels{pointer-events:none;z-index:1;position:absolute;inset:0}.tag{will-change:transform;flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;top:0;left:0}.name{color:var(--fg);white-space:nowrap;background:#1b1626bf;padding:0 6px;font-size:13px;font-weight:600;line-height:1.5}.place{font-family:var(--display);color:var(--bubble-ink);border:2px solid var(--bubble-ink);white-space:nowrap;background:#ffffffe0;padding:0 6px;font-size:13px;line-height:1.4}.bub{background:var(--bubble);color:var(--bubble-ink);border:2px solid var(--bubble-ink);text-align:center;transform-origin:50% 100%;width:max-content;max-width:200px;padding:4px 8px;font-size:14px;line-height:1.4;position:relative}.bub:after{content:"";background:var(--bubble-ink);clip-path:polygon(0 0,100% 0,50% 100%);width:8px;height:6px;margin-left:-4px;position:absolute;bottom:-8px;left:50%}.bub.pop,#toast.pop{animation:.42s cubic-bezier(.34,1.8,.5,1) pop}@keyframes pop{0%{transform:scale(.3)}to{transform:scale(1)}}#log{left:max(12px, env(safe-area-inset-left,0px));pointer-events:none;gap:2px;max-width:min(70%,360px);display:grid;position:absolute;bottom:10px}#log div{color:var(--fg);background:#1b16269e;padding:1px 8px;font-size:14px}#log b{color:var(--accent);font-weight:600}#toast{text-align:center;background:var(--bubble);width:300px;color:var(--bubble-ink);border:2px solid var(--bubble-ink);z-index:5;cursor:pointer;margin-left:-150px;padding:8px 12px;font-size:14px;position:absolute;top:30%;left:50%}#fade{opacity:0;pointer-events:none;background:#000;transition:opacity .25s;position:absolute;inset:0}#fade.on{opacity:1}form#chat{padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));padding-block:8px max(8px, env(safe-area-inset-bottom,0px));background:var(--panel);border-top:2px solid var(--line);gap:8px;display:flex}#msg{min-width:0;font-family:var(--body);background:var(--bg);color:var(--fg);border:2px solid var(--line);border-radius:0;flex:1;padding:6px 10px;font-size:16px}@media (width<=420px){#toast{width:260px;margin-left:-130px}}@media (prefers-reduced-motion:reduce){.bub.pop,#toast.pop,.sheet,.resultban,#hud .coins.bump,#hud .float{animation:none}#fade{transition:none}}#hud{left:max(12px, env(safe-area-inset-left,0px));z-index:3;border:2px solid var(--line);background:#1b1626d1;gap:4px;width:min(250px,100% - 24px);padding:8px 10px;font-size:13px;display:grid;position:absolute;top:10px}#hud .who{font-family:var(--display);color:var(--fg);font-size:16px}#hud .row{justify-content:space-between;gap:8px;display:flex}#hud .coins{font-family:var(--display);color:var(--accent);font-variant-numeric:tabular-nums;font-size:18px}#hud .muted,.sheet .muted{color:var(--muted)}#hud .news{font:inherit;color:var(--muted);text-align:left;border:0;border-left:2px solid var(--accent);cursor:pointer;background:0 0;padding:0 0 0 6px}#hud .bday{font-size:12px}#hud .row{position:relative}#hud .coins.bump{animation:.5s cubic-bezier(.34,1.56,.64,1) bump}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.35)}to{transform:scale(1)}}#hud .float{font-family:var(--display);color:var(--good);pointer-events:none;font-size:15px;animation:1s cubic-bezier(.22,1,.36,1) forwards floatup;position:absolute;top:-4px;right:0}@keyframes floatup{0%{opacity:0;transform:translateY(6px)scale(.6)}20%{opacity:1;transform:translateY(0)scale(1.1)}to{opacity:0;transform:translateY(-26px)scale(1)}}.meter i b{transition:width .6s cubic-bezier(.34,1.56,.64,1)}.meter{grid-template-columns:68px 1fr;align-items:center;gap:6px;display:grid}.meter i{background:var(--line);height:8px;display:block;position:relative}.meter i b{background:var(--good);position:absolute;inset:0 auto 0 0}.meter.stress i b{background:var(--bad)}.meter.happy i b{background:#ffb3d1}#clockPill{font-family:var(--display);border:2px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;min-height:28px;padding:2px 6px;font-size:13px}#clockPill.on{border-color:var(--accent);color:var(--accent)}#banner{z-index:4;color:#ffe0e6;text-align:center;background:#5a2333;border:2px solid #ff7a9a;max-width:calc(100% - 290px);padding:4px 12px;font-size:13px;position:absolute;top:10px;left:50%;transform:translate(-50%)}@media (width<=600px){#banner{max-width:calc(100% - 24px);top:auto;bottom:120px}}#sheetWrap{z-index:10;background:#0a061273;justify-content:center;align-items:flex-end;display:flex;position:absolute;inset:0}#sheetWrap[hidden]{display:none}.sheet{background:var(--panel);border:2px solid var(--line);width:min(560px,100%);max-height:88%;padding:14px max(16px, env(safe-area-inset-right,0px)) max(16px, env(safe-area-inset-bottom,0px)) max(16px, env(safe-area-inset-left,0px));border-bottom:0;gap:10px;animation:.3s cubic-bezier(.34,1.5,.5,1) rise;display:grid;overflow:auto}.sheet.swap{animation:none}.sheet.playing{max-height:100%}.sheet .game{gap:8px;display:grid;position:relative}.resultban{font-family:var(--display);white-space:nowrap;background:var(--accent);color:var(--accent-ink);border:3px solid var(--accent-ink);pointer-events:none;padding:8px 18px;font-size:26px;animation:.35s cubic-bezier(.34,1.56,.64,1) banner;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%)}.resultban.bad{color:#ffe0e6;background:#5a2333;border-color:#ff7a9a}@keyframes banner{0%{transform:translate(-50%,-50%)scale(.3)}to{transform:translate(-50%,-50%)scale(1)}}.sheet .letters li,.sheet .letter{font-style:italic}@keyframes rise{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}.sheet h2{font-family:var(--display);justify-content:space-between;align-items:center;gap:8px;margin:0;font-size:20px;display:flex}.sheet p{margin:0;line-height:1.5}.sheet .grid2{grid-template-columns:1fr 1fr;gap:6px 12px;display:grid}.sheet .grid2 b{font-family:var(--display);font-variant-numeric:tabular-nums;text-align:right;font-weight:500}.sheet .acts{flex-wrap:wrap;gap:8px;display:flex}.sheet .acts .btn{flex:auto}.sheet textarea,.sheet input[type=number]{width:100%;font-family:var(--body);background:var(--bg);color:var(--fg);border:2px solid var(--line);padding:6px 8px;font-size:16px}.sheet textarea{resize:vertical;min-height:72px}.sheet canvas{background:var(--bg);border:2px solid var(--line);width:100%;height:120px;image-rendering:pixelated}.sheet .note{color:var(--muted);font-size:14px}.sheet .warn{color:var(--bad)}.sheet ul{gap:2px;margin:0;padding-left:20px;display:grid}.sheet .perk{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.sheet .perk .btn[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.mg{grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,330px);margin:0 auto;display:grid}.mg button{aspect-ratio:1;border:2px solid var(--line);cursor:pointer;color:var(--fg);touch-action:manipulation;background:#3a2d52;border-radius:0;place-items:center;font-size:34px;display:grid}.mg button.lit{border-color:var(--accent);background:#6b4a2a;animation:.25s cubic-bezier(.34,1.8,.5,1) pop}.mg button.hit{background:#2f5a3a}.mgbar{background:var(--line);height:8px}.mgbar b{background:var(--accent);height:100%;display:block}canvas.pvz{aspect-ratio:8/5;width:100%;height:auto;image-rendering:pixelated;border:2px solid var(--line);touch-action:none;cursor:pointer}.sheet canvas.pvz{height:auto}.pvzbar{font-family:var(--display);color:var(--accent);font-variant-numeric:tabular-nums;font-size:15px}.pvzpick{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.pvzpick .btn{justify-items:center;gap:0;padding:4px;font-size:13px;line-height:1.25;display:grid;position:relative;overflow:hidden}.pvzpick .btn small{color:var(--accent);font-size:13px}.pvzpick .btn.poor small{color:var(--bad)}.pvzpick .btn.cooling:after{content:"";height:calc(var(--cd,0) * 100%);pointer-events:none;background:#0a061299;position:absolute;top:0;left:0;right:0}.pvzpick .btn.poor canvas,.pvzpick .btn.cooling canvas{opacity:.55}.pvzpick .btn canvas{width:32px;height:32px;image-rendering:pixelated;background:0 0;border:0}.pvzpick .btn[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}#hud .btn.goals{text-align:left;min-height:36px;padding:2px 8px;font-size:13px}.tag.pointer{color:var(--accent);text-shadow:0 2px #2b2140,0 -2px #2b2140,2px 0 #2b2140,-2px 0 #2b2140;pointer-events:none;font-size:26px}@media (width<=420px){.bar h1{font-size:16px}.bar{gap:6px}}@media (height<=500px){.sheet{max-height:100%}#hud .news,#hud .bday{display:none}}@media (width<=600px){#hud{gap:3px;width:206px;padding:6px 8px;font-size:13px}#hud .who{font-size:14px}#hud .coins{font-size:16px}.meter{grid-template-columns:60px 1fr}.meter i{height:6px}}.sheet .wardrobe{grid-template-columns:repeat(5,1fr);gap:4px;display:grid}.sheet .wardrobe .btn{justify-items:center;gap:2px;padding:4px 2px;font-size:12px;display:grid}.sheet .wardrobe .btn[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.sheet .wardrobe canvas{background:0 0;border:0;width:40px;height:54px}.order{background:var(--bg);border:2px solid var(--line);grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;padding:6px 10px;display:grid}.order .big{grid-row:span 2;font-size:40px}.order .muted{color:var(--muted);font-size:13px}.shelf{grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,360px);margin:0 auto;display:grid}.shelf button{aspect-ratio:1.2;border:2px solid var(--line);cursor:pointer;touch-action:manipulation;background:#3a2d52;border-radius:0;font-size:40px}.shelf button.hit{border-color:var(--good);background:#2f5a3a}.shelf button.miss{border-color:var(--bad);background:#5a2333}.mg,.shelf{position:relative}.countdown{font-family:var(--display);color:var(--accent);pointer-events:none;text-shadow:0 3px #2b2140,0 -3px #2b2140,3px 0 #2b2140,-3px 0 #2b2140;place-items:center;font-size:64px;display:grid;position:absolute;inset:0}.countdown.pop{animation:.5s cubic-bezier(.34,1.56,.64,1) cdpop}@keyframes cdpop{0%{opacity:0;transform:scale(1.7)}to{opacity:1;transform:scale(1)}}.mg button.shake,.shelf button.shake{animation:.2s cubic-bezier(.36,.07,.19,.97) shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (prefers-reduced-motion:reduce){.countdown.pop,.mg button.shake,.shelf button.shake{animation:none}}
