:root{color-scheme:dark;--ui-scale: 1;--beat: .6s;--void: #07070c;--outline: #0c0c12;--paper: #ffffff;--ink-1: rgba(255, 255, 255, .85);--ink-2: rgba(255, 255, 255, .62);--ink-3: rgba(255, 255, 255, .5);--ink-faint: rgba(255, 255, 255, .4);--p1: #38dcff;--p1-tint: #b6f3ff;--p2: #ff60bc;--p2-tint: #ffc7e8;--p1-data: #0ea5e9;--p2-data: #ec4899;--gold: #ffd23a;--danger: #ff4f6d;--hype: #ff8c3c;--lime: #aef74b;--hp-chip: #fff4b0;--fruit-watermelon: #eb2d46;--fruit-apple: #faebaa;--fruit-lemon: #ffe65a;--fruit-pear: #e1ee96;--fruit-coconut: #f5f0dc;--fruit-banana: #fae178;--fruit-kiwi: #7dc83c;--fruit-bomb: #55555c;--tint-menu: rgba(60, 14, 52, .7);--tint-settings: rgba(14, 38, 60, .78);--tint-results: rgba(60, 44, 14, .72);--tint-camfail: rgba(60, 16, 16, .8);--r-button: 12px;--r-card: 14px;--r-bar: 4px;--stroke-ink: 4px;--btn-drop: 0 6px 0 rgba(0, 0, 0, .45);--skew-btn: -6deg;--skew-bar: 14deg}*{margin:0;padding:0;box-sizing:border-box}body{background:#07070c;font-family:Teko,system-ui,sans-serif;color:#fff;overflow:hidden}#stage{position:relative;width:100vw;height:100vh;display:grid;place-items:center;will-change:transform}#webcam,#fruit,#overlay{position:absolute;width:100%;height:100%;object-fit:contain;transform:scaleX(-1)}#fruit{z-index:1}#overlay{z-index:31;pointer-events:none}#status{position:absolute;left:10px;bottom:9px;padding:1px 9px;border-radius:4px;background:#00000059;font-family:Teko,sans-serif;font-size:15px;letter-spacing:.06em;color:var(--ink-3);pointer-events:none;z-index:10;transform:scale(var(--ui-scale));transform-origin:left bottom}#hud{position:absolute;top:16px;left:0;right:0;display:flex;align-items:flex-start;justify-content:center;gap:16px;padding:0 22px;z-index:15;pointer-events:none}#hud.hidden{display:none}.hpwrap{flex:1;max-width:44%;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.hpwrap.p1{align-items:flex-end}.plate{font-family:Bungee,sans-serif;font-size:clamp(13px,1.9vmin,40px);line-height:1.4;padding:0 12px;border-radius:4px;color:#07070c}.p0 .plate{background:var(--p1);box-shadow:0 0 16px #38dcffcc}.p1 .plate{background:var(--p2);box-shadow:0 0 16px #ff60bccc}.bar{position:relative;width:100%;height:clamp(16px,2.4vmin,52px);background:#000000a6;border:3px solid #fff;border-radius:4px;overflow:hidden;transform:skew(-14deg);box-shadow:0 0 0 2px #000000b3,0 5px 16px #00000080}.p1 .bar{transform:skew(14deg)}.bar span{position:absolute;top:0;bottom:0;left:0;display:block;width:100%}.p1 .bar span{left:auto;right:0}.trail{background:var(--hp-chip);transition:width .45s ease .14s}.fill{transition:width .07s linear}.p0 .fill{background:linear-gradient(180deg,var(--p1-tint),var(--p1));box-shadow:0 0 20px var(--p1)}.p1 .fill{background:linear-gradient(180deg,var(--p2-tint),var(--p2));box-shadow:0 0 20px var(--p2)}.hpwrap.low .fill{background:linear-gradient(180deg,#ffd2da,var(--danger));box-shadow:0 0 26px var(--danger)}.hpwrap.low .bar{border-color:var(--danger);animation:hpDanger var(--beat) ease-in-out infinite}@keyframes hpDanger{0%,to{box-shadow:0 0 0 2px #000000b3,0 5px 16px #00000080,0 0 8px #ff4f6d4d}50%{box-shadow:0 0 0 2px #000000b3,0 5px 16px #00000080,0 0 30px #ff4f6df2}}.fill.hit{animation:hpHit .2s ease-out}@keyframes hpHit{0%{filter:brightness(2.6)}to{filter:brightness(1)}}.hpwrap.hit{animation:hpJolt .18s ease-out}@keyframes hpJolt{0%{transform:translate(0)}30%{transform:translate(-4px)}60%{transform:translate(3px)}to{transform:translate(0)}}@media(prefers-reduced-motion:reduce){.hpwrap.low .bar,.fill.hit,.hpwrap.hit{animation:none}}body.reduced-motion .hpwrap.low .bar,body.reduced-motion .fill.hit,body.reduced-motion .hpwrap.hit{animation:none}.vs{font-family:Bungee,sans-serif;font-size:clamp(20px,3.5vmin,72px);margin-top:16px;color:#fff;-webkit-text-stroke:2px #111;text-shadow:0 0 18px rgba(255,255,255,.55);transform:rotate(-6deg)}.vs.low{color:#ff4f6d;text-shadow:0 0 24px rgba(255,79,109,.75);animation:timerPulse .5s ease-in-out infinite}#victory{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#3c0e34b3,#05050bed);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}#victory.hidden{display:none}#victory h1{font-family:Bungee,sans-serif;font-size:clamp(40px,9vw,104px);line-height:1;-webkit-text-stroke:4px #0c0c12;text-shadow:7px 7px 0 rgba(0,0,0,.45);transform:rotate(-2deg)}.vstats{display:flex;flex-direction:column;gap:10px;font-family:Teko,sans-serif;font-size:clamp(18px,2.6vw,27px);letter-spacing:.14em}.vstat{display:flex;align-items:center;gap:14px}.vstat .who{font-family:Bungee,sans-serif;font-size:.72em;padding:0 10px;border-radius:4px;color:#07070c}.vstat.p0 .who{background:var(--p1);box-shadow:0 0 14px #38dcffb3}.vstat.p1 .who{background:var(--p2);box-shadow:0 0 14px #ff60bcb3}#btn-rematch:hover{border-color:var(--gold)}.menu-btns button.hand-hover{transform:skew(-6deg) translateY(-4px);box-shadow:0 10px #00000073,0 0 32px #ffffff38;border-color:var(--gold)}#btn-practice.hand-hover{border-color:var(--p1)}#btn-multi.hand-hover{border-color:var(--p2)}.vhint{font-family:Teko,sans-serif;font-size:clamp(15px,2.2vw,22px);letter-spacing:.28em;color:#ffffffbf}#menu{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#3c0e34b3,#05050bed);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}#menu.hidden{display:none}.menu-card{display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center;transform:scale(var(--ui-scale))}#menu h1{font-family:Bungee,sans-serif;display:flex;flex-direction:column;line-height:.86;font-size:clamp(54px,13vw,132px);color:#aef74b;-webkit-text-stroke:4px #0c0c12;text-shadow:7px 7px 0 rgba(0,0,0,.45),0 0 34px rgba(255,140,60,.45);transform:rotate(-3deg)}.title .row{display:flex;justify-content:center}.title .row.red{color:#ff4f6d}.title .ltr{display:inline-block;will-change:transform;animation:letterHop calc(var(--beat) * 16) ease-out infinite;animation-delay:calc(var(--slot) * var(--beat))}@keyframes letterHop{0%,4.5%,to{transform:translateY(0) scaleY(1)}1.6%{transform:translateY(-.5em) scaleY(1.14)}3.4%{transform:translateY(0) scaleY(.86)}}@media(prefers-reduced-motion:reduce){.title .ltr{animation:none}}.tagline{position:absolute;right:-10%;bottom:-9%;z-index:2;max-width:55%;font-family:Luckiest Guy,Bungee,sans-serif;font-size:clamp(12px,1.7vw,17px);line-height:1.05;text-align:right;text-transform:none;color:var(--gold);-webkit-text-stroke:0;text-shadow:2px 2px 0 rgba(0,0,0,.8),0 0 14px rgba(255,210,58,.45);animation:tagPulse calc(var(--beat) * 2) ease-in-out infinite;pointer-events:none}@keyframes tagPulse{0%,to{transform:rotate(-8deg) scale(1)}50%{transform:rotate(-8deg) scale(1.06)}}@media(prefers-reduced-motion:reduce){.tagline{animation:none;transform:rotate(-8deg)}}#menu-sub{font-family:Teko,sans-serif;font-size:clamp(18px,3vw,28px);letter-spacing:.32em;color:var(--gold);text-shadow:0 0 14px rgba(255,210,58,.5)}.menu-btns{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.menu-btns button{font-family:Bungee,sans-serif;display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 30px;min-width:244px;color:#fff;border:4px solid #fff;border-radius:12px;background:linear-gradient(180deg,#ffffff21,#ffffff08);box-shadow:0 6px #00000073,0 0 26px #0006;cursor:pointer;transform:skew(-6deg);transition:transform .12s,box-shadow .12s,border-color .12s,background .12s}.menu-btns button>*{transform:skew(6deg)}.menu-btns button b{font-size:clamp(17px,3vw,25px);letter-spacing:.02em}.menu-btns button span{font-family:Teko,sans-serif;font-size:17px;letter-spacing:.08em;text-transform:uppercase;opacity:.8}.menu-btns button:hover{transform:skew(-6deg) translateY(-4px);box-shadow:0 10px #00000073,0 0 32px #ffffff38}#btn-timeattack:hover{border-color:var(--gold)}#btn-practice:hover{border-color:var(--p1)}#btn-multi:hover{border-color:var(--p2)}.credit{font-family:Teko,sans-serif;font-size:clamp(14px,2vw,19px);letter-spacing:.18em;color:#ffffff8c}.credit a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(255,210,58,.4)}.credit a:hover{color:#fff;border-bottom-color:#fff}.attrib{font-size:clamp(10px,1.3vw,13px);letter-spacing:.12em;color:var(--ink-3);margin-top:.15em}.attrib a{color:#ffd23a99;border-bottom-color:transparent}.gear{position:absolute;top:18px;right:20px;width:clamp(48px,5vmin,104px);height:clamp(48px,5vmin,104px);font-size:clamp(26px,2.8vmin,58px);line-height:1;display:grid;place-items:center;color:#fff;background:#ffffff14;border:3px solid rgba(255,255,255,.45);border-radius:12px;cursor:pointer;transition:transform .25s,border-color .12s,background .12s}.gear:hover{border-color:var(--gold);background:#ffffff29;transform:rotate(60deg)}.gear-icon{display:block;width:1em;height:1em}.gear.help{right:calc(34px + clamp(48px,5vmin,104px));font-family:Bungee,sans-serif}.gear.help:hover{transform:none}#btn-quit{z-index:20}#btn-quit:hover{border-color:#ff4f6d;transform:none}#btn-quit.hidden{display:none}#settings{position:absolute;top:0;right:0;bottom:0;left:0;z-index:32;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#0e263cc7,#05050bf2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}#settings.hidden{display:none}.settings-card{gap:22px;width:min(440px,90vw)}.settings-card h2,.camfail-card h2{font-family:Bungee,sans-serif;font-size:clamp(28px,6vw,46px);color:#fff;-webkit-text-stroke:3px #0c0c12;text-shadow:5px 5px 0 rgba(0,0,0,.45);transform:rotate(-2deg)}.set-rows{display:flex;flex-direction:column;gap:18px;width:100%;text-align:left}.set-row{display:flex;flex-direction:column;gap:7px}.set-label{font-family:Bungee,sans-serif;font-size:clamp(12px,2.3vw,15px);letter-spacing:.03em;color:#fff;display:flex;align-items:baseline;gap:8px}.set-label em{font-family:Teko,sans-serif;font-style:normal;font-size:1.25em;color:var(--gold);margin-left:auto}.set-hint{font-family:Teko,sans-serif;font-size:15px;letter-spacing:.06em;color:var(--ink-3);font-weight:500;text-transform:none}.set-row input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:8px;border-radius:6px;background:#ffffff29;outline:none;cursor:pointer}.set-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--gold);border:3px solid #0c0c12;box-shadow:0 0 12px #ffd23ab3;cursor:pointer}.set-row input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--gold);border:3px solid #0c0c12;box-shadow:0 0 12px #ffd23ab3;cursor:pointer}.set-row select{font-family:Teko,sans-serif;font-size:18px;letter-spacing:.04em;padding:8px 12px;color:#fff;background:#0000008c;border:3px solid rgba(255,255,255,.4);border-radius:8px;cursor:pointer}.toggle-row{flex-direction:row;align-items:center;gap:14px;cursor:pointer}.toggle-row input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex:0 0 auto;width:30px;height:30px;border-radius:7px;border:3px solid rgba(255,255,255,.5);background:#00000080;cursor:pointer;position:relative}.toggle-row input[type=checkbox]:checked{background:var(--gold);border-color:var(--gold)}.toggle-row input[type=checkbox]:checked:after{content:"✓";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#0c0c12;font-weight:900;font-size:19px}.toggle-row .set-label{flex-direction:column;align-items:flex-start;gap:2px}#btn-settings-done:hover{border-color:var(--gold)}#help,#tips{position:absolute;top:0;right:0;bottom:0;left:0;z-index:32;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#0e263cc7,#05050bf2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}#help.hidden,#tips.hidden{display:none}#tips{z-index:33}.help-card{gap:18px;width:min(720px,94vw)}.help-card h2,.tips-card h2{font-family:Bungee,sans-serif;font-size:clamp(28px,6vw,46px);color:#fff;-webkit-text-stroke:3px #0c0c12;text-shadow:5px 5px 0 rgba(0,0,0,.45);transform:rotate(-2deg)}#btn-help-done:hover{border-color:var(--gold)}.tips-card{gap:20px;width:min(460px,92vw)}.tips-card .vhint b{color:var(--gold)}#btn-tips-done:hover{border-color:var(--gold)}.help-block{width:100%;text-align:left}.help-h3{font-family:Luckiest Guy,Bungee,sans-serif;font-size:clamp(16px,2.2vw,20px);letter-spacing:.06em;color:var(--gold);text-shadow:2px 2px 0 rgba(0,0,0,.6);margin-bottom:10px}.cue-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cue-list{display:flex;flex-direction:column;gap:12px;width:100%}.cue{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:12px;text-align:left}.cue-ico{flex:0 0 auto;font-size:26px;line-height:1}.cue-txt{font-family:Teko,sans-serif;font-size:clamp(16px,2vw,19px);letter-spacing:.04em;line-height:1.25;text-transform:uppercase;color:#ffffff9e}.cue-txt b{display:block;margin-bottom:3px;color:#fff;font-weight:600}.fruit-normal{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px;margin-bottom:10px;background:#00000038;border:1px solid rgba(255,255,255,.08);border-radius:12px;font-family:Teko,sans-serif;font-size:clamp(16px,2vw,19px);letter-spacing:.08em;text-transform:uppercase;color:#ffffffad}.fruit-normal-emoji{font-size:24px;letter-spacing:2px}.fruit-guide{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.fruit-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px 12px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-top:3px solid var(--fc, #fff);border-radius:12px;text-align:center}.fruit-card.danger{background:#ff4f6d1a}.fruit-emoji{font-size:34px;line-height:1}.fruit-name{font-family:Bungee,sans-serif;font-size:12px;color:#fff}.fruit-card.danger .fruit-name{color:var(--fc)}.fruit-effect{font-family:Teko,sans-serif;font-size:clamp(14px,1.8vw,16px);letter-spacing:.04em;text-transform:uppercase;color:var(--fc, #fff)}.setup-row{display:flex;flex-wrap:wrap;gap:10px}.setup-item{flex:1 1 0;min-width:130px;display:flex;align-items:center;gap:9px;padding:10px 12px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:12px;font-family:Teko,sans-serif;font-size:clamp(14px,1.8vw,16px);letter-spacing:.04em;text-transform:uppercase;color:#ffffffb8}.setup-ico{flex:0 0 auto;font-size:22px;line-height:1}#help,#tips{display:block;overflow-y:auto}#help .menu-card,#tips .menu-card{margin:auto;padding:4vh 0}@media(max-width:560px){.cue-grid,.fruit-guide{grid-template-columns:1fr 1fr}}#tahud{position:absolute;top:14px;left:0;right:0;z-index:15;display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:none;transform:scale(var(--ui-scale));transform-origin:top center}#tahud.hidden{display:none}.ta-timer{font-family:Bungee,sans-serif;font-size:clamp(40px,9vw,84px);line-height:.9;color:#fff;-webkit-text-stroke:4px #0c0c12;text-shadow:0 0 22px rgba(255,255,255,.4),5px 5px 0 rgba(0,0,0,.4)}.ta-timer.low{color:#ff4f6d;text-shadow:0 0 26px rgba(255,79,109,.7),5px 5px 0 rgba(0,0,0,.4);animation:timerPulse .5s ease-in-out infinite}@keyframes timerPulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}.ta-score{font-family:Bungee,sans-serif;font-size:clamp(15px,2.6vw,24px);letter-spacing:.06em;color:var(--gold);text-shadow:0 0 16px rgba(255,210,58,.5),3px 3px 0 rgba(0,0,0,.4)}.ta-score span{color:#fff}.ta-combo{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:4px}.ta-combo.hidden{display:none}.ta-combo.bump{animation:comboBump .22s ease-out}@keyframes comboBump{0%{transform:scale(1)}40%{transform:scale(1.16)}to{transform:scale(1)}}.ta-combo-head{display:flex;align-items:baseline;gap:8px;font-family:Luckiest Guy,Bungee,sans-serif;-webkit-text-stroke:2px #0c0c12;text-shadow:0 0 20px rgba(255,140,60,.7)}#ta-combo-n{font-size:clamp(30px,6vw,60px);color:#ff8c3c;line-height:.9}.ta-combo-word{font-size:clamp(15px,2.6vw,24px);color:#fff;letter-spacing:.06em}.ta-combo-mult{font-family:Bungee,sans-serif;-webkit-text-stroke:0;font-size:clamp(16px,3vw,28px);color:var(--gold);text-shadow:0 0 14px rgba(255,210,58,.7)}.ta-combo-bar{width:clamp(130px,30vw,280px);height:9px;border-radius:6px;background:#ffffff2e;border:2px solid rgba(0,0,0,.5);overflow:hidden}#ta-combo-fill{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gold),var(--hype));box-shadow:0 0 12px #ff8c3ccc}#results{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#3c2c0eb8,#05050bed);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}#results.hidden{display:none}#results h1{font-family:Bungee,sans-serif;font-size:clamp(40px,9vw,100px);line-height:1;color:var(--gold);-webkit-text-stroke:4px #0c0c12;text-shadow:7px 7px 0 rgba(0,0,0,.45),0 0 40px rgba(255,210,58,.5);transform:rotate(-2deg)}.ta-final{display:flex;flex-direction:column;align-items:center;gap:10px}.ta-final-score{font-family:Bungee,sans-serif;font-size:clamp(44px,11vw,96px);line-height:1;color:#fff;text-shadow:0 0 30px rgba(255,255,255,.45),5px 5px 0 rgba(0,0,0,.4)}.ta-final-rows{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;font-family:Teko,sans-serif;font-size:clamp(16px,2.4vw,24px);letter-spacing:.12em;color:#ffffffd9}.ta-final-rows span{white-space:nowrap}#res-best{color:var(--gold)}#btn-ta-rematch:hover{border-color:var(--gold)}#camfail{position:absolute;top:0;right:0;bottom:0;left:0;z-index:33;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#3c1010cc,#05050bf5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}#camfail.hidden{display:none}.camfail-card{gap:18px;width:min(560px,92vw)}.camfail-sub{font-family:Teko,sans-serif;font-size:clamp(16px,2.4vw,22px);letter-spacing:.14em;color:var(--gold)}#camfail-msg{font-family:Teko,sans-serif;font-size:clamp(18px,2.6vw,25px);letter-spacing:.05em;line-height:1.3;color:#ffffffe0;max-width:46ch}#btn-cam-retry:hover{border-color:var(--gold)}