/* Impeccable polish — 2026-08-22.
   Visual overlay: stadium background + glass tiles + spacing rhythm.
   No navigation structure, typography, content, data or event changes;
   button colors, borders and interaction states stay untouched. */

:root{
  --impeccable-glass:rgba(255,255,255,.04);
  --impeccable-edge:rgba(255,255,255,.10);
  --impeccable-top-edge:rgba(255,255,255,.16);
  --impeccable-space-1:4px;
  --impeccable-space-2:8px;
  --impeccable-space-3:12px;
  --impeccable-space-4:16px;
  --impeccable-space-6:24px;
  --impeccable-control-compact:40px;
  --impeccable-control-standard:48px;
}

/* The user-provided stadium image is the single full-app background. */
html[data-ui="liquid-glass-v2"],
html[data-ui="liquid-glass-v2"] body{
  min-height:100%;
  background-color:#080204!important;
}

html[data-ui="liquid-glass-v2"] body{
  background:
    linear-gradient(180deg,rgba(3,5,12,.08) 0%,rgba(6,2,5,.04) 56%,rgba(3,0,1,.26) 100%),
    url("./stadium-background-exact.webp?v=2") center top/cover fixed no-repeat!important;
}

html[data-ui="liquid-glass-v2"] body .app-atmosphere{
  position:fixed!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background:url("./stadium-background-exact.webp?v=2") center top/cover no-repeat!important;
  background-attachment:fixed!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
}

html[data-ui="liquid-glass-v2"] body .app-atmosphere::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(3,5,12,.10) 0%,rgba(8,2,5,.025) 54%,rgba(4,0,1,.24) 100%)!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  mix-blend-mode:normal!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}

html[data-ui="liquid-glass-v2"] body .app-atmosphere::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:radial-gradient(circle at 82% 13%,rgba(255,255,255,.08),transparent 24%)!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
}

/* Structural shells stay transparent so the stadium is continuous on every screen. */
html[data-ui="liquid-glass-v2"] body .screen,
html[data-ui="liquid-glass-v2"] body .home-screen,
html[data-ui="liquid-glass-v2"] body .mockup-home,
html[data-ui="liquid-glass-v2"] body .mockup-topbar,
html[data-ui="liquid-glass-v2"] body .week-overview,
html[data-ui="liquid-glass-v2"] body .mockup-section-head,
html[data-ui="liquid-glass-v2"] body .page-head,
html[data-ui="liquid-glass-v2"] body .day-detail-head,
html[data-ui="liquid-glass-v2"] body .day-detail-content,
html[data-ui="liquid-glass-v2"] body .stopwatch-shell,
html[data-ui="liquid-glass-v2"] body .an-shell{
  background:transparent!important;
}

/* Glassmorphism is applied only to existing content tiles/cards. */
html[data-ui="liquid-glass-v2"] body .next-card,
html[data-ui="liquid-glass-v2"] body .week-card,
html[data-ui="liquid-glass-v2"] body .phase-card,
html[data-ui="liquid-glass-v2"] body .card,
html[data-ui="liquid-glass-v2"] body .day-exercise,
html[data-ui="liquid-glass-v2"] body .rest-detail,
html[data-ui="liquid-glass-v2"] body .training-flow-step,
html[data-ui="liquid-glass-v2"] body .training-actuals-card,
html[data-ui="liquid-glass-v2"] body .an-card,
html[data-ui="liquid-glass-v2"] body .prompt,
html[data-ui="liquid-glass-v2"] body .hero.test{
  background:var(--impeccable-glass)!important;
  border:1px solid var(--impeccable-edge)!important;
  border-top:1px solid var(--impeccable-top-edge)!important;
  box-shadow:
    0 16px 42px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -1px 0 rgba(0,0,0,.08)!important;
  backdrop-filter:blur(25px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(25px) saturate(115%)!important;
}

/* Spacing grid polish.
   Every distance is a multiple of the 4px base unit. These rules only change
   geometry/rhythm; existing button visuals, labels and selected states remain. */
html[data-ui="liquid-glass-v2"] body .top-actions,
html[data-ui="liquid-glass-v2"] body .nav-arrows{
  gap:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .mockup-home{
  gap:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .week-overview{
  padding-top:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .mockup-section-head{
  margin-bottom:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .week-card,
html[data-ui="liquid-glass-v2"] body .phase-card{
  margin-top:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .phase-card,
html[data-ui="liquid-glass-v2"] body .page-head,
html[data-ui="liquid-glass-v2"] body .day-detail-head,
html[data-ui="liquid-glass-v2"] body .day-exercise,
html[data-ui="liquid-glass-v2"] body .training-flow-step,
html[data-ui="liquid-glass-v2"] body .training-flow-heading{
  gap:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .card{
  margin-top:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .prompt{
  margin-top:var(--impeccable-space-4)!important;
}

html[data-ui="liquid-glass-v2"] body .flow-switch,
html[data-ui="liquid-glass-v2"] body .subnav{
  gap:var(--impeccable-space-1)!important;
  margin-top:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .row,
html[data-ui="liquid-glass-v2"] body .choice2,
html[data-ui="liquid-glass-v2"] body .choice3,
html[data-ui="liquid-glass-v2"] body .choice4,
html[data-ui="liquid-glass-v2"] body .grid5,
html[data-ui="liquid-glass-v2"] body .rpe,
html[data-ui="liquid-glass-v2"] body .stopwatch-controls{
  gap:var(--impeccable-space-2)!important;
  align-items:stretch!important;
}

html[data-ui="liquid-glass-v2"] body .choice2 button,
html[data-ui="liquid-glass-v2"] body .choice3 button,
html[data-ui="liquid-glass-v2"] body .choice4 button,
html[data-ui="liquid-glass-v2"] body .grid5 button,
html[data-ui="liquid-glass-v2"] body .rpe button,
html[data-ui="liquid-glass-v2"] body .stopwatch-controls button{
  min-width:0!important;
  min-height:var(--impeccable-control-standard)!important;
}

html[data-ui="liquid-glass-v2"] body .flow-tab,
html[data-ui="liquid-glass-v2"] body .subnav-tab{
  min-width:0!important;
  min-height:44px!important;
  padding:var(--impeccable-space-2) var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .button{
  min-height:var(--impeccable-control-standard)!important;
  margin-top:var(--impeccable-space-4)!important;
  padding:var(--impeccable-space-3) var(--impeccable-space-4)!important;
}

html[data-ui="liquid-glass-v2"] body .training-actuals-card{
  gap:var(--impeccable-space-4)!important;
}

html[data-ui="liquid-glass-v2"] body .training-actuals-card label{
  gap:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .training-actuals-card .button{
  margin-top:0!important;
}

html[data-ui="liquid-glass-v2"] body .actual-checkin-edit,
html[data-ui="liquid-glass-v2"] body .training-flow-step button{
  min-height:var(--impeccable-control-standard)!important;
}

html[data-ui="liquid-glass-v2"] body .actual-checkin-edit{
  margin-top:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .training-flow-step button{
  margin-top:var(--impeccable-space-3)!important;
  padding:var(--impeccable-space-2) var(--impeccable-space-4)!important;
}

html[data-ui="liquid-glass-v2"] body .next-date-nav{
  grid-template-columns:var(--impeccable-control-compact) minmax(0,1fr) var(--impeccable-control-compact)!important;
  gap:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .next-arrow,
html[data-ui="liquid-glass-v2"] body .refresh-plan,
html[data-ui="liquid-glass-v2"] body .mini-back{
  width:var(--impeccable-control-compact)!important;
  min-width:var(--impeccable-control-compact)!important;
  height:var(--impeccable-control-compact)!important;
  min-height:var(--impeccable-control-compact)!important;
}

html[data-ui="liquid-glass-v2"] body .next-date-button{
  min-height:var(--impeccable-control-compact)!important;
  padding:var(--impeccable-space-1) 0!important;
}

html[data-ui="liquid-glass-v2"] body .hero-start,
html[data-ui="liquid-glass-v2"] body .hero-view{
  width:min(70%,264px)!important;
  min-height:44px!important;
  margin-top:var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .text-link{
  min-height:32px!important;
  padding:var(--impeccable-space-1) var(--impeccable-space-2)!important;
}

html[data-ui="liquid-glass-v2"] body .week-strip{
  gap:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .week-legend{
  gap:var(--impeccable-space-2) var(--impeccable-space-3)!important;
  margin-top:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-panel{
  margin-top:var(--impeccable-space-3)!important;
  padding:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-head{
  gap:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:var(--impeccable-space-2)!important;
  margin-top:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-actions button{
  min-width:0!important;
  min-height:44px!important;
}

html[data-ui="liquid-glass-v2"] body .stopwatch-mini{
  gap:var(--impeccable-space-2)!important;
  padding:var(--impeccable-space-2) var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .bottom{
  gap:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .bottom .nav{
  min-width:0!important;
  min-height:var(--impeccable-control-standard)!important;
  padding:var(--impeccable-space-1)!important;
}

html[data-ui="liquid-glass-v2"] body .day-summary{
  margin:var(--impeccable-space-2) 0 var(--impeccable-space-4)!important;
}

html[data-ui="liquid-glass-v2"] body .day-exercise{
  margin-top:var(--impeccable-space-3)!important;
}

html[data-ui="liquid-glass-v2"] body .training-flow-step{
  margin:var(--impeccable-space-2) 0 var(--impeccable-space-4)!important;
}

@media(max-width:430px){
  html[data-ui="liquid-glass-v2"] body,
  html[data-ui="liquid-glass-v2"] body .app-atmosphere{
    background-position:center top!important;
    background-size:cover!important;
  }
}

@media(max-width:370px){
  html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html[data-ui="liquid-glass-v2"] body .exercise-stopwatch-actions button:last-child{
    grid-column:1/-1!important;
  }
}

/* Preserve the compact one-screen home at short viewport heights. */
@media(max-height:780px){
  html[data-ui="liquid-glass-v2"] body .mockup-home{
    gap:var(--impeccable-space-1)!important;
  }
  html[data-ui="liquid-glass-v2"] body .week-card,
  html[data-ui="liquid-glass-v2"] body .phase-card{
    margin-top:var(--impeccable-space-1)!important;
  }
  html[data-ui="liquid-glass-v2"] body .hero-start,
  html[data-ui="liquid-glass-v2"] body .hero-view{
    min-height:var(--impeccable-control-compact)!important;
    margin-top:var(--impeccable-space-1)!important;
  }
}

@media(max-height:690px){
  html[data-ui="liquid-glass-v2"] body .hero-start,
  html[data-ui="liquid-glass-v2"] body .hero-view{
    min-height:36px!important;
  }
}
