:root{--cyan: #5ff6ff;--ink: #e9f4ff}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#070914;color:var(--ink);font-family:Silkscreen,monospace;-webkit-tap-highlight-color:transparent}#app canvas{display:block;touch-action:none}header{position:fixed;left:max(32px,env(safe-area-inset-left));top:max(30px,env(safe-area-inset-top));display:flex;flex-direction:column;gap:10px;pointer-events:none}.title{display:flex;align-items:center;gap:12px}.led{width:8px;height:8px;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:led-pulse 2.4s ease-in-out infinite}h1{margin:0;font-size:1.1em;font-weight:400;letter-spacing:.45em;color:#ffffffeb}@keyframes led-pulse{0%,to{opacity:1}50%{opacity:.35}}#burns{position:fixed;left:50%;bottom:max(32px,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}#treat{position:fixed;top:max(20px,env(safe-area-inset-top));right:max(28px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:center;width:200px;text-decoration:none;filter:drop-shadow(0 0 10px rgba(255,190,80,.35));transition:transform .2s ease-in-out,filter .2s ease-in-out}#treat svg{display:block;width:100%}#treat .bone{fill:#f0b445}#treat span{position:absolute;font-size:.62em;letter-spacing:.06em;white-space:nowrap;color:#4a2f0c}#treat:hover{transform:rotate(-4deg) scale(1.06);filter:drop-shadow(0 0 18px rgba(255,190,80,.7))}#burns canvas{display:block;image-rendering:pixelated;filter:drop-shadow(0 0 6px rgba(47,240,255,.45))}.burn-label{font-size:.6em;letter-spacing:.3em;color:#ffffff73}#loading{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#070914;color:var(--cyan);transition:opacity .6s ease-in-out;z-index:2}#loading .track{width:180px;height:4px;border-radius:5px;background:#5ff6ff26;overflow:hidden}#loading-bar{width:0;height:100%;background:var(--cyan)}.is-loaded #loading{opacity:0;pointer-events:none}@media only screen and (max-width:800px){#burns{bottom:max(24px,env(safe-area-inset-bottom))}#treat{top:max(14px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));width:160px}#treat span{font-size:.5em}header{left:max(20px,env(safe-area-inset-left));top:max(24px,env(safe-area-inset-top))}}