/* local-fonts:start */ @font-face { font-family: 'PixelifyLocal'; src: url('./assets/fonts/pixelify-sans.woff2') format('woff2'); font-weight: 400 700; font-display: swap; } /* local-fonts:end */ /* Drop m6x11 (or m6x11plus) into assets/fonts/ and it is picked up automatically — the file 404ing simply falls through to Pixelify Sans. m6x11 is Balatro's actual typeface, by Daniel Linssen. */ @font-face { font-family: 'm6x11'; src: url('./assets/fonts/m6x11plus.ttf') format('truetype'); font-weight: 400 700; font-display: swap; } * { margin: 0; padding: 0; box-sizing: border-box; } html, body { width: 100%; height: 100%; overflow: hidden; background: #0b1418; color: #f4f0e6; font-family: 'm6x11', 'PixelifyLocal', 'Pixelify Sans', 'Silkscreen', ui-monospace, monospace; -webkit-font-smoothing: antialiased; overscroll-behavior: none; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; } canvas { position: fixed; inset: 0; width: 100%; height: 100%; display: block; /* touch-action is not inherited, so the rule on never reached here. Without it the browser can claim a tap as a pan gesture and cancel the pointer stream mid-press. */ touch-action: none; } #bg { z-index: 0; /* The shader renders at reduced resolution and is upscaled; smoothing keeps the paint swirl soft instead of blocky. */ image-rendering: auto; } #game { z-index: 1; } #boot { position: fixed; inset: 0; z-index: 2; display: grid; place-items: center; font-size: 28px; letter-spacing: 2px; color: #eac058; background: #0b1418; pointer-events: none; }