:root{--panel:#fff8ecdb;--ink:#3b2a1e;--accent:#e0794a;--accent2:#5c9c8c;--radius:18px;--shadow:0 6px 20px #3c230a38;--edge:max(14px, env(safe-area-inset-left));--edge-r:max(14px, env(safe-area-inset-right));--edge-b:max(14px, env(safe-area-inset-bottom));--bar-h:46px}*{box-sizing:border-box;margin:0}html,body{overscroll-behavior:none;background:#20160f;width:100%;height:100%;overflow:hidden}body{color:var(--ink);-webkit-tap-highlight-color:transparent;font-family:Nunito,ui-rounded,system-ui,sans-serif}button,input{font:inherit;color:inherit}[hidden]{display:none!important}#app{position:fixed;inset:0;overflow:hidden}#stage,#stage canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#tags{pointer-events:none;position:absolute;inset:0;overflow:hidden}.panel{background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px)}#place{left:var(--edge);top:max(14px, env(safe-area-inset-top));white-space:nowrap;pointer-events:none;padding:9px 18px;font-size:17px;position:absolute}#place b{letter-spacing:.01em;font-weight:800}#place span{opacity:.6;margin-left:8px;font-weight:600}#place.down b:after{content:"";background:var(--accent);vertical-align:2px;border-radius:50%;width:7px;height:7px;margin-left:8px;animation:1s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{50%{opacity:.2}}#log{left:var(--edge);top:calc(max(14px, env(safe-area-inset-top)) + 50px);width:min(360px, calc(100vw - var(--edge) - var(--edge-r)));pointer-events:none;flex-direction:column;align-items:flex-start;gap:4px;display:flex;position:absolute}#log p{overflow-wrap:anywhere;background:#fff8ecc7;border-radius:12px;max-width:100%;padding:4px 11px 5px;font-size:14px;font-weight:600;line-height:1.3;transition:opacity .6s;box-shadow:0 2px 8px #3c230a1f}#log p b{margin-right:6px;font-weight:800}#log p.me b{color:var(--accent)}#log p.old{opacity:.55}#log p.note{background:#fff4dee6;font-style:italic;font-weight:700}#arcade{z-index:10;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:absolute;inset:0}#arcade iframe{border:0;width:100%;height:100%;display:block}#arcade .close{top:calc(env(safe-area-inset-top) + 10px);right:calc(env(safe-area-inset-right) + 10px);cursor:pointer;background:#fff8ec29;border:0;border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:absolute}#arcade .close svg{stroke:#f3e6d4;fill:none;stroke-width:2.4px;stroke-linecap:round;width:22px;height:22px}#toasts{z-index:20;left:50%;top:max(14px, env(safe-area-inset-top));pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;transform:translate(-50%)}.toast{--tier:#c98a52;background:var(--panel);min-width:190px;box-shadow:var(--shadow), inset 0 -3px 0 var(--tier);border-radius:16px;flex-direction:column;align-items:center;padding:9px 20px 10px;transition:opacity .5s;animation:.35s ease-out toast;display:flex}.toast[data-tier=silver]{--tier:#9aa4ad}.toast[data-tier=gold]{--tier:#e1b23c}.toast[data-tier=platinum]{--tier:#7fc4c9}.toast b{font-size:16px;font-weight:800}.toast span{opacity:.7;font-size:13px;font-weight:600}.toast.fade{opacity:0}@keyframes toast{0%{opacity:0;transform:translateY(-10px)}}#bar{left:50%;bottom:var(--edge-b);width:min(560px, calc(100vw - var(--edge) - var(--edge-r)));align-items:center;gap:8px;padding:7px;display:flex;position:absolute;transform:translate(-50%)}#say{min-width:0;height:var(--bar-h);border-radius:calc(var(--radius) - 6px);background:#0000000f;border:0;outline:none;flex:1;padding:0 16px;font-size:16px;font-weight:600}#say::placeholder{color:var(--ink);opacity:.5}#say:focus{background:#ffffffbf;box-shadow:inset 0 0 0 2px #e0794a73}#say.nope{animation:.3s nope;box-shadow:inset 0 0 0 2px #c94f4f}@keyframes nope{25%{transform:translate(-5px)}75%{transform:translate(5px)}}#bar button{width:var(--bar-h);height:var(--bar-h);border-radius:calc(var(--radius) - 6px);cursor:pointer;background:#0000000f;border:0;flex:none;place-items:center;display:grid}#bar button:active{transform:scale(.94)}#bar button svg{width:24px;height:24px;stroke:var(--ink);fill:none;stroke-width:2.1px;stroke-linecap:round;stroke-linejoin:round}#bar #send{background:var(--accent)}#bar #send svg{stroke:#fff}#bar button.on{background:var(--accent2)}#bar button.on svg{stroke:#fff}.tag{white-space:nowrap;will-change:transform;background:#fff8ecdb;border-radius:10px;padding:2px 9px 3px;font-size:13px;font-weight:800;position:absolute;top:0;left:0;box-shadow:0 2px 6px #3c230a2e}.tag.me{background:var(--accent);color:#fff}.bubble{opacity:var(--a,1);color:#222;overflow-wrap:anywhere;width:max-content;max-width:230px;box-shadow:var(--shadow);will-change:transform;background:#fff;border-radius:16px;padding:8px 14px 9px;font-size:15px;font-weight:700;line-height:1.28;transition:opacity .35s;position:absolute;top:0;left:0}.bubble:after{content:"";left:var(--tail,50%);border:8px solid #0000;border-top-color:#fff;border-bottom:0;margin-left:-8px;position:absolute;bottom:-8px}.bubble.fade{opacity:0}#join{background:#20160f47;place-items:center;padding:16px;display:grid;position:absolute;inset:0}#join form{background:#fff8ecf2;flex-direction:column;gap:16px;width:min(380px,100%);padding:20px;display:flex}#join h1,#join .only{text-align:center;font-size:22px;font-weight:800}#join .only{flex:1}#looks{justify-content:center;gap:10px;display:flex}#looks button{aspect-ratio:3/5;cursor:pointer;background:#0000000f;border:0;border-radius:14px;flex:1;max-height:34vh;position:relative;overflow:hidden}#looks button canvas{object-fit:contain;object-position:bottom;pointer-events:none;width:calc(100% - 8px);height:calc(100% - 12px);position:absolute;top:8px;left:4px}#looks button[aria-checked=true]{box-shadow:inset 0 0 0 3px var(--accent);background:#e0794a2e}#join .row{gap:10px;display:flex}#name{background:#0000000f;border:0;border-radius:12px;outline:none;flex:1;min-width:0;height:48px;padding:0 16px;font-size:17px;font-weight:700}#name:focus{background:#fffc;box-shadow:inset 0 0 0 2px #e0794a73}#name.nope{animation:.3s nope;box-shadow:inset 0 0 0 2px #c94f4f}#go{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:12px;height:48px;padding:0 22px;font-size:17px;font-weight:800}#go:disabled{opacity:.45;cursor:default}#fps{white-space:pre;right:var(--edge-r);bottom:calc(var(--edge-b) + 64px);color:#fff;pointer-events:none;background:#20160fc7;border-radius:12px;padding:6px 12px;font:800 14px/1.2 ui-monospace,monospace;position:absolute}@media (width<=600px),(height<=500px){:root{--bar-h:40px;--radius:16px}#place{padding:6px 13px;font-size:14px}#log{top:calc(max(10px, env(safe-area-inset-top)) + 38px)}#log p{font-size:13px}#bar{gap:6px;padding:5px}#say{padding:0 12px;font-size:16px}#bar button svg{width:20px;height:20px}.tag{font-size:12px}.bubble{max-width:180px;padding:6px 11px 7px;font-size:13px}}@media (height<=500px){:root{--edge-b:max(8px, env(safe-area-inset-bottom))}#place{top:max(8px, env(safe-area-inset-top))}#log{top:calc(max(8px, env(safe-area-inset-top)) + 36px);width:min(300px,40vw)}#join form{flex-flow:wrap;align-items:center;gap:10px;width:min(560px,100%);padding:12px 16px}#join h1{display:none}#looks{flex:100%}#looks button{aspect-ratio:auto;height:46vh;max-height:46vh}#join .row{flex:1}}