.ghost-layer{position:fixed;inset:0;z-index:8;pointer-events:none;overflow:hidden;direction:ltr;contain:layout style}
.floating-ghost{position:absolute;top:0;left:0;border:0;padding:0;background:none;cursor:crosshair;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-user-select:none;opacity:.95;will-change:transform,opacity;border-radius:50%;outline-offset:-8px}
.ghost-sprite{display:block;width:100%;height:100%;background-image:url('assets/ghosts-vector-atlas.svg');background-size:300% 200%;background-repeat:no-repeat;pointer-events:none;transition:transform .18s}
.floating-ghost:hover .ghost-sprite,.floating-ghost:focus-visible .ghost-sprite{transform:scale(1.07) rotate(-4deg)}
.floating-ghost:focus-visible{outline:2px dashed #f6ff00}
.floating-ghost.is-popped{pointer-events:none}
.is-popped .ghost-sprite{animation:ghost-pop .38s ease-out forwards}
@keyframes ghost-pop{0%{transform:scale(1);opacity:1}35%{transform:scale(1.22,.8);opacity:1}100%{transform:scale(.08);opacity:0}}
.ghost-burst{position:absolute;width:0;height:0;pointer-events:none}
.ghost-burst::before{content:"";position:absolute;width:40px;height:40px;left:-20px;top:-20px;border:2px solid #f6ff00;border-radius:50%;animation:ghost-ring .5s ease-out forwards}
.ghost-burst i{position:absolute;left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:#f6ff00;animation:ghost-particle .5s cubic-bezier(.12,.7,.3,1) forwards}
.ghost-burst i:nth-child(even){background:#fff;width:4px;height:4px}
@keyframes ghost-ring{from{transform:scale(.4);opacity:.9}to{transform:scale(2.2);opacity:0}}
@keyframes ghost-particle{from{transform:translate(0,0) scale(1);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.1);opacity:0}}
.ghost-controls{position:fixed;bottom:16px;left:18px;z-index:12;display:flex;align-items:center;gap:6px;padding:7px;border:1px solid #505244;border-radius:50px;background:#161710f5;box-shadow:0 4px 20px #0003;font-size:.8rem;direction:inherit}
.ghost-controls[hidden]{display:none}
.ghost-hint{color:var(--yellow);padding:0 8px;font-weight:600;white-space:nowrap}
.ghost-controls button{font-family:inherit;font-size:.8rem;color:#e4e5da;background:transparent;border:1px solid #505244;border-radius:24px;padding:8px 12px;min-height:38px;cursor:pointer;white-space:nowrap}
.ghost-controls button:hover{color:#111210;background:var(--yellow);border-color:var(--yellow)}
.ghost-controls button[aria-pressed=true].ghost-pause{color:var(--yellow);border-color:var(--yellow)}
.ghost-controls button[aria-pressed=true].ghost-pause:hover{color:var(--ink)}
.ghost-controls button:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
footer{padding-bottom:92px}
@media(max-width:620px){.ghost-controls{left:12px;right:auto;bottom:12px;max-width:calc(100% - 24px);gap:4px;padding:5px}.ghost-hint{font-size:.75rem;padding:0 6px}.ghost-controls button{font-size:.75rem;padding:8px 10px;min-height:40px}footer{padding-bottom:90px}}
@media(prefers-reduced-motion:reduce){.ghost-sprite{transition:none}.is-popped .ghost-sprite{animation:none;opacity:0}.ghost-burst{display:none}}
