@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;font-family:Barlow,Arial,sans-serif;background:#101c29;color:#f4f7fa}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 45%,#22364a 0,#101c29 73%);min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit}header{height:92px;margin:0 auto;max-width:1440px;padding:0 48px;display:flex;align-items:center;gap:16px;border-bottom:1px solid #ffffff0d}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;font-weight:800;letter-spacing:.5px;text-decoration:none;color:white;display:flex;align-items:center}.brand>span:not(.brand-ball){color:#b5ef53}.brand-ball{font-size:40px;color:#b5ef53;margin-right:12px}.brand small{font:700 11px Barlow,Arial;margin-left:12px;background:#ffffff10;padding:5px 7px;border-radius:4px}.edition{margin-left:auto;font-size:10px;letter-spacing:1.8px;color:#8fa0b1}.edition span{color:#b5ef53;margin:0 12px}.icon{background:#ffffff08;border:1px solid #ffffff13;border-radius:50%;height:36px;width:36px;margin-left:18px}main{max-width:1440px;margin:auto;padding:34px 48px}.topline{display:flex;justify-content:space-between;color:#8498aa;font-size:10px;letter-spacing:1.8px;font-weight:700;margin-bottom:15px}.topline i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#b6ed53;margin-right:8px}.arena{position:relative;border-radius:14px;overflow:hidden;box-shadow:0 24px 70px #0005;border:1px solid #ffffff20;aspect-ratio:2/1;background:#1d5273}canvas{display:block;width:100%;height:100%}.scoreboard{position:absolute;top:23px;left:50%;transform:translateX(-50%);display:flex;align-items:center;background:#102538ee;box-shadow:0 6px 0 #0002;border:1px solid #ffffff25;border-radius:9px;height:73px;padding:0 24px;gap:26px}.team{display:flex;gap:10px;align-items:center;font-family:'Barlow Condensed',Impact,sans-serif;font-size:18px;letter-spacing:1px;white-space:nowrap}.team small{display:block;font:600 8px Barlow,Arial;letter-spacing:1.5px;color:#91a7b9;margin-top:4px}.right{text-align:right}.flag{font-size:26px}.score{display:flex;align-items:center;gap:15px;position:relative;padding-bottom:11px;font-family:'Barlow Condensed',Impact,sans-serif;font-size:38px}.score>span{color:#748da0;font-size:25px}.score small{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;font:600 7px Barlow,Arial;letter-spacing:1px;color:#c3d3df}.pause{position:absolute;right:23px;top:24px;background:#102538bb;border:1px solid #ffffff30;border-radius:7px;width:37px;height:37px}.overlay{position:absolute;inset:0;display:flex;align-items:center;background:linear-gradient(90deg,#102538ed,#102538aa 36%,#10253810 76%)}.overlay.hidden{display:none}.intro{margin-left:7%;margin-top:55px}.eyebrow{font-size:9px;font-weight:800;letter-spacing:2px;color:#c0ed7a}h1{font-family:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;font-size:clamp(32px,5.4vw,77px);line-height:.91;letter-spacing:-.6px;margin:16px 0}h1 em{display:block;font-style:normal;color:#baf45b}.intro p{font-size:12px;color:#c4d2de;margin:15px 0 20px}.modes{display:flex;gap:6px;margin-bottom:10px}.modes button{font-size:9px;letter-spacing:1px;font-weight:800;background:#142b3f;border:1px solid #ffffff27;border-radius:5px;padding:11px 19px}.modes .selected{border-color:#b9ed5b;color:#b9ed5b;background:#b9ed5b12}.primary{display:block;background:#bbef5c;color:#193025;border-radius:5px;padding:15px 21px;font-size:12px;font-weight:800;letter-spacing:1px;box-shadow:0 4px 0 #6c9a33;width:283px;text-align:left}.primary span{float:right;font-size:17px}.primary:hover{background:#d1ff7f;transform:translateY(-1px)}.hint{display:block;font-size:7px;letter-spacing:1.4px;color:#9bb1c1;margin-top:15px}.court-tag{position:absolute;bottom:17px;left:24px;font-size:8px;font-weight:700;letter-spacing:2px;color:#fff9}.court-tag span{color:#b9ef63;margin:0 7px}.bottom{display:flex;justify-content:space-between;align-items:center;padding:23px 0;border-bottom:1px solid #ffffff10}.controls{display:flex;align-items:center;gap:27px}.section-label{font-size:9px;color:#8a9bab;font-weight:800;letter-spacing:1.6px}.controls>div{display:flex;align-items:center;gap:5px}.controls div span{font-size:11px;color:#acbbc9;margin-left:5px}kbd{background:#243445;border:1px solid #455362;border-bottom-width:3px;border-radius:4px;font:700 10px Barlow,Arial;min-width:25px;text-align:center;padding:6px 7px}#restart{background:none;color:#9bacba;font-size:19px}#restart span{font-size:11px;margin-left:5px}footer{display:flex;justify-content:space-between;font-size:10px;color:#718497;padding-top:18px}footer>span:last-child{font-size:8px;letter-spacing:1.5px}.announcement{position:absolute;top:30%;left:0;right:0;text-align:center;pointer-events:none;font-family:'Barlow Condensed',Impact,sans-serif;font-size:42px;color:#fff;text-shadow:0 3px 0 #19354d,0 0 20px #19354d}.touch{display:none}button:focus-visible{outline:3px solid white;outline-offset:3px}@media(max-width:800px){header{height:70px;padding:0 20px}.edition{display:none}.icon{margin-left:auto}main{padding:23px 15px}.arena{aspect-ratio:1.55}.scoreboard{top:12px;transform:translateX(-50%) scale(.75);transform-origin:top center}.intro{margin-top:50px}h1{font-size:42px}.eyebrow{font-size:7px}.intro p{font-size:10px;margin:10px 0}.hint{display:none}.primary{width:245px;padding:12px}.modes button{padding:8px 12px}.controls{gap:12px;flex-wrap:wrap}.section-label{display:none}.bottom{gap:10px}footer>span:last-child{display:none}.topline{font-size:8px}.touch{position:absolute;bottom:32px;left:15px;right:15px;display:flex;gap:8px;pointer-events:none}.touch button{pointer-events:auto;touch-action:none;background:#10253888;border:1px solid #ffffff40;border-radius:8px;padding:12px 18px;user-select:none}.touch button:nth-child(3){margin-left:auto}.court-tag{bottom:10px;font-size:7px}.overlay:not(.hidden)~.touch{display:none}}@media(max-width:480px){.arena{aspect-ratio:1.1}h1{font-size:44px}.topline>span:last-child{display:none}.controls div span{font-size:9px}.controls{gap:8px}.pause{right:10px;top:10px;width:28px;height:28px}.scoreboard{gap:16px;padding:0 15px}.intro{margin-top:45px}}
