@font-face{font-family:Pixelify;src:url('assets/pixelify.woff2') format('woff2');font-weight:400 700;font-display:swap}
:root{font-family:Pixelify,monospace;color:#132d4e;--focus:#fff4db}
*{box-sizing:border-box}
html,body{margin:0;min-width:320px;background:#378cf0}
.experience{position:relative;isolation:isolate;overflow:hidden;height:100svh;min-height:480px}
#world{display:block;position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;background:#378cf0}
.site-header{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 30px}
.wordmark{display:flex;align-items:center;min-height:40px;padding:8px 10px;font-size:18px;line-height:1;color:#fff4db;background:#193a60;border:1px solid #86b0cf;border-radius:3px;text-decoration:none;white-space:nowrap}
.controls{display:flex;gap:8px}
.control{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;border:1px solid #86b0cf;background:#193a60e8;color:#fff4db;cursor:pointer;border-radius:3px;-webkit-tap-highlight-color:transparent}
.control:hover{background:#1c466c}
.control svg{width:18px;height:18px;flex-shrink:0}
button:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.intro{position:absolute;top:8%;left:20px;right:20px;text-align:center;pointer-events:none}
h1{margin:0;color:#fff4db;font-size:clamp(38px,4.1vw,64px);font-weight:500;line-height:1.08;letter-spacing:-.025em;text-shadow:0 3px 0 #244a77}
h1 span{font-size:.75em;color:#ffdf9a}
.title-trigger{display:inline-block;min-height:44px;padding:0;border:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;text-shadow:inherit;cursor:pointer;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
::selection{background:#ffe4a0;color:#193a60}
.asset-error{position:absolute;left:20px;right:20px;bottom:25px;background:#193a60;color:#fff4db;padding:18px;text-align:center;font-size:16px}
.asset-error button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent;text-decoration:underline}
@media(max-width:600px){.site-header{padding:15px 17px;gap:8px}.wordmark{font-size:15px}.intro{top:10%;left:12px;right:12px}h1{font-size:38px}}
@media(max-height:540px) and (min-width:601px){.experience{min-height:360px}.intro{top:10%}h1{font-size:36px}.site-header{padding:15px 22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}