*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#111;background-image:radial-gradient(circle,rgba(255,255,255,.05) 1px,transparent 1px);background-size:16px 16px;overscroll-behavior:none}#root{width:100%;height:100%}canvas{position:fixed;top:0;left:0;display:block}.ui{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:flex-end;justify-content:space-between;padding:20px 28px;pointer-events:none;z-index:10;background:linear-gradient(to top,rgba(0,0,0,.6) 0%,transparent 100%);padding-bottom:max(20px,env(safe-area-inset-bottom));padding-left:max(28px,env(safe-area-inset-left));padding-right:max(28px,env(safe-area-inset-right))}.brand{display:flex;flex-direction:column;gap:1px;line-height:1}.site-name{font-family:Fredoka One,cursive;font-size:clamp(1.6rem,3.5vw,2.8rem);color:#fff;letter-spacing:2px;text-shadow:0 3px 0 rgba(0,0,0,.55),0 0 40px rgba(0,0,0,.9)}.byline{font-family:Fredoka One,cursive;font-size:clamp(.7rem,1.4vw,1rem);color:#ffffff80;letter-spacing:1px;text-shadow:0 2px 0 rgba(0,0,0,.4);padding-left:1px}.controls{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.counter{font-family:Fredoka One,cursive;font-size:clamp(.65rem,1vw,.72rem);color:#ffffff2e;letter-spacing:1px}.hint{font-family:Fredoka One,cursive;font-size:clamp(.7rem,1vw,.78rem);color:#ffffff47;letter-spacing:2px;text-transform:uppercase;cursor:pointer;pointer-events:all;transition:color .2s;-webkit-user-select:none;user-select:none;background:none;border:none;padding:0}.hint:hover,.hint:focus-visible{color:#ffffffa6;outline:none}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.5) 100%)}