#homescreen{width:min(1120px,94vw);max-width:none;padding:32px 40px;background:#102d38;color:#eef4df;border:1px solid #54717a;border-radius:22px;max-height:94dvh;overflow:auto;box-shadow:0 30px 100px #071c4670}#homescreen::backdrop{background:#0a202be8;backdrop-filter:blur(8px)}.home-top,.home-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px}.home-wordmark{font-size:16px;font-weight:900;letter-spacing:2px}.beta-tag{font-size:9px;letter-spacing:1px;color:#b5c6c4;border:1px solid #49626a;padding:8px 10px;border-radius:30px}.home-layout{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:54px 0}.home-eyebrow{font-size:10px;letter-spacing:2px;color:#c1ee63}#homescreen h1{font:bold clamp(42px,5.5vw,72px)/1.04 Arial,sans-serif;letter-spacing:-3px;margin:24px 0}#homescreen h1 em{color:#d5f77a;font-style:normal}.home-intro{font-size:14px;line-height:1.8;max-width:360px;color:#afc5c5}.home-actions{display:flex;flex-direction:column;gap:10px;margin:28px 0 16px;max-width:350px}.home-actions button{display:flex;justify-content:space-between;align-items:center;border-radius:9px;padding:17px 20px;font-size:15px;font-weight:700;background:#d5f77a!important;border:1px solid #d5f77a!important;color:#15343c!important}.home-actions #homefriend{background:#23434d!important;border-color:#526d75!important;color:#eef4df!important}.home-actions button:hover{filter:brightness(1.1)}.home-actions button:disabled{opacity:.4;cursor:default}.home-meta{font-size:9px;letter-spacing:1px;color:#a8bfbd}.home-meta i{margin:0 8px}.home-bottom{border-top:1px solid #38535d;padding-top:22px;font-size:11px;color:#a8bfbd}.home-bottom button,#homeresume{background:transparent!important;border:0;color:#e0edc9!important;padding:6px 0;font-size:12px}#homeresume[hidden]{display:none}.home-court{height:340px;position:relative;overflow:hidden;border-radius:160px 160px 18px 18px;background:linear-gradient(#ecb384,#e8c8a1 52%,#738c85);isolation:isolate}.court-sun{position:absolute;top:32px;right:62px;width:75px;height:75px;border-radius:50%;background:#ffdfb2}.court-buildings{position:absolute;bottom:75px;width:100%;height:110px;background:repeating-linear-gradient(90deg,#7e8c83 0 35px,#a4a990 35px 42px,#647b76 42px 78px);clip-path:polygon(0 30%,12% 30%,12% 0,24% 0,24% 55%,35% 55%,35% 20%,50% 20%,50% 45%,65% 45%,65% 0,80% 0,80% 30%,100% 30%,100% 100%,0 100%)}.court-board{position:absolute;top:127px;left:12%;width:76%;height:145px;background:#416966;border:12px solid #d5c3a1;transform:rotate(-10deg) skewX(13deg);box-shadow:0 15px 0 #9e927d,0 25px 25px #203e4c44}.court-lines{position:absolute;inset:9px;border:2px solid #ecedc9;background:linear-gradient(transparent 48%,#ecedc9 48%,#ecedc9 50%,transparent 50%),linear-gradient(90deg,transparent 49%,#ecedc9 49%,#ecedc9 50%,transparent 50%)}.court-net{position:absolute;left:0;right:0;top:40%;height:20px;transform:skewY(-5deg);background:repeating-linear-gradient(90deg,#efeee1 0 1px,transparent 1px 7px),repeating-linear-gradient(0deg,#e9e4d2 0 1px,transparent 1px 5px);border-top:3px solid #f6efcf}.court-player{position:absolute;width:16px;height:24px;border-radius:8px 8px 5px 5px;background:#d7ed87;left:30%;top:70%;box-shadow:0 6px 7px #193d49}.court-player:before{content:'';position:absolute;width:12px;height:12px;border-radius:50%;top:-10px;left:2px;background:#c38c67}.court-player.two{background:#e6a683;left:70%;top:15%}.court-shuttle{position:absolute;width:7px;height:7px;background:#fff9e8;left:60%;top:0;border-radius:50%;box-shadow:0 0 18px white}.court-caption{position:absolute;bottom:18px;left:23px;right:23px;color:#f5f5dd;text-shadow:0 1px 4px #183b3c}.court-caption span{display:block;font-size:9px;letter-spacing:2px;margin-bottom:7px}.court-caption b{font-size:17px}#homebutton{font-weight:700}#homescreen button:focus-visible{outline:3px solid #fff;outline-offset:4px}
@media(max-width:600px){#homescreen{padding:24px;width:94vw;border-radius:16px}.home-wordmark{font-size:12px;letter-spacing:1px}.beta-tag{font-size:8px;padding:6px 8px}.home-layout{display:flex;flex-direction:column-reverse;gap:20px;padding:24px 0}.home-court{width:100%;height:150px;border-radius:65px 65px 12px 12px}.court-board{top:42px;height:80px;border-width:7px;left:20%;width:60%}.court-sun{width:45px;height:45px;top:10px;right:50px}.court-buildings{bottom:30px;height:80px}.court-caption{display:none}.home-copy{width:100%}#homescreen h1{font-size:43px;letter-spacing:-2px;margin:12px 0}.home-eyebrow{font-size:8px;margin:0}.home-intro{font-size:12px;line-height:1.6;margin:12px 0}.home-actions{margin-top:20px;max-width:none}.home-actions button{padding:14px 18px}.home-meta{font-size:8px}.home-bottom{padding-top:16px}.home-bottom>span{display:none}.v2 #v2-brand{display:none}.v2 #__retired_timer{top:calc(64px + env(safe-area-inset-top));right:14px;padding:4px 10px}.v2 #__retired_timer output{font-size:17px}.v2 .tools{gap:4px}.v2 .tools #homebutton{font-size:10px;padding:0 9px}.v2 .tools #install{display:none}.v2 #live-connection{top:calc(59px + env(safe-area-inset-top));left:16px;right:auto}.v2 #perf-toggle{top:calc(85px + env(safe-area-inset-top));width:25px;height:25px}.v2 #endmatch{top:calc(87px + env(safe-area-inset-top))}.v2 #perfpanel{top:calc(116px + env(safe-area-inset-top))}.v2 .controls{bottom:calc(22px + env(safe-area-inset-bottom))}.v2 #play{bottom:170px}}
@media(max-height:520px){.home-layout{display:grid;grid-template-columns:1fr 1fr;padding:16px 0;gap:24px}.home-court{height:190px}.home-intro{display:none}#homescreen h1{font-size:38px;margin:12px 0}.home-actions{margin:12px 0}.home-actions button{padding:10px 16px}.home-bottom{padding-top:10px}#homescreen{padding:18px 28px}}
#keysettings{width:min(500px,94vw);max-width:none;padding:26px}#keysettings h2{margin:5px 0;font-size:28px}.key-intro,.key-fixed{font-size:12px;color:#647b77;line-height:1.7}.key-fixed{font-size:11px;border-top:1px solid #bbcbbd;padding-top:14px}.key-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:9px 0;border-bottom:1px solid #cad6c8;font-size:13px}.key-row button{min-width:78px;padding:9px 12px;border-radius:7px;font-weight:bold}#keymessage{min-height:36px;font-size:12px;color:#435d65}#keysreset{font-weight:700}.home-bottom{flex-wrap:wrap}.home-bottom>span{display:none}#settingsbutton{font-size:11px}@media(max-width:600px){#settingsbutton{display:none}.home-bottom{gap:12px}.home-bottom button{font-size:11px}#keysettings{padding:22px}}
#trainingcoach{position:fixed;left:20px;top:110px;z-index:12;width:min(315px,90vw);padding:17px;background:#142f40f5;border:1px solid #718c87;color:#edf2da;border-radius:14px;box-shadow:0 8px 30px #17303b30}#trainingcoach[hidden],#resultactions[hidden]{display:none}.traininghead{display:flex;align-items:center;justify-content:space-between;gap:20px}.traininghead b{font-size:9px;letter-spacing:2px;color:#d4f77a}#trainingcoach h2{font:700 20px Arial,sans-serif;margin:12px 0 8px}#trainingcoach p{font:12px/1.6 Arial,sans-serif;color:#c4d5ce;min-height:58px;margin:0 0 10px}#trainingcoach button{padding:6px 10px;font-size:10px;background:#284855;color:#e9efdc;border-color:#5a7680}#resultactions{display:flex;gap:10px;justify-content:center;margin:18px 0}#resultactions button{background:#d1ed91;color:#183a3e;border-radius:8px;font-size:13px}#resultactions #resulthome{background:#e2e9db}.home-actions #hometutorial{background:#e5eecc!important;color:#1c3c40!important;border-color:#a9bd9b!important}.usage-link{color:#d9eab4;font-size:11px;text-decoration:none}.usage-note{display:block;flex-basis:100%;font-size:10px;color:#adbfba}#metricstoggle{font-size:11px}.home-bottom{gap:14px}#tutorialdone{max-width:400px}#tutorialdone p{font-size:13px}#tutorialplay{font-weight:bold}@media(max-width:600px){#trainingcoach{left:50%;top:auto;bottom:158px;transform:translateX(-50%);width:min(360px,94vw);padding:12px 16px}#trainingcoach h2{font-size:16px;margin:6px 0}#trainingcoach p{font-size:11px;min-height:34px;margin:0 0 6px}.home-layout{padding:18px 0}.home-court{height:115px}.home-actions{gap:8px;margin:14px 0}.home-actions button{padding:12px 16px}.home-bottom{gap:8px 16px}.home-bottom button,.usage-link{font-size:10px}#homescreen h1{font-size:36px}.home-intro{margin:8px 0}.usage-note{font-size:9px}}@media(max-height:520px){#trainingcoach{top:65px;bottom:auto;left:16px;transform:none;width:240px;padding:10px}#trainingcoach p{font-size:10px;min-height:30px}.home-court{height:190px}}.v2 #__retired_timer{top:28px;left:50%;right:auto;transform:translateX(-50%);padding:6px 14px}.v2 #__retired_timer span{display:none}.v2 #__retired_timer output{font-size:20px}.v2 #v2-brand{display:none}.v2 #play{bottom:180px}.v2 .controls{bottom:24px}.v2 #live-connection{top:64px}.v2 #endmatch{top:91px}.v2 #perf-toggle{top:91px}.v2 #perfpanel{top:128px}
@media(max-width:600px){.v2 #__retired_timer{top:calc(60px + env(safe-area-inset-top));left:50%;right:auto;transform:translateX(-50%);padding:4px 11px}.v2 #__retired_timer output{font-size:16px}.v2 #live-connection{top:calc(60px + env(safe-area-inset-top));font-size:7px}.v2 .controls,.v2.standalone .controls{bottom:calc(22px + env(safe-area-inset-bottom))}.v2 #perf-toggle{top:calc(84px + env(safe-area-inset-top))}.v2 #perfpanel{top:calc(116px + env(safe-area-inset-top))}.v2 #endmatch{top:calc(60px + env(safe-area-inset-top));font-size:8px}.v2 #play{bottom:174px}}
@media(max-height:520px){.v2 .controls,.v2.standalone .controls{bottom:calc(16px + env(safe-area-inset-bottom))}.v2 #__retired_timer{top:18px;left:50%;right:auto}.v2 #live-connection{top:45px}.v2 #endmatch{top:62px}.v2 #perf-toggle{top:65px}.v2 #play{bottom:12px}}
.v2 #perf-toggle{top:64px!important;left:24px}.v2 #perfpanel{top:102px!important}
@media(max-width:600px){.v2 #perf-toggle{top:calc(60px + env(safe-area-inset-top))!important;left:16px}.v2 #perfpanel{top:calc(98px + env(safe-area-inset-top))!important}.v2 #live-connection{left:48px;top:calc(62px + env(safe-area-inset-top));font-size:7px;padding:3px 5px}}
@media(max-height:520px){.v2 #perf-toggle{top:62px!important;left:18px}.v2 #perfpanel{top:98px!important}}header,body.v2 header{top:max(12px,env(safe-area-inset-top));left:18px;right:18px;height:32px;align-items:center}header .tools,body.v2 .tools{height:32px}header .tools #gamesettings,body.v2 header .tools #gamesettings{display:grid;width:36px;height:36px;min-height:36px;place-items:center;padding:8px!important;border-radius:50%;background:#244238;color:#fff7e5;border:1px solid #6c8174;box-shadow:0 2px 0 #102b24}body.v2 header .tools #gamesettings{background:#142c3d;border-color:#6b7f88}#gamesettings svg{width:20px;height:20px;pointer-events:none}
#score,body.v2 #score{min-width:104px;max-width:142px;width:104px;height:32px;border-radius:6px;transform:none;box-shadow:0 2px 5px #142d3320;overflow:hidden}#score .score-row,body.v2 #score .score-row{height:16px;grid-template-columns:minmax(0,1fr) 24px;padding:0 3px 0 5px;font-size:9px;font-weight:bold;border-left:3px solid transparent;letter-spacing:.2px}#score .score-row>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#score .score-row strong,body.v2 #score strong{height:16px;font:700 12px Arial,sans-serif;background:transparent;color:#f7f5e5;margin:0;padding:0;letter-spacing:0}#score .serve-dot{display:none!important}#score .score-row.serving{border-left-color:#d4eb9a}#score .score-row.serving>span{color:#d4eb9a}#score small{font-size:7px}#perf-toggle{display:none!important}#v2-brand{display:none!important}#__retired_timer,body.v2 #__retired_timer{top:max(14px,env(safe-area-inset-top));left:50%;right:auto;transform:translateX(-50%);padding:5px 10px;border-radius:6px;clip-path:none;background:#243f34}body.v2 #__retired_timer{background:#142b3e}#__retired_timer span{display:none!important}#__retired_timer output,body.v2 #__retired_timer output{font:700 13px Arial,sans-serif;letter-spacing:.5px}
#play,body.v2 #play{top:calc(var(--court-controls-top, 75dvh) - 40px);bottom:auto;z-index:3}#live-connection,body.v2 #live-connection{top:49px;right:18px;left:auto;font-size:8px}#perfpanel,body.v2 #perfpanel{top:54px!important}
#gamemenu{width:min(360px,92vw);max-width:none;padding:24px;border-radius:16px}#gamemenu h2{font:700 25px Arial,sans-serif;margin:5px 0 18px}.game-menu-actions{display:grid;gap:8px}.game-menu-actions button,#gamemenu #sound{display:flex;width:100%;height:44px;min-height:44px;padding:11px 14px!important;align-items:center;justify-content:space-between;gap:12px;border-radius:9px;font-size:13px;text-align:left}.game-menu-actions #sound>span{flex:1}.game-menu-actions #sound svg{width:19px;height:19px;flex:none}.game-menu-actions #sound strong{font-size:11px}.game-menu-actions #endmatch{position:static;margin:0;box-shadow:none;color:#9a3f32}.game-menu-actions #endmatch[hidden]{display:none}.menu-caption{margin:20px 0 8px;font-size:11px;font-weight:bold}.style-options{display:flex;gap:8px}.style-options a{flex:1;padding:10px 8px;text-decoration:none;border:1px solid #b9c8b6;border-radius:8px;text-align:center;color:#355244;font-size:12px;background:#e9eede}.style-options a[aria-current="page"]{border-color:#456b49;background:#dbe8c7;font-weight:bold}.menu-note{font-size:10px;line-height:1.6;color:#66786a;margin:14px 0}#menuresume{width:100%;background:#34583e;color:#f6f5e8;font-weight:bold;border-radius:9px}body.v2 #menuresume{background:#17394d;color:#d3f477}body.v2 #gamemenu .style-options a{color:#274757}.game-menu-actions button:focus-visible,.style-options a:focus-visible{outline:3px solid #92ad54;outline-offset:2px}
@media(max-width:600px){header,body.v2 header{top:calc(10px + env(safe-area-inset-top));left:14px;right:14px;height:30px}#score,body.v2 #score{height:30px;min-width:100px;width:100px}#score .score-row,body.v2 #score .score-row{height:15px;font-size:9px}#score .score-row strong,body.v2 #score strong{height:15px;font-size:11px}#__retired_timer,body.v2 #__retired_timer{top:calc(13px + env(safe-area-inset-top));padding:4px 8px}#live-connection,body.v2 #live-connection{top:calc(47px + env(safe-area-inset-top));right:14px;left:auto;padding:3px 6px}#trainingcoach{bottom:170px}#gamemenu{padding:20px}header .tools #gamesettings,body.v2 header .tools #gamesettings{width:34px;height:34px;min-height:34px}}
@media(max-height:520px){.controls,body.v2 .controls{top:auto;bottom:calc(16px + env(safe-area-inset-bottom))}#play,body.v2 #play{top:auto;bottom:12px}#gamemenu{max-height:92dvh;padding:18px}.game-menu-actions{grid-template-columns:1fr 1fr}.game-menu-actions button,#gamemenu #sound{font-size:11px}}

#__retired_timer{position:absolute;z-index:2;pointer-events:none;text-align:center;color:#fff9ed}#__retired_timer output{display:block;font-variant-numeric:tabular-nums}
#score{flex:none}#score .score-row{box-sizing:border-box;width:100%}#gamemenu #settingsbutton{display:flex}