@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--ink:#183f35;--muted:#79867a;--paper:#f7f7ef;--lime:#def682;--line:#dce1d5}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #eb783f;outline-offset:3px}header{height:90px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4.5%}.brand{text-decoration:none;color:var(--ink);font-family:'Barlow Condensed',Impact,sans-serif;font-size:27px;font-weight:800;letter-spacing:.6px;position:relative;padding-left:48px}.brand-icon{position:absolute;left:0;top:0;background:var(--ink);color:var(--lime);border-radius:50%;width:37px;height:37px;display:grid;place-items:center;font-size:31px}.brand-sub{display:block;font:8px 'DM Sans',sans-serif;letter-spacing:2.8px;margin-top:1px}nav{display:flex;gap:32px;height:100%}.nav{font-size:10px;font-weight:700;letter-spacing:1.2px;border:0;background:none;position:relative}.nav.active:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--ink)}.profile{display:flex;gap:10px;align-items:center;font-size:10px;font-weight:700;letter-spacing:1px}.avatar{display:grid;place-items:center;width:36px;height:36px;background:#e8eada;border-radius:50%;font-size:11px}.profile small{display:block;color:var(--muted);font-size:9px;font-weight:400;letter-spacing:0;margin-top:4px}.welsh{color:#d05f48}main{max-width:1600px;margin:auto;padding:34px 4.5% 0}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:1.6px}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:54px;letter-spacing:-.7px;margin:7px 0 0;line-height:1.05;font-weight:700}h1 em{font-style:normal;color:#789279}.sound{display:flex;gap:20px;align-self:flex-end;margin-bottom:7px}.sound button{background:none;border:0;font-size:8px;letter-spacing:1px;font-weight:700}.layout{display:grid;grid-template-columns:minmax(0,1fr) 258px;gap:22px}.arena{border:1px solid #cdd5c6;border-radius:9px;overflow:hidden;min-width:0;background:#fff}.arena-top{height:43px;display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:#edf3da;padding:0 21px;font-size:9px;font-weight:600;letter-spacing:1.1px}.arena-top i{font-style:normal;color:#9bad87;margin:0 8px}.live-dot{display:inline-block;width:6px;height:6px;background:var(--lime);border-radius:50%;margin-right:7px}.viewport{height:480px;position:relative;background:#e7b78d;overflow:hidden}canvas{display:block;width:100%;height:100%;outline:0}.scoreboard{position:absolute;top:24px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:25px;background:rgba(246,248,229,.93);border-radius:5px;padding:12px 24px 27px;box-shadow:0 5px 15px #173e3515}.scoreboard>div{text-align:center;min-width:65px}.scoreboard span{font-size:8px;font-weight:700;letter-spacing:1px;white-space:nowrap}.scoreboard b{color:#899b60;font-size:6px;margin-left:6px}.scoreboard strong{display:block;font:45px 'Barlow Condensed',Impact,sans-serif;line-height:1.1}.scoreboard small{position:absolute;bottom:10px;font-size:7px;letter-spacing:1.3px;white-space:nowrap}.score-divider{opacity:.3;font-size:23px!important}.court-tag{position:absolute;left:23px;top:26px;display:flex;gap:9px;color:#244d40;font-size:8px;letter-spacing:1px;font-weight:700}.court-tag>span{border:1px solid #315c484f;padding:5px;font-size:15px}.court-tag div{padding-top:4px}.court-tag small{display:block;font-size:8px;font-weight:400;letter-spacing:0;margin-top:5px}.message{position:absolute;top:48%;left:0;width:100%;text-align:center;font:700 31px 'Barlow Condensed',Impact,sans-serif;color:#fff8de;text-shadow:0 2px 15px #123b39}.message small{display:block;font:10px 'DM Sans',sans-serif;margin-top:9px}.start-button{position:absolute;top:64%;left:50%;transform:translateX(-50%);background:var(--lime);border:none;border-radius:3px;padding:16px 23px;font-size:11px;font-weight:700;letter-spacing:1px;box-shadow:0 5px 25px #193b3955;white-space:nowrap}.start-button span{margin-left:25px;font-size:19px}.court-bottom{position:absolute;bottom:16px;left:22px;right:22px;display:flex;justify-content:space-between;color:#e9edcf;font-size:7px;letter-spacing:1px;pointer-events:none}.court-bottom button{background:#183f3566;border:1px solid #e8edcb66;border-radius:3px;color:inherit;font-size:8px;padding:5px 9px;pointer-events:auto}.weather-dot{display:inline-block;width:7px;height:7px;background:var(--lime);border-radius:50%;margin-right:5px}.shot-bar{display:flex;padding:14px 15px;gap:5px;align-items:center}.shot-heading{font-size:8px;line-height:1.6;letter-spacing:1px;min-width:78px}.shot{display:flex;flex:1;align-items:center;gap:7px;padding:10px 7px;border:1px solid transparent;border-radius:4px;background:transparent;text-align:left}.shot.active{background:#e7eddb;border-color:#c6d3b4}.shot span{font-size:9px;font-weight:700;letter-spacing:.3px;white-space:nowrap}.shot small{display:block;color:#7a8773;font-size:7px;font-weight:400;letter-spacing:0;margin-top:5px}.shot i{margin-left:auto;font-size:20px;font-style:normal}kbd{display:inline-grid;place-items:center;border:1px solid #d7ddcc;border-radius:3px;min-width:17px;height:18px;font:8px 'DM Sans',sans-serif;background:#f5f7ee}.controls{padding:12px 20px;border-top:1px solid #e9ede2;display:flex;gap:24px;align-items:center;font-size:8px;color:#81907e}.controls>span{display:flex;align-items:center;gap:3px}.controls .first-person{margin-left:auto;color:#4a654c;font-size:7px;letter-spacing:1px}aside{display:flex;flex-direction:column;gap:14px}.career-card{border-radius:8px;background:#e9edde;padding:23px 23px 20px}.career-card>.eyebrow{display:flex;justify-content:space-between}.club-badge{width:66px;height:76px;clip-path:polygon(0 0,100% 0,100% 72%,50% 100%,0 72%);background:#264e3d;color:#e7edbb;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 33px 'Barlow Condensed',sans-serif;margin:25px 0 17px;transform:rotate(-5deg);border-top:4px solid #aebd79}.club-badge span{font:5px 'DM Sans',sans-serif;letter-spacing:1px;margin-top:3px}h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:30px;line-height:1.08;margin:0;font-weight:600}.career-card p{font-size:10px;color:#829078;margin:11px 0 25px}.rank{display:flex;justify-content:space-between;font-size:7px;font-weight:700;letter-spacing:.6px}.rank span+span{font-weight:400;color:#8b947c}.progress{height:4px;background:#d3dcc5;margin:10px 0 20px;border-radius:3px}.progress div{background:#466642;height:100%;width:0;transition:width .3s}.stats{display:flex;justify-content:space-between}.stats>div{display:flex;flex-direction:column}.stats strong{font:28px 'Barlow Condensed',Impact,sans-serif}.stats span{font-size:7px;color:#839076;letter-spacing:1px;margin-top:4px}.coach{background:#f0eedc;border:1px solid #e5e4d3;border-radius:8px;padding:21px 23px}.coach .eyebrow{font-size:8px;color:#7e8360}.coach h3{font-size:17px;line-height:1.4;margin:13px 0 9px;font-weight:600}.coach p{font-size:10px;color:#858775;line-height:1.7;margin:0 0 15px}.tip-tag{font-size:6px;letter-spacing:1px;border:1px solid #d9dcc8;border-radius:3px;padding:5px}.practice{border:1px solid #d5dccd;border-radius:5px;padding:15px 18px;background:transparent;text-align:left;font-size:9px;font-weight:700;letter-spacing:.6px}.practice span{float:right}.journey{margin-top:31px}.journey-heading{display:flex;justify-content:space-between;align-items:center}.journey-heading h2{font-size:28px;margin-top:8px}.journey-heading button{font-size:8px;font-weight:700;letter-spacing:1px;background:none;border:0}.milestones{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:20px}.milestone{border:1px solid #dce2d4;border-radius:5px;position:relative;padding:17px;min-height:99px;text-align:left;background:transparent;display:block}.milestone.unlocked{background:#e8eedc;border-color:#bac9a6}.milestone .num{font-size:9px;color:#809275;letter-spacing:1px}.milestone h3{font-size:11px;margin:14px 0 6px}.milestone p{font-size:8px;color:#8a9482;margin:0}.milestone .symbol{position:absolute;top:17px;right:17px;color:#869579;font-size:12px}footer{display:flex;justify-content:space-between;padding:27px 0 19px;margin-top:22px;border-top:1px solid var(--line);font-size:7px;color:#86947f;letter-spacing:1px}footer b{margin:0 10px}.hidden{display:none!important}.rally-hud{position:absolute;bottom:58px;width:100%;text-align:center;pointer-events:none;color:#f0f6d7;text-shadow:0 2px 8px #163b36}.rally-hud span{display:block;font-size:11px;font-weight:700;letter-spacing:2px}.rally-hud span+span{font-size:9px;letter-spacing:.3px;font-weight:400;margin-top:7px}.crosshair{position:absolute;top:48%;left:50%;color:#e4f887;pointer-events:none;font-size:24px}dialog{border:1px solid #bac7ae;border-radius:12px;padding:40px;background:var(--paper);color:var(--ink);max-width:650px;width:90%;box-shadow:0 30px 100px #092e4266}dialog::backdrop{background:#102d26aa;backdrop-filter:blur(5px)}.close{position:absolute;right:15px;top:10px;font-size:28px;background:none;border:0}dialog h2{font-size:40px;margin:10px 0 20px}dialog p,dialog li{font-size:13px;line-height:1.8}dialog ul{padding-left:18px}dialog .action{background:var(--ink);color:var(--lime);border:0;padding:13px 20px;border-radius:4px;margin:12px 5px 0 0;font-size:12px}.upgrade{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:14px 0;font-size:12px}.upgrade button{padding:8px;border:1px solid #b9c8a8;background:#e3ebd5;border-radius:4px}button:disabled{opacity:.4;cursor:not-allowed}@media(min-width:1450px){.viewport{height:550px}}@media(max-width:1100px){header{padding:0 3%}main{padding:28px 3% 0}.layout{grid-template-columns:minmax(0,1fr) 225px;gap:15px}.shot-heading{display:none}.shot i{display:none}.controls{gap:10px}.court-tag{display:none}.shot-bar{padding:10px 7px}.career-card,.coach{padding:20px}.viewport{height:460px}}@media(max-width:780px){header{height:74px}.brand{font-size:23px}nav{gap:15px}.nav{font-size:8px}.profile{display:none}h1{font-size:43px}.heading{display:block}.sound{margin-top:19px}.layout{grid-template-columns:1fr}.viewport{height:450px}aside{display:grid;grid-template-columns:1fr 1fr}.career-card{grid-row:span 2}.coach h3{font-size:16px}.milestones{grid-template-columns:repeat(2,1fr)}.journey-heading button{display:none}.controls{font-size:7px;gap:12px;flex-wrap:wrap}.controls .first-person{display:none}.arena-top{font-size:7px;padding:0 12px}.message{font-size:27px}.shot span{font-size:8px}.shot small{font-size:6px}.shot{padding:8px 3px;gap:4px}.eyebrow{font-size:8px}footer{font-size:6px}.journey-heading h2{font-size:25px}}
.scoreboard,.court-tag,.message{pointer-events:none}#game{cursor:default;touch-action:none}
.serve-overlay{position:absolute;right:22px;bottom:60px;background:var(--lime);border:0;border-radius:4px;padding:13px 24px;color:var(--ink);font-size:12px;font-weight:700;box-shadow:0 4px 16px #163b3644}
.hit-overlay{background:#ffcb88;bottom:58px;right:22px}.viewport .scoreboard{top:12px;transform:scale(.78);transform-origin:top right;left:auto;right:12px}.viewport .court-tag{top:18px}
.timing-panel{position:absolute;z-index:3;left:50%;bottom:30px;transform:translateX(-50%);width:min(540px,calc(100% - 36px));background:#153d36ed;color:#f3f9df;border:1px solid #d8f4aa77;border-radius:11px;padding:13px 18px 12px;box-shadow:0 12px 30px #0a2c2970;backdrop-filter:blur(8px)}
.timing-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:8px;font-weight:700;letter-spacing:1px}.timing-top strong{font:700 16px 'Barlow Condensed',Impact,sans-serif;color:#e9fb8e;letter-spacing:1px}.timing-top span:last-child{text-align:right;color:#b7d19f}
.timing-track{position:relative;height:25px;margin:10px 0 7px;border-radius:15px;background:linear-gradient(90deg,#ed8068,#e8b97d 48%,#e8b97d 52%,#ed8068);border:2px solid #ffffff50;box-shadow:inset 0 2px 6px #10312770;overflow:visible}.timing-window{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:48%;background:#d9fb80dd;border-left:2px solid #f6ffd2;border-right:2px solid #f6ffd2;transition:left .18s ease}.timing-centre{position:absolute;left:50%;top:-4px;bottom:-4px;width:3px;background:#fffce2;box-shadow:0 0 10px #fff;transition:left .18s ease}.timing-needle{position:absolute;left:0;top:-7px;width:5px;height:35px;border-radius:3px;background:#193b35;border:1px solid #fff;box-shadow:0 0 0 3px #fff8,0 0 10px #e9ff92;transform:translateX(-50%)}.timing-hint{text-align:center;font-size:9px;color:#d8e5cb}
.rally-hud{bottom:154px;z-index:2}.rally-hud span{font-size:14px}.rally-hud span+span{font-size:10px}
.shot-bar{gap:4px}.shot-heading{min-width:94px}.shot{min-width:0;padding:10px 5px;touch-action:manipulation}.shot i{font-size:17px}.shot span{font-size:8px}.shot small{font-size:6px}.shot[data-level="easy"]{background:#edf5db}.shot[data-level="hard"],.shot[data-level="very-hard"]{background:#fff4e7}.shot[data-level="very-hard"]{border-color:#efb57a}.shot[data-level="miss"]{opacity:.48}.shot.wildcard-shot{background:#f6e8ff;border-color:#dab8e8;opacity:1}.shot.wildcard-shot:disabled{opacity:.42}.shot:active{transform:translateY(1px)}
.shot[data-level="foul"]{background:#f9e8e2;border-color:#efb4a8;color:#9e4935}
.wildcard-card{position:absolute;z-index:8;inset:0;display:grid;place-items:center;background:#102e2ccc;backdrop-filter:blur(5px);padding:20px}.playing-card{width:min(340px,100%);min-height:340px;position:relative;background:linear-gradient(145deg,#fffdf0,#e9eddb);border:8px solid #f8f4df;outline:3px solid #d7b679;border-radius:14px;box-shadow:0 20px 60px #051e1fa8;padding:30px 35px;color:#1a4137;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(-2deg)}.playing-card:before{content:'';position:absolute;inset:10px;border:1px solid #be9f67;border-radius:5px;pointer-events:none}.card-suit{position:absolute;top:15px;left:19px;font-size:24px;color:#c86e59}.card-suit.bottom{top:auto;left:auto;bottom:13px;right:19px;transform:rotate(180deg)}.playing-card small{font-size:9px;font-weight:700;letter-spacing:2px;color:#b46852}.playing-card h2{font-size:31px;margin:12px 0}.playing-card p{font-size:13px;line-height:1.55;margin:0 0 23px}.playing-card button{position:relative;border:0;border-radius:4px;background:#1b4638;color:#e6fb8f;padding:12px 16px;font-size:9px;font-weight:700;letter-spacing:.6px}
.matchup-banner{position:absolute;z-index:7;inset:0;display:grid;place-items:center;background:linear-gradient(130deg,#133e39e8,#1b6a57d9);backdrop-filter:blur(5px);padding:22px;text-align:center;color:#f8f5df}.matchup-inner{width:min(540px,100%);padding:24px 20px;border-top:2px solid #e8f69c;border-bottom:2px solid #e8f69c}.matchup-inner>small{font-size:10px;letter-spacing:2px;color:#d8eb9e}.matchup-inner h2{font:700 clamp(28px,4.7vw,58px)/1 'Barlow Condensed',Impact,sans-serif;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin:14px 0;text-transform:uppercase}.matchup-inner h2 span{max-width:44%}.matchup-inner h2 em{font-style:normal;font-size:.58em;color:#e7f78f}.matchup-inner p{font-size:11px;color:#dce9d3;margin:8px 0 13px}.matchup-inner button{border:0;border-radius:4px;background:#e8f88a;color:#194334;padding:14px 22px;font-weight:700;font-size:11px;letter-spacing:.8px}.target-picker{display:flex;align-items:center;justify-content:center;gap:7px;margin:0 0 15px}.target-picker span{font-size:9px;font-weight:700;letter-spacing:1.4px;margin-right:4px}.target-picker button{min-width:42px;padding:10px 9px;background:#f7f3dc22;color:#f8f5df;border:1px solid #e8f69c66}.target-picker button.selected{background:#e8f88a;color:#194334;box-shadow:0 0 0 2px #ffffff55}.scoreboard #human-name{display:inline-block;max-width:130px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}.scoreboard #serve-indicator{font-size:8px;color:#426347}
@media(max-width:780px){.shot-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.shot{padding:8px 7px;min-height:56px;border:1px solid #dce4d5}.shot kbd{display:none}.shot i{display:block;margin-left:auto}.shot span{font-size:9px}.shot small{font-size:7px}.timing-panel{bottom:18px}.rally-hud{bottom:140px}.playing-card{min-height:300px}.controls{justify-content:center}.controls span:first-child{display:none}.target-picker{gap:5px;flex-wrap:wrap}.target-picker span{width:100%;margin:0}.target-picker button{min-width:46px;min-height:42px;padding:9px}.matchup-inner{padding:18px 8px}.matchup-inner h2{font-size:31px;margin:10px 0}.matchup-inner p{margin-bottom:10px}.matchup-inner>#matchup-start{min-height:46px}}
.matchup-inner .change-opponent{display:block;margin:0 auto 12px;padding:8px 13px;background:#f7f3dc18;color:#eef6d2;border:1px solid #e8f69c66;font-size:9px}.matchup-inner .change-opponent:active{background:#f7f3dc30}@media(max-width:780px){.matchup-inner .change-opponent{min-height:42px;padding:9px 14px}}
.new-player-button{position:absolute;top:76%;left:50%;transform:translateX(-50%);border:1px solid #f5f7d799;background:#183f3588;color:#f7f8dc;border-radius:3px;padding:11px 20px;font-size:9px;font-weight:700;letter-spacing:1px}.form-label{display:grid;gap:8px;font-size:9px;font-weight:700;letter-spacing:1px}.form-label input{width:100%;padding:13px 14px;border:1px solid #b8c6ad;border-radius:5px;background:#fffef6;font:16px 'DM Sans',sans-serif;color:#183f35}.name-picker{width:100%;padding:18px;border:1px solid #b6c7a8;border-radius:7px;background:#e7eed8;font:700 25px 'Barlow Condensed',sans-serif}.name-picker small{display:block;margin-top:7px;font:7px 'DM Sans',sans-serif;letter-spacing:1px}.action.secondary{background:#e6ecd9;color:#183f35}.enter-next{background:#d9f66f!important;color:#183f35!important}.online-note{font-size:10px;color:#76866f}.player-row{display:flex;width:100%;align-items:center;justify-content:space-between;padding:15px 13px;border:0;border-top:1px solid #d6ddcd;background:transparent;text-align:left}.player-row:hover{background:#e9efde}.player-row span,.player-row small{display:block}.player-row small{margin-top:4px;font-size:8px;color:#788672}.player-row strong{font-size:12px}.boards{display:grid;grid-template-columns:1fr 1fr;gap:18px}.boards h3{font:700 18px 'Barlow Condensed',sans-serif}.boards table{width:100%;border-collapse:collapse;font-size:10px}.boards th,.boards td{padding:8px 5px;border-bottom:1px solid #dce2d4;text-align:left}.boards td small{display:block;color:#7e8b78}.boards tr.you{background:#e1edc8}.boards section>small{display:block;margin-top:10px;color:#7c8975;font-size:8px;line-height:1.5}@media(max-width:780px){.boards{grid-template-columns:1fr}.new-player-button{top:78%;min-height:40px}.player-row{min-height:58px}}
.mobile-copy{display:none}@media(max-width:780px){.desktop-copy{display:none}.mobile-copy{display:inline}}