*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#050d20;color:#ebf0fc;font-family:"Microsoft YaHei",sans-serif}body{display:flex;flex-direction:column;justify-content:center;align-items:center}#stage{width:min(100vw,calc((100dvh - 28px)*1.85));aspect-ratio:1.85;max-height:calc(100dvh - 28px)}canvas{display:block;width:100%;height:100%;touch-action:none}nav{height:28px;display:flex;width:100%;justify-content:space-between;align-items:center;padding:0 14px;font-size:12px;color:#8da4c7}a{color:#adc6e7}dialog{max-width:min(520px,92vw);border:1px solid #789ac1;border-radius:18px;background:linear-gradient(#284c77,#0c213f);color:#f8e4b0;box-shadow:0 12px 35px #0009;padding:24px}dialog::backdrop{background:#0009}dialog p{white-space:pre-wrap;overflow-wrap:anywhere;color:#d4e1f5;line-height:1.6}input{width:100%;padding:12px;border-radius:9px;border:1px solid #8fa8c7;background:#09192e;color:white;font-size:18px}footer{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}button{padding:10px 24px;border-radius:10px;border:1px solid #c9d5e9;background:linear-gradient(#3979b5,#153959);color:white;font-size:16px;cursor:pointer}#dialog-accept{background:linear-gradient(#ffdc7a,#bc7c17);color:#332106;border-color:#ffe8a0}

nav button{padding:2px 12px;font-size:12px;line-height:19px;border-radius:5px;margin-left:6px}nav div{display:flex}#jukebox input[type=range]{min-width:0}#jukebox button{cursor:pointer}