@font-face {
    font-family: 'MacondoSwashCaps';
    src: url('/fonts/MacondoSwashCaps-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

body {
    margin: 0;
    padding: 0;
    color: rgba(255, 255, 255, 0.87);
    background-color: #000000;
    background-image: url('/assets/background.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    font-family: Arial, Helvetica, sans-serif;
}

#app {
    width: 100%;
    min-height: 100vh;
    overflow: auto;
    position: relative;
    isolation: isolate;
}

#app::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: rgba(8, 12, 20, 0.6);
    z-index: 1;
}

#app > * {
    position: relative;
    z-index: 2;
}

.game-title-text {
    font-family: 'MacondoSwashCaps', serif;
    font-size: 60px;
    line-height: 1;
    color: #dbeafe;
    text-shadow:
        -3px 0 0 #000000,
        3px 0 0 #000000,
        0 -3px 0 #000000,
        0 3px 0 #000000,
        -2px -2px 0 #000000,
        2px -2px 0 #000000,
        -2px 2px 0 #000000,
        2px 2px 0 #000000;
    letter-spacing: 0.4px;
    white-space: nowrap;
    pointer-events: none;
    cursor: default;
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}