:root{color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid #fff;outline-offset:5px}
.wrap{width:min(1440px,calc(100% - 96px));margin:auto}
.header{min-height:100px;padding:20px 0;display:flex;align-items:center;border-bottom:1px solid #292929}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 22px/1 'Courier New',monospace;letter-spacing:-1px}
.brand img{width:30px;height:30px;object-fit:contain}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero-circle{min-height:calc(100svh - 100px);display:grid;place-items:center}
.hero-art{position:relative;width:100%;height:max(480px,calc(100svh - 100px));overflow:visible}
.circle-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.webgl-unavailable::after{content:'';position:absolute;left:50%;top:50%;width:220px;height:220px;border:1px solid #888;border-radius:50%;transform:translate(-50%,-50%)}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.header{min-height:76px}.hero-circle{min-height:calc(100svh - 76px)}.hero-art{height:max(340px,calc(100svh - 76px))}}