/* Island Car Log — shared rendering/performance safeguards
   Keeps the existing visual design while reducing work that is not visible. */

/* CSS animations behind a full-screen transition do not need to keep ticking. */
html.icl-transition-active body > header *,
html.icl-transition-active body > nav *,
html.icl-transition-active body > main *,
html.icl-transition-active body > footer *{
  animation-play-state:paused!important;
}

/* Background tabs should not spend CPU/GPU time on decorative CSS animation. */
html.icl-page-hidden *{
  animation-play-state:paused!important;
}

/* Full-screen transition roots are short-lived. Isolate their layout/style work
   without clipping their artwork or changing the animation design. */
.icl-page-transition,
#homeIgnitionIntro,
#marketValueTransition,
#marketToExpensesTransition,
#expenseBurnTransition,
#newCarEntryTransition,
#editCarBonnetTransition,
#fuelRefuelTransition,
#serviceBookTransition,
#logHistoryBookTransition,
#documentFileTransition,
#mechanicalQualityTransition,
#bodyworkQualityTransition,
#timelineDriveTransition,
#gqcCloseTransition{
  contain:layout style;
  isolation:isolate;
}

/* Promote only the short-lived, large moving animation surfaces. */
.icl-page-transition__motion,
.icl-page-transition__wheel,
#homeIgnitionIntro .hii-car,
#marketValueTransition .mvt-terminal,
#marketToExpensesTransition .mte-stage,
#expenseBurnTransition .ebt-stage,
#newCarEntryTransition .nce-stage,
#editCarBonnetTransition .ecb-stage,
#fuelRefuelTransition .frt-stage,
#serviceBookTransition .sbt-stage,
#logHistoryBookTransition .lhbt-stage,
#documentFileTransition .dft-stage,
#mechanicalQualityTransition .mqt-stage,
#bodyworkQualityTransition .bwq-stage,
#timelineDriveTransition .tdt-stage{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/* Keep expensive glass static while it moves. The blur itself is unchanged. */
.icl-page-transition *,
#homeIgnitionIntro *,
#marketValueTransition *,
#marketToExpensesTransition *,
#expenseBurnTransition *,
#newCarEntryTransition *,
#editCarBonnetTransition *,
#fuelRefuelTransition *,
#serviceBookTransition *,
#logHistoryBookTransition *,
#documentFileTransition *,
#mechanicalQualityTransition *,
#bodyworkQualityTransition *,
#timelineDriveTransition *{
  -webkit-font-smoothing:antialiased;
}


/* Long histories can become expensive on mobile. Let the browser skip paint
   for rows that are well outside the viewport. Interactive/delete rows render
   normally as soon as they approach view. */
@supports (content-visibility:auto){
  #logHistoryModal .log-entry,
  #documentationModal .doc-item,
  #fuelModal .log-entry,
  #mechanicalQualityModal .mechanical-log,
  #bodyworkQualityModal .mechanical-log,
  #dashboardModal .valuation-row{
    content-visibility:auto;
    contain-intrinsic-size:auto 150px;
  }
}

/* Idle engine lamps are always visible but their animated drop-shadow is costly
   on mobile Safari. Keep the same illuminated appearance, animate only opacity
   on touch/mobile devices, and leave the full effect unchanged on desktop. */
@media (pointer:coarse), (max-width:900px){
  .car-card .check-engine-light:not([aria-busy="true"]):not(:hover):not(:focus-visible){
    filter:brightness(1.12) drop-shadow(0 0 8px rgba(255,210,0,.66))!important;
    animation:iclEngineIdleOpacity 2s ease-in-out infinite!important;
  }
  @keyframes iclEngineIdleOpacity{
    0%,100%{opacity:.88}
    50%{opacity:1}
  }
}

/* Avoid retaining compositor layers for all timeline items between animations. */
#timelineModal .timeline-connector,
#timelineModal .timeline-month-dot,
#timelineModal .timeline-month-label,
#timelineModal .timeline-event{
  will-change:auto!important;
}
#timelineModal .timeline-car,
#timelineModal .timeline-month-dot.timeline-node-active,
#timelineModal .timeline-month-detail.open .timeline-event{
  will-change:transform,opacity!important;
}


/* Do not reserve compositor layers for every parked car indefinitely. */
.car-card [data-ignition-button],
.car-card .check-engine-light{
  will-change:auto!important;
}
.car-card.car-ignition-running [data-ignition-button],
.car-card.car-ignition-running .check-engine-light{
  will-change:transform,opacity,filter!important;
}


/* iOS/mobile Safari can repaint a fixed full-screen background on every scroll
   frame. Keep the same image/gradient, but let it scroll normally on touch
   devices so modal/list scrolling remains compositor-friendly. */
@media (pointer:coarse), (max-width:900px){
  body.page-profile{
    background-attachment:scroll!important;
  }
}
