* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #000000; }
body { font-family: Arial, sans-serif; color: #ffffff; }
a { -webkit-tap-highlight-color: transparent; }
#gameShell { position: fixed; inset: 0; width: 100%; height: 100%; height: 100dvh; overflow: hidden; background: #000000; }
#gameShell:fullscreen { width: 100vw; height: 100vh; }
#gameShell:-webkit-full-screen { width: 100vw; height: 100vh; }
#unityContainer { position: absolute; inset: 0; touch-action: none; }
#unityContainer canvas { display: block; width: 100%; height: 100%; touch-action: none; }
.brand { position: absolute; z-index: 10; top: max(20px, env(safe-area-inset-top)); left: max(22px, env(safe-area-inset-left)); width: clamp(150px, 22vw, 290px); min-height: 44px; display: flex; align-items: center; transition: transform .3s ease; }
.brand img { display: block; width: 100%; height: auto; }
.brand:hover { transform: translateY(-1px); }
.brand:focus-visible { outline: 2px solid #4fd8ff; outline-offset: 5px; }
.mobile-device .brand { width: 96px; top: max(8px, env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); }
#loading { position: absolute; z-index: 9; width: min(360px, 70vw); height: 10px; border-radius: 5px; overflow: hidden; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #ffffff; transition: opacity .45s ease, visibility .45s; }
#progress { width: 0; height: 100%; background: #ff6998; transition: width .25s ease; }
#loading.loaded { visibility: hidden; opacity: 0; }
@media (prefers-reduced-motion: reduce) { * { transition-duration: .01ms !important; } }