*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:#07090e;color:#e3e6e9;font-family:Arial,"Microsoft YaHei",sans-serif}body{height:100dvh;display:flex;flex-direction:column}button,a,input{-webkit-tap-highlight-color:transparent}header{height:80px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid #242831;font:9px monospace;letter-spacing:1.5px;color:#7d8796}.brand{font:bold 18px Arial;letter-spacing:3px;color:#ecedf0;text-decoration:none}header b{font-weight:normal;color:#a5aab4;margin-left:16px}main{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}.heading{position:absolute;z-index:2;left:38px;top:32px;pointer-events:none}.heading>p:first-child{font:8px monospace;letter-spacing:3px;color:#939eac}h1{font-size:clamp(24px,3.5vw,53px);letter-spacing:-2px;font-weight:400;line-height:.98;margin:22px 0 12px}h1 em{font-family:Georgia,serif;font-weight:normal}h2{font-size:11px;letter-spacing:6px;font-weight:400;color:#a2a7b2;margin:0}.intro{font:10px/1.9 monospace;color:#9fa7b7;margin-top:24px}.intro span{font-size:9px;color:#717d8f}#stage{position:relative;flex:1;min-height:280px;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}canvas:focus-visible{outline:1px solid #8294b5;outline-offset:-3px}.guide{position:absolute;pointer-events:none;bottom:25px;left:38px;font:8px monospace;letter-spacing:2px;color:#8792a6}.guide span{font-size:8px;letter-spacing:1px;color:#606a7c}.readout{position:absolute;bottom:22px;right:38px;display:flex;gap:12px;align-items:center;pointer-events:none}.readout>span{font:25px Georgia;color:#c5ccda}.readout small{font:7px/1.8 monospace;letter-spacing:1px;color:#758296}footer{flex:none;min-height:92px;border-top:1px solid #242831;padding:22px 38px;display:flex;align-items:center;gap:25px;justify-content:space-between;background:#090c12}.caption{font:8px monospace;letter-spacing:1.4px;color:#8792a6}.caption small{display:block;font:8px Arial;letter-spacing:1px;margin-top:8px;color:#667083}.controls{display:flex;align-items:center;gap:22px}button{border:0;background:none;padding:7px 0;color:#cdd2da;font:8px monospace;letter-spacing:1px;cursor:pointer;white-space:nowrap}button:hover,button:focus-visible{color:#97cfff}button small,label small{font:8px Arial;color:#69788c;margin-left:3px}label{font:8px monospace;letter-spacing:1px;color:#cdd2da;display:flex;flex-direction:column;gap:9px;position:relative}label small{position:absolute;left:61px;top:0;white-space:nowrap}input{width:85px;height:2px;margin:0;accent-color:#a4b6cc;cursor:pointer}#notice{font:7px monospace;color:#647188;max-width:150px;line-height:1.8}button:focus-visible,a:focus-visible{outline:1px solid #a4b6cc;outline-offset:6px}@media(max-width:1000px){footer{flex-wrap:wrap;gap:18px}.caption{display:none}#notice{max-width:none}.controls{gap:18px}header{padding:0 22px}.heading{left:22px;top:25px}.guide{left:22px}}@media(max-width:620px){header{height:61px;padding:0 20px;font-size:7px;letter-spacing:0}header>span{display:none}header b{margin-left:7px;font-size:7px}.brand{font-size:14px}h1{font-size:29px;letter-spacing:-1px;margin:16px 0 10px}.heading{top:20px;left:20px}.heading>p:first-child{font-size:7px;letter-spacing:2px}.intro{display:none}h2{font-size:9px;letter-spacing:4px}footer{padding:20px;gap:16px;min-height:120px}.controls{gap:15px;flex-wrap:wrap;justify-content:flex-end;width:100%}label{font-size:7px}label small{left:55px}input{width:80px}.guide{bottom:24px;left:20px;font-size:7px;letter-spacing:1px}.guide span{display:none}.readout{right:20px;bottom:18px}.readout>span{font-size:20px}#notice{font-size:7px}.readout small{font-size:6px}}@media(max-height:560px){header{height:48px}.heading{top:15px}h1{font-size:23px;margin:12px 0}.intro{display:none}footer{min-height:70px;padding:15px 22px}#stage{min-height:180px}}

.back{color:#9ba8ba;text-decoration:none;font:9px monospace;letter-spacing:1px}.back small{font-size:8px}.back:hover{color:#fff}@media(max-width:620px){.back{font-size:7px;letter-spacing:0}.back small{display:none}}