#lapStopwatchDialog{background:#090c10;color:#f5f8fb}#lapStopwatchDialog::backdrop{background:rgba(0,0,0,.88)}
.lap-timer-shell{display:grid;grid-template-rows:auto auto 1fr auto;height:100%;min-height:0;background:radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--theme-primary) 24%,transparent),transparent 38%),#090c10}.lap-timer-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;border-bottom:1px solid #2b3540}.lap-timer-head strong{color:#fff!important;font-size:17px;letter-spacing:.04em;text-transform:uppercase}.lap-timer-head-actions{display:flex;gap:8px}.lap-timer-head button{min-height:38px;background:#131a22!important;color:#f5f8fb!important;border-color:#415063!important}
.lap-timer-setup{padding:14px 20px;border-bottom:1px solid #2b3540}.lap-timer-setup-body{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.lap-timer-setup-toggle{display:none}.lap-timer-setup label{display:grid;gap:5px;color:#aebdcb!important;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.lap-timer-setup .wide{grid-column:span 2}.lap-timer-setup :is(input,select,textarea){width:100%;min-width:0;padding:9px 11px;border:1px solid #3b4857;border-radius:9px;background:#151719!important;color:#fff!important;font:600 14px Arial,sans-serif;box-sizing:border-box}.lap-timer-setup textarea{min-height:42px;resize:vertical}
.lap-timer-stage{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(290px,.88fr);min-height:0;overflow:hidden}.lap-timer-clock-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:24px;text-align:center}.lap-timer-tray-body{display:flex;flex-direction:column;align-items:center;width:100%;min-width:0}.lap-timer-status{color:var(--theme-primary);font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}#lapTimerClock{margin:12px 0 22px;color:#fff;font:900 clamp(48px,9vw,112px)/.92 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:-.07em;font-variant-numeric:tabular-nums;white-space:nowrap}.lap-timer-primary-actions{display:grid;grid-template-columns:repeat(2,minmax(0,180px));gap:12px;width:100%;justify-content:center}.lap-timer-primary-actions button{min-height:74px;border-radius:16px;font-size:20px}#lapTimerLapButton{background:var(--theme-primary)!important;color:var(--theme-contrast,#fff)!important;border-color:var(--theme-primary)!important}#lapTimerStartButton{background:#1b2632!important;color:#fff!important;border-color:#526579!important}
.lap-timer-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;max-width:560px;margin-top:22px}.lap-timer-stats div{padding:10px 8px;border:1px solid #2f3b48;border-radius:10px;background:#111820}.lap-timer-stats span{display:block;color:#91a1b1;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.lap-timer-stats strong{display:block;margin-top:5px;color:#fff!important;font:800 14px ui-monospace,SFMono-Regular,Consolas,monospace}
.lap-timer-laps{min-height:0;padding:16px 18px;border-left:1px solid #2b3540;background:rgba(9,12,16,.72);overflow:auto}.lap-timer-laps h3{margin:0 0 10px;color:#fff!important;font-size:14px;text-transform:uppercase;letter-spacing:.06em}.lap-timer-laps-empty{color:#8394a5;font-size:13px;line-height:1.5}.lap-timer-lap{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid #28323d}.lap-timer-lap b{color:var(--theme-primary);font-size:12px}.lap-timer-lap-time{font:800 19px ui-monospace,SFMono-Regular,Consolas,monospace}.lap-timer-lap small{display:block;margin-top:3px;color:#8697a7}.lap-timer-lap button{width:34px;height:34px;min-height:34px;padding:0;border-color:#4a5868!important;background:transparent!important;color:#b7c3ce!important}
.lap-timer-footer{display:flex;justify-content:space-between;gap:10px;padding:13px 20px max(13px,env(safe-area-inset-bottom));border-top:1px solid #2b3540;background:#0d1218}.lap-timer-footer>div{display:flex;gap:8px}.lap-timer-footer button{min-height:42px}.lap-timer-save[hidden]{display:none!important}.lap-timer-message{align-self:center;color:#aebdcb;font-size:12px}.ride-lap-summary{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;margin-top:6px}.ride-lap-summary span{padding:9px;border:1px solid var(--line);border-radius:9px}.ride-lap-summary small{display:block;color:#61768e;font-size:9px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.ride-lap-summary b{display:block;margin-top:4px;color:inherit;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.ride-lap-details{margin-top:14px;border:1px solid var(--line);border-radius:11px;overflow:hidden}.ride-lap-details summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;color:var(--theme-primary);font-size:12px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;list-style:none}.ride-lap-details summary::-webkit-details-marker{display:none}.ride-lap-details summary::after{content:"+";order:3;font-size:20px;line-height:1}.ride-lap-details[open] summary::after{content:"−"}.ride-lap-details summary b{display:grid;place-items:center;min-width:26px;height:26px;border-radius:999px;background:color-mix(in srgb,var(--theme-primary) 14%,transparent);font-size:12px}.ride-lap-details ol{display:grid;gap:0;margin:0;padding:0 14px 8px;list-style:none}.ride-lap-details li{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.ride-lap-details li span{color:#61768e;font-size:11px;font-weight:900;text-transform:uppercase}.ride-lap-details li strong{font:800 17px ui-monospace,SFMono-Regular,Consolas,monospace}.ride-lap-details li small{color:#74869a;font:600 11px ui-monospace,SFMono-Regular,Consolas,monospace}
@media(max-width:720px){#lapStopwatchDialog{width:100vw;height:100dvh;border-radius:0}.lap-timer-head{padding:10px 12px}.lap-timer-head-actions button{padding:0 9px;font-size:11px}.lap-timer-setup{padding:0 12px}.lap-timer-setup-body{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 0 10px}.lap-timer-setup-body>label{min-width:0}.lap-timer-setup-body :is(input,select,textarea),#lapTimerTime{display:block;width:100%;min-width:0;max-width:100%}.lap-timer-setup .wide{grid-column:1/-1}.lap-timer-setup-toggle,.lap-timer-tray-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;padding:0 4px;border:0;border-radius:0;background:transparent!important;color:inherit!important;box-shadow:none!important;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.lap-timer-setup-toggle b,.lap-timer-tray-toggle b{color:var(--theme-primary);font-size:24px;line-height:1}.lap-timer-setup.is-collapsed .lap-timer-setup-body{display:none}.lap-timer-stage{grid-template-columns:1fr;grid-template-rows:auto minmax(160px,1fr);width:auto;max-width:none;margin:0;padding:0;overflow:hidden}.lap-timer-clock-panel{justify-content:flex-start;padding:0 12px 14px}.lap-timer-tray-body{padding-top:8px}.lap-timer-laps{border-left:0;border-top:1px solid #2b3540;padding:12px;overflow:auto}#lapTimerClock{font-size:clamp(46px,16vw,82px);margin:9px 0 16px}.lap-timer-primary-actions button{min-height:64px}.lap-timer-stats{margin-top:14px}.lap-timer-footer{padding:9px 12px max(9px,env(safe-area-inset-bottom))}.lap-timer-message{display:none}.ride-lap-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}.ride-lap-details li{grid-template-columns:58px minmax(0,1fr);gap:6px 10px}.ride-lap-details li small{grid-column:2}}
@media(orientation:landscape) and (max-height:620px){.lap-timer-setup{display:none}.lap-timer-stage{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);grid-template-rows:1fr}.lap-timer-clock-panel{padding:10px}.lap-timer-laps{border-top:0;border-left:1px solid #2b3540}#lapTimerClock{font-size:clamp(48px,11vh,82px);margin:6px 0 12px}.lap-timer-primary-actions button{min-height:54px}.lap-timer-stats{margin-top:10px}}
#openLapStopwatchButton{white-space:nowrap}
.ride-log-head-actions{display:flex;align-items:center;gap:8px;align-self:center}.ride-log-head-actions button{white-space:nowrap}
@media(max-width:600px){.dashboard-explore #rideLogPageButton{order:0}.dashboard-explore #openLapStopwatchButton{order:1}.dashboard-explore #raceResultsOpenButton{order:2}.dashboard-explore #rideFinderButton{order:3}.dashboard-explore #serviceLocatorButton{order:4}}

@media(max-width:720px){
  .lap-timer-setup-body>label:nth-child(1){order:1}
  .lap-timer-setup-body>label:nth-child(2){order:2}
  .lap-timer-field-track{order:3}
  .lap-timer-field-time{order:4}
  .lap-timer-setup-body>label:nth-child(5){order:5}
  .lap-timer-setup-body>label:nth-child(6){order:6}
}

html body #lapStopwatchDialog :is(.lap-timer-setup-toggle,.lap-timer-tray-toggle),
html body #lapStopwatchDialog :is(.lap-timer-setup-toggle,.lap-timer-tray-toggle):is(:hover,:active,:focus,:focus-visible){
  background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;transform:none!important;-webkit-tap-highlight-color:transparent!important;-webkit-user-select:none!important;user-select:none!important;
}
html body #lapStopwatchDialog :is(.lap-timer-setup-toggle,.lap-timer-tray-toggle) :is(span,b)::selection{background:transparent;color:inherit}

/* Match the stopwatch to MotoHQ's active display mode and selected color theme. */
html body[data-display-mode="day"] #lapStopwatchDialog{
  background:#fff;color:#14201f;border:1px solid #dbe5f3;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-shell{
  background:radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--theme-primary,#146cff) 13%,transparent),transparent 38%),#fff;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-head{background:#fff!important;color:#14201f!important}
html body[data-display-mode="day"] #lapStopwatchDialog :is(.lap-timer-head,.lap-timer-setup,.lap-timer-footer){border-color:#dbe5f3}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-head strong,
html body[data-display-mode="day"] #lapStopwatchDialog #lapTimerClock,
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-laps h3,
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-stats strong{color:#14201f!important}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-head button,
html body[data-display-mode="day"] #lapStopwatchDialog #lapTimerStartButton{
  background:#edf3fb!important;color:#14201f!important;border-color:#c9dcf3!important;box-shadow:none!important;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-setup label,
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-message{color:#52647a!important}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-setup :is(input,select,textarea){
  background:#fff!important;color:#14201f!important;border-color:#c9dcf3!important;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-setup :is(input,select,textarea):focus{
  border-color:var(--theme-primary,#146cff)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-primary,#146cff) 14%,transparent)!important;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-stats div{
  background:#f6f9fd;border-color:#dbe5f3;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-stats span,
html body[data-display-mode="day"] #lapStopwatchDialog :is(.lap-timer-laps-empty,.lap-timer-lap small){color:#61768e}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-laps{
  background:#f8fbff;border-color:#dbe5f3;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-lap{border-color:#dbe5f3}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-lap button{
  color:#52647a!important;border-color:#c9dcf3!important;background:transparent!important;box-shadow:none!important;
}
html body[data-display-mode="day"] #lapStopwatchDialog .lap-timer-footer{background:#fff}

html body[data-display-mode="night"] #lapStopwatchDialog{
  background:#090c10;color:#f5f8fb;border:1px solid #303944;
}
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-shell{
  background:radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--theme-primary,#146cff) 20%,transparent),transparent 38%),#1d1f1f;
}
html body[data-display-mode="night"] #lapStopwatchDialog :is(.lap-timer-head,.lap-timer-setup,.lap-timer-stage,.lap-timer-clock-panel,.lap-timer-footer){background:#1d1f1f!important}
html body[data-display-mode="night"] #lapStopwatchDialog :is(.lap-timer-head,.lap-timer-setup,.lap-timer-footer){border-color:#303944}
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-setup :is(input,select,textarea),
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-stats div{background:#1d1f1f!important;color:#fff!important;border-color:#3b4652!important}
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-laps{background:#1d1f1f;border-color:#303944}

@media(max-width:720px){
  .lap-timer-field-time{min-width:0;overflow:hidden}
  #lapTimerTime{
    display:block!important;
    width:calc(100% - 8px)!important;
    min-width:0!important;
    max-width:calc(100% - 8px)!important;
    inline-size:calc(100% - 8px)!important;
    min-inline-size:0!important;
    max-inline-size:calc(100% - 8px)!important;
    justify-self:start;
    padding-left:8px;
    padding-right:8px;
    -webkit-appearance:none;
    appearance:none;
    overflow:hidden;
  }
  #lapTimerTime::-webkit-date-and-time-value{min-width:0;text-align:left}
}
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-footer{background:#1d1f1f}
html body[data-display-mode="night"] #lapStopwatchDialog .lap-timer-head button,
html body[data-display-mode="night"] #lapStopwatchDialog #lapTimerStartButton{
  background:#1d1f1f!important;color:#f5f8fb!important;border-color:#415063!important;box-shadow:none!important;
}
html body #lapStopwatchDialog #lapTimerLapButton,
html body #lapStopwatchDialog .lap-timer-save{
  background:var(--theme-primary,#146cff)!important;color:var(--theme-text,#fff)!important;border-color:var(--theme-primary,#146cff)!important;
}

/* Keep mobile tray headings visually neutral in every display/color theme. */
html body[data-theme][data-display-mode] #lapStopwatchDialog button.lap-timer-setup-toggle,
html body[data-theme][data-display-mode] #lapStopwatchDialog button.lap-timer-tray-toggle,
html body[data-theme][data-display-mode] #lapStopwatchDialog button.lap-timer-setup-toggle:is(:hover,:active,:focus,:focus-visible),
html body[data-theme][data-display-mode] #lapStopwatchDialog button.lap-timer-tray-toggle:is(:hover,:active,:focus,:focus-visible){
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  transform:none!important;
  appearance:none;
}

/* The stopwatch occupies the app viewport; save-details remains a separate dialog. */
html:has(#lapStopwatchDialog[open]),body:has(#lapStopwatchDialog[open]){overflow:hidden!important}
html body #lapStopwatchDialog{
 position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;
 max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;
 border:0!important;border-radius:0!important;box-sizing:border-box!important;overflow:hidden!important;
}
html body #lapStopwatchDialog .lap-timer-shell{height:100%;min-height:0;grid-template-rows:auto minmax(0,1fr) auto}
html body #lapStopwatchDialog .lap-timer-stage{
 width:100%!important;max-width:none!important;height:100%;min-width:0;min-height:0;
 margin:0!important;padding:0 env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px)!important;
}
html body #lapStopwatchDialog .lap-timer-head{
 padding-top:calc(12px + env(safe-area-inset-top,0px));
 padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px));
}
html body #lapStopwatchDialog .lap-timer-footer{min-width:0;padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
html body #lapStopwatchDialog .lap-timer-footer>div{flex-wrap:wrap;justify-content:flex-end}
@media(max-width:720px){
 html body #lapStopwatchDialog .lap-timer-stage{grid-template-rows:auto minmax(120px,1fr);overflow-y:auto}
 html body #lapStopwatchDialog .lap-timer-footer>div{width:100%;justify-content:space-between}
}
@media(orientation:landscape) and (max-height:620px){
 html body #lapStopwatchDialog .lap-timer-stage{grid-template-columns:minmax(0,1.12fr) minmax(220px,.88fr);grid-template-rows:minmax(0,1fr);overflow:hidden}
 html body #lapStopwatchDialog .lap-timer-clock-panel{justify-content:center;padding:8px 12px;overflow-y:auto}
 html body #lapStopwatchDialog #lapTimerClock{font-size:clamp(36px,8vw,64px);margin:6px 0 10px}
 html body #lapStopwatchDialog :is(#lapTimerStartButton,#lapTimerLapButton){min-height:64px!important}
 html body #lapStopwatchDialog .lap-timer-stats{margin-top:10px}
 html body #lapStopwatchDialog .lap-timer-message{display:none}
}
