:root{--void:#05060f;--cyan:#3ff2ff;--magenta:#ff3fb4;--amber:#ffb43f;--white:#f4f7ff;--dim:#f4f7ff8c;--font:"BIZ UDPGothic", "Hiragino Maru Gothic ProN", "Hiragino Sans", "Yu Gothic UI", "Meiryo", system-ui, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--white);font-family:var(--font);cursor:none;-webkit-user-select:none;user-select:none;background:#020208;margin:0;overflow:hidden}body.cursor{cursor:crosshair}#gl{width:100vw;height:100vh;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}.layer{opacity:0;transition:opacity .6s cubic-bezier(.2,.7,.2,1);position:absolute;inset:0}.layer.on{opacity:1}.center{text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.glow-c{text-shadow:0 0 .3em #3ff2ffe6,0 0 1.2em #3ff2ff80}.glow-a{text-shadow:0 0 .3em #ffb43ff2,0 0 1.2em #ffb43f80}.glow-m{text-shadow:0 0 .3em #ff3fb4f2,0 0 1.2em #ff3fb480}.logo{letter-spacing:.32em;color:var(--white);text-shadow:0 0 .15em #3ff2ffe6,0 0 .6em #3ff2ff8c,0 0 1.4em #ff3fb459;padding-left:.32em;font-size:13vh;font-weight:300;animation:4.8s ease-in-out infinite breathe;position:absolute;top:9vh;left:50%;transform:translate(-50%)}@keyframes breathe{0%,to{opacity:.82}50%{opacity:1}}.call{letter-spacing:.12em;white-space:nowrap;font-size:5.2vh;animation:2.4s ease-in-out infinite breathe;position:absolute;bottom:13vh;left:50%;transform:translate(-50%)}.privacy{color:var(--dim);letter-spacing:.06em;white-space:nowrap;font-size:2.1vh;position:absolute;bottom:3vh;left:50%;transform:translate(-50%)}.privacy b{color:var(--white);font-weight:600}.guide{height:60vh;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .4s;position:absolute;top:50%;left:50%;transform:translate(-50%,-46%)}.guide svg{height:100%;overflow:visible}.guide path,.guide circle.head{fill:none;stroke-width:3px;stroke:var(--cyan);filter:drop-shadow(0 0 6px);transition:stroke .3s}.guide.tooClose path,.guide.tooClose circle.head{stroke:var(--magenta)}.guide.tooFar path,.guide.tooFar circle.head{stroke:var(--amber)}.guide.tooClose{animation:1.6s ease-in-out infinite pushBack}.guide.tooFar{animation:1.6s ease-in-out infinite pullIn}@keyframes pushBack{0%,to{transform:translate(-50%,-46%)scale(1.06)}50%{transform:translate(-50%,-46%)scale(.92)}}@keyframes pullIn{0%,to{transform:translate(-50%,-46%)scale(.9)}50%{transform:translate(-50%,-46%)scale(1.04)}}.guide .fill{stroke:var(--amber)!important;stroke-width:6px!important}.hint{letter-spacing:.1em;white-space:nowrap;font-size:5vh;position:absolute;top:4vh;left:50%;transform:translate(-50%)}.hbtn{text-align:center;background:#05060f59;border:2px solid #3ff2ff8c;border-radius:50%;justify-content:center;align-items:center;font-size:2.8vh;line-height:1.25;display:flex;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 1.5vh #3ff2ff59,inset 0 0 1.5vh #3ff2ff33}.hbtn .prog{background:conic-gradient(var(--amber) calc(var(--p) * 1turn), transparent 0);border-radius:50%;position:absolute;inset:-6px;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,#0000 calc(100% - 6px),#000 calc(100% - 5px))}.score{font-variant-numeric:tabular-nums;color:var(--white);letter-spacing:.04em;font-size:7vh;font-weight:600;position:absolute;top:2.5vh;right:3vw}.combo{color:var(--amber);font-variant-numeric:tabular-nums;font-size:4vh;transition:transform .16s cubic-bezier(.3,1.6,.5,1);position:absolute;top:11vh;right:3vw}.combo.bump{transform:scale(1.18)}.combo small{color:var(--dim);margin-left:.3em;font-size:.55em}.timebar{background:#f4f7ff14;border-radius:1vh;height:.6vh;position:absolute;bottom:2vh;left:3vw;right:3vw;overflow:hidden}.timebar i{background:linear-gradient(90deg, var(--cyan), var(--amber));box-shadow:0 0 1vh var(--cyan);position:absolute;top:0;bottom:0;left:0}.sections{gap:1.2vh;display:flex;position:absolute;top:3vh;left:3vw}.sections span{opacity:.45;border:2px solid #f4f7ff33;border-radius:50%;justify-content:center;align-items:center;width:4.6vh;height:4.6vh;font-size:2.4vh;transition:all .4s;display:flex}.sections span.now{opacity:1;border-color:var(--amber);box-shadow:0 0 1.4vh var(--amber);transform:scale(1.15)}.sections span.done{opacity:.7;border-color:var(--cyan)}.judge{letter-spacing:.08em;pointer-events:none;white-space:nowrap;font-size:5vh;font-weight:700;animation:.65s cubic-bezier(.2,.8,.2,1) forwards pop;position:absolute;transform:translate(-50%,-50%)}.judge.perfect{color:var(--amber);text-shadow:0 0 .4em #ffb43fe6}.judge.good{color:var(--cyan);text-shadow:0 0 .4em #3ff2ffe6;font-size:4vh}.judge.miss{color:#a0aad2b3;font-size:3.2vh;animation-name:sink}@keyframes pop{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}18%{opacity:1;transform:translate(-50%,-60%)scale(1.12)}60%{opacity:1;transform:translate(-50%,-80%)scale(1)}to{opacity:0;transform:translate(-50%,-110%)scale(.96)}}@keyframes sink{0%{opacity:0}20%{opacity:1}to{opacity:0;transform:translate(-50%,20%)}}.banner{letter-spacing:.3em;white-space:nowrap;opacity:0;font-size:6vh;position:absolute;top:70vh;left:50%;transform:translate(-50%)}.banner.show{animation:1.8s cubic-bezier(.2,.8,.2,1) forwards banner}@keyframes banner{0%{opacity:0;letter-spacing:.6em}20%{opacity:1;letter-spacing:.3em}75%{opacity:1}to{opacity:0;letter-spacing:.2em}}.warn{color:var(--amber);opacity:0;white-space:nowrap;background:#05060f99;border:1px solid #ffb43f99;border-radius:3vh;padding:.5em 1.2em;font-size:3vh;transition:opacity .4s;position:absolute;top:13vh;left:50%;transform:translate(-50%)}.warn.on{opacity:1}.calib-text{letter-spacing:.14em;white-space:nowrap;font-size:6vh;position:absolute;top:9vh;left:50%;transform:translate(-50%)}.calib-dots{gap:1.6vh;display:flex;position:absolute;top:18vh;left:50%;transform:translate(-50%)}.calib-dots i{border:2px solid #ffb43f99;border-radius:50%;width:2vh;height:2vh;transition:all .2s}.calib-dots i.ok{background:var(--amber);box-shadow:0 0 1.4vh var(--amber)}.res{text-align:center;background:radial-gradient(#020208d1 0%,#02020899 55%,#02020800 75%);border-radius:50%;padding:4vh 8vh;position:absolute;top:50%;left:50%;transform:translate(-50%,-54%)}.res .rank{font-size:22vh;font-weight:700;line-height:1}.res .rank.rank-d{color:var(--dim)}.res .big{font-variant-numeric:tabular-nums;font-size:10vh;font-weight:600}.res .row{color:var(--dim);justify-content:center;gap:4vh;margin-top:1.5vh;font-size:3.2vh;display:flex}.res .row b{color:var(--white);font-variant-numeric:tabular-nums}.res .row span{white-space:nowrap}.res .row b{margin:0 .25em}.res .nick{color:var(--cyan);margin-top:2vh;font-size:4vh}.res .newbest{color:var(--amber);letter-spacing:.2em;margin-top:1vh;font-size:3.6vh}.ranking{min-width:30vh;font-size:2.6vh;position:absolute;top:50%;right:4vw;transform:translateY(-50%)}.ranking h3{color:var(--dim);letter-spacing:.3em;margin:0 0 1vh;font-size:2.4vh;font-weight:400}.ranking ol{margin:0;padding:0;list-style:none}.ranking li{border-bottom:1px solid #f4f7ff12;justify-content:space-between;gap:2vh;padding:.35em 0;display:flex}.ranking li.me{color:var(--amber)}.ranking li span:last-child{font-variant-numeric:tabular-nums}.load{text-align:center;width:40vw;position:absolute;top:62vh;left:50%;transform:translate(-50%)}.load .bar{background:#f4f7ff1a;border-radius:1vh;height:.5vh;margin-top:2vh;overflow:hidden}.load .bar i{background:linear-gradient(90deg, var(--cyan), var(--amber));width:0;height:100%;box-shadow:0 0 1vh var(--cyan);transition:width .2s;display:block}.load .label{color:var(--dim);letter-spacing:.1em;font-size:2.6vh}.err{text-align:center;max-width:70vw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.err h2{color:var(--amber);margin:0 0 2vh;font-size:5vh;font-weight:400}.err p{color:var(--dim);margin:.5em 0;font-size:2.6vh;line-height:1.7}.err code{color:var(--white)}.staffnote{color:#f4f7ff59;margin-top:4vh;font-size:1.6vh}.qr{text-align:center;color:var(--dim);font-size:2vh;line-height:1.5;position:absolute;top:50%;left:4vw;transform:translateY(-50%)}.qr svg{background:#f4f7ff;border-radius:1vh;width:22vh;height:22vh;margin:0 auto 1.2vh;padding:1vh;display:block;box-shadow:0 0 2vh #3ff2ff59}.marks{position:absolute;inset:0}.mark{transform-origin:50%;color:#f4f7ffd9;white-space:nowrap;letter-spacing:.08em;text-shadow:0 0 .5em #05060fe6,0 0 .2em #05060fe6;will-change:transform;font-size:2.6vh;position:absolute;top:0;left:0}.mark.strong{color:var(--amber);text-shadow:0 0 .4em #ffb43fcc,0 0 .2em #05060fe6;font-size:3.4vh}.hurt{pointer-events:none;opacity:0;background:radial-gradient(#0000 55%,#ff3fb461 100%);position:absolute;inset:0}.hurt.on{animation:.7s cubic-bezier(.2,.7,.2,1) hurt}@keyframes hurt{0%{opacity:0}15%{opacity:1}to{opacity:0}}.cutin{pointer-events:none;opacity:0;will-change:opacity;position:absolute;inset:0}.cutin.show{animation:1.3s linear forwards cutinFade}.cutin.big.show{animation-duration:2.8s}@keyframes cutinFade{0%{opacity:1}85%{opacity:1}to{opacity:0}}.cutin .bar{will-change:transform;background:#000;height:11vh;position:absolute;left:0;right:0;transform:scaleY(0)}.cutin .bar.t{transform-origin:top;top:0}.cutin .bar.b{transform-origin:bottom;bottom:0}.cutin.show .bar{animation:1.3s cubic-bezier(.2,.8,.2,1) forwards bar}.cutin.big.show .bar{animation-duration:2.8s}@keyframes bar{0%{transform:scaleY(0)}12%{transform:scaleY(1)}88%{transform:scaleY(1)}to{transform:scaleY(0)}}.cutin .ink{transform-origin:0;will-change:transform, opacity;background:linear-gradient(90deg,#0000,#05060feb 8% 92%,#0000);height:24vh;position:absolute;top:38vh;left:-20vw;right:-20vw;transform:skewY(-6deg)scaleX(0)}.cutin.show .ink{animation:1.3s cubic-bezier(.2,.8,.2,1) forwards ink}.cutin.big.show .ink{animation-duration:2.8s}@keyframes ink{0%{transform:skewY(-6deg)scaleX(0)}14%{transform:skewY(-6deg)scaleX(1)}86%{opacity:1;transform:skewY(-6deg)scaleX(1)}to{opacity:0;transform:skewY(-6deg)scaleX(1)}}.cutin .ct{text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cutin .kanji{letter-spacing:.12em;color:#fff;-webkit-text-stroke:.02em #fff9;opacity:0;white-space:nowrap;will-change:transform, opacity;font-family:Yu Mincho,YuMincho,Hiragino Mincho ProN,Noto Serif JP,MS PMincho,serif;font-size:15vh;font-weight:900;line-height:1}.cutin.big .kanji{font-size:20vh}.cutin.amber .kanji{text-shadow:0 0 .08em #ffb43f,0 0 .35em #ffb43fb3}.cutin.cyan .kanji{text-shadow:0 0 .08em #3ff2ff,0 0 .35em #3ff2ffb3}.cutin.magenta .kanji{text-shadow:0 0 .08em #ff3fb4,0 0 .35em #ff3fb4b3}.cutin.show .kanji{animation:1.3s cubic-bezier(.15,.9,.2,1) forwards kanji}.cutin.big.show .kanji{animation-duration:2.8s}@keyframes kanji{0%{opacity:0;transform:scale(1.9)}16%{opacity:1;transform:scale(1)}80%{opacity:1;transform:scale(1.04)}to{opacity:0;transform:scale(1.08)}}.cutin .read{letter-spacing:.6em;color:#f4f7ffcc;opacity:0;will-change:transform, opacity;margin-top:1.5vh;font-size:3vh}.cutin.show .read{animation:1.3s forwards read}.cutin.big.show .read{animation-duration:2.8s}@keyframes read{0%,18%{opacity:0;transform:translateY(1vh)}30%{opacity:1;transform:none}85%{opacity:1}to{opacity:0}}body.calm .cutin .kanji{animation-name:kanjiCalm!important}@keyframes kanjiCalm{0%{opacity:0}20%{opacity:1}80%{opacity:1}to{opacity:0}}.lens{pointer-events:none;opacity:0;z-index:6;color:#9ff4ff;font:500 clamp(11px,1.6vh,20px)/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;transition:opacity .4s;position:fixed;inset:0}.lens.on{opacity:1}.lens-hand{white-space:pre;text-shadow:0 0 6px #5ef0ffcc;background:linear-gradient(90deg,#143c5073,#143c5000);border-left:2px solid #5ef0ff;padding:.5em .8em;transition:opacity .2s;position:absolute;top:0;left:0}.lens-sys{white-space:pre;color:#ffd27a;text-shadow:0 0 6px #ffb547b3;background:linear-gradient(90deg,#3c280a80,#3c280a00);border-left:2px solid #ffb547;padding:.6em .9em;position:absolute;bottom:4.5vh;left:1.6vw}.calm .lens-hand,.calm .lens-sys{text-shadow:none}.sel-head{letter-spacing:.3em;white-space:nowrap;padding-left:.3em;font-size:6vh;position:absolute;top:5vh;left:50%;transform:translate(-50%)}.sel-sub{color:var(--dim);letter-spacing:.08em;white-space:nowrap;font-size:2.6vh;position:absolute;top:13vh;left:50%;transform:translate(-50%)}.sel-card{--c:var(--cyan);--p:0;text-align:center;border:2px solid color-mix(in srgb, var(--c) 45%, transparent);height:62vh;box-shadow:0 0 2vh color-mix(in srgb, var(--c) 25%, transparent), inset 0 0 3vh color-mix(in srgb, var(--c) 10%, transparent);background:linear-gradient(#05060f40,#05060f8c);border-radius:1.6vh;padding:3vh 1.6vw;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s;position:absolute;top:21vh;overflow:hidden}.sel-card.hue-cyan{--c:var(--cyan)}.sel-card.hue-magenta{--c:var(--magenta)}.sel-card.hue-amber{--c:var(--amber)}.sel-card.hue-vermilion{--c:#ff5a2a}.sel-card.hover{border-color:var(--c);box-shadow:0 0 4vh color-mix(in srgb, var(--c) 60%, transparent), inset 0 0 4vh color-mix(in srgb, var(--c) 25%, transparent);transform:scale(1.04)}.sel-card .prog{height:.9vh;width:calc(var(--p) * 100%);background:var(--c);box-shadow:0 0 2vh var(--c);position:absolute;bottom:0;left:0}.sel-card .lv{letter-spacing:.2em;color:var(--c);text-shadow:0 0 1.2vh var(--c);font-size:4.2vh;font-weight:700}.sel-card .lv small{letter-spacing:.4em;color:var(--dim);margin-top:.4vh;font-size:1.7vh;font-weight:400;display:block}.sel-card .stars{color:var(--amber);letter-spacing:.3em;margin:1.2vh 0 2vh;font-size:2.6vh}.sel-card .nm{letter-spacing:.12em;text-shadow:0 0 1.5vh color-mix(in srgb, var(--c) 70%, transparent);font-family:Yu Mincho,YuMincho,Hiragino Mincho ProN,Noto Serif JP,serif;font-size:6.4vh;font-weight:700}.sel-card .rd{color:var(--dim);letter-spacing:.3em;margin-top:.6vh;font-size:1.8vh}.sel-card .ds{text-align:left;color:#f4f7ffd9;margin-top:2.6vh;font-size:2.15vh;line-height:1.65}.sel-card .boss{letter-spacing:.12em;color:var(--c);font-size:2.3vh;position:absolute;bottom:8.5vh;left:0;right:0}.sel-card .best{color:var(--dim);font-size:2vh;position:absolute;bottom:3.6vh;left:0;right:0}.sel-card .best b{color:var(--white);font-variant-numeric:tabular-nums}.sel-cursor{border:2px solid var(--amber);width:3.4vh;height:3.4vh;box-shadow:0 0 1.5vh var(--amber);opacity:0;border-radius:50%;margin:-1.7vh 0 0 -1.7vh;transition:opacity .2s;position:absolute;top:0;left:0}.res .stage-name{letter-spacing:.25em;color:var(--dim);margin-bottom:1vh;font-size:3vh}.ranking h3 small{letter-spacing:.1em;color:var(--dim);margin-top:.4vh;font-size:.7em;font-weight:400;display:block}.ranking .online{margin-top:3vh}.ranking .online .off{color:var(--dim);margin:.5vh 0;font-size:2vh}.ranking .online .place{color:var(--cyan);margin:.4vh 0 .8vh;font-size:2.2vh}.ranking .online .place b{color:var(--white);font-size:1.3em}.ranking .online .place small{color:var(--dim)}.ranking li em{color:var(--dim);letter-spacing:.05em;font-size:.62em;font-style:normal;display:block}.settings{z-index:50;pointer-events:auto;width:min(460px,92vw);max-height:94vh;color:var(--white);cursor:default;background:#060816eb;border:1px solid #3ff2ff59;border-radius:14px;padding:18px 22px;font-size:15px;display:none;position:fixed;top:3vh;right:2vw;overflow:auto;box-shadow:0 0 30px #3ff2ff33}.settings.on{display:block}.settings h2{letter-spacing:.1em;margin:0 0 12px;font-size:20px;font-weight:600}.settings h2 small{color:var(--dim);letter-spacing:0;margin-left:.6em;font-size:12px;font-weight:400}.settings .row{border-bottom:1px solid #f4f7ff14;grid-template-columns:1fr 150px 48px;align-items:center;gap:10px;padding:9px 0;display:grid}.settings .row.chk{grid-template-columns:1fr auto}.settings .row select{grid-column:2/4}.settings .lb em{color:var(--dim);margin-top:2px;font-size:12px;font-style:normal;display:block}.settings input[type=range]{accent-color:#3ff2ff;width:100%}.settings input[type=checkbox]{accent-color:#3ff2ff;width:20px;height:20px}.settings output{text-align:right;font-variant-numeric:tabular-nums;color:var(--cyan)}.settings select,.settings button{font:inherit;color:var(--white);background:#f4f7ff14;border:1px solid #f4f7ff33;border-radius:8px;padding:6px 10px}.settings .btns{justify-content:flex-end;gap:10px;margin-top:14px;display:flex}.settings button{cursor:pointer}.settings h2{align-items:baseline;display:flex}.settings h2 .x{margin-left:auto;padding:0 12px;font-size:22px;line-height:1.3}.settings-btn{z-index:49;font:15px var(--font);color:var(--white);opacity:.45;cursor:pointer;pointer-events:auto;background:#06081699;border:1px solid #f4f7ff33;border-radius:999px;align-items:center;gap:.4em;padding:8px 14px;transition:opacity .2s,border-color .2s;display:flex;position:fixed;bottom:4.5vh;right:2vw}.settings-btn span{font-size:18px;line-height:1}.settings-btn:hover,.settings-btn:focus-visible{opacity:1;border-color:var(--cyan)}.settings-btn.on{display:none}.settings button:hover{border-color:var(--cyan)}.name-entry{text-align:center;pointer-events:auto;width:min(1100px,94vw);display:none;position:absolute;bottom:3vh;left:50%;transform:translate(-50%)}.name-entry.on{display:block}.layer.results.naming .res{transform-origin:top;top:1vh;transform:translate(-50%)scale(.5)}.layer.results.naming .ranking,.layer.results.naming .qr{display:none}.ne-head{letter-spacing:.15em;color:var(--amber);text-shadow:0 0 1vh #ffb43f99;margin-bottom:1vh;font-size:3.2vh}.ne-box{background:#05060fb3;border:2px solid #3ff2ff99;border-radius:1vh;align-items:center;gap:1vh;padding:.6vh 1.6vh;display:inline-flex;box-shadow:0 0 2vh #3ff2ff4d}.ne-input{font:600 4.6vh var(--font);color:var(--white);text-align:center;letter-spacing:.12em;width:22ch;caret-color:var(--amber);background:0 0;border:0;outline:none}.ne-count{color:var(--dim);font-variant-numeric:tabular-nums;font-size:2vh}.ne-msg{min-height:3vh;color:var(--magenta);margin:.4vh 0;font-size:2.4vh}.ne-grid{gap:.7vh;margin:0 auto;display:grid}.ne-grid.kana{grid-template-columns:repeat(11,1fr)}.ne-grid.abc{grid-template-columns:repeat(10,1fr)}.ne-key{--p:0;height:6.2vh;font:600 3.1vh var(--font);color:var(--white);cursor:pointer;background:#0a0e22c7;border:1px solid #f4f7ff38;border-radius:.8vh;position:relative;overflow:hidden}.ne-key:after{content:"";height:.6vh;width:calc(var(--p) * 100%);background:var(--amber);position:absolute;bottom:0;left:0}.ne-key.hover{border-color:var(--cyan);box-shadow:0 0 1.6vh #3ff2ff80}.ne-key.mod{color:var(--cyan)}.ne-key.blank{background:0 0;border:0}.ne-ctrl{justify-content:center;gap:1vh;margin-top:1vh;display:flex}.ne-key.wide{width:18vh}.ne-key.ok{border-color:var(--amber);color:var(--amber)}.ne-hint{color:var(--dim);margin-top:1vh;font-size:1.9vh}.ne-cursor{border:2px solid var(--amber);width:2.6vh;height:2.6vh;box-shadow:0 0 1.4vh var(--amber);opacity:0;pointer-events:none;z-index:5;background:#ffb43f59;border-radius:50%;margin:-1.3vh 0 0 -1.3vh;position:fixed;top:0;left:0}.ne-cursor.idle{box-shadow:none;background:0 0;border-style:dashed;opacity:.5!important}
