*{box-sizing:border-box}body{color:#d8cbb7;background:#171512;margin:0;font-family:monospace}header{padding:24px 5vw 10px}a{color:#d6a85e;font-size:12px;text-decoration:none}h1{letter-spacing:3px;margin:22px 0 10px;font-size:clamp(22px,3vw,36px)}h1 span{color:#8b7a62;font-size:.6em}p{color:#ad9b82;line-height:1.5}nav{border-block:1px solid #463b2d;gap:10px;padding:12px 5vw;display:flex}button{cursor:pointer;color:#baaa91;font:inherit;background:#282219;border:1px solid #625037;padding:12px 20px}button.active{color:#171512;background:#ba8743}main{position:relative}canvas{touch-action:none;width:100%;height:57vh;display:block}#status{text-align:center;pointer-events:none;width:100%;position:absolute;top:40%}footer{max-width:1100px;padding:10px 5vw 24px;font-size:12px}@media (max-width:600px){nav{gap:5px}button{padding:10px;font-size:11px}canvas{height:48vh}header p{font-size:11px}}