*{box-sizing:border-box}body{color:#fff;background-color:#040408;justify-content:center;align-items:center;height:100vh;margin:0;font-family:Inter,Avenir,Helvetica,Arial,sans-serif;display:flex}.menu{text-align:center;flex-direction:column;align-items:center;gap:1em;padding-bottom:40vh;display:flex}.menu h1{-webkit-text-fill-color:#0000;opacity:.9;background:linear-gradient(#fee87b,#ff7e5f);-webkit-background-clip:text;background-clip:text;margin-bottom:.5em;font-size:5rem;position:relative}.menu h1:after{content:"Reverse Breakout";z-index:2;-webkit-text-stroke:2px #935757;color:#0000;position:absolute;top:0;bottom:0;left:0;right:0}.menu button#startButton{color:#000;cursor:pointer;background-image:linear-gradient(#fed375,#ff9665);border:2px solid #935757;border-radius:5px;margin-top:1em;padding:.5em 1em;font-size:1.5rem;font-weight:700;transition:background-color .3s}.menu span#scoreDisplay{font-size:1.5rem}.menu a#githubIcon{z-index:10;color:#fff;width:48px;height:48px;position:fixed;top:10px;right:10px}canvas{display:absolute;z-index:-2;width:100%;height:100%;position:fixed;top:0;left:0}[data-game-ui]{display:none}.hud{z-index:5;padding:15px;font-size:1.2rem;position:fixed;top:0;bottom:0;left:0;right:0}.hud .score{flex-direction:column;align-items:flex-start;display:flex}.hud .time{text-align:center;width:100%;font-family:Courier New,Courier,monospace;font-size:2rem;font-weight:700;position:absolute;top:10px}.hud .energy-bar{background-color:#111;border:2px solid #333;border-radius:5px;width:320px;height:30px;position:absolute;top:10px;right:10px}.hud .energy-bar svg{color:#ece8ae;z-index:10;height:100%;padding:1px;position:absolute;right:0}.hud .energy-bar path{fill:currentColor;stroke:#000;stroke-width:2px}.hud .energy-bar .energy-fill{--color-1:#efd87b;--color-2:#ecca66;--separation:8px;background-image:repeating-linear-gradient(-45deg,var(--color-1),var(--color-1)var(--separation),var(--color-2)var(--separation),var(--color-2)calc(var(--separation)*2));border-radius:3px;height:100%;transition:width 50ms ease-in-out;position:absolute;top:0}.hud .modifiers{flex-direction:column;gap:10px;display:flex;position:absolute;bottom:10px;left:10px}.hud .modifier{background-color:#111;border-radius:10px;flex-direction:column;width:15rem;padding:5px;display:flex;position:relative;overflow:hidden}.hud .modifier .modifier-fill{background-color:#222;height:4px;position:absolute;bottom:0;left:0;right:0}.hud .modifier .modifier-fill .modifier-fill-inner{background-color:#6ae29c;width:50%;height:100%;transition:width .1s ease-in-out}.hud .modifier .label{color:#ccc;padding:0 5px;font-size:.9rem;font-weight:400}.hud .modifier .content{flex-direction:row;gap:.5rem;font-family:Courier New,Courier,monospace;font-size:1.5rem;font-weight:700;display:flex}.hud .modifier .content svg{vertical-align:middle;color:#ccc;width:1.2em;height:1.2em}.hud .abilities{flex-direction:row;gap:10px;display:flex;position:absolute;bottom:10px;left:10px}.hud .abilities.inactive .ability{opacity:.4!important;pointer-events:none!important;filter:grayscale(70%)!important}.hud .abilities .ability{cursor:pointer;background-color:#111;border:2px solid #333;border-radius:0 10px 10px;justify-content:center;align-items:center;padding:5px;display:flex;position:relative}.hud .abilities .ability:has(.count.visible){border-top-right-radius:0}.hud .abilities .ability:after{content:"";--inset:3px;top:var(--inset);left:var(--inset);bottom:var(--inset);width:calc(var(--ability-cooldown,0%) - var(--inset)*2);opacity:min(1,var(--ability-cooldown,0%)/20%);pointer-events:none;--border-radius:calc(10px - var(--inset));border-radius:var(--border-radius)0 0 var(--border-radius);box-sizing:border-box;background-color:#ffffff80;border:1px solid #0000;position:absolute}.hud .abilities .ability .keybind,.hud .abilities .ability .count{color:#aaa;background-color:#111;border:2px solid #333;border-bottom:none;border-radius:5px 5px 0 0;margin:0;padding:0 5px;font-weight:700;line-height:1.2;position:absolute;bottom:100%}.hud .abilities .ability .keybind{height:1.2rem;font-family:Courier New,Courier,monospace;font-size:1.25rem;left:-2px}.hud .abilities .ability .count{height:.8rem;font-size:1rem;display:none;right:-2px}.hud .abilities .ability .count.visible{display:block}.hud .abilities .ability svg{width:4rem;height:4rem;color:hsl(var(--ability-hue),70%,80%)}.hud .abilities .ability .ability-hint{opacity:0;pointer-events:none;margin-bottom:1.5rem;transition:opacity .15s ease-in-out,transform .15s ease-in-out;position:absolute;bottom:100%;left:-2px;transform:translateY(-3px)}.hud .abilities .ability:hover .ability-hint{opacity:1;pointer-events:auto;transform:translateY(0)}.hud .abilities .ability{opacity:.1;pointer-events:none;filter:grayscale();transition:opacity .2s ease-in-out,filter .2s ease-in-out}.hud .abilities .ability[data-count]:not([data-count="0"]){opacity:1;pointer-events:auto;filter:grayscale(0%)}.hud .abilities .ability[data-count="2"]{translate:0 -3px;box-shadow:0 3px 0 -2px #222,0 3px #333}.hud .abilities .ability[data-count="3"]{translate:0 -6px;box-shadow:0 3px 0 -2px #222,0 3px #333,0 6px 0 -2px #222,0 6px #333}.hud .abilities .ability[data-count="4"]{translate:0 -9px;box-shadow:0 3px 0 -2px #222,0 3px #333,0 6px 0 -2px #222,0 6px #333,0 9px 0 -2px #222,0 9px #333}.hud .abilities .new-ability-hint{margin-bottom:1.5rem;position:absolute;bottom:100%;left:0;padding:10px 12px!important}.hud .abilities .new-ability-hint .title{color:#aaa;font-size:1rem}.hud .abilities .new-ability-hint{opacity:0;pointer-events:none;transition:opacity .3s ease-in-out,transform .3s ease-in-out;transform:translateY(-5px)}.hud .abilities .new-ability-hint.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.hud .abilities .ability-hint{background-color:#111;border:2px solid #333;border-radius:5px;flex-direction:column;width:max-content;padding:5px 12px;display:flex}.hud .abilities .ability-hint h1{margin:0;font-size:1.5rem}.hud .abilities .ability-hint>span{color:#ccc;font-size:1rem}.hud .abilities .ability-hint .action{color:hsl(var(--ability-hue),70%,70%)}.hud .abilities .ability-hint .name{color:hsl(var(--ability-hue),70%,80%)}.hud .abilities .ability-hint pre{padding:0 3px;display:inline}.game-over{opacity:0;z-index:100;flex-direction:column;justify-content:center;align-items:center;transition:opacity .3s ease-in-out,transform .3s ease-in-out;display:none;position:absolute;top:0;bottom:0;left:0;right:0;transform:translateY(-15px)}.game-over.visible{opacity:1;display:flex;transform:translateY(0)}.game-over .game-over-content{text-align:center;background-color:#111;border:2px solid #333;border-radius:10px;flex-direction:column;padding:1rem;display:flex}.game-over h1{margin:0 0 .5rem;padding:0 1em;font-size:2rem}.game-over span.reason{color:#ccc;margin-bottom:1rem;font-size:1.2rem}.game-over span.time{color:#aaa;font-size:1rem}.game-over button{color:#000;cursor:pointer;background-image:linear-gradient(#fed375,#ff9665);border:2px solid #935757;border-radius:5px;margin-top:.5rem;padding:.25em 1em;font-size:1.2rem;font-weight:700;transition:background-color .3s}