:root{color-scheme:dark;--mint:#a6ffd9;--muted:#9095aa;--border:#25283b}*{box-sizing:border-box}body{margin:0;background:#0c0e18;color:#f2f3fa;font-family:'Microsoft YaHei','PingFang SC',sans-serif;font-size:14px}button,select,input{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:5px}header{height:100px;display:flex;align-items:center;justify-content:space-between;margin:0 4.3%;border-bottom:1px solid var(--border)}.brand{font-family:'Arial Narrow',Arial,sans-serif,sans-serif;font-size:28px;letter-spacing:2px;font-weight:700;color:#fff;text-decoration:none;display:flex;align-items:center;gap:9px}.brand i{font-style:normal;color:var(--mint)}.brand-icon{color:var(--mint);font-size:42px;margin-right:9px}.top-note{color:#b4b6c5;letter-spacing:4px}.live{font-size:11px;letter-spacing:1.7px;color:var(--muted)}.live b{display:inline-block;width:6px;height:6px;background:var(--mint);border-radius:50%;margin-right:9px;box-shadow:0 0 10px #a6ffd955}main{display:grid;grid-template-columns:minmax(0,1fr) 345px;gap:35px;margin:32px 4.3% 0}.arena{position:relative;min-height:660px;height:calc(100vh - 192px);max-height:920px;overflow:hidden;background:#080b18;border:1px solid #30364e;border-radius:8px;touch-action:none}canvas{position:absolute;width:100%;height:100%;inset:0}.arena-top{position:absolute;top:24px;left:28px;right:28px;display:flex;justify-content:space-between;gap:15px;color:#9099b5;font-size:12px}.eyebrow{font-family:'Arial Narrow',Arial,sans-serif,sans-serif;font-size:12px;letter-spacing:2px;color:var(--mint);font-weight:600}.hud{position:absolute;top:67px;left:28px;right:28px;display:flex;justify-content:space-between;pointer-events:none}.hud small{display:block;font:11px 'Arial Narrow',Arial,sans-serif,sans-serif;letter-spacing:2px;color:#8894b0}.hud strong{font-family:'Arial Narrow',Arial,sans-serif,sans-serif;font-size:32px;font-weight:600;letter-spacing:2px}.hud .combo{text-align:center}.combo strong{font-size:45px;line-height:1}.right{text-align:right}#overlay,#result{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(180deg,#080b1810,#080b1840 50%,#080b1810);padding:110px 20px 80px;text-align:center}#overlay h1{font-size:clamp(45px,5vw,78px);letter-spacing:-4px;margin:12px 0 10px;font-weight:800;text-shadow:0 5px 50px #040414}#overlay h1 span{color:var(--mint)}#overlay p{font-size:15px;line-height:1.9;color:#abb6cd;margin:0 0 26px}.primary{min-width:210px;border:0;border-radius:3px;background:var(--mint);color:#0b2721;padding:16px 23px;font-weight:700;box-shadow:0 0 35px #99ffcd15;display:flex;justify-content:space-between;gap:28px}.primary:hover{background:#c7ffe7;transform:translateY(-1px)}.primary:disabled{opacity:.4;cursor:wait}.hint{font-size:12px;color:#808ba5;margin-top:16px}.arena-bottom{position:absolute;bottom:25px;left:25px;right:25px;display:flex;align-items:center;gap:8px}.arena-bottom>div{flex:1;font-size:14px}.arena-bottom small{display:block;padding:6px 0 0 47px;color:#7a879e;font-size:12px}.pill{font:10px 'Arial Narrow',Arial,sans-serif;letter-spacing:1px;border:1px solid #56746d;color:var(--mint);padding:3px 6px;margin-right:8px}.arena-bottom button{width:35px;height:35px;border:1px solid #39445a;background:#0c1525;border-radius:50%;font-size:20px}.arena-bottom button:disabled{opacity:.3}.progress{position:absolute;bottom:0;height:3px;background:#24283b;width:100%}.progress div{height:100%;background:var(--mint);width:0;box-shadow:0 0 15px var(--mint)}aside{padding:4px 0}.library-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.library-head .eyebrow{color:#8990a6;font-size:11px}.library-head h2{font-size:21px;letter-spacing:1px;margin:8px 0 0;font-weight:600}.library-head h2 span{color:var(--mint);margin-left:14px}.count{font:38px 'Arial Narrow',Arial,sans-serif;color:#4b5065}.tracks{display:flex;flex-direction:column;gap:10px}.track{border:1px solid var(--border);display:flex;text-align:left;align-items:center;gap:14px;background:#111421;padding:12px;border-radius:5px;transition:.2s;width:100%}.track:hover{background:#1b2030;border-color:#70778d}.track.selected{border-color:#91cdb6;background:#152322;box-shadow:inset 3px 0 0 var(--mint)}.cover{width:61px;height:64px;flex-shrink:0;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;font:italic 44px 'Arial Narrow',Arial,sans-serif;letter-spacing:-6px;color:#fff;background:#253953}.cover span{font-size:27px}.original{background:linear-gradient(130deg,#081d1f,#328375);color:#d3ffe8}.original:after{content:'';position:absolute;width:3px;height:100px;transform:rotate(40deg);background:#b8fff0;box-shadow:0 0 20px #b8fff0;left:12px}.walker{background:radial-gradient(at 80% 0%,#327490,#101d3c 80%)}.dragons{background:linear-gradient(140deg,#5f344a,#24212f 70%)}.maroon{background:linear-gradient(120deg,#793f3d,#392331)}.track-info{flex:1;min-width:0}.track-info b{font-size:15px;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-info small{display:block;color:#8f98ab;font-size:12px;margin:5px 0}.track-info em{font:10px 'Arial Narrow',Arial,sans-serif;letter-spacing:1.6px;color:#99b5b1;font-style:normal}.track-state{color:var(--mint);font-size:18px}.import{width:100%;display:flex;align-items:center;gap:8px;padding:15px 12px;border:1px dashed #404659;background:none;margin-top:16px;border-radius:4px;font-size:14px}.import span{font-size:22px;color:var(--mint)}.import small{margin-left:auto;font:11px 'Arial Narrow',Arial,sans-serif;letter-spacing:1px;color:#969bb0}#status{font-size:12px;line-height:1.6;color:#7e859c;margin:9px 0 20px;min-height:20px}.settings{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:15px 0;display:grid;gap:18px}.settings label{display:flex;align-items:center;gap:12px;color:#a7acbd;font-size:13px;justify-content:space-between}.settings select{background:#191d2b;color:#d8dfef;border:1px solid #333a50;border-radius:4px;padding:6px 12px;font-size:12px}.settings input{width:150px;accent-color:var(--mint);height:3px}.settings output{width:33px;font:14px 'Arial Narrow',Arial,sans-serif}.how{margin-top:23px}.how>.eyebrow{color:#737e96}.how>div{display:flex;align-items:center;gap:13px;margin-top:15px}.instruction-icon{color:var(--mint);font-size:23px;border:1px solid #2b3845;width:34px;height:34px;display:grid;place-items:center;border-radius:5px}.how p{margin:0;font-size:13px;color:#c7cede}.how small{display:block;font-size:12px;margin-top:5px;color:#737f96}footer{margin:20px 4.3%;display:flex;justify-content:space-between;font:11px 'Arial Narrow',Arial,sans-serif;letter-spacing:2px;color:#667086}footer i{color:var(--mint);font-style:normal;margin-left:12px}#judgement{position:absolute;top:32%;left:0;right:0;text-align:center;pointer-events:none;color:var(--mint);font:700 28px 'Arial Narrow',Arial,sans-serif;letter-spacing:4px;text-shadow:0 0 20px currentColor}#result{background:#080e20df}#result h2{font:800 95px 'Arial Narrow',Arial,sans-serif;color:var(--mint);margin:0}#result h3{font-size:23px;margin:0 0 10px}#result p{color:#a9b4c9;line-height:2;white-space:pre-line;margin-bottom:25px}.text-button{background:none;border:0;color:#97a6bf;margin-top:15px;padding:10px}[hidden]{display:none!important}body.playing .arena{cursor:crosshair}body.playing .tracks,body.playing .import,body.playing #difficulty{pointer-events:none;opacity:.45}@media(min-width:1600px){main{grid-template-columns:minmax(0,1fr) 390px;gap:45px}}@media(max-width:1000px){main{grid-template-columns:minmax(0,1fr) 300px;gap:20px;margin-left:3%;margin-right:3%}.top-note{display:none}.arena-top{left:18px;right:18px}.arena-top #mode{display:none}.cover{width:48px}.track{gap:10px;padding:10px}}@media(max-width:750px){header{height:72px}.brand{font-size:23px}.live{font-size:8px;letter-spacing:1px}main{display:flex;flex-direction:column;margin:16px 4%}.arena{height:68vh;min-height:530px;max-height:750px}aside{padding-top:12px}.tracks{display:grid;grid-template-columns:1fr 1fr}.track{gap:8px}.cover{width:40px;height:54px;font-size:32px}.track-info b{font-size:12px}.track-info small{font-size:10px}.track-state{display:none}.how{display:flex;flex-wrap:wrap;gap:15px}.how>.eyebrow{width:100%}.how>div{margin:0}.hud{left:18px;right:18px}#overlay h1{font-size:57px}.arena-top{top:19px}.hud{top:52px}footer{font-size:9px;letter-spacing:1px}.library-head{margin-bottom:15px}.settings input{width:50%}body.playing aside{display:none}}
.music-sources{font-size:11px;color:#8592a8;margin:-10px 0 20px;line-height:1.7}.music-sources a{color:#a6cfbd;text-decoration:none}.music-sources a:hover{text-decoration:underline}
.tuning{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:16px 0}.tuning label{margin-bottom:14px}.settings .tuning input{width:100%;height:5px;margin:0;display:block}.tuning-scale{display:flex;justify-content:space-between;color:#8b96ab;font-size:11px;margin-top:11px}.tuning p{font-size:12px;color:#b9d4c9;margin:13px 0 9px}.tuning-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}.tuning-bottom small{font-size:11px;color:#7f8da3}.tuning-bottom button{font-size:11px;white-space:nowrap;padding:6px 9px;background:#192a29;border:1px solid #385d52;border-radius:4px;color:#a6ffd9}.tuning-bottom button:disabled,.tuning input:disabled{opacity:.4;cursor:default}
.midnight{background:linear-gradient(135deg,#20315f,#714783);color:#e5cfff}.skyline{background:linear-gradient(135deg,#135362,#2c94a0);color:#ccfffb}.garden{background:linear-gradient(135deg,#425c43,#6b9176);color:#e0ffcd}.tracks{max-height:505px;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:#3c5c58 transparent}@media(max-width:750px){.tracks{max-height:none;overflow:visible;padding-right:0}}