.pause {
    left: 0;
    text-align:right;
    float:right;
    text-align: right;
}

html, body {
    height: 100%;
}

body {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(180deg, #1c1228 0%, #2d1b3a 35%, #3a2149 65%, #0c0814 100%);
}

canvas {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

#background {
    z-index: 0;
}

#game {
 z-index:1000;
 position: relative;
 margin: 0 auto;
 width: 100%;
 max-width: 480px;
 height: 100%;
 max-height: 640px;
 overflow: hidden;
}

#game::before, #game::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

#game::before {
    background: linear-gradient(180deg, #1c1228 0%, #2d1b3a 35%, #3a2149 65%, #0c0814 100%);
    z-index: 0;
}

#game::after {
    background: radial-gradient(ellipse at 50% 70%, rgba(120, 80, 150, 0.2), transparent 55%);
    mix-blend-mode: screen;
    opacity: 0.35;
    z-index: 1;
}

#playfield {
    z-index: 1;
}

#projectiles {
    z-index: 2;
    pointer-events: none;
}
