/* One deliberate tactile moment: compress, release, then a brief track-light sweep. */
.header-logo{width:180px;height:42px;object-fit:contain;object-position:left center}
.vs-header img{height:42px;object-fit:contain;object-position:left center}
.title-screen .title-logo{margin-bottom:12px}
.title-screen .title-logo img{max-height:min(39svh,270px);object-fit:contain}
.title-screen #start{position:relative;isolation:isolate;overflow:hidden;min-height:58px;border-radius:11px;border:1px solid #e8ffbd;box-shadow:0 5px 0 #708f46,0 12px 24px #0b1a2366;transform:translateY(0);transition:transform 100ms ease-out,box-shadow 100ms ease-out,background 120ms ease-out}
.title-screen #start::after{content:"";position:absolute;inset:-50% -40%;z-index:-1;background:linear-gradient(110deg,transparent 36%,#ffffff70 49%,transparent 62%);transform:translateX(-100%);transition:transform 450ms cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){.title-screen #start:hover{background:#ddffab;box-shadow:0 5px 0 #819f50,0 15px 32px #b7f87920}.title-screen #start:hover::after{transform:translateX(100%)}}
.title-screen #start.title-pressed,.title-screen #start:active{transform:translateY(4px) scale(.982);box-shadow:0 1px 0 #708f46,0 4px 10px #0b1a2340}
.title-screen #ready-card .distance-picker{position:relative;isolation:isolate;width:min(310px,100%);padding:4px;gap:4px;margin:21px auto 0;border:1px solid #b0c3ba55;border-radius:13px;background:#102530c9}
.title-screen #ready-card .distance-picker::before{content:"";position:absolute;z-index:-1;left:4px;top:4px;bottom:4px;width:calc((100% - 12px)/2);border-radius:9px;background:#eef0d9;box-shadow:0 3px 10px #071b2633;transform:translateX(calc(var(--course-index,0) * (100% + 4px)));transition:transform 310ms cubic-bezier(.18,.85,.22,1)}
.title-screen #ready-card .distance-picker button{flex:1;min-width:0;min-height:73px;border:0;border-radius:9px;background:transparent;color:#d9e3de;padding:10px 8px;transition:color 180ms ease,transform 100ms ease;position:relative}
.title-screen #ready-card .distance-picker button.selected{background:transparent;color:#172b30;box-shadow:none}
.title-screen #ready-card .distance-picker button small{transition:color 180ms ease;color:#aebeba}
.title-screen #ready-card .distance-picker button.selected small{color:#4b6265}
.title-screen #ready-card .distance-picker button:active{transform:scale(.965)}
.title-course-preview{z-index:3!important;pointer-events:none;opacity:0;transform:translateX(0);will-change:auto}
.title-course-preview.switching{animation:course-reveal 320ms cubic-bezier(.2,.7,.2,1) both}
@keyframes course-reveal{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(calc(var(--course-direction,1) * -16px))}}
.title-launch-fx{position:absolute;inset:0;z-index:9;pointer-events:none;opacity:0;overflow:hidden;background:radial-gradient(ellipse at 50% 52%,#d8ff9633,transparent 68%)}
.title-launch-fx::before,.title-launch-fx::after{content:"";position:absolute;top:0;bottom:0;left:-70%;width:55%;background:linear-gradient(100deg,transparent,#e8ffc677,transparent);transform:skewX(-18deg)}
.title-launch-fx::after{width:12%;background:#f6ffe185}
.title-launch-fx.launching{animation:title-launch-flash 420ms ease-out both}
.title-launch-fx.launching::before,.title-launch-fx.launching::after{animation:title-launch-sweep 400ms cubic-bezier(.12,.65,.25,1) both}
.title-launch-fx.launching::after{animation-delay:35ms}
@keyframes title-launch-flash{0%{opacity:.8}100%{opacity:0}}
@keyframes title-launch-sweep{0%{transform:translateX(0) skewX(-18deg)}100%{transform:translateX(440%) skewX(-18deg)}}
@media(max-width:650px){.header-logo{width:145px;height:34px}.vs-header img{height:34px}.title-screen #start{min-height:54px}.title-screen .title-logo img{max-height:min(35svh,240px)}.title-screen #ready-card .distance-picker{width:min(280px,100%);margin-top:19px}.title-screen #ready-card .distance-picker button{min-height:66px}}
@media(max-height:450px) and (orientation:landscape){.title-screen .title-logo{margin-bottom:6px}.title-screen .title-logo img{max-height:105px}.title-screen #start{min-height:45px}.title-screen #ready-card .distance-picker{margin-top:12px}.title-screen #ready-card .distance-picker button{min-height:51px;padding:6px}.title-screen #ready-card .distance-picker button small{margin-top:0}}
@media(prefers-reduced-motion:reduce){.title-screen #start,.title-screen #start::after,.title-screen #ready-card .distance-picker::before,.title-screen #ready-card .distance-picker button{transition:none!important;transform:none!important}.title-screen #ready-card .distance-picker::before{transform:translateX(calc(var(--course-index,0) * (100% + 4px)))!important}.title-course-preview.switching,.title-launch-fx.launching,.title-launch-fx.launching::before,.title-launch-fx.launching::after{animation:none!important;opacity:0!important}}
