.practice-start{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;margin-top:17px;border:1px solid #83d2b6;border-radius:12px;background:linear-gradient(110deg,#27584c,#193f47);font-size:13px;font-weight:900;color:#dcfff0;min-height:54px}.practice-start span{font-size:10px;max-width:50%;text-align:right;line-height:1.5;color:#a2dccb}
.showdown-replay{display:flex;align-items:end;gap:10px;margin-top:16px}.showdown-replay label{font-size:11px;color:#b6cebf;flex:1;min-width:0}.showdown-replay button{min-height:44px;font-size:11px;border-radius:9px;color:#ecd18c}.showdown-intro{padding:16px;border:1px solid #e3bc62;border-radius:14px;background:linear-gradient(130deg,#4d3c2380,#29365080);margin:18px 0}.showdown-intro small{font-size:10px;letter-spacing:1px;color:#e2c17d}.showdown-intro h3{font-size:22px;line-height:1.1;margin:10px 0;color:#f9dfa2}.showdown-intro p{font-style:italic;color:#e4e6dc}.showdown-intro b{font-size:12px;color:#bdedd3;line-height:1.5;display:block}
.practice-bar{position:absolute;z-index:8;top:max(59px,calc(env(safe-area-inset-top) + 56px));left:50%;transform:translateX(-50%);display:flex;gap:6px;max-width:67%;padding:5px;border:1px solid #85c9b58a;border-radius:16px;background:#102e32ee}.practice-bar button{min-height:44px;padding:8px 12px;border-radius:10px;font-size:11px;font-weight:900;color:#d6fff0;background:#25564c;white-space:nowrap}.practice-help{position:absolute;z-index:7;left:50%;top:110px;transform:translateX(-50%);width:min(450px,62%);margin:0;text-align:center;font-size:12px;color:#fff0bb;text-shadow:0 1px 3px #000;pointer-events:none}.practice-tasks{position:absolute;z-index:7;left:50%;bottom:22%;transform:translateX(-50%);width:min(560px,62%);padding:7px 12px;margin:0;text-align:center;font-size:12px;line-height:1.6;border:1px solid #bddb9066;border-radius:12px;background:#0c252bd9;color:#c5f2d9;pointer-events:none}.practice-exit{position:absolute;z-index:9;top:8px;left:12px;min-height:44px;border-radius:10px;background:#1d4640;font-size:12px;color:#ffe6a8}.practice .race-hud .position,.practice .race-hud .lap,.practice .race-hud .race-title,.practice .race-standings,.practice .race-time>b,.practice .race-coins,.practice .ghost-status{display:none!important}.practice .race-hud{justify-content:flex-end}.practice .race-time{margin-left:auto}.practice .circuit-map{display:none}.practice .racer-reaction{top:150px}.practice #raceMessage{top:32%}
@media(max-width:480px){.practice-bar{max-width:96%;width:96%;justify-content:center;gap:5px}.practice-bar button{font-size:10px;padding:6px 8px;flex:1}.practice-help{width:92%;top:116px;font-size:11px}.practice-tasks{width:87%;bottom:28%;font-size:11px}.showdown-replay{flex-wrap:wrap}.showdown-replay label{min-width:100%}.showdown-replay button{width:100%}}
@media(orientation:landscape) and (max-height:420px){.practice-bar{top:6px;max-width:68%}.practice-bar button{min-height:38px;padding:5px 10px}.practice-help{top:59px;font-size:11px}.practice-tasks{bottom:5px;width:47%;font-size:11px;padding:3px 7px}.practice .racer-reaction{top:85px}.practice #raceMessage{top:27%}}
@media(prefers-reduced-motion:no-preference){.showdown-intro{animation:showdown-reveal .35s ease-out}@keyframes showdown-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}
/* Keep practice guidance above the action rather than over the player's truck. */
.practice-help{top:124px}.practice-tasks{top:151px;bottom:auto}.practice .racer-reaction{top:204px}
@media(max-width:480px){.practice-help{top:124px}.practice-tasks{top:167px;bottom:auto}.practice .racer-reaction{top:235px}}
@media(orientation:landscape) and (max-height:420px){.practice-help{top:59px}.practice-tasks{top:auto;bottom:5px}.practice .racer-reaction{top:85px}}
@media(orientation:landscape) and (max-height:420px){.practice-tasks{top:83px;bottom:auto;width:62%;font-size:11px;padding:3px 7px}.practice .racer-reaction{top:139px}}
#raceView.practice .racer-reaction{bottom:auto;width:max-content;height:auto;max-height:62px;max-width:65%}
#raceView.practice #raceMessage{display:none}
