:root{--gold: #e8c547;--gold-dim: #c9a227;--purple: #6b32a3;--ink: #0e1713;--cream: #f4efe4;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:#15241c;color:var(--cream);font-family:Nunito,system-ui,sans-serif;touch-action:none;user-select:none}canvas{display:block;width:100%;height:100%}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.hud{position:absolute;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:calc(10px + var(--safe-t)) calc(12px + var(--safe-r)) 8px calc(12px + var(--safe-l));pointer-events:none;background:linear-gradient(180deg,rgba(8,16,12,.55),transparent 90%)}.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand img{width:40px;height:40px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45))}.brand strong{display:block;font-family:Cinzel,serif;font-weight:900;font-size:18px;letter-spacing:.04em;text-shadow:0 2px 0 rgba(0,0,0,.45)}.brand span{display:block;font-size:12px;opacity:.85}.stats{display:flex;gap:8px;justify-self:end;align-items:start}.chip{display:flex;align-items:center;gap:6px;background:#0e1713b8;border:1px solid rgba(232,197,71,.35);border-radius:999px;padding:6px 10px;font-weight:800;min-width:64px;justify-content:center}.chip img{width:22px;height:22px}.chip .k{font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}.hp-wrap{grid-column:1 / -1;display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:800}.hp-wrap .hp{flex:1;height:10px;max-width:280px;background:#00000073;border-radius:6px;overflow:hidden;border:1px solid rgba(255,255,255,.15)}.hp-wrap .hp i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#7b3fb0,#e8c547);transform-origin:left}.banner{position:absolute;top:28%;left:50%;transform:translate(-50%,-50%);font-family:Cinzel,serif;font-weight:900;font-size:clamp(22px,6vw,40px);letter-spacing:.08em;text-shadow:0 3px 0 rgba(0,0,0,.5);pointer-events:none;animation:pop 1.4s ease forwards}@keyframes pop{0%{opacity:0;transform:translate(-50%,-40%) scale(.8)}20%{opacity:1;transform:translate(-50%,-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-60%) scale(1.05)}}.shop{position:absolute;right:calc(12px + var(--safe-r));bottom:calc(18px + var(--safe-b));display:flex;flex-direction:column;gap:8px;pointer-events:auto}.buy{display:flex;align-items:center;gap:10px;border:1px solid rgba(232,197,71,.45);background:#0e1713d1;color:var(--cream);border-radius:14px;padding:8px 12px 8px 8px;min-width:168px;text-align:left;font:inherit;cursor:pointer;box-shadow:0 6px 16px #00000047}.buy:disabled{opacity:.45;cursor:default}.buy:not(:disabled):active{transform:translateY(1px)}.buy img,.buy .glyph{width:36px;height:36px;object-fit:contain;flex:none}.buy .glyph{display:grid;place-items:center;font-size:22px;background:#e8c5471f;border-radius:10px}.buy b{display:block;font-size:13px}.buy small{display:flex;align-items:center;gap:4px;color:var(--gold);font-weight:800}.buy small img{width:14px;height:14px}.joy{position:absolute;left:calc(18px + var(--safe-l));bottom:calc(18px + var(--safe-b));width:148px;height:148px;pointer-events:auto}.joy-base{position:absolute;inset:8px;border-radius:50%;border:3px solid rgba(244,239,228,.55);background:#0e171338}.joy-knob{position:absolute;width:64px;height:64px;left:42px;top:42px;border-radius:50%;background:#f4efe4eb;box-shadow:0 4px 10px #0000004d}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;background:radial-gradient(ellipse at 50% 40%,#15241c59,#080e0cb8);pointer-events:auto}.overlay h1{font-family:Cinzel,serif;font-weight:900;font-size:clamp(36px,9vw,64px);margin:8px 0 6px;letter-spacing:.04em;text-shadow:0 3px 0 rgba(0,0,0,.45)}.overlay p{margin:0 0 16px;font-size:16px;opacity:.92}.overlay ul{margin:0 0 22px;padding:0;list-style:none;font-size:14px;opacity:.88}.overlay li+li{margin-top:6px}.crest{width:92px;height:92px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}.crest.dim{filter:grayscale(.4) brightness(.8)}.cta{font-family:Cinzel,serif;font-weight:700;font-size:18px;color:#1a1208;background:linear-gradient(180deg,#f3d56a,#c9a227);border:0;border-radius:999px;padding:14px 28px;cursor:pointer;box-shadow:0 6px #8a6a12,0 10px 20px #0000004d}.cta:active{transform:translateY(2px);box-shadow:0 4px #8a6a12}.legal{margin-top:18px;font-size:11px;opacity:.65;max-width:320px}.hp-world{width:36px;height:5px;background:#1a0a0a;border:1px solid #000;border-radius:3px;overflow:hidden}.hp-world i{display:block;height:100%;background:#d4533a;width:100%}.dmg{font-weight:800;font-size:16px;color:#fff4c8;text-shadow:0 2px 0 #5a1c12,0 0 8px #5a1c12;pointer-events:none}.pad-tag{font-size:11px;font-weight:800;background:#0e1713bf;border:1px solid rgba(232,197,71,.4);border-radius:8px;padding:3px 7px;white-space:nowrap}@media(min-width:720px){.joy{width:168px;height:168px}.joy-knob{width:72px;height:72px;left:48px;top:48px}}