:root{--bg-night:#070b16;--bg-violet:#0f1730;--hud-gold:#ffdb6e;--frame-a:#1749b4;--frame-b:#2a75ff}*{box-sizing:border-box}html,body,#app{width:100%;min-height:100svh;margin:0}body{background:radial-gradient(circle at 50% -20%, #253f81 0%, transparent 52%), radial-gradient(circle at 88% 10%, #24345e 0%, transparent 42%), linear-gradient(160deg, var(--bg-night), var(--bg-violet));color:#fff;place-items:center;font-family:Trebuchet MS,Gill Sans,sans-serif;display:grid}#app{place-items:center;padding:12px;display:grid;position:relative}#app:after{content:"";pointer-events:none;opacity:.24;background-image:repeating-linear-gradient(#ffffff14 0 1px,#0000 2px 4px);position:fixed;inset:0}canvas{aspect-ratio:620/700;border:5px solid var(--frame-b);width:min(96vw,85.0285svh);max-width:620px;height:auto;box-shadow:0 0 0 3px var(--frame-a), 0 14px 30px #00000080, 0 0 40px #2c79ff73;border-radius:12px}