:root{--pitch-dark:#0b3d1f;--gold:#ffd400;--ink:#151515;--white:#fff;font-family:ui-rounded,SF Pro Rounded,system-ui,-apple-system,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{background:var(--pitch-dark);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;width:100%;height:100%;margin:0;overflow:hidden}.screen{height:100dvh;position:fixed;inset:0}.game-host{position:absolute;inset:0}.game-host canvas{display:block}.message{color:var(--white);pointer-events:none;white-space:nowrap;text-align:center;background:#00000073;border-radius:999px;padding:.3em .9em;font-size:clamp(32px,7vmin,72px);font-weight:900;animation:.35s cubic-bezier(.2,1.6,.4,1) pop;position:absolute;top:18%;left:50%;transform:translate(-50%)}.message.goal{color:var(--ink);background:var(--gold);font-size:clamp(48px,12vmin,120px)}@keyframes pop{0%{opacity:0;transform:translate(-50%)scale(.4)}to{opacity:1;transform:translate(-50%)scale(1)}}.message.good{color:var(--ink);background:#8be28b}.message.tip{color:var(--ink);background:var(--white)}.top-right{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));gap:12px;display:flex;position:absolute}.round-btn{width:56px;height:56px;color:var(--white);background:#00000059;border:none;border-radius:50%;font-size:30px;line-height:1}.level-btn{top:max(12px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));height:56px;font:inherit;color:var(--white);background:#00000059;border:none;border-radius:28px;align-items:center;gap:10px;padding:0 18px;font-size:18px;font-weight:800;display:flex;position:absolute}.stars{color:var(--gold);letter-spacing:1px}.stars-off{color:#ffffff4d}.level-panel{background:#00000080;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.level-list{flex-direction:column;gap:10px;width:min(420px,90vw);display:flex}.level-option{height:min(64px,15vh);font:inherit;color:var(--ink);background:var(--white);border:3px solid #0000;border-radius:18px;justify-content:space-between;align-items:center;padding:0 24px;font-size:24px;font-weight:800;display:flex}.level-option .stars-off{color:#00000026}.level-option .stars{color:#e0a800}.level-option.current{border-color:var(--gold);background:#fff6c2}.fps{left:max(12px, env(safe-area-inset-left));bottom:max(12px, env(safe-area-inset-bottom));color:var(--white);background:#0006;border-radius:6px;padding:4px 8px;font:600 14px ui-monospace,monospace;position:absolute}.rotate{display:none}@media (orientation:portrait){.rotate{background:var(--pitch-dark);color:var(--white);flex-direction:column;justify-content:center;align-items:center;gap:28px;font-size:28px;font-weight:800;display:flex;position:absolute;inset:0}.rotate-phone{border:6px solid var(--white);border-radius:14px;width:70px;height:120px;animation:1.8s ease-in-out infinite turn}}@keyframes turn{0%,20%{transform:rotate(0)}50%,80%{transform:rotate(-90deg)}to{transform:rotate(0)}}.home{background:repeating-linear-gradient(90deg,#3f9b3f 0 12vw,#378a37 12vw 24vw);flex-direction:column;justify-content:center;align-items:center;gap:5vh;display:flex;position:absolute;inset:0}.home-title{color:var(--white);text-shadow:0 6px #00000040;letter-spacing:1px;margin:0;font-size:clamp(44px,11vmin,110px);font-weight:900}.home-title span{color:var(--gold)}.home-buttons{gap:2vw;display:flex}.home-btn{width:clamp(150px,17vw,240px);height:clamp(110px,24vh,190px);font:inherit;color:var(--ink);border:none;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;gap:8px;font-size:clamp(20px,3.6vmin,34px);font-weight:900;display:flex;box-shadow:0 8px #00000040}.home-btn:active{transform:translateY(4px);box-shadow:0 4px #00000040}.home-btn.play{background:var(--gold)}.home-btn.challenge{background:var(--white)}.home-btn small{opacity:.7;font-size:.55em;font-weight:700;display:block}.home-icon{font-size:1.3em}.progress{top:max(26px, calc(env(safe-area-inset-top) + 14px));background:#00000059;border-radius:999px;gap:10px;padding:8px 12px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.dot{background:#ffffff4d;border-radius:50%;width:18px;height:18px}.dot.current{background:var(--white);box-shadow:0 0 0 3px #fff6}.overlay{background:#00000073;justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0}.card{text-align:center;width:min(560px,100%);max-height:100%;color:var(--ink);background:var(--white);border-radius:28px;padding:clamp(14px,3vh,28px) 28px;animation:.3s cubic-bezier(.2,1.4,.4,1) pop-card;overflow:auto}@keyframes pop-card{0%{opacity:0;transform:scale(.85)}}.card h2{margin:0 0 1vh;font-size:clamp(26px,5vmin,40px);font-weight:900}.card p{margin:.6vh 0}.big-btn{min-width:200px;height:clamp(52px,11vh,68px);font:inherit;color:var(--ink);background:var(--gold);border:none;border-radius:999px;margin-top:1.5vh;padding:0 28px;font-size:clamp(22px,4vmin,30px);font-weight:900;box-shadow:0 6px #c9a400}.big-btn:active{transform:translateY(3px);box-shadow:0 3px #c9a400}.big-btn.secondary{background:#e8edf3;box-shadow:0 6px #b9c2cc}.card-buttons{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.demo{width:min(320px,100%);height:auto;max-height:32vh}.intro-big{font-size:clamp(26px,5vmin,38px);font-weight:900}.intro-small{opacity:.75;font-size:clamp(18px,3.4vmin,26px);font-weight:700}.demo-ball{animation:3.6s ease-in-out infinite demo-ball}.demo-rival{animation:3.6s ease-in-out infinite demo-rival}.demo-arrow{animation:3.6s ease-in-out infinite demo-arrow}.demo-finger{animation:3.6s ease-in-out infinite demo-finger}@keyframes demo-ball{0%,10%{transform:translate(0)}45%,60%{transform:translate(84px,94px)}85%,to{opacity:1;transform:translate(10px,100px)}}@keyframes demo-rival{0%,10%{transform:translate(0)}60%{transform:translate(-55px,70px)}to{transform:translate(-80px,95px)}}@keyframes demo-arrow{0%,30%{opacity:0}38%,to{opacity:1}}@keyframes demo-finger{0%,20%{opacity:0;transform:translate(10px,10px)}30%,40%{opacity:1;transform:translate(0)}50%,to{opacity:0;transform:translate(0)}}.summary-count{font-size:clamp(22px,4.2vmin,32px);font-weight:900}.summary-praise{color:#1f8a1f;font-size:clamp(20px,3.8vmin,28px);font-weight:800}.summary-tip{background:#fff6c2;border-radius:16px;padding:10px 14px;font-size:clamp(18px,3.4vmin,24px);font-weight:700}.message-stars{text-align:center;margin-bottom:.1em;font-size:.75em;line-height:1}.message .stars{color:#e0a800;text-shadow:0 2px #00000026}.message .stars-off{color:#00000026}.dot-stars{letter-spacing:-1px;font-size:15px;line-height:18px}.summary-stars{font-size:clamp(52px,12vmin,84px);line-height:1;animation:.5s cubic-bezier(.2,1.6,.4,1) .2s both pop-card}.summary-stars .stars,.summary-reps .stars{color:#e0a800}.summary-stars .stars-off,.summary-reps .stars-off{color:#0000001f}.summary-reps{flex-wrap:wrap;justify-content:center;gap:14px;font-size:clamp(16px,3vmin,22px);display:flex}.why-list{text-align:left;flex-direction:column;gap:1.6vh;margin:1.5vh 0;padding:0;font-size:clamp(20px,4vmin,30px);font-weight:800;list-style:none;display:flex}.why-list li{align-items:center;gap:14px;display:flex}.why-list li:before{content:"";background:var(--gold);border-radius:50%;flex:none;width:14px;height:14px}.demo-presser{animation:3.6s ease-in-out infinite demo-presser}.demo-pass{animation:3.6s ease-in-out infinite demo-pass}.demo-finger-pass{animation:3.6s ease-in-out infinite demo-finger}.demo-hint{transform-box:fill-box;transform-origin:50%;animation:1s ease-in-out infinite demo-hint}@keyframes demo-presser{0%,10%{transform:translate(0)}to{transform:translateY(105px)}}@keyframes demo-pass{0%,40%{opacity:1;transform:translate(0)}75%,95%{opacity:1;transform:translate(82px,-96px)}to{opacity:0;transform:translate(82px,-96px)}}@keyframes demo-hint{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.demo-run{animation:3.6s ease-in-out infinite demo-arrow}.message.cue{top:auto;bottom:max(16px, calc(env(safe-area-inset-bottom) + 10px));color:var(--ink);background:var(--gold);font-size:clamp(20px,4.5vmin,34px)}.home-btn.big{width:clamp(200px,30vw,320px);height:clamp(130px,30vh,220px);font-size:clamp(26px,5vmin,44px)}.home-title.small{font-size:clamp(32px,7vmin,64px)}.challenges{gap:3vh}.challenge-grid{grid-template-columns:repeat(auto-fill,minmax(clamp(150px,17vw,210px),1fr));gap:14px;width:min(1100px,100% - 32px);display:grid}.challenge-card{min-height:clamp(110px,26vh,180px);font:inherit;color:var(--ink);background:var(--white);border:none;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:10px;display:flex;box-shadow:0 6px #00000040}.challenge-card:active{transform:translateY(3px);box-shadow:0 3px #00000040}.challenge-num{font-size:clamp(18px,3.4vmin,26px);font-weight:900}.challenge-title{opacity:.7;text-align:center;font-size:clamp(12px,2.2vmin,16px);font-weight:700}.challenge-best{font-size:clamp(18px,3.6vmin,28px)}.challenge-best .stars{color:#e0a800}.challenge-best .stars-off{color:#00000026}.new-record{color:var(--ink);background:var(--gold);border-radius:999px;margin-bottom:.5vh;padding:4px 14px;font-size:clamp(16px,3vmin,22px);font-weight:900;animation:.5s cubic-bezier(.2,1.6,.4,1) .4s both pop-card;display:inline-block}.demo-shot{animation:3.6s ease-in-out infinite demo-shot}@keyframes demo-shot{0%,40%{opacity:1;transform:translate(0)}70%,95%{opacity:1;transform:translate(-48px,-88px)}to{opacity:0;transform:translate(-48px,-88px)}}.demo-runner{animation:4s ease-in-out infinite demo-runner}.demo-block{animation:4s ease-in-out infinite demo-block}.demo-onetwo{animation:4s ease-in-out infinite demo-onetwo}@keyframes demo-runner{0%,30%{transform:translate(0)}60%,to{transform:translate(-62px,-68px)}}@keyframes demo-block{0%,25%{transform:translate(0)}55%,to{transform:translate(-20px,20px)}}@keyframes demo-onetwo{0%{opacity:1;transform:translate(0)}25%,55%{opacity:1;transform:translate(62px,-90px)}80%,95%{opacity:1;transform:translate(-70px,-58px)}to{opacity:0;transform:translate(-70px,-58px)}}.demo-overlap{animation:4.4s ease-in-out infinite demo-overlap}.demo-overlap-ball{animation:4.4s ease-in-out infinite demo-overlap-ball}@keyframes demo-overlap{0%,20%{transform:translate(0)}45%{transform:translate(-115px,-70px)}65%,to{transform:translate(-102px,-122px)}}@keyframes demo-overlap-ball{0%{opacity:1;transform:translate(0)}20%,50%{opacity:1;transform:translate(-88px,-80px)}65%{opacity:1;transform:translate(-102px,-112px)}85%,95%{opacity:1;transform:translate(120px,-132px)}to{opacity:0;transform:translate(120px,-132px)}}.demo-defender{animation:3.6s ease-in-out infinite demo-defender}@keyframes demo-defender{0%,25%{transform:translate(0)}60%,to{transform:translate(-5px,-75px)}}.demo-hold{stroke-dasharray:126;animation:3.6s linear infinite demo-hold}.demo-lob{animation:3.6s ease-in-out infinite demo-lob}@keyframes demo-hold{0%{stroke-dashoffset:126px;opacity:1}30%{stroke-dashoffset:0;opacity:1}40%,to{stroke-dashoffset:0;opacity:0}}@keyframes demo-lob{0%,30%{opacity:1;transform:translate(0)}50%{transform:translate(38px,-60px)}70%,95%{opacity:1;transform:translateY(-110px)}to{opacity:0;transform:translateY(-110px)}}.profile{padding:max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left));background:repeating-linear-gradient(90deg,#3f9b3f 0 12vw,#378a37 12vw 24vw);gap:2vw;display:flex;position:absolute;inset:0}.preview{flex:0 0 36%;min-width:0}.preview canvas{display:block}.profile-panel{background:var(--white);min-width:0;color:var(--ink);border-radius:28px;flex-direction:column;flex:1;justify-content:center;gap:2vh;padding:clamp(12px,3vh,28px) clamp(16px,3vw,32px);display:flex;overflow:auto}.profile-panel h2{margin:0;font-size:clamp(26px,5vmin,42px);font-weight:900}.profile-steps{gap:8px;display:flex}.step-dot{background:#dfe5ec;border-radius:50%;width:14px;height:14px}.step-dot.done{background:#9fd59f}.step-dot.on{background:var(--gold)}.field-group{flex-direction:column;gap:1.6vh;display:flex}.field-group label,.field-label{flex-direction:column;gap:6px;font-size:clamp(18px,3.4vmin,24px);font-weight:800;display:flex}.field-group small{opacity:.6;font-weight:600}.field-group input{font:inherit;-webkit-user-select:text;user-select:text;border:3px solid #dfe5ec;border-radius:14px;outline:none;padding:10px 14px;font-size:clamp(20px,4vmin,28px);font-weight:800}.field-group input:focus{border-color:var(--gold)}.number-picker{justify-content:center;align-items:center;gap:12px;display:flex}.num-value{text-align:center;min-width:2.2ch;font-size:clamp(56px,14vmin,110px);font-weight:900}.num-btn,.style-btn,.pill-btn{min-width:56px;height:56px;font:inherit;color:var(--ink);background:#e8edf3;border:none;border-radius:999px;padding:0 14px;font-size:20px;font-weight:900}.pill-btn{background:#ffffffe6}.kit-picker{gap:16px;display:flex}.kit-card{font:inherit;color:var(--ink);background:#f2f5f8;border:4px solid #0000;border-radius:20px;flex-direction:column;flex:1;align-items:center;gap:8px;padding:14px;font-size:22px;font-weight:900;display:flex}.kit-card.on,.style-btn.on{border-color:var(--gold);background:#fff6c2}.style-btn{border:3px solid #0000}.kit-shirt{border-radius:18px 18px 12px 12px;width:clamp(70px,12vmin,110px);height:clamp(70px,12vmin,110px)}.kit-a{background:repeating-linear-gradient(90deg,#f6c700 0 14%,#151515 14% 28%)}.kit-b{background:linear-gradient(135deg,#f4f4f4 0 38%,#151515 38% 58%,#f4f4f4 58%);box-shadow:inset 0 0 0 2px #d9dde2}.swatches,.style-picker{flex-wrap:wrap;gap:10px;display:flex}.swatch{border:4px solid #dfe5ec;border-radius:50%;width:52px;height:52px}.swatch.on{border-color:var(--gold);box-shadow:0 0 0 3px var(--ink)}.profile-nav{justify-content:space-between;gap:12px;display:flex}.profile-nav .big-btn{flex:1;min-width:0;margin-top:0}.big-btn:disabled{opacity:.4}.home-hello{color:var(--white);margin:-2vh 0 0;font-size:clamp(22px,4.5vmin,36px);font-weight:900}.home-number{color:var(--ink);background:var(--gold);border-radius:10px;margin-left:8px;padding:0 12px;display:inline-block}.card.wide{text-align:left;width:min(760px,100%)}.card.wide h2,.card.wide h3{text-align:center}.card h3{margin:1.5vh 0 1vh;font-size:clamp(20px,3.6vmin,28px);font-weight:900}.attrs{flex-direction:column;gap:1.2vh;display:flex}.attr{grid-template-columns:minmax(120px,34%) 1fr auto;align-items:center;gap:12px;font-size:clamp(15px,2.8vmin,20px);font-weight:800;display:grid}.attr-bar{background:#e8edf3;border-radius:999px;height:16px;overflow:hidden}.attr-fill{background:linear-gradient(90deg,#6fd66f,#2fae4f);border-radius:999px;height:100%;display:block}.attr-value{text-align:right;min-width:3ch;font-weight:900}.attr-value em{color:#1f8a1f;font-style:normal}.medals{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;display:grid}.medal{opacity:.45;background:#f2f5f8;border-radius:14px;align-items:center;gap:8px;padding:8px 10px;font-size:14px;font-weight:800;display:flex}.medal.got{opacity:1;background:#fff6c2}.medal.small{margin:4px;display:inline-flex}.medal-coin{color:#8a6500;background:var(--gold);border-radius:50%;flex:none;place-items:center;width:30px;height:30px;font-size:18px;display:grid}.summary-gains{flex-wrap:wrap;justify-content:center;gap:6px 14px;font-size:clamp(14px,2.8vmin,18px);font-weight:800;display:flex}.summary-gains b{color:#1f8a1f}.level-up{color:var(--white);background:#2fae4f;border-radius:999px;margin-bottom:.5vh;padding:6px 16px;font-size:clamp(18px,3.4vmin,26px);font-weight:900;animation:.5s cubic-bezier(.2,1.6,.4,1) .4s both pop-card;display:inline-block}.finish-btn{font:inherit;color:var(--white);background:#0000004d;border:none;border-radius:999px;padding:10px 22px;font-size:clamp(16px,3vmin,22px);font-weight:900}.report-block{border-radius:18px;margin:1.2vh 0;padding:12px 16px}.report-block h3{margin:0 0 4px;text-align:left!important}.report-block p{margin:0;font-size:clamp(18px,3.4vmin,24px);font-weight:700}.report-block.good{background:#dff5df}.report-block.improve{background:#fff6c2}.report-block.mission{background:#dcecff}.report-empty{text-align:center;font-size:22px;font-weight:800}.scoreboard{top:max(12px, env(safe-area-inset-top));color:var(--white);white-space:nowrap;background:#00000080;border-radius:999px;align-items:center;gap:10px;padding:6px 14px;font-weight:900;display:flex;position:absolute;left:50%;transform:translate(-50%)}.sb-team{opacity:.85;font-size:clamp(14px,2.6vmin,18px)}.sb-score{color:var(--gold);font-size:clamp(22px,4.4vmin,32px)}.sb-time{background:#ffffff26;border-radius:999px;margin-left:6px;padding:2px 10px;font-size:clamp(14px,2.6vmin,18px)}.final-score{font-size:clamp(26px,5vmin,40px);font-weight:900;margin:0!important}
