:root{color:#203c34;font-synthesis:none;background:#f6f7f1;font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible{outline-offset:4px;outline:3px solid #df9c39}button{transition:background .16s,transform .16s}button:active:not(:disabled){transform:translateY(1px)}.app-shell{max-width:1600px;margin:auto;padding:0 48px}.topbar{border-bottom:1px solid #dae0d5;justify-content:space-between;align-items:center;height:102px;display:flex}.brand{color:inherit;letter-spacing:-1px;align-items:center;gap:13px;font-size:25px;font-weight:850;text-decoration:none;display:flex}.brand-mark{color:#dafa83;background:#1e5742;border-radius:50%;place-items:center;width:44px;height:44px;font-size:36px;font-weight:400;display:grid;transform:rotate(-9deg)}.brand small{letter-spacing:2px;margin-top:3px;font-size:11px;font-weight:500;display:block}.brand-bang{color:#518c5c}.top-label,.sound-button{letter-spacing:.6px;color:#657469;align-items:center;gap:9px;font-size:12px;display:flex}.status-dot{background:#608e62;border-radius:50%;width:6px;height:6px;margin-right:7px;display:inline-block}.sound-button{background:0 0;border:1px solid #dce2d7;border-radius:30px;padding:10px 14px}.workspace{grid-template-columns:290px minmax(0,1fr);gap:40px;padding-top:33px;display:grid}.lessons{padding:13px 0}.eyebrow{letter-spacing:2px;color:#7d8a77;font-size:10px;font-weight:650}.lessons h1{letter-spacing:-1px;margin:18px 0 9px;font-size:31px;font-weight:760;line-height:1.5}.lessons h1 span{color:#76a65c}.intro{color:#829080;margin:0 0 36px;font-size:13px}.section-label{color:#657663;justify-content:space-between;font-size:12px;font-weight:650;display:flex}.section-label>span{letter-spacing:2px;color:#8e9b86;font-size:11px}.lesson-list{gap:10px;margin-top:14px;display:grid}.lesson{text-align:left;color:#607263;background:0 0;border:1px solid #e0e5d9;border-radius:12px;align-items:center;gap:13px;width:100%;min-height:91px;padding:20px 16px;display:flex}.lesson.selected{color:#244d35;background:#e7eedc;border-color:#bfceac}.lesson:hover{background:#eef1e5}.lesson-no{color:#8b9a7e;font-family:monospace;font-size:13px}.selected .lesson-no{color:#58814b}.lesson-copy{flex:1}.lesson b{font-size:16px;font-weight:650;display:block}.lesson small{color:#8c9785;margin-top:8px;font-size:10px;display:block}.lesson svg{opacity:.75}.coach-note{border-top:1px solid #dfe4d7;gap:12px;margin:30px 0 0;padding-top:23px;display:flex}.coach-icon{color:#7c9f59;font-size:25px}.coach-note p{color:#788471;margin:9px 0;font-size:13px;line-height:1.85}.lesson-goal{color:#98a08f;flex-direction:column;gap:9px;margin-top:18px;font-size:11px;display:flex}.lesson-goal b{color:#697962;font-size:13px;font-weight:500}.footnote{color:#a0a895;max-width:255px;margin-top:30px;font-size:10px;line-height:1.8}.play-column{min-width:0}.game-panel{background:#d8e9e2;border:1px solid #cedbd0;border-radius:20px;height:580px;position:relative;overflow:hidden}.court-canvas{position:absolute;inset:0}.court-canvas canvas{width:100%;height:100%;display:block}.court-top{z-index:2;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:21px;left:23px;right:20px}.live-badge{color:#4f6957;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f5f8efc9;border:1px solid #ffffffb0;border-radius:30px;padding:8px 12px;font-size:11px}.live-badge span{background:#64926a;border-radius:50%;width:5px;height:5px;margin-right:6px;display:inline-block}.court-top-right{color:#527561;letter-spacing:2px;align-items:center;gap:15px;font-size:10px;display:flex}.court-top-right button{pointer-events:auto;letter-spacing:0;background:#e4eee0b0;border:1px solid #bfd0c0;border-radius:50%;place-items:center;width:31px;height:31px;display:grid}.scoreboard{pointer-events:none;background:#fafcf3e8;border:1px solid #fff;border-radius:12px;align-items:center;gap:20px;padding:12px 22px;display:flex;position:absolute;top:22px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #29493608}.scoreboard div{min-width:57px}.scoreboard span{color:#889680;margin-bottom:4px;font-size:9px;display:block}.scoreboard b{color:#33533d;font-variant-numeric:tabular-nums;white-space:nowrap;font-family:Arial,sans-serif;font-size:24px;font-weight:550}.scoreboard small{color:#95a18c;font-size:11px}.scoreboard i{background:#dce3d3;width:1px;height:29px}.start-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fbfcf5f5;border:1px solid #fff;border-radius:18px;width:min(360px,85%);padding:26px 27px 23px;position:absolute;top:50%;left:50%;transform:translate(-50%,-42%);box-shadow:0 16px 60px #173e3929}.mini-label{letter-spacing:1.8px;color:#85916e;font-size:9px;font-weight:600;display:block}.start-card h2{letter-spacing:-.5px;color:#2c4733;margin:13px 0 10px;font-size:24px;font-weight:700;line-height:1.4}.start-card p{color:#7d8870;margin:0 0 22px;font-size:12px;line-height:1.95}.primary{color:#354827;background:#d3ed84;border:0;border-radius:8px;justify-content:center;align-items:center;gap:10px;width:100%;padding:14px;font-size:13px;font-weight:650;display:flex}.primary:hover{background:#c6e672}.primary svg:last-child{margin-left:auto}.primary svg:first-child{margin-right:auto}.start-card>small{text-align:center;color:#9aa28a;margin-top:16px;font-size:9px;display:block}.court-bottom{letter-spacing:.6px;color:#5d7a65;pointer-events:none;justify-content:space-between;font-size:9px;display:flex;position:absolute;bottom:16px;left:23px;right:23px}.court-bottom span{align-items:center;display:flex}.feedback{background:#f0f3e7;border:1px solid #dfe5d4;border-radius:12px;align-items:center;gap:15px;min-height:78px;margin-top:14px;padding:15px 21px;display:flex}.feedback-symbol{color:#6d8d47;background:#e1e9d1;border-radius:50%;flex-shrink:0;place-items:center;width:34px;height:34px;font-size:25px;display:grid}.feedback b{color:#526549;font-size:13px;font-weight:650}.feedback p{color:#929c82;margin:6px 0 0;font-size:11px;line-height:1.6}.feedback-tag{letter-spacing:1.8px;color:#9caa8c;margin-left:auto;font-size:8px}.feedback.perfect,.feedback.good{background:#eaf3d9;border-color:#c8dba7}.feedback.early,.feedback.late,.feedback.position{background:#f6eedf;border-color:#e5d7b8}.controls{justify-content:space-between;align-items:center;gap:20px;margin-top:17px;display:flex}.move-controls{align-items:center;gap:8px;display:flex}.move-controls>span{color:#7d8772;margin-right:10px;font-size:12px}.move-controls button{color:#758364;touch-action:none;-webkit-user-select:none;user-select:none;background:#fcfcf7;border:1px solid #dce1d4;border-radius:8px;place-items:center;width:46px;height:44px;display:grid}.move-controls button:hover{background:#e6edd9}.move-controls small{color:#a6ac9c;margin-left:9px;font-size:10px}.swing-button{color:#50623b;text-align:left;touch-action:manipulation;background:#e2ebcb;border:1px solid #c7d3b4;border-radius:9px;justify-content:space-between;align-items:center;gap:28px;min-width:204px;padding:11px 17px;font-size:13px;font-weight:650;display:flex}.swing-button:disabled{opacity:.72}.swing-button small{letter-spacing:1px;color:#7f8d6c;margin-top:4px;font-size:9px;font-weight:400;display:block}.timing-hud{color:#e0edcc;background:#193f36eb;border:1px solid #6d8c6c;border-radius:12px;width:min(380px,75%);padding:13px 17px;position:absolute;bottom:53px;left:50%;transform:translate(-50%)}.timing-hud>div:first-child{justify-content:space-between;align-items:center;margin-bottom:9px;font-size:12px;display:flex}.timing-hud small{color:#9eb899;font-size:8px}.timing-track{background:#466558;border-radius:5px;height:7px;position:relative}.sweet-spot{background:#cbeb7d;border-radius:3px;width:26%;height:100%;position:absolute;left:69%}.timing-track i{background:#fff;border-radius:3px;width:4px;height:15px;position:absolute;top:-4px;transform:translate(-50%);box-shadow:0 0 8px #fff}.timing-hud.auto .timing-track{display:none}.timing-hud.auto>div:first-child{margin:0}.result-card{text-align:center;padding-top:22px}.result-card .trophy{color:#9ab958;margin:auto auto 12px}.result-card h2{font-size:22px}.result-stats{border-bottom:1px solid #e3e8d7;justify-content:space-around;margin-bottom:15px;padding:14px 0 18px;display:flex}.result-stats b{color:#527a37;font-family:Arial;font-size:24px;display:block}.result-stats span{color:#91a07c;margin-top:6px;font-size:10px;display:block}.text-button{color:#8a977a;background:0 0;border:0;justify-content:center;align-items:center;gap:6px;margin:15px auto 0;font-size:11px;display:flex}footer{color:#9aa48f;justify-content:space-between;margin:32px 0 23px;font-size:10px;display:flex}footer span:last-child{letter-spacing:1.6px;font-size:9px}footer i{color:#c2cbbb;padding:0 12px;font-style:normal}@media (width>=1450px){.game-panel{height:650px}.workspace{grid-template-columns:320px minmax(0,1fr);gap:50px}.lessons h1{font-size:36px}}@media (width<=1100px){.app-shell{padding:0 24px}.workspace{grid-template-columns:240px minmax(0,1fr);gap:24px}.lessons h1{font-size:26px}.game-panel{height:550px}.scoreboard{gap:18px;top:65px}.scoreboard b{font-size:20px}.move-controls small{display:none}.swing-button{min-width:170px}.feedback-tag{display:none}.start-card{transform:translate(-50%,-30%)}}@media (width<=760px){.app-shell{padding:0 16px}.topbar{height:80px}.brand{font-size:21px}.brand-mark{width:38px;height:38px}.top-label{display:none}.sound-button{padding:9px}.sound-button span{display:none}.workspace{flex-direction:column;gap:16px;padding-top:20px;display:flex}.lessons{padding:0}.eyebrow,.lessons h1,.intro,.coach-note,.lesson-goal,.footnote,.lessons>.section-label{display:none}.lesson-list{grid-template-columns:repeat(3,1fr);gap:7px;margin:0}.lesson{border-radius:9px;justify-content:center;gap:7px;min-height:59px;padding:12px 9px}.lesson-no{font-size:10px}.lesson-copy{flex:initial}.lesson b{font-size:13px}.lesson small,.lesson svg{display:none}.game-panel{border-radius:14px;height:560px}.court-top{top:16px;left:15px;right:15px}.scoreboard{gap:17px;padding:9px 17px;top:57px}.scoreboard span{font-size:8px}.scoreboard div{min-width:52px}.scoreboard b{font-size:21px}.start-card{width:82%;padding:22px;transform:translate(-50%,-33%)}.start-card h2{font-size:22px}.court-bottom{font-size:8px;left:15px;right:15px}.court-bottom>span:last-child{display:none}.feedback{gap:11px;min-height:83px;padding:13px 15px}.feedback p{font-size:11px}.controls{gap:12px}.move-controls{gap:6px}.move-controls>span{display:none}.move-controls button{width:48px;height:48px}.swing-button{flex:1;min-width:165px;max-width:235px}.timing-hud{width:82%}footer{margin:24px 0 20px}footer span:last-child{letter-spacing:.8px;font-size:7px}footer i{padding:0 4px}}@media (prefers-reduced-motion:reduce){button{transition:none}}