:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{-webkit-user-select:none;user-select:none;background:#e8935a;width:100%;height:100%;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;overflow:hidden}#app{width:100vw;height:100vh;position:relative}canvas{display:block}body:after{content:"";z-index:100;pointer-events:none;background:radial-gradient(circle,#0000 58%,#3c140057 100%);position:fixed;inset:0}.hud{pointer-events:none;z-index:10;-webkit-backdrop-filter:blur(7px);background:#46220e6b;border:2px solid #ffd36b59;border-radius:16px;flex-direction:column;align-items:center;padding:8px 30px;display:flex;position:absolute;top:48px;left:50%;transform:translate(-50%);box-shadow:0 6px 22px #3c140066}.hud__score{letter-spacing:1px;color:#fff6e6;text-shadow:0 2px #a8281c;font-size:38px;font-weight:800;line-height:1.05}.hud__combo{letter-spacing:2px;color:#ffd36b;opacity:0;text-shadow:0 0 10px #f2b134cc;height:0;font-size:15px;font-weight:800;transition:opacity .15s,transform .15s;transform:scale(.7)}.hud__combo.is-shown{opacity:1;height:auto;margin-top:2px;transform:scale(1)}.hud__best{letter-spacing:2px;color:#ffe0b0;opacity:.85;font-size:11px}.hud__best:not(:empty){text-align:center;border-top:1px solid #ffffff24;width:100%;margin-top:4px;padding-top:4px}.overlay{text-align:center;pointer-events:auto;z-index:20;background:radial-gradient(circle,#3c18066b 0%,#280e02d1 78%);flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:20px;transition:opacity .3s;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.overlay__title{letter-spacing:2px;color:#ffd36b;text-transform:uppercase;text-shadow:0 3px #a8281c,0 6px #6e1810,0 8px 22px #00000080;font-size:clamp(38px,8vw,66px);font-weight:900}.overlay__subtitle{letter-spacing:1px;color:#fff3e0;font-size:clamp(14px,2.6vw,18px);font-weight:700}.overlay__score{letter-spacing:1px;color:#ffd36b;font-size:clamp(16px,3vw,22px);font-weight:800}.overlay__hint{letter-spacing:.5px;color:#ffe6c4;opacity:.9;max-width:520px;margin-top:8px;font-size:clamp(12px,2.2vw,14px);line-height:1.5}.overlay__hint b{color:#ffd36b}.countdown{pointer-events:none;z-index:25;letter-spacing:4px;color:#ffd36b;text-shadow:0 4px #a8281c,0 8px 30px #0000008c;opacity:0;justify-content:center;align-items:center;font-size:clamp(90px,22vw,160px);font-weight:900;display:flex;position:absolute;inset:0}.countdown.is-shown{animation:.75s ease-out countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1.12)}40%{transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}.tokens{z-index:12;pointer-events:none;-webkit-backdrop-filter:blur(6px);background:#46220e6b;border:2px solid #ffd36b59;border-radius:14px;align-items:center;gap:6px;padding:6px 10px;display:flex;position:absolute;top:54px;left:16px}.tokens.hidden{display:none}.token{filter:drop-shadow(0 2px 2px #3c140080);width:30px;height:30px;transition:opacity .25s,transform .25s,filter .25s;display:inline-flex}.token svg{width:100%;height:100%}.token--shield{box-sizing:content-box;border-right:2px solid #fff3;margin-right:4px;padding-right:8px}.token--mail{width:26px;height:26px}.token--divide{box-sizing:content-box;border-left:2px solid #fff3;margin-left:4px;padding-left:8px}.token.is-spent{opacity:.25;filter:grayscale(.85)drop-shadow(0 1px 1px #0006);transform:scale(.82)}.token--shield.is-spent{display:none}.bubble{z-index:15;color:#6e2a12;text-align:center;pointer-events:none;opacity:0;background:#fff3dc;border:3px solid #8a5a2b;border-radius:20px;max-width:min(320px,74vw);padding:11px 17px;font-size:clamp(13px,2.4vw,16px);font-weight:800;line-height:1.35;transition:opacity .3s,transform .3s;position:absolute;top:16%;left:50%;transform:translate(-50%,8px);box-shadow:0 8px 22px #3c140073}.bubble.is-shown{opacity:1;transform:translate(-50%)}
