/* * Boot stylesheet: everything the page needs before the game module loads — * the two @font-face declarations, the black/tricolour page ground and the * #app canvas host (including the fullscreen override). * * Shared by every web entry document (index.html, index.fr.html, * index.com.html) so a layout tweak lands on all of them at once. The native * entry (index.native.html) deliberately keeps its own inline copy: it boots * from the local filesystem behind the splash and must not wait on a second * request. */ @font-face { font-family: "TerminalScreen"; src: url("/fonts/TerminalScreen.ttf") format("truetype"); font-display: block; } @font-face { font-family: "PressStart2P"; src: url("/fonts/PressStart2P-Regular.ttf") format("truetype"); font-display: block; } html, body { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; background: #000; touch-action: none; overscroll-behavior: none; font-family: "TerminalScreen", monospace; } /* Letterbox margins around the centred desktop stage: a bleu-blanc-rouge tricolour instead of flat black. The canvas covers the white band, so a wide window shows blue down the left and red down the right. Set on so it also paints the overscroll area; stays transparent to let it through (the credits block paints its own black background). */ html { background: linear-gradient( 90deg, #0055a4 0 33.333%, #f3f5fb 33.333% 66.666%, #ef4135 66.666% 100% ); background-attachment: fixed; } body { background: transparent; } #app { position: fixed; inset: 0; } /* When fullscreen, override the centered desktop box so the stage fills the screen (beats the inline width/transform set in Game.layoutMount). */ #app.fs { left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important; /* drop the vertical-centring margin from layoutMount */ transform: none !important; } #app canvas { display: block; width: 100%; height: 100%; }