:root{color-scheme:dark;--cinder-void: #02040a;--cinder-phosphor: #050a14;--cinder-cyan: #22d3ee;--cinder-purple: #a78bfa;--cinder-pink: #f472b6;--cinder-amber: #fbbf24}html,body{margin:0;background:radial-gradient(ellipse at 50% 45%,rgba(34,211,238,.08),transparent 42%),radial-gradient(ellipse at 50% 50%,#071426,#02050c 64%,#000);width:100%;height:100%;overflow:hidden;font-family:monospace}body{display:grid;place-items:center;box-sizing:border-box;padding:16px;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 18% 22%,rgba(167,139,250,.1),transparent 28%),radial-gradient(circle at 82% 78%,rgba(34,211,238,.08),transparent 30%)}canvas{position:relative;width:min(1280px,calc(100vw - 32px),calc((100vh - 32px) * 16 / 9));height:auto;aspect-ratio:16 / 9;display:block;background:var(--cinder-void);border:1px solid rgba(34,211,238,.42);border:1px solid color-mix(in srgb,var(--cinder-cyan) 42%,transparent);border-radius:3px;box-shadow:0 0 0 1px #02040af2,0 0 22px #22d3ee33,0 0 80px #a78bfa1f,inset 0 0 28px #0000008c}@media (prefers-reduced-motion: reduce){canvas{box-shadow:0 0 0 1px #02040af2,0 0 18px #22d3ee24}}