/* ROTOR Final 01 — swing coach. Reads the live match; DOM is glass over the court. */
.f1-coach{position:fixed;left:50%;top:auto;bottom:calc(118px + env(safe-area-inset-bottom,0px));translate:-50% 0;z-index:420;width:min(560px,calc(100vw - 28px));padding:12px 16px 12px;border:1px solid #e9eef2a8;border-radius:22px;background:linear-gradient(150deg,#0a1220d9,#02060fcc 60%,#0a1220d9);box-shadow:inset 0 1px 0 #ffffff66,0 18px 40px #00000066;color:#e9eef2;text-shadow:0 1px 2px #000c;font:600 11px/1.3 Inter,system-ui,sans-serif;letter-spacing:1.4px;text-transform:uppercase;pointer-events:auto;opacity:0;transform:translateY(-8px);transition:opacity 900ms cubic-bezier(.22,.61,.36,1),transform 900ms cubic-bezier(.22,.61,.36,1)}
.f1-coach.on{opacity:1;transform:none}
.f1-coach[hidden]{display:none}
.f1-coach .f1-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.f1-coach .f1-step{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:center;padding:8px 10px;border:1px solid #e9eef233;border-radius:14px;background:#00000040;transition:border-color 300ms,background 300ms}
.f1-coach .f1-step i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid #e9eef2aa;font:800 12px/1 'Barlow Condensed',sans-serif;color:#e9eef2;background:linear-gradient(145deg,#fdfefe,#9aa5ad 45%,#39434b 70%,#c9d2d8)}
.f1-coach .f1-step b{display:block;font:800 16px/1 'Barlow Condensed',sans-serif;letter-spacing:1px;color:#fff}
.f1-coach .f1-step span{display:block;margin-top:3px;font-size:9.5px;letter-spacing:1.2px;color:#e9eef2b3;text-transform:none}
.f1-coach .f1-step[data-live="true"]{border-color:#c7fc68cc;background:#c7fc6814}
.f1-coach .f1-step[data-live="true"] i{background:linear-gradient(145deg,#f4ffd9,#c7fc68 55%,#5c8a12);color:#101706;border-color:#eaffb0}
.f1-coach .f1-step[data-done="true"]{border-color:#e9eef255}
.f1-coach .f1-step[data-done="true"] i{background:linear-gradient(145deg,#fff5c7,#ffcf00 55%,#9a7a00);color:#101706;border-color:#ffe99a}
.f1-coach .f1-step[data-done="true"] i::before{content:"✓"}
.f1-coach .f1-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;font-size:9.5px;color:#e9eef2b3}
.f1-coach .f1-foot button{min-height:30px;padding:0 12px;border:1px solid #e9eef277;border-radius:15px;background:#00000066;color:#e9eef2;font:700 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:1.4px;text-transform:uppercase;cursor:pointer}
.f1-coach .f1-foot button:hover{border-color:#c7fc68;color:#f4ffe0}
.f1-coach .f1-foot b{color:#c7fc68}
@media (max-width:760px){.f1-coach{top:calc(184px + env(safe-area-inset-top,0px));width:min(400px,calc(100vw - 24px));padding:8px 10px}.f1-coach .f1-steps{grid-template-columns:1fr 1fr 1fr;gap:6px}.f1-coach .f1-step{grid-template-columns:22px 1fr;gap:6px;padding:6px}.f1-coach .f1-step i{width:22px;height:22px;font-size:10px}.f1-coach .f1-step b{font-size:13px}.f1-coach .f1-step span{display:none}.f1-coach .f1-foot{margin-top:6px}.f1-coach .f1-foot span{display:none}}

/* The beat: SWING NOW lands as a single deliberate hit, never a buzz. */
.f1-beat{position:fixed;left:50%;top:40%;bottom:auto;translate:-50% 0;z-index:421;pointer-events:none;font:800 46px/1 'Barlow Condensed',sans-serif;letter-spacing:4px;color:#c7fc68;text-shadow:0 0 18px #c7fc6866,0 2px 0 #06070a;opacity:0;transform:scale(.86);will-change:opacity,transform}
.f1-beat.on{animation:f1-beat 520ms cubic-bezier(.22,.61,.36,1) both}
.f1-beat.hit{color:#ffcf00;text-shadow:0 0 22px #ffcf0066,0 2px 0 #1a1400}
@keyframes f1-beat{0%{opacity:0;transform:scale(.86)}18%{opacity:1;transform:scale(1.04)}70%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
.f1-beat small{display:block;margin-top:6px;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:2.2px;color:#e9eef2}
@media (max-width:760px){.f1-beat{font-size:34px;top:34%}}
@media (prefers-reduced-motion:reduce){.f1-beat.on{animation:none;opacity:1;transform:none}.f1-coach{transition:none}}

/* Keep the coach clear of the pause dialog, result card and modals. */
html body:has(#resumePanel:not([hidden])) :is(.f1-coach,.f1-beat),html body.searching :is(.f1-coach,.f1-beat),html body.modalOpen :is(.f1-coach,.f1-beat),html body:has(#d22Result.on) :is(.f1-coach,.f1-beat){visibility:hidden!important}
html body:not(.playing) .f1-beat{display:none}