html, body { margin: 0; padding: 0; height: 100%; overflow: hidden; background: #101828; }
canvas { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100dvh; display: block; outline: none; touch-action: none; }
.paluu { position: fixed; top: 10px; left: 12px; z-index: 2; display: flex; align-items: center; gap: 2px; padding: 5px 10px 5px 4px; border-radius: 999px; background: rgba(8, 12, 24, .6); color: #fff3dc; font: 600 14px/1 system-ui, sans-serif; text-decoration: none; }
.paluu:hover { background: rgba(8, 12, 24, .85); }
.paluu:focus-visible { outline: 2px solid #f0a03c; }
.upotettu .paluu { top: auto; bottom: 8px; left: 8px; opacity: .8; }
.upotettu .paluu span { display: none; }
#lataus { position: fixed; inset: 0; z-index: 3; display: grid; place-items: center; background: #101828; pointer-events: none; }
.kipina { width: 18px; height: 18px; border-radius: 50%; background: #f0a03c; box-shadow: 0 0 24px 8px rgba(240, 160, 60, .55); animation: syke 1.1s ease-in-out infinite; }
@keyframes syke { 50% { transform: scale(.55); opacity: .5; } }
@media (prefers-reduced-motion: reduce) { .kipina { animation: none; } }