*{box-sizing:border-box}:root{--ink: #0b1220;--navy: #0e1a33;--cyan: #2fe6ff;--red: #ff2d55;--gold: #ffcf3a;--green: #35d07f;--sat: env(safe-area-inset-top, 0px);--sar: env(safe-area-inset-right, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--cond: "Barlow Condensed", "Noto Sans JP", system-ui, sans-serif}html,body{margin:0;height:100%;overflow:hidden;background:#0b1220;color:#fff;font-family:Noto Sans JP,system-ui,-apple-system,Hiragino Sans,sans-serif;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%;touch-action:manipulation}button{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}[hidden]{display:none!important}.app{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden}.app.is-shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97)}@keyframes shake{0%{transform:translate(0)}15%{transform:translate(-9px,6px) rotate(-.6deg)}30%{transform:translate(8px,-6px) rotate(.5deg)}45%{transform:translate(-5px,3px)}65%{transform:translate(3px,-2px)}to{transform:translate(0)}}.gl{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.app[data-phase=var] .gl,.app[data-phase=result]:not(.is-god) .gl{filter:saturate(.82) contrast(1.08)}.dim,.flash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0}.dim{background:radial-gradient(circle at 50% 50%,rgba(4,8,18,.55),rgba(2,4,10,.96))}.flash{background:#fff}.flash[data-kind=gold]{background:radial-gradient(circle at 50% 42%,#fffbe0 0%,#ffe27a 35%,rgba(255,190,40,.6) 100%)}@keyframes blink{50%{opacity:.35}}.top{position:absolute;left:0;right:0;top:0;padding:calc(var(--sat) + 10px) calc(var(--sar) + 60px) 18px calc(var(--sal) + 60px);text-align:center;pointer-events:none;background:linear-gradient(to bottom,rgba(6,12,26,.85),rgba(6,12,26,.4) 65%,rgba(6,12,26,0));transition:opacity .3s}.top>*{pointer-events:auto}.app[data-phase=play] .top,.app[data-phase=var] .top{opacity:0;pointer-events:none}.app[data-phase=play] .top>*,.app[data-phase=var] .top>*{pointer-events:none}.site-top{position:absolute;left:calc(var(--sal) + 10px);top:calc(var(--sat) + 12px);font-size:12px;font-weight:700;color:#cfe3ff;text-decoration:none;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.12)}.logo{margin:36px 0 0;line-height:1.05;display:inline-flex;flex-direction:column;align-items:center}@media (min-width: 600px){.logo{flex-direction:row;gap:10px;margin-top:4px;align-items:baseline}}.logo-b{margin-top:6px;font-weight:900;font-size:clamp(26px,8vw,44px);letter-spacing:.02em;white-space:nowrap;text-shadow:0 3px 0 rgba(0,0,0,.45)}.logo-b em{font:italic 800 1.35em / .8 var(--cond);color:var(--gold);margin:0 2px}.app:not([data-phase=title]) .logo-b{font-size:clamp(18px,5.4vw,28px)}.sound-btn{position:absolute;right:calc(var(--sar) + 12px);top:calc(var(--sat) + 10px);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center}.sound-btn svg{width:22px;height:22px}.sound-btn .mute,.sound-btn.is-muted .wave{display:none}.sound-btn.is-muted .mute{display:inline}.title-panel,.result{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;align-items:flex-end;justify-content:center;padding:0 0 calc(var(--sab) + 12px)}.panel,.card{pointer-events:auto;position:relative;width:min(94vw,420px);max-height:calc(100% - var(--sat) - 70px);overflow-y:auto;padding:16px 16px 14px;border-radius:18px;background:linear-gradient(to bottom,rgba(16,28,54,.94),rgba(8,14,30,.96));border:1px solid rgba(47,230,255,.35);box-shadow:0 14px 40px #00000073,inset 0 1px #ffffff14;text-align:center}.app:not([data-phase=title]) .title-panel{display:none}.lead{margin:0;font-weight:900;font-size:clamp(16px,4.6vw,19px)}.lead b{color:var(--gold)}.rule{margin:10px 0 12px;font-size:clamp(12.5px,3.4vw,14px);line-height:1.7;font-weight:700;color:#b9c8e4}.rule b{color:#fff}.rule-key{margin:-4px 0 12px;font-size:12px;font-weight:700;color:#8fa3c8}.start-btn,.retry-btn{width:100%;min-height:60px;border-radius:999px;font-size:clamp(20px,5.8vw,24px);font-weight:900;letter-spacing:.1em;color:#0b1220;background:linear-gradient(to bottom,#7ff3ff,var(--cyan));box-shadow:0 5px #0b8fb0,0 10px 22px #2fe6ff4d;transition:transform .06s,box-shadow .06s}.start-btn:active,.retry-btn:active{transform:translateY(4px);box-shadow:0 1px #0b8fb0}.steer{position:absolute;left:0;right:0;bottom:0;padding:34px calc(var(--sar) + 18px) calc(var(--sab) + 14px) calc(var(--sal) + 18px);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;background:linear-gradient(to top,rgba(6,12,26,.88),rgba(6,12,26,.5) 65%,rgba(6,12,26,0));transition:opacity .25s,transform .25s}.app:not([data-phase=aim]) .steer{opacity:0;transform:translateY(24px)}.s-hint{margin:2px 0 0;font-weight:900;font-size:clamp(15px,4.4vw,18px);letter-spacing:.06em;animation:pulse 1s ease-in-out infinite}.key-hint{margin:0;font-size:11px;color:#8ea2c8;font-weight:700}.for-touch{display:none}@media (pointer: coarse){.key-hint,.for-mouse{display:none}.for-touch{display:inline}}.pause-btn{position:absolute;right:calc(var(--sar) + 58px);top:calc(var(--sat) + 10px);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;z-index:6}.pause-btn svg{width:20px;height:20px}.app[data-phase=title] .pause-btn,.app[data-phase=result] .pause-btn{display:none}.app[data-phase=play] .pause-btn,.app[data-phase=var] .pause-btn{right:calc(var(--sar) + 12px);background:rgba(8,14,30,.6)}.app[data-phase=var] .var-rec{margin-right:48px}.pause{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;background:rgba(4,8,18,.72);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.pause-card{width:min(86vw,340px);padding:20px 18px 16px;border-radius:18px;background:linear-gradient(to bottom,rgba(16,28,54,.96),rgba(8,14,30,.98));border:1px solid rgba(47,230,255,.35);display:grid;gap:10px;text-align:center}.pause-title{margin:0 0 4px;font-weight:900;font-size:20px;letter-spacing:.1em}.pause-go,.pause-sub{min-height:52px;border-radius:999px;font-weight:900;font-size:17px}.pause-go{color:#0b1220;background:linear-gradient(to bottom,#7ff3ff,var(--cyan));box-shadow:0 4px #0b8fb0}.pause-sub{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2)}.pause-key{margin:2px 0 0;font-size:11px;color:#8ea2c8;font-weight:700}@media (pointer: coarse){.pause-key{display:none}}.banner{position:absolute;left:0;right:0;top:30%;text-align:center;pointer-events:none;opacity:0;font:italic 800 clamp(64px,20vw,140px) / .9 var(--cond);letter-spacing:.02em;white-space:nowrap}.banner small{display:block;margin-top:8px;font:900 clamp(15px,4.4vw,22px) / 1.2 "Noto Sans JP",sans-serif;letter-spacing:.16em;font-style:normal}.banner.is-goal{background:linear-gradient(100deg,#c98a00,#ffcf3a 30%,#fff8d0 45%,#ffcf3a 60%,#c98a00);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 #6a4a00) drop-shadow(0 0 20px rgba(255,200,60,.7));animation:shine 1.4s linear infinite}.banner.is-goal small{color:#fff3c0}.banner.is-kick{color:#fff;text-shadow:0 4px 0 #6a1404,0 0 24px rgba(255,60,40,.8);font-size:clamp(48px,14vw,100px)}.banner.is-kick small{color:#ffb08a}.g-hint{margin:0;font-weight:900;font-size:clamp(15px,4.4vw,18px);letter-spacing:.06em;animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{opacity:.55}}.gauge{position:relative;width:min(90vw,460px);height:34px}.g-track{position:absolute;top:6px;right:0;bottom:6px;left:0;border-radius:999px;background:linear-gradient(90deg,#ff5a3c,#ffb02e 30%,#ffe66b 50%,#9be86a 70%,#3cc7ff);box-shadow:inset 0 0 0 2px #ffffffd9,0 4px 14px #0006}.g-ticks{position:absolute;top:6px;right:12px;bottom:6px;left:12px;background:repeating-linear-gradient(90deg,rgba(0,0,0,.32) 0 2px,transparent 2px calc(10% - .2px));border-radius:999px;-webkit-mask:linear-gradient(to bottom,transparent 25%,#000 25% 75%,transparent 75%);mask:linear-gradient(to bottom,transparent 25%,#000 25% 75%,transparent 75%)}.g-ticks:after{content:"";position:absolute;left:50%;top:-6px;bottom:-6px;width:3px;margin-left:-1.5px;background:rgba(0,0,0,.55)}.g-marker{position:absolute;top:-2px;bottom:-2px;left:calc(12px + (100% - 24px) * var(--p));width:14px;margin-left:-7px;border-radius:7px;background:#fff;border:3px solid #0b1220;box-shadow:0 0 0 2px #fff,0 3px 8px #00000080}.gauge.is-stopped .g-marker{background:var(--gold);animation:stopped .4s ease-out}@keyframes stopped{0%{transform:scale(1.6)}to{transform:scale(1)}}.g-labels{display:flex;justify-content:space-between;width:min(90vw,460px);font-size:12px;font-weight:700;color:#b9c8e4}.var{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;font-family:var(--cond)}.var-scan{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.05) 0 1px,rgba(0,0,0,.12) 1px 3px);mix-blend-mode:overlay}.var-scan:after{content:"";position:absolute;left:0;right:0;height:22%;background:linear-gradient(to bottom,rgba(47,230,255,0),rgba(47,230,255,.08),rgba(47,230,255,0));animation:sweep 2.6s linear infinite}@keyframes sweep{0%{top:-22%}to{top:100%}}.var:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 120px #000000bf}.var-noise{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.5) 0 2px,rgba(0,0,0,.6) 2px 5px),repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 3px,transparent 3px 7px);mix-blend-mode:screen}.var-corner{position:absolute;width:28px;height:28px;border:3px solid rgba(255,255,255,.85)}.var-corner.tl{left:calc(var(--sal) + 12px);top:calc(var(--sat) + 12px);border-right:0;border-bottom:0}.var-corner.tr{right:calc(var(--sar) + 12px);top:calc(var(--sat) + 12px);border-left:0;border-bottom:0}.var-corner.bl{left:calc(var(--sal) + 12px);bottom:calc(var(--sab) + 12px);border-right:0;border-top:0}.var-corner.br{right:calc(var(--sar) + 12px);bottom:calc(var(--sab) + 12px);border-left:0;border-top:0}.var-head{position:absolute;left:calc(var(--sal) + 24px);right:calc(var(--sar) + 24px);top:calc(var(--sat) + 24px);display:flex;align-items:center;gap:8px}.var-badge{font:italic 800 26px / 1 var(--cond);letter-spacing:.06em;padding:3px 10px 2px;background:#fff;color:#0b1220;transform:skew(-10deg)}.var-status{font:800 20px / 1 var(--cond);letter-spacing:.16em;padding:5px 10px 4px;background:rgba(10,18,36,.8);border-left:4px solid var(--cyan)}.var-rec{margin-left:auto;font:800 16px / 1 var(--cond);letter-spacing:.14em;display:flex;align-items:center;gap:6px}.var-rec i{width:10px;height:10px;border-radius:50%;background:var(--red);animation:blink 1s steps(2) infinite}.var-foot{position:absolute;left:calc(var(--sal) + 24px);right:calc(var(--sar) + 24px);bottom:calc(var(--sab) + 26px);display:flex;justify-content:space-between;font:600 15px / 1 var(--cond);letter-spacing:.12em;color:#ffffffd9;transition:opacity .3s}.app[data-phase=result] .var-foot,.app[data-phase=result] .var-readout,.app[data-phase=result] .var-head,.app[data-phase=result] .var-corner{opacity:0;transition:opacity .3s}.var-tc{font-variant-numeric:tabular-nums}.var-title{position:absolute;left:0;right:0;top:40%;text-align:center;opacity:0}.var-title span{display:block;font:italic 800 clamp(48px,15vw,96px) / .9 var(--cond);letter-spacing:.04em;text-shadow:0 0 24px rgba(47,230,255,.7),3px 0 0 rgba(255,45,85,.6),-3px 0 0 rgba(47,230,255,.6)}.var-title span:after{content:"...";animation:blink .6s steps(2) infinite}.var-title small{display:block;margin-top:10px;font:900 clamp(14px,4vw,18px) / 1 "Noto Sans JP",sans-serif;letter-spacing:.3em;color:var(--cyan)}.var-measure{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.var-measure text{font:800 15px var(--cond);letter-spacing:.06em}.var-readout{position:absolute;left:50%;bottom:calc(var(--sab) + 58px);transform:translate(-50%);display:flex;align-items:baseline;gap:8px;padding:8px 16px 6px;background:rgba(8,14,30,.85);border:1px solid rgba(47,230,255,.5);opacity:0;transition:opacity .3s;white-space:nowrap}.var-readout small{font:600 14px / 1 var(--cond);letter-spacing:.16em;color:var(--cyan)}.var-readout b{font:800 clamp(34px,10vw,46px) / 1 var(--cond);font-variant-numeric:tabular-nums;min-width:3.2ch;text-align:right}.var-readout.is-in b{color:#7dffb4}.var-readout.is-out b{color:#ff9a6a}.var-readout.is-god b{color:var(--gold);text-shadow:0 0 16px rgba(255,207,58,.8)}.var-verdict{position:absolute;left:0;right:0;top:22%;text-align:center;opacity:0;font:italic 800 clamp(54px,17vw,110px) / .9 var(--cond);letter-spacing:.04em}.var-verdict small{display:block;margin-top:8px;font:900 clamp(15px,4.4vw,20px) / 1.2 "Noto Sans JP",sans-serif;letter-spacing:.2em;font-style:normal}.var-verdict.is-in{color:#7dffb4;text-shadow:0 0 28px rgba(53,208,127,.8),0 4px 0 #0a5a32}.var-verdict.is-out{color:#ff5a3c;text-shadow:0 0 28px rgba(255,60,40,.8),0 4px 0 #6a1404}.var-verdict.is-god{background:linear-gradient(100deg,#c98a00,#ffcf3a 30%,#fff8d0 45%,#ffcf3a 60%,#c98a00);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(255,200,60,.9)) drop-shadow(0 4px 0 #6a4a00);animation:shine 1.6s linear infinite}.var-verdict.is-god small{color:#fff3c0}@keyframes shine{to{background-position:-220% 0}}.replay-tag{position:absolute;left:50%;top:calc(var(--sat) + 70px);transform:translate(-50%);padding:6px 14px 5px;font:italic 800 clamp(18px,5vw,26px) / 1 var(--cond);letter-spacing:.14em;color:#0b1220;background:linear-gradient(90deg,#c98a00,#ffe27a,#fff6cf,#ffcf3a);white-space:nowrap;pointer-events:none}.replay-tag b{font-weight:800}@media (max-width: 599px){.replay-tag{top:calc(var(--sat) + 88px)}}.sparks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.spark{position:absolute;background:linear-gradient(135deg,#fff6c8,#ffcf3a 50%,#d89a00);clip-path:polygon(50% 0,61% 36%,100% 38%,69% 60%,80% 100%,50% 76%,20% 100%,31% 60%,0 38%,39% 36%);filter:drop-shadow(0 0 6px rgba(255,210,80,.9));opacity:0}.card{padding:14px 16px 12px}.r-kicker{margin:0;font:800 16px / 1.2 var(--cond);letter-spacing:.2em;color:var(--tone, #b9c8e4)}.r-title{margin:6px 0 2px;font-weight:900;font-size:clamp(30px,9vw,42px);line-height:1.15;color:var(--tone, #fff);white-space:nowrap}.r-title.is-long{font-size:clamp(24px,7vw,34px)}.r-dist{margin:0;font:800 clamp(44px,14vw,64px) / 1 var(--cond);font-variant-numeric:tabular-nums}.r-dist small{font-size:.42em;margin-left:4px}.r-dist .r-label{font:900 14px Noto Sans JP,sans-serif;letter-spacing:.1em;margin:0 8px 0 0;color:#b9c8e4;vertical-align:.9em}.r-note{margin:4px 0 10px;font-size:12.5px;font-weight:700;color:#b9c8e4}.result-social .social{margin-top:10px}@media (hover: hover) and (pointer: fine){.result-social .social{margin-top:24px}}.result-ad:empty{display:none}.card[data-tone=great]{--tone: #7dffb4}.card[data-tone=good]{--tone: #9be8ff}.card[data-tone=mid]{--tone: #ffe08a}.card[data-tone=out]{--tone: #ff7a5a;border-color:#ff5a3c99}.card[data-tone=god]{--tone: #ffcf3a;border:2px solid transparent;background:linear-gradient(to bottom,rgba(40,30,8,.95),rgba(16,12,4,.97)) padding-box,conic-gradient(from var(--spin, 0deg),#c98a00,#fff6cf,#ffcf3a,#ffe9a0,#fff6cf,#c98a00) border-box;box-shadow:0 0 0 4px #ffd65a59,0 0 60px #ffc83c99,0 14px 40px #00000080;animation:spin-border 3s linear infinite}@property --spin{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@keyframes spin-border{to{--spin: 360deg}}.card[data-tone=god] .r-title,.card[data-tone=god] .r-dist span{background:linear-gradient(100deg,#c98a00,#ffcf3a 30%,#fff8d0 45%,#ffcf3a 60%,#c98a00);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #6a4a00);animation:shine 1.8s linear infinite}.card[data-tone=god] .r-dist{font-size:clamp(64px,22vw,96px)}.card[data-tone=out] .r-title{color:#ff7a5a}@media (min-aspect-ratio: 5/4) and (min-width: 760px){.title-panel,.result{align-items:center;justify-content:flex-end;padding:calc(var(--sat) + 70px) calc(var(--sar) + 4vw) calc(var(--sab) + 16px) 0}.panel,.card{width:400px;max-height:100%}}