*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#06100a;color:#fff;font-family:Arial,Tahoma,sans-serif;touch-action:none}canvas{display:block}.hide{display:none!important}button{border:1px solid #ffffff24;border-radius:10px;background:#101812dd;color:#fff;padding:12px 19px;font:800 15px Arial}button:active{transform:scale(.94)}#loading{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#020504}#loading div{font-size:72px;animation:spin 1.5s linear infinite}#loading h1{margin:8px;letter-spacing:3px}#loading em{font-style:normal;color:#d8ae43}#loading p{font-size:9px;letter-spacing:4px;color:#829087}#menu{position:fixed;inset:0;z-index:10;background:radial-gradient(circle at 75% 45%,#234e30,#07100b 38%,#020403 80%)}header{height:62px;display:flex;align-items:center;padding:0 6%;gap:22px;color:#819087;font-size:9px;letter-spacing:1px}header b{margin-right:auto;font-size:18px;color:#fff}header em{color:#d8ae43;font-style:normal}.hero{height:calc(100% - 130px);display:flex;align-items:center;padding:0 8%;position:relative}.hero>div:first-child{z-index:2;max-width:610px}.hero small{color:#d7ad43;letter-spacing:3px;font-size:9px}.hero h1{font-size:clamp(64px,9vw,120px);line-height:.83;margin:15px 0}.hero h1 em{color:#d8ae43;font-style:normal}.hero p{color:#a9b5ad}.creator{margin:18px 0;padding:11px 16px;border-right:3px solid #d8ac3e;background:#ffffff07}.creator small,.creator label{display:block;color:#768279;font-size:8px}.creator strong{display:block;font-size:21px}.creator span{display:block;color:#d8dfda;font-weight:bold}.hero button:first-of-type{background:linear-gradient(135deg,#f0c65d,#986713);color:#1b1307;border:0;box-shadow:0 10px 40px #c79b343c}.heroBall{position:absolute;right:6%;font-size:min(43vw,450px);filter:drop-shadow(0 40px 40px #000);animation:float 4s ease-in-out infinite}.modes{position:absolute;bottom:0;left:0;right:0;height:68px;display:flex;justify-content:center;gap:2px;background:#050806e6;border-top:1px solid #ffffff10}.modes span{padding:23px 18px;font-size:11px;border-left:1px solid #ffffff08}.score{position:fixed;z-index:5;top:10px;left:50%;transform:translateX(-50%);display:flex;align-items:center;background:#050908ed;border:1px solid #ffffff15;border-radius:12px;overflow:hidden}.score b{padding:9px 15px;background:#1554b9;font-size:10px}.score .red{background:#b52c3a}.score strong{font-size:27px;padding:2px 15px}.score small{position:absolute;left:50%;bottom:2px;transform:translateX(-50%);font-size:9px;color:#d6b353}.selected{position:fixed;left:15px;bottom:22px;z-index:5;background:#06100cdc;border:1px solid #ffffff12;border-radius:10px;padding:9px 13px;width:170px}.selected b{display:block;font-size:12px}.selected span{font-size:8px;color:#88948d}.selected i{display:block;height:5px;background:#d6ac40;margin-top:6px;width:100%}.goal{position:fixed;z-index:8;top:33%;left:50%;transform:translate(-50%,-50%);font-size:clamp(55px,11vw,130px);font-weight:1000;font-style:italic;color:#f0cf6d;text-shadow:0 0 25px #fff0a0,0 0 80px #ba8019;animation:goal 1s}.hint{position:fixed;z-index:5;top:72px;left:50%;transform:translateX(-50%);background:#030706c9;color:#c0c9c3;padding:5px 10px;border-radius:99px;font-size:9px}.modal{position:fixed;inset:0;z-index:20;background:#020403e8;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.modal h2{color:#d9b44f;font-size:46px}.modal>div:first-child{font-size:55px}.final{font-size:72px;font-weight:1000}.pad{position:absolute;left:12px;bottom:14px;text-align:center}.pad button,#touch>button{width:52px;height:52px;padding:0;border-radius:50%;margin:2px}.pad div{display:flex}.pad div button{width:47px;height:47px}.pad~button{position:absolute;bottom:30px}.pad~#pass{right:285px}.pad~#through{right:225px}.pad~#switch{right:165px}.pad~#run{right:105px}.pad~#shot{right:20px;width:76px;height:76px;background:#bf922b}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-22px) rotate(6deg)}}@keyframes goal{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}@media(min-width:801px){#touch{display:none!important}}@media(max-width:700px){.hero{padding:0 7%;padding-top:13vh;align-items:flex-start}.heroBall{opacity:.18;right:-12%;font-size:320px}.hero h1{font-size:60px}.modes span{padding:23px 8px;font-size:9px}.modes span:nth-child(n+4){display:none}.score{width:95%}.score b{padding:8px 6px;font-size:8px}.score strong{font-size:22px;padding:3px 8px}}

.stats{position:fixed;right:16px;bottom:20px;z-index:5;background:#06100de8;border:1px solid #d4aa4026;border-radius:12px;padding:10px 13px;display:flex;gap:12px;align-items:center;font-size:9px}.stats b{color:#d9b34f}.stats span{color:#c2cbc5}.stats i{font-style:normal;color:#fff;font-weight:900}.modes{overflow:hidden}.modes span{white-space:nowrap}