/* BPF CLEAN4.4.2 — responsive active-workout cockpit.
   Presentation only: preserves the existing DOM, control IDs, timers, audio,
   navigation handlers, and completion behavior. */

body.bpf-workout-player #active.on .player-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(220px,280px)!important;
  gap:12px!important;
  align-items:start!important;
}

body.bpf-workout-player #active.on .current-panel{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:8px!important;
  padding:12px!important;
}

body.bpf-workout-player #active.on .now{
  grid-column:1 / -1;
  grid-row:1;
  min-width:0;
  margin:0!important;
}

body.bpf-workout-player #active.on .now .status,
body.bpf-workout-player #active.on .now .pill{
  font-size:12px!important;
  line-height:1!important;
}

body.bpf-workout-player #active.on .now .pill{
  min-height:0!important;
  padding:7px 10px!important;
}

body.bpf-workout-player #active.on .big-name{
  grid-column:1 / -1;
  grid-row:2;
  min-width:0;
  margin:0!important;
  font-size:clamp(30px,4vw,48px)!important;
  line-height:.95!important;
  overflow-wrap:anywhere;
}

body.bpf-workout-player #active.on .big-img{
  grid-column:1 / 8;
  grid-row:3 / 7;
  width:100%!important;
  height:clamp(230px,40dvh,390px)!important;
  min-height:0!important;
  max-height:none!important;
  padding:5px!important;
  border-radius:16px!important;
}

body.bpf-workout-player #active.on #activeLibraryLink,
body.bpf-workout-player #active.on #bpf-active-swap-btn{
  grid-row:7;
  width:100%!important;
  min-width:0!important;
  min-height:42px!important;
  margin:0!important;
  padding:8px 10px!important;
  font-size:12px!important;
  line-height:1.12!important;
  text-align:center!important;
  white-space:normal!important;
}

body.bpf-workout-player #active.on #activeLibraryLink{grid-column:1 / 5;}
body.bpf-workout-player #active.on #bpf-active-swap-btn{grid-column:5 / 8;}

body.bpf-workout-player #active.on .meta{
  grid-column:8 / -1;
  grid-row:3;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  min-width:0;
  margin:0!important;
}

body.bpf-workout-player #active.on .meta span{
  min-width:0!important;
  padding:8px 7px!important;
  font-size:12px!important;
  line-height:1.05!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}

body.bpf-workout-player #active.on #repInfo{
  grid-column:1 / -1!important;
  order:-1!important;
  min-width:0!important;
  padding:9px 7px!important;
  font-size:clamp(16px,2vw,20px)!important;
}

body.bpf-workout-player #active.on #cue{
  grid-column:8 / -1;
  grid-row:4;
  min-width:0;
  min-height:42px;
  margin:0!important;
  padding:8px 9px!important;
  font-size:13px!important;
  line-height:1.28!important;
  overflow-wrap:anywhere;
}

body.bpf-workout-player #active.on .bpf-target-line{
  margin:0 0 5px!important;
  padding:5px 7px!important;
  font-size:12px!important;
}

body.bpf-workout-player #active.on #timer{
  grid-column:8 / -1;
  grid-row:5;
  align-self:center;
  min-width:0;
  margin:2px 0!important;
  font-size:clamp(50px,7dvh,76px)!important;
  line-height:.88!important;
}

body.bpf-workout-player #active.on .control-row,
body.bpf-workout-player #active.on .control-row.g6-adaptive-controls,
body.bpf-workout-player #active.on .control-row.g6-legacy-controls{
  grid-column:8 / -1;
  grid-row:6 / 8;
  align-self:end;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
  min-width:0;
  margin:0!important;
}

body.bpf-workout-player #active.on .control-row .btn{
  min-width:0!important;
  min-height:44px!important;
  padding:8px 7px!important;
  font-size:12px!important;
  line-height:1.12!important;
  text-align:center!important;
  white-space:normal!important;
}

body.bpf-workout-player #active.on .player-layout > aside{
  display:grid;
  gap:10px;
  min-width:0;
}

body.bpf-workout-player #active.on .player-layout > aside > .next-card{
  min-width:0;
  margin-top:0!important;
  padding:10px!important;
  border-radius:16px!important;
}

body.bpf-workout-player #active.on .player-layout > aside > .next-card:first-child > h3:first-child{
  margin:0 0 7px!important;
  font-size:23px!important;
  line-height:1!important;
}

body.bpf-workout-player #active.on #nextImg{
  width:100%!important;
  height:clamp(120px,20dvh,180px)!important;
  padding:4px!important;
  border-radius:12px!important;
}

body.bpf-workout-player #active.on #nextName{
  margin:8px 0 3px!important;
  font-size:18px!important;
  line-height:1.05!important;
  overflow-wrap:anywhere;
}

body.bpf-workout-player #active.on #nextMeta,
body.bpf-workout-player #active.on #elapsed{
  margin:0!important;
  font-size:12px!important;
  line-height:1.25!important;
}

body.bpf-workout-player #active.on .player-layout > aside > .next-card:nth-child(2) > h3{
  margin:0 0 7px!important;
  font-size:20px!important;
  line-height:1!important;
}

body.bpf-workout-player #active.on .log-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:5px!important;
  margin:0 0 6px!important;
}

body.bpf-workout-player #active.on .log-grid input{
  min-width:0!important;
  padding:8px 6px!important;
  font-size:12px!important;
}

@supports selector(body:has(#active.on)){
  body.bpf-workout-player:has(#active.on) .page{
    width:100%!important;
    max-width:1280px!important;
    padding:8px 12px calc(84px + env(safe-area-inset-bottom,0px))!important;
  }

  body.bpf-workout-player:has(#active.on) .topbar,
  body.bpf-workout-player:has(#active.on) .bpf-theme-switch{
    display:none!important;
  }
}

@media(max-width:760px){
  body.bpf-workout-player #active.on .player-layout{
    grid-template-columns:1fr!important;
    gap:7px!important;
  }

  body.bpf-workout-player #active.on .current-panel{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:6px!important;
    padding:8px!important;
    border-radius:16px!important;
  }

  body.bpf-workout-player #active.on .now{grid-column:1 / -1;grid-row:1;}

  body.bpf-workout-player #active.on .big-name{
    grid-column:1 / -1;
    grid-row:2;
    font-size:clamp(26px,8vw,34px)!important;
  }

  body.bpf-workout-player #active.on .big-img{
    grid-column:1 / -1;
    grid-row:3;
    height:clamp(160px,25dvh,230px)!important;
    border-radius:13px!important;
  }

  body.bpf-workout-player #active.on #activeLibraryLink,
  body.bpf-workout-player #active.on #bpf-active-swap-btn{
    grid-row:4;
    min-height:42px!important;
    padding:7px 6px!important;
    font-size:11px!important;
  }

  body.bpf-workout-player #active.on #activeLibraryLink{grid-column:1 / 4;}
  body.bpf-workout-player #active.on #bpf-active-swap-btn{grid-column:4 / -1;}

  body.bpf-workout-player #active.on .meta{
    grid-column:1 / -1;
    grid-row:5;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }

  body.bpf-workout-player #active.on .meta span,
  body.bpf-workout-player #active.on #repInfo{
    grid-column:auto!important;
    order:0!important;
    min-width:0!important;
    padding:7px 4px!important;
    font-size:clamp(10px,3vw,13px)!important;
    line-height:1.08!important;
  }

  body.bpf-workout-player #active.on #cue{
    grid-column:1 / -1;
    grid-row:6;
    min-height:38px;
    padding:7px 8px!important;
    font-size:clamp(11px,3.1vw,13px)!important;
    line-height:1.22!important;
  }

  body.bpf-workout-player #active.on .bpf-target-line{
    display:inline;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }

  body.bpf-workout-player #active.on #timer{
    grid-column:1 / -1;
    grid-row:7;
    margin:0!important;
    font-size:clamp(48px,13vw,62px)!important;
  }

  body.bpf-workout-player #active.on .control-row,
  body.bpf-workout-player #active.on .control-row.g6-adaptive-controls,
  body.bpf-workout-player #active.on .control-row.g6-legacy-controls{
    grid-column:1 / -1;
    grid-row:8;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }

  body.bpf-workout-player #active.on .control-row .btn{
    min-height:44px!important;
    font-size:12px!important;
  }

  body.bpf-workout-player #active.on .player-layout > aside{
    gap:7px;
  }

  body.bpf-workout-player #active.on .player-layout > aside > .next-card{
    padding:8px!important;
    border-radius:14px!important;
  }

  body.bpf-workout-player #active.on .player-layout > aside > .next-card:first-child{
    display:grid!important;
    grid-template-columns:82px minmax(0,1fr)!important;
    grid-template-rows:auto auto 1fr!important;
    column-gap:9px!important;
    row-gap:2px!important;
    align-items:center!important;
  }

  body.bpf-workout-player #active.on .player-layout > aside > .next-card:first-child > h3:first-child{
    grid-column:2;
    grid-row:1;
    margin:0!important;
    font-size:16px!important;
  }

  body.bpf-workout-player #active.on #nextImg{
    grid-column:1;
    grid-row:1 / 4;
    width:82px!important;
    height:72px!important;
  }

  body.bpf-workout-player #active.on #nextName{
    grid-column:2;
    grid-row:2;
    margin:0!important;
    font-size:15px!important;
  }

  body.bpf-workout-player #active.on #nextMeta{
    grid-column:2;
    grid-row:3;
    font-size:11px!important;
  }

  body.bpf-workout-player #active.on .player-layout > aside > .next-card:nth-child(2){
    padding:7px 8px!important;
  }

  body.bpf-workout-player #active.on .player-layout > aside > .next-card:nth-child(2) > h3{
    margin:0 0 5px!important;
    font-size:15px!important;
  }

  body.bpf-workout-player #active.on .log-grid input{
    min-height:36px!important;
    padding:6px 5px!important;
  }

  @supports selector(body:has(#active.on)){
    body.bpf-workout-player:has(#active.on) .page{
      padding:4px 8px calc(68px + env(safe-area-inset-bottom,0px))!important;
    }
  }
}

@media(max-height:700px) and (min-width:761px){
  body.bpf-workout-player #active.on .big-img{height:clamp(205px,34dvh,270px)!important;}
  body.bpf-workout-player #active.on .current-panel{padding:9px!important;gap:6px!important;}
  body.bpf-workout-player #active.on #nextImg{height:120px!important;}
}

@media(max-width:380px){
  body.bpf-workout-player #active.on .big-img{height:155px!important;}
  body.bpf-workout-player #active.on .big-name{font-size:24px!important;}
  body.bpf-workout-player #active.on #activeLibraryLink,
  body.bpf-workout-player #active.on #bpf-active-swap-btn{font-size:10px!important;}
  body.bpf-workout-player #active.on .control-row .btn{font-size:11px!important;}
}

@media(prefers-reduced-motion:reduce){
  body.bpf-workout-player #active.on *{scroll-behavior:auto!important;}
}