/* RIFFELO 8.0-RC2.30aq-LYR1a2-LA2 — LOOK-A, presentation only.
   Scoped to existing header, Manager and Chart. No new navigation shell,
   no player changes, no data/behaviour changes. Load AFTER legacy styles.
   Northstar: target-mockups/0-PRIMARY-TARGET-dev-mockup.png.
   Primary artwork is the ACTUAL artist's existing image, never a fixture.
*/
:root{
  --la-ink:#0A0B10;
  --la-surface:#111216;
  --la-deep:#09090C;
  --la-line:rgba(244,245,251,.12);
  --la-strong:#F4F5FB;
  --la-muted:#B9BEDA;
  --la-dim:#A0A4B3;
  --la-pink:var(--pink,#E63E94);
}

/* A1 — restrained shared application chrome; DO NOT replace the existing nav. */
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header){
  background:rgba(9,9,12,.98)!important;
  border-bottom:1px solid var(--la-line)!important;
  box-shadow:none!important;
  backdrop-filter:none;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav{
  gap:4px;align-items:center;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav>button:not(.desktop-create-action){
  color:var(--la-muted);background:transparent!important;border-color:transparent!important;
  box-shadow:none!important;min-height:44px;font-weight:600;border-radius:10px;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav>button.active:not(.desktop-create-action){
  color:var(--la-strong)!important;background:rgba(255,255,255,.07)!important;
  box-shadow:inset 0 -2px 0 var(--la-pink)!important;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-create-action{
  background:var(--la-pink)!important;border:1px solid transparent!important;
  box-shadow:none!important;color:#fff!important;border-radius:10px!important;
  min-height:44px;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .profile-button{
  border-color:var(--la-line)!important;background:transparent!important;
  box-shadow:none!important;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) .profile-button img{
  box-shadow:none!important;border-color:var(--la-line)!important;
}
:is(body:has(.manager-page),body:has(.chart-page)) .app-header:not(.sl-app-header):not(.artist-studio-app-header) button:focus-visible,
.manager-page button:focus-visible,.chart-page button:focus-visible{
  outline:2px solid var(--la-pink)!important;outline-offset:3px!important;
}

/* A2 — Manager editorial workspace. The pre-existing five metrics remain real. */
.manager-page{
  background:var(--la-deep)!important;color:var(--la-strong)!important;
  --aq-pink:var(--la-pink);--aq-violet:var(--la-pink);
  --aq-blue:var(--la-pink);--aq-amber:var(--la-muted);
  --aq-glass:var(--la-surface);--aq-ink:var(--la-ink);
  --mkpi-bg:var(--la-surface);--mkpi-border:var(--la-line);
  --mkpi-secondary:var(--la-muted);
}
.manager-page .manager-shell{max-width:1200px!important;gap:20px!important}
.manager-page .manager-top-strip{min-height:60px;gap:16px}
.manager-page .manager-artist-trigger,
.manager-page .manager-top-strip .manager-credits{
  background:var(--la-surface)!important;border:1px solid var(--la-line)!important;
  border-radius:10px!important;box-shadow:none!important;
}
.manager-page .manager-artist-trigger{min-height:48px}
.manager-page .manager-artist-options{background:var(--la-surface)!important;border-color:var(--la-line)!important}
.manager-page .manager-top-strip .manager-credits{min-height:60px;padding:9px 16px!important}
.manager-page .manager-top-strip .manager-credits strong{font-size:18px!important}
.manager-page .manager-top-strip .manager-credits small{color:var(--la-dim)!important}
.manager-page .manager-top-strip>.eyebrow{color:var(--la-dim)!important}
.manager-page .mkpi-hero-wrap{
  border-radius:18px!important;overflow:hidden!important;
  border:1px solid var(--la-line)!important;
  box-shadow:none!important;background:var(--la-surface)!important;
}
.manager-page .mkpi-hero-wrap .manager-hero{
  display:grid!important;position:relative!important;isolation:isolate;
  overflow:hidden!important;min-width:0;
  background:var(--la-ink)!important;
  border:0!important;border-radius:18px 18px 0 0!important;
  box-shadow:none!important;
}
/* Use the current stage image; never replace it with invented artwork. */
.manager-page .mkpi-hero-wrap .manager-hero-banner{
  position:absolute!important;inset:0 0 0 auto!important;
  width:min(45%,384px)!important;height:100%!important;
  opacity:.79!important;object-fit:cover!important;
  object-position:center 32%!important;filter:none!important;
  z-index:-2!important;pointer-events:none;
}
.manager-page .mkpi-hero-wrap .manager-hero:before{
  content:""!important;position:absolute;inset:0!important;
  background:linear-gradient(90deg,var(--la-ink) 0%,rgba(10,11,16,.94) 34%,rgba(10,11,16,.42) 78%,rgba(10,11,16,.18) 100%)!important;
  z-index:-1!important;opacity:1!important;pointer-events:none!important;
}
.manager-page .mkpi-hero-wrap .manager-hero:after{display:none!important}
.manager-page .mkpi-hero-wrap .manager-hero-copy{position:relative!important;z-index:1!important;min-width:0!important}
.manager-page .mkpi-hero-wrap .manager-hero-copy>.eyebrow{color:var(--la-muted)!important}
.manager-page .mkpi-hero-wrap .manager-hero-copy h1{
  color:var(--la-strong)!important;font-weight:750!important;
  letter-spacing:-.055em!important;line-height:1.06!important;
  text-shadow:0 2px 14px rgba(0,0,0,.12);
}
.manager-page .mkpi-hero-wrap .manager-hero-copy>.manager-status{
  color:var(--la-muted)!important;margin:8px 0!important;font-size:14px;
}
.manager-page .manager-genre-row em,.manager-page .manager-dna-details span{
  color:var(--la-muted)!important;background:rgba(9,9,12,.34)!important;
  border:1px solid rgba(244,245,251,.28)!important;box-shadow:none!important;
}
.manager-page .mkpi-hero-wrap .manager-quick-actions button{
  min-height:44px!important;border:1px solid rgba(244,245,251,.22)!important;
  border-radius:10px!important;background:rgba(10,11,16,.70)!important;
  color:var(--la-strong)!important;box-shadow:none!important;
  padding-inline:14px!important;font-size:13px!important;
}
.manager-page .mkpi-hero-wrap .manager-quick-actions button:hover{background:rgba(255,255,255,.13)!important}
.manager-page .mkpi-hero-wrap .manager-hero-create{
  min-height:48px!important;padding:12px 20px!important;border:0!important;
  border-radius:10px!important;background:var(--la-pink)!important;
  box-shadow:none!important;color:white!important;font-size:14px!important;
}
.manager-page .mkpi-hero-wrap .mkpi-tabs{
  position:relative!important;inset:auto!important;display:flex!important;
  width:100%!important;min-height:48px!important;height:auto!important;
  padding:0 16px!important;border-top:1px solid var(--la-line)!important;
  background:rgba(9,9,12,.96)!important;box-shadow:none!important;
  z-index:4!important;overflow-x:auto!important;
}
.manager-page .mkpi-hero-wrap .mkpi-tabs button{
  flex:0 1 128px!important;min-height:48px!important;height:auto!important;
  color:var(--la-muted)!important;border:0!important;
  border-bottom:2px solid transparent!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  font-size:14px!important;font-weight:600!important;
}
.manager-page .mkpi-hero-wrap .mkpi-tabs button.is-active{
  color:var(--la-strong)!important;border-bottom-color:var(--la-pink)!important;
}
.manager-page .mkpi-panel,
.manager-page .manager-card:not(.manager-hero){
  background:var(--la-surface)!important;border:1px solid var(--la-line)!important;
  border-radius:18px!important;box-shadow:none!important;
}
.manager-page .mkpi-panel{padding:20px 22px!important;gap:16px!important}
.manager-page .mkpi-heading{border-bottom:1px solid var(--la-line);padding-bottom:12px}
.manager-page .mkpi-heading h2,.manager-page .manager-heading h2{
  font-weight:650!important;font-size:18px!important;color:var(--la-strong)!important;
}
.manager-page .mkpi-clock{color:var(--la-muted)!important;font-size:13px!important}
.manager-page .mkpi-live{font-size:12px!important;font-weight:600!important;
  background:transparent!important;color:var(--la-muted)!important;padding:4px 0!important;
  display:inline-flex;align-items:center;gap:7px;border-radius:0!important;
}
.manager-page .mkpi-live:before{content:"";display:block;width:7px;height:7px;
  border-radius:999px;background:var(--la-pink)}
/* 5 actual metrics, not four invented or hidden figures. */
.manager-page .mkpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;
  border-top:0!important;border-bottom:1px solid var(--la-line)}
.manager-page .mkpi-grid .mkpi-tile{
  display:flex!important;flex-direction:column!important;justify-content:center!important;
  gap:7px!important;min-width:0!important;min-height:112px!important;
  height:auto!important;padding:12px 14px!important;border:0!important;
  border-right:1px solid var(--la-line)!important;border-bottom:0!important;
  border-radius:0!important;background:none!important;box-shadow:none!important;
}
.manager-page .mkpi-grid .mkpi-tile:last-child{border-right:0!important}
.manager-page .mkpi-grid .mkpi-value{font-size:clamp(25px,2.8vw,36px)!important;
  font-weight:650!important;letter-spacing:-.04em!important;
  color:var(--la-strong)!important;line-height:1.12!important;
  white-space:normal!important;overflow-wrap:anywhere!important}
.manager-page .mkpi-grid .mkpi-label{font-size:13px!important;font-weight:500!important;
  color:var(--la-muted)!important;line-height:1.35!important;
  margin-top:auto!important;display:flex!important;align-items:center!important;gap:7px!important}
.manager-page .mkpi-grid .mkpi-label svg{width:16px!important;height:16px!important;
  min-width:16px!important;min-height:16px!important;stroke:var(--la-muted)!important}
.manager-page .mkpi-grid .mkpi-comparison,.manager-page .mkpi-movement,
.manager-page .mkpi-position-delta{color:var(--la-muted)!important;font-size:12px!important}
.manager-page .mkpi-grid .mkpi-info{color:var(--la-muted)!important;border-color:var(--la-line)!important}
.manager-page .mkpi-alltime .mkpi-value{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important}
.manager-page .mkpi-alltime .mkpi-value strong{font-size:22px!important}
.manager-page .mkpi-alltime-record{border-color:var(--la-line)!important}
.manager-page .mkpi-chip,
.manager-page .manager-stats>div{
  background:var(--la-ink)!important;border:1px solid var(--la-line)!important;
  border-radius:10px!important;box-shadow:none!important;
}
.manager-page .mkpi-chip-cover{box-shadow:none!important;border-color:var(--la-line)!important}
.manager-page .mkpi-overview-body{gap:20px!important}
.manager-page .mkpi-overview-columns{gap:20px!important}
.manager-page .mkpi-latest-feature{overflow:hidden!important;box-shadow:none!important}
.manager-page .mkpi-latest-feature .mkpi-release-actions .primary-cta{
  background:var(--la-pink)!important;border-radius:10px!important;box-shadow:none!important;
}
.manager-page .mkpi-latest-feature .mkpi-cover-play{background:rgba(9,9,12,.79)!important;
  border:1px solid rgba(255,255,255,.52)!important;box-shadow:none!important}
/* Existing milestone labels and progress flags are preserved. */
.manager-page .manager-career .manager-milestones{gap:8px!important}
.manager-page .manager-career .manager-milestone>span{
  width:30px!important;height:30px!important;border:1px solid var(--la-line)!important;
  background:transparent!important;color:var(--la-muted)!important;
  border-radius:999px!important;box-shadow:none!important;
}
.manager-page .manager-career .manager-milestone.done:not(.official-first)>span{
  color:var(--la-strong)!important;border-color:var(--la-pink)!important;
}
/* Official #1 remains the only existing gold distinction; no gold decorations added. */
.manager-page .manager-career .manager-milestone.official-first>span{color:#E8C068!important;border-color:#E8C068!important}
.manager-page .manager-career .manager-milestone small{color:var(--la-muted)!important;font-size:12px!important}
.manager-page .manager-messages-panel,.manager-page .manager-achievements,.manager-page .manager-dna{box-shadow:none!important}
.manager-page .mkpi-bottom-duo{gap:16px!important}

/* A3 — neutral, music-first chart. Keep every existing data/control and layout tier. */
.chart-page,.chart-page.atmo-chart{
  background:var(--la-deep)!important;color:var(--la-strong)!important;
  --chart-control-bg:var(--la-surface);--chart-control-border:var(--la-line);
  --chart-neutral:var(--la-strong);--chart-vote:var(--la-pink);
  --chart-play:var(--la-ink);
}
.chart-page .chart-editorial-shell{max-width:1200px!important}
.chart-page .chart-hero{padding:12px 8px 18px!important}
.chart-page .chart-hero .eyebrow{color:var(--la-muted)!important}
.chart-page .chart-hero h1{color:var(--la-strong)!important;
  font-weight:700!important;letter-spacing:-.045em!important}
.chart-page .chart-hero p{color:var(--la-muted)!important}
.chart-page .chart-board,.chart-page .chart-pulse,
.chart-page .chart-highlights,.chart-page .chart-side .manager-card{
  background:var(--la-surface)!important;border:1px solid var(--la-line)!important;
  border-radius:18px!important;box-shadow:none!important;
}
.chart-page .chart-board-nav{background:var(--la-surface)!important;
  border-bottom:1px solid var(--la-line)!important}
.chart-page .chart-mode-toggle{background:transparent!important;box-shadow:none!important;
  border:0!important;border-radius:0!important}
.chart-page .chart-mode-toggle button{color:var(--la-muted)!important;border:0!important;
  border-bottom:2px solid transparent!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  min-height:48px!important;font-size:14px!important;font-weight:600!important;
}
.chart-page .chart-mode-toggle button.active{color:var(--la-strong)!important;
  border-bottom-color:var(--la-pink)!important}
.chart-page .chart-close{border-left:1px solid var(--la-line)!important;color:var(--la-muted)!important}
.chart-page .chart-close small,.chart-page .chart-close strong,
.chart-page .chart-close b{color:var(--la-muted)!important;background:none!important;
  border-color:var(--la-line)!important;font-weight:600!important}
.chart-page .chart-tier-heading,.chart-page .chart-chase-separator,
.chart-page .chart-table-head,.chart-page .chart-chase-head{
  background:var(--la-ink)!important;color:var(--la-muted)!important;
  border-color:var(--la-line)!important;box-shadow:none!important;
}
.chart-page .chart-tier-heading span,.chart-page .chart-chase-separator span{
  color:var(--la-strong)!important;
}
.chart-page .chart-chase-separator h2{color:var(--la-strong)!important}
.chart-page .chart-chase-separator p{color:var(--la-muted)!important}
.chart-page .chart-leader{
  background:var(--la-surface)!important;border-color:var(--la-line)!important;
  box-shadow:none!important;border-radius:0!important;
}
.chart-page .chart-leader-rank{border-color:var(--la-line)!important}
.chart-page .chart-leader-rank b{color:var(--la-strong)!important;font-weight:650!important}
.chart-page .chart-leader-main{color:var(--la-strong)!important}
.chart-page .chart-leader-copy>strong{font-weight:650!important}
.chart-page .chart-leader-copy em{color:var(--la-muted)!important}
.chart-page .chart-leader-play{background:var(--la-ink)!important;border:1px solid var(--la-line)!important}
.chart-page .chart-leader-stats>span{border-color:var(--la-line)!important}
.chart-page .chart-leader-stats small{color:var(--la-muted)!important}
.chart-page .chart-leader-stats b{color:var(--la-strong)!important}
.chart-page .chart-row,.chart-page .chart-chase-row,
.chart-page .chart-history-row{
  background:var(--la-surface)!important;border-bottom:1px solid var(--la-line)!important;
  border-radius:0!important;box-shadow:none!important;
}
.chart-page .chart-row:hover,.chart-page .chart-chase-row:hover{
  background:rgba(244,245,251,.05)!important;
}
.chart-page .chart-position,.chart-page .chart-track strong,
.chart-page .chart-chase-track .chart-track strong{color:var(--la-strong)!important;font-weight:600!important}
.chart-page .chart-track small,.chart-page .chart-track em,
.chart-page .chart-stat,.chart-page .chart-chase-stat small{
  color:var(--la-muted)!important;
}
.chart-page .chart-row-actions button,.chart-page .chart-chase-actions button,
.chart-page .chart-leader-actions button,.chart-page .history-actions button{
  background:var(--la-ink)!important;border:1px solid var(--la-line)!important;
  border-radius:10px!important;box-shadow:none!important;color:var(--la-strong)!important;
}
.chart-page .chart-row-actions .vote-button,.chart-page .chart-chase-actions .vote-button,
.chart-page .chart-leader-actions .vote-button{color:var(--la-pink)!important}
.chart-page .chart-leader-actions .chart-leader-action-pill{min-height:44px!important}
.chart-page .chart-row-play,.chart-page .chart-chase-play,
.chart-page .history-actions .history-play{
  background:var(--la-ink)!important;border:1px solid var(--la-line)!important;
  box-shadow:none!important;color:var(--la-strong)!important;
}
.chart-page .chart-pulse-head{border-bottom-color:var(--la-line)!important}
.chart-page .chart-pulse-head h3{color:var(--la-strong)!important}
.chart-page .chart-pulse-grid>span{background:var(--la-ink)!important;border-color:var(--la-line)!important}
.chart-page .chart-highlights>div{border-bottom-color:var(--la-line)!important}
.chart-page .chart-aspiration{background:var(--la-surface)!important;border-color:var(--la-line)!important}

@media(min-width:801px){
  .manager-page .mkpi-hero-wrap .manager-hero{
    height:auto!important;min-height:365px!important;
    grid-template-columns:minmax(0,1fr)!important;
    padding:76px 40px 30px!important;align-items:end!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-portrait{display:none!important}
  .manager-page .mkpi-hero-wrap .manager-hero-copy{
    grid-area:1/1!important;display:flex!important;flex-direction:column!important;
    align-items:flex-start!important;justify-content:end!important;
    width:100%!important;max-width:100%!important;padding:0 210px 0 0!important;
    margin:0!important;gap:8px!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy h1{font-size:clamp(54px,6vw,88px)!important}
  .manager-page .mkpi-hero-wrap .manager-quick-actions{margin-top:8px!important;gap:8px!important}
  .manager-page .mkpi-hero-wrap .manager-hero-create{position:absolute!important;
    right:24px!important;top:24px!important;z-index:3!important}
  .manager-page .mkpi-latest-feature .mkpi-feature-row,
  .manager-page .mkpi-latest-feature .mkpi-release-art,
  .manager-page .mkpi-latest-feature .manager-art{min-height:248px!important}
}
@media(max-width:1100px) and (min-width:801px){
  .manager-page .mkpi-hero-wrap .manager-hero-copy{padding-right:110px!important}
  .manager-page .mkpi-hero-wrap .manager-hero-copy h1{font-size:clamp(48px,6vw,70px)!important}
  .manager-page .mkpi-grid .mkpi-tile{padding:12px 9px!important}
  .manager-page .mkpi-grid .mkpi-value{font-size:28px!important}
}
@media(max-width:800px){
  /* Preserve existing phone navigation/player: LOOK-B is not built. */
  .manager-page{padding:18px 16px 100px!important}
  .manager-page .manager-top-strip{gap:8px}
  .manager-page .manager-artist-picker{flex:1 1 128px}
  .manager-page .manager-top-strip .manager-credits{padding:7px 10px!important}
  .manager-page .manager-top-strip .manager-credits strong{font-size:14px!important}
  .manager-page .mkpi-hero-wrap .manager-hero{
    height:auto!important;min-height:200px!important;
    display:grid!important;grid-template-columns:64px minmax(0,1fr)!important;
    align-items:start!important;padding:16px!important;gap:12px!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-banner{width:min(60%,240px)!important;opacity:.28!important}
  .manager-page .mkpi-hero-wrap .manager-hero-portrait{
    display:block!important;grid-column:1!important;width:64px!important;height:76px!important;
    border-radius:12px!important;border:1px solid var(--la-line)!important;
    box-shadow:none!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy{
    display:contents!important;padding-right:0!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy>.eyebrow{display:none!important}
  .manager-page .mkpi-hero-wrap .manager-hero-copy>h1{
    grid-column:2!important;grid-row:1!important;align-self:start;
    font-size:clamp(26px,7vw,37px)!important;line-height:1.1!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy>.manager-status,
  .manager-page .mkpi-hero-wrap .manager-hero-copy>.manager-genre-row{
    grid-column:2!important;margin:0!important;
  }
  .manager-page .mkpi-hero-wrap .manager-quick-actions{
    grid-column:1/-1!important;display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;
    margin-top:8px!important;width:100%!important;
  }
  .manager-page .mkpi-hero-wrap .manager-quick-actions button{
    min-width:0!important;width:100%!important;white-space:normal!important;
    text-overflow:clip!important;overflow-wrap:anywhere!important;font-size:12px!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-create{
    position:relative!important;grid-column:1/-1!important;
    width:100%!important;top:auto!important;right:auto!important;
    min-height:48px!important;margin-top:8px!important;
  }
  .manager-page .mkpi-hero-wrap .mkpi-tabs{padding:0 4px!important;overflow-x:auto!important}
  .manager-page .mkpi-hero-wrap .mkpi-tabs button{flex:1 1 20%!important;
    min-width:0!important;padding:8px 2px!important;font-size:12px!important}
  .manager-page .mkpi-panel{padding:16px!important}
  .manager-page .mkpi-heading{gap:8px!important}
  .manager-page .mkpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:0!important;border-top:1px solid var(--la-line)}
  .manager-page .mkpi-grid .mkpi-tile{padding:12px!important;min-height:112px!important;
    border-bottom:1px solid var(--la-line)!important}
  .manager-page .mkpi-grid .mkpi-tile:nth-child(even){border-right:0!important}
  .manager-page .mkpi-grid .mkpi-alltime{grid-column:1/-1!important;border-right:0!important}
  .manager-page .mkpi-grid .mkpi-value{font-size:27px!important}
  .manager-page .mkpi-feature-messages,.manager-page .mkpi-overview-columns{grid-template-columns:1fr!important}
  .manager-page .mkpi-release-actions{display:grid!important;grid-template-columns:1fr!important}
  .manager-page .mkpi-release-actions button{min-height:44px!important}
  .manager-page .manager-career .manager-milestones{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .chart-page .chart-editorial-shell{width:calc(100% - 32px)!important;gap:16px!important}
  .chart-page .chart-hero{padding:12px 0!important}
  .chart-page .chart-hero h1{font-size:clamp(38px,8vw,56px)!important}
  .chart-page .chart-board-nav{grid-template-columns:1fr!important}
  .chart-page .chart-close{border-left:0!important;border-top:1px solid var(--la-line)!important;
    flex-wrap:wrap;gap:8px!important}
  .chart-page .chart-leader{border-radius:0!important}
  .chart-page .chart-leader-actions button,.chart-page .chart-row-actions button,
  .chart-page .chart-chase-actions button{min-height:44px!important;min-width:44px!important}
  .chart-page .chart-row,.chart-page .chart-chase-row{border-radius:0!important}
}
@media(max-width:390px){
  .manager-page .mkpi-hero-wrap .manager-hero{padding:12px!important;gap:8px!important}
  .manager-page .mkpi-hero-wrap .manager-hero-copy>h1{font-size:26px!important}
  .manager-page .mkpi-grid .mkpi-tile{padding:10px!important}
  .manager-page .mkpi-grid .mkpi-value{font-size:25px!important}
}
@media(prefers-reduced-motion:reduce){
  .manager-page .mkpi-panel *,.chart-page .chart-board *{animation:none!important;transition:none!important}
}


/* LA2: full-width Manager presentation and consistent shared header on every route.
   Presentation ONLY. Existing top navigation, templates and handlers remain intact.
   No Stage B sidebar, player or navigation changes. */
.app-header {
  background:rgba(9,9,12,.98)!important;
  border-bottom:1px solid var(--la-line)!important;
  box-shadow:none!important;
  backdrop-filter:none;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav {
  align-items:center;
  gap:4px;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav > button:not(.desktop-create-action) {
  min-height:44px;
  background:transparent!important;
  color:var(--la-muted)!important;
  border:0!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-nav > button.active:not(.desktop-create-action) {
  color:var(--la-strong)!important;
  background:rgba(255,255,255,.07)!important;
  box-shadow:inset 0 -2px 0 var(--la-pink)!important;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-create-action {
  min-height:44px;
  background:var(--la-pink)!important;
  color:white!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .profile-button {
  border-color:var(--la-line)!important;
  background:transparent!important;
  box-shadow:none!important;
}
.app-header:not(.sl-app-header):not(.artist-studio-app-header) button:focus-visible {
  outline:2px solid var(--la-pink)!important;
  outline-offset:3px!important;
}
/* Preserve custom Sound Lab and artist-studio layouts, while sharing neutral chrome. */
@media(min-width:801px) {
  .manager-page .manager-shell {
    width:100%!important;
    max-width:1440px!important;
    min-width:0!important;
  }
  .manager-page .mkpi-hero-wrap {
    grid-column:1/-1;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    justify-self:stretch;
  }
  .manager-page .mkpi-hero-wrap .manager-hero {
    width:100%!important;
    min-height:380px!important;
    box-sizing:border-box!important;
  }
  /* Keep low-resolution 384px source imagery at native-width or less. The
     full hero surface is completed with ink/gradient, not interpolated imagery. */
  .manager-page .mkpi-hero-wrap .manager-hero-banner {
    width:min(38%,384px)!important;
    max-width:384px!important;
    object-fit:cover!important;
    filter:none!important;
  }
}
@media(max-width:800px) {
  .manager-page .manager-shell {
    width:100%!important;
    min-width:0!important;
  }
  .manager-page .mkpi-hero-wrap {
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
}

@media(min-width:801px) {
  .manager-page .mkpi-grid .mkpi-tile {
    min-height:146px!important;
    height:auto!important;
  }
  .manager-page .mkpi-grid .mkpi-alltime .mkpi-value {
    gap:3px!important;
    margin:0!important;
  }
  .manager-page .mkpi-grid .mkpi-alltime .mkpi-alltime-record {
    border-top:0!important;
    padding-top:0!important;
    margin:0!important;
  }
  .manager-page .mkpi-grid .mkpi-alltime .mkpi-alltime-record small {
    font-size:12px!important;
    line-height:1.25!important;
    color:var(--la-muted)!important;
  }
}
@media(max-width:800px) {
  .manager-page .mkpi-grid .mkpi-alltime {
    min-height:136px!important;
  }
}

/* BF1: Owner-only historical lyrics review. Does not affect customer screens. */
.admin-console-v2 .bf-list{max-height:min(55vh,650px);overflow:auto;margin:16px 0;border:1px solid var(--line,rgba(255,255,255,.14));border-radius:12px}
.admin-console-v2 .bf-row{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.12)}
.admin-console-v2 .bf-row summary{cursor:pointer;min-height:44px;line-height:1.5;align-content:center}
.admin-console-v2 .bf-row summary small{color:var(--muted,#b9beda);font-size:12px}
.admin-console-v2 .bf-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0}
.admin-console-v2 .bf-columns>div{min-width:0}
.admin-console-v2 .bf-columns pre{max-height:260px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:12px;font:13px/1.6 Inter,sans-serif}
.admin-console-v2 .admin-backfill-actions{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin:18px 0}
.admin-console-v2 .admin-backfill-actions label{display:grid;gap:8px;font-size:14px}
.admin-console-v2 .admin-backfill-actions input{min-height:44px;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.4);background:#111827;color:#fff}
.admin-console-v2 .admin-backfill-actions button{min-height:44px}
@media(max-width:800px){.admin-console-v2 .bf-columns{grid-template-columns:1fr}.admin-console-v2 .bf-row{padding:10px}}

/* LA3b — universal focal framing: use the ACTUAL artist image across the
   full Manager hero, with a consistent face-favouring vertical crop.
   No generated image, artist-specific filename rule, or JS/API/PHP change. */
.manager-page .mkpi-hero-wrap .manager-hero {
  isolation:isolate!important;
  background:#0A0B10!important;
}
.manager-page .mkpi-hero-wrap .manager-hero-banner {
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:62% 32%!important;
  opacity:1!important;
  filter:none!important;
  pointer-events:none!important;
  z-index:-2!important;
}
/* Darker at the text-bearing left and at the bottom, with visible image
   throughout the surface, including behind the name and actions. */
.manager-page .mkpi-hero-wrap .manager-hero::before {
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(90deg, rgba(5,6,11,.92) 0%, rgba(5,6,11,.76) 27%, rgba(5,6,11,.43) 50%, rgba(5,6,11,.06) 100%),
    linear-gradient(0deg, rgba(5,6,11,.90) 0%, rgba(5,6,11,.48) 27%, rgba(5,6,11,.08) 72%, rgba(5,6,11,.30) 100%)!important;
  opacity:1!important;
  z-index:-1!important;
  pointer-events:none!important;
}
.manager-page .mkpi-hero-wrap .manager-hero::after{display:none!important}
.manager-page .mkpi-hero-wrap .manager-hero-portrait{display:none!important}
.manager-page .mkpi-hero-wrap .manager-hero-copy{z-index:1!important}
.manager-page .mkpi-hero-wrap .manager-hero-copy h1,
.manager-page .mkpi-hero-wrap .manager-hero-next h2 {
  color:#FFFFFF!important;
  text-shadow:0 2px 14px rgba(0,0,0,.70)!important;
}
.manager-page .mkpi-hero-wrap .manager-hero-next p,
.manager-page .mkpi-hero-wrap .manager-status,
.manager-page .mkpi-hero-wrap .manager-hero-next .eyebrow {
  color:#F4F5FB!important;
  text-shadow:0 1px 5px rgba(0,0,0,.85)!important;
}
/* Matching tile heights and the same bottom-aligned label track for all 5.
   The fifth tile did not render its pre-existing 'All time' label in JS. */
.manager-page .mkpi-grid .mkpi-tile {
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  min-height:164px!important;
  gap:8px!important;
}
.manager-page .mkpi-grid .mkpi-tile > .mkpi-value {
  flex:0 0 auto!important;
  min-height:45px!important;
  margin:0!important;
}
.manager-page .mkpi-grid .mkpi-tile > .mkpi-comparison {margin:0!important}
.manager-page .mkpi-grid .mkpi-tile > .mkpi-label,
.manager-page .mkpi-grid .mkpi-tile.mkpi-alltime::after {
  box-sizing:border-box!important;
  min-height:36px!important;
  margin-top:auto!important;
  padding:0!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:500!important;
  color:var(--la-muted)!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  white-space:normal!important;
}
.manager-page .mkpi-grid .mkpi-tile.mkpi-alltime::after{
  content:"All time"!important;
  flex:0 0 36px!important;
}
.manager-page .mkpi-grid .mkpi-alltime > .mkpi-value {
  flex:0 0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  min-height:0!important;
  white-space:normal!important;
}
.manager-page .mkpi-grid .mkpi-alltime-count{
  display:flex!important;flex-direction:row!important;
  align-items:baseline!important;gap:7px!important;
}
.manager-page .mkpi-grid .mkpi-alltime-record {
  display:grid!important;
  grid-template-columns:20px auto!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  justify-content:start!important;
  gap:1px 6px!important;
  width:100%!important;
  border:0!important;padding:0!important;margin:0!important;
}
.manager-page .mkpi-grid .mkpi-alltime-record .mkpi-tile-icon{
  grid-column:1!important;grid-row:1!important;
  width:18px!important;height:18px!important;
}
.manager-page .mkpi-grid .mkpi-alltime-record strong{
  grid-column:2!important;grid-row:1!important;
}
.manager-page .mkpi-grid .mkpi-alltime-record small{
  grid-column:1/-1!important;grid-row:2!important;
  white-space:normal!important;line-height:1.3!important;
  font-size:12px!important;
}
@media(max-width:800px) {
  .manager-page .mkpi-hero-wrap .manager-hero {
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-end!important;
    min-height:360px!important;
    height:auto!important;
    gap:0!important;
    padding:22px 16px!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-banner{
    object-position:50% 26%!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero::before{
    background:
      linear-gradient(0deg,rgba(5,6,11,.97) 0%,rgba(5,6,11,.85) 34%,rgba(5,6,11,.24) 73%,rgba(5,6,11,.23) 100%),
      linear-gradient(90deg,rgba(5,6,11,.55) 0%,transparent 90%)!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy {
    display:flex!important;flex-direction:column!important;
    align-items:stretch!important;
    gap:7px!important;
    padding:0!important;
    margin:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-copy > h1,
  .manager-page .mkpi-hero-wrap .manager-hero-copy > .manager-status,
  .manager-page .mkpi-hero-wrap .manager-hero-copy > .manager-genre-row {
    grid-column:auto!important;grid-row:auto!important;
  }
  .manager-page .mkpi-hero-wrap .manager-quick-actions {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;width:100%!important;margin-top:8px!important;
  }
  .manager-page .mkpi-hero-wrap .manager-hero-create {
    position:relative!important;top:auto!important;right:auto!important;
    margin-top:8px!important;width:100%!important;min-height:48px!important;
  }
  .manager-page .mkpi-grid .mkpi-tile{min-height:148px!important}
}
@media(max-width:390px){
  .manager-page .mkpi-hero-wrap .manager-hero{padding:18px 12px!important;min-height:340px!important}
  .manager-page .mkpi-grid .mkpi-tile{min-height:150px!important}
}
/* LA3 tile polish: undo inherited dense letter spacing inside the composite
   fifth value. Only the fifth tile is affected; no metric is renamed. */
.manager-page .mkpi-grid .mkpi-alltime .mkpi-value,
.manager-page .mkpi-grid .mkpi-alltime .mkpi-value * {
  letter-spacing:normal!important;
  word-spacing:normal!important;
}
.manager-page .mkpi-grid .mkpi-alltime-record small {
  display:block!important;
  width:100%!important;
  min-width:0!important;
  line-height:1.5!important;
  font-size:12px!important;
  font-weight:500!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
}
.manager-page .mkpi-grid .mkpi-alltime-count small {
  font-size:12px!important;line-height:1.5!important;
}
/* LA3 contrast: previously white text on #E63E94 was only ~3.83:1.
   Use a darker magenta for white-on-pink primary actions (~4.8:1). */
.app-header:not(.sl-app-header):not(.artist-studio-app-header) .desktop-create-action,
.manager-page .mkpi-hero-wrap .manager-hero-create,
.manager-page .mkpi-hero-wrap .manager-hero-next .primary-cta,
.manager-page .mkpi-latest-feature .mkpi-release-actions .primary-cta {
  background:#D22B7B!important;
  color:#FFFFFF!important;
}



/* BP1 — per-artist crop uses stored, bounded focal coordinates, not filenames. */
.manager-page .mkpi-hero-wrap .manager-hero-banner {object-position:var(--riffelo-banner-desktop,62% 32%)!important}
@media(max-width:800px){.manager-page .mkpi-hero-wrap .manager-hero-banner{object-position:var(--riffelo-banner-mobile,50% 26%)!important}}
.manager-page .mkpi-hero-wrap #managerAdjustBanner{min-height:44px!important}
.banner-position-backdrop{position:fixed;inset:0;z-index:10030;background:rgba(0,0,0,.84);display:flex;align-items:center;justify-content:center;padding:16px;overflow-y:auto}
.banner-position-dialog{width:min(960px,100%);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;background:#10121b;border:1px solid #3c4156;color:#fff;border-radius:20px;padding:22px;box-shadow:0 20px 75px #000b;font-size:14px}
.banner-position-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.banner-position-head h2{font-size:clamp(22px,3vw,28px);line-height:1.2;margin:4px 0 6px;color:#fff}
.banner-position-head p,.banner-position-hint{font-size:14px;line-height:1.5;color:#d4d8e5;margin:0}
.banner-position-head .eyebrow{font-size:12px;color:#f3a5d4}
.banner-position-dialog button{cursor:pointer;color:#fff;border-radius:10px;border:1px solid #64697d;background:#202432;font-size:14px;font-weight:700;min-height:44px;padding:10px 14px}
.banner-position-dialog button:focus-visible,.banner-position-dialog input:focus-visible,.banner-position-preview:focus-visible{outline:3px solid #fc8ccb;outline-offset:3px}
.banner-position-dialog button:disabled{opacity:.6;cursor:wait}
.banner-position-close{width:44px;flex:0 0 44px;font-size:24px!important;line-height:1!important;padding:0!important}
.banner-position-modes{display:flex;gap:9px;margin:20px 0 14px}
.banner-position-modes button[aria-pressed="true"]{background:#70204f;border-color:#ef69b1}
.banner-position-stage{display:flex;justify-content:center;align-items:center;min-height:220px;background:#090b12;border:1px solid #3b4050;border-radius:14px;padding:12px}
.banner-position-preview{width:100%;height:auto;aspect-ratio:3.78;max-height:350px;min-height:180px;position:relative;overflow:hidden;border-radius:12px;background:#090b12;touch-action:none;cursor:grab;user-select:none;outline-offset:3px}
.banner-position-preview:active{cursor:grabbing}
.banner-position-preview.is-mobile{width:min(360px,100%);height:340px;min-height:0;max-height:none;aspect-ratio:auto}
.banner-position-preview>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}
.banner-position-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,6,11,.93),rgba(5,6,11,.50) 44%,rgba(5,6,11,.04)),linear-gradient(0deg,rgba(5,6,11,.85),transparent 65%)}
.banner-position-preview.is-mobile .banner-position-shade{background:linear-gradient(0deg,rgba(5,6,11,.94),rgba(5,6,11,.32) 64%,rgba(5,6,11,.12))}
.banner-position-preview-name{position:absolute;left:5%;bottom:17%;display:grid;gap:6px;max-width:68%;pointer-events:none;text-shadow:0 2px 12px #000}
.banner-position-preview-name small{font-size:12px;letter-spacing:.08em;font-weight:700;color:#f5dbea}
.banner-position-preview-name strong{font-size:clamp(24px,5vw,48px);font-weight:800;line-height:1.12;overflow-wrap:anywhere}
.banner-position-preview.is-mobile .banner-position-preview-name{bottom:12%}
.banner-position-preview.is-mobile .banner-position-preview-name strong{font-size:30px}
.banner-position-hint{margin:12px 0}
.banner-position-sliders{display:grid;grid-template-columns:1fr;gap:7px;margin:16px 0}
.banner-position-sliders label{display:flex;justify-content:space-between;font-size:14px;color:#f7f7fa;font-weight:600}
.banner-position-sliders output{font-variant-numeric:tabular-nums}
.banner-position-sliders input[type=range]{width:100%;height:44px;accent-color:#ed4d9d;cursor:pointer}
.banner-position-result{min-height:21px;font-size:14px;color:#ffd7ec;margin:6px 0}
.banner-position-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.banner-position-spacer{flex:1}
.banner-position-actions .banner-position-save{background:#bd236e;border-color:#d64092;color:#fff}
@media(max-width:600px){.banner-position-dialog{padding:14px;max-height:calc(100dvh - 20px);border-radius:12px}.banner-position-backdrop{padding:10px}.banner-position-preview{min-height:105px}.banner-position-stage{min-height:160px;padding:8px}.banner-position-preview-name strong{font-size:26px}.banner-position-actions .banner-position-reset{width:100%}.banner-position-spacer{display:none}.banner-position-actions .banner-position-cancel,.banner-position-actions .banner-position-save{flex:1;min-width:110px}}

/* CH1 weekly chart: add Saves and Score without changing other catalogue tables.
   Desktop gains two columns; the small-screen chart retains its stacked metrics. */
@media (min-width: 801px) {
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns: 50px minmax(160px,2.6fr) repeat(6,minmax(52px,.68fr)) minmax(136px,1.45fr)!important;
  }
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-row {
    grid-template-columns: 50px minmax(160px,2.8fr) repeat(4,minmax(63px,.8fr)) minmax(136px,1.5fr)!important;
  }
  .chart-page .chart-leader-stats {
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  .chart-page .chart-score-stat b,
  .chart-page .chart-chase-score b,
  .chart-page .chart-leader-score b {
    color:var(--la-strong)!important;
    font-weight:750!important;
    font-variant-numeric:tabular-nums;
  }
  .chart-page .chart-table-head span,
  .chart-page .chart-chase-head span {min-width:0;font-size:10px;line-height:1.25;}
}
@media (max-width: 800px) {
  /* Savings and points appear explicitly in the existing small-screen meta line. */
  .chart-page .chart-row .chart-saves-stat,
  .chart-page .chart-row .chart-score-stat,
  .chart-page .chart-chase-row .chart-chase-saves,
  .chart-page .chart-chase-row .chart-chase-score {display:none!important;}
  .chart-page .chart-leader-stats {
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .chart-page .chart-leader-stats>span {min-width:0!important;}
  .chart-page .chart-leader-score b {font-weight:750!important;}
}
/* Keep the expanded weekly metrics readable on narrow phones. */
@media (max-width: 800px) {
  .chart-page .chart-mobile-meta,
  .chart-page .chart-chase-mobile-meta {white-space:normal!important;overflow-wrap:normal;line-height:1.5!important;}
}
@media (min-width:801px) and (max-width:1050px) {
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns:38px minmax(132px,2fr) repeat(6,minmax(35px,.5fr)) minmax(118px,1.5fr)!important;
  }
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-row {
    grid-template-columns:38px minmax(132px,2fr) repeat(4,minmax(42px,.5fr)) minmax(118px,1.5fr)!important;
  }
}

/* CH1.1 tablet rules preserved byte-for-byte below, effective only at 801-959px. */
@media(min-width:801px) and (max-width:959px){
/* CH1.1 / RC2.33 — chart spacing only. All sizing is driven by the chart board's
   available width (the desktop editorial sidebar can make this much smaller
   than the browser viewport). No ranking, song or button behaviour changes. */
.chart-page .current-chart-board {container-type:inline-size;}
@media (min-width:801px) {
  /* Move the leader's six metrics below the title/actions, giving the track
     its own readable line and the stats a full-width, evenly spaced grid. */
  .chart-page .current-chart-board .chart-leader {
    display:grid!important;
    grid-template-columns:64px minmax(0,1fr) auto!important;
    column-gap:20px!important;
    row-gap:24px!important;
    align-items:center!important;
    padding:20px 22px!important;
  }
  .chart-page .current-chart-board .chart-leader-rank {
    grid-column:1!important;grid-row:1 / 3!important;align-self:center!important;
  }
  .chart-page .current-chart-board .chart-leader-main {
    grid-column:2!important;grid-row:1!important;
    width:100%!important;min-width:0!important;max-width:none!important;
  }
  .chart-page .current-chart-board .chart-leader-copy {
    min-width:0!important;max-width:none!important;
  }
  .chart-page .current-chart-board .chart-leader-copy>strong {
    overflow-wrap:anywhere;white-space:normal!important;
  }
  .chart-page .current-chart-board .chart-leader-actions {
    grid-column:3!important;grid-row:1!important;
    display:flex!important;gap:8px!important;align-items:center!important;
    justify-content:flex-end!important;flex-wrap:wrap!important;
    margin:0!important;min-width:0!important;
  }
  .chart-page .current-chart-board .chart-leader-stats {
    grid-column:2 / 4!important;grid-row:2!important;
    display:grid!important;
    grid-template-columns:repeat(6,minmax(72px,1fr))!important;
    column-gap:12px!important;row-gap:12px!important;
    width:100%!important;min-width:0!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-leader-stats>span {
    min-width:72px!important;max-width:none!important;
    text-align:center!important;
  }
  .chart-page .current-chart-board .chart-leader-stats small {
    display:block!important;white-space:normal!important;
    font-size:10px!important;line-height:1.32!important;
    letter-spacing:.045em!important;overflow-wrap:normal!important;
    text-align:center!important;
  }
  .chart-page .current-chart-board .chart-leader-stats b,
  .chart-page .current-chart-stack .chart-stat b,
  .chart-page .chart-chase-stack .chart-chase-stat b {
    font-variant-numeric:tabular-nums!important;
  }
  /* The header and numbered rows use identical columns and gutters.
     The final 16px gutter separates SCORE from the first action button. */
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    display:grid!important;
    grid-template-columns:42px minmax(220px,2fr) repeat(6,minmax(72px,.65fr)) minmax(148px,auto)!important;
    column-gap:16px!important;align-items:center!important;
  }
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row {
    display:grid!important;
    grid-template-columns:42px minmax(215px,2fr) repeat(4,minmax(72px,.7fr)) minmax(148px,auto)!important;
    column-gap:16px!important;align-items:center!important;
  }
  .chart-page .current-chart-head>span,
  .chart-page .chart-chase-head>span {
    min-width:0!important;white-space:normal!important;
    overflow-wrap:normal!important;line-height:1.3!important;
    letter-spacing:.045em!important;
  }
  .chart-page .current-chart-head>span:nth-child(n+3):nth-child(-n+9),
  .chart-page .chart-chase-head>span:nth-child(n+3) {text-align:center!important;}
  .chart-page .current-chart-stack .chart-row-track,
  .chart-page .chart-chase-stack .chart-chase-track-cell {min-width:0!important;}
  .chart-page .current-chart-stack .chart-track strong,
  .chart-page .chart-chase-stack .chart-track strong {
    min-width:0!important;overflow-wrap:anywhere;
  }
  .chart-page .current-chart-stack .chart-row-actions,
  .chart-page .chart-chase-stack .chart-chase-actions {
    min-width:0!important;justify-content:flex-start!important;
    display:flex!important;gap:6px!important;margin:0!important;
  }
}
/* Shrink according to *chart width*, not browser width: with the editorial
   sidebar open a 1920px browser can have less than 900px for the chart. */
@media (min-width:801px) {
@container (max-width:1040px) {
  /* A real desktop chart board is ~870px when the sidebar is visible.
     Retain all six measures instead of hiding last week's context. */
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns:32px minmax(180px,1.75fr) repeat(6,minmax(60px,.56fr)) minmax(124px,auto)!important;
    column-gap:12px!important;
    padding-inline:14px!important;
  }
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row {
    grid-template-columns:32px minmax(180px,1.75fr) repeat(4,minmax(60px,.56fr)) minmax(124px,auto)!important;
    column-gap:12px!important;
    padding-inline:14px!important;
  }
  .chart-page .current-chart-head>span,
  .chart-page .chart-chase-head>span {
    font-size:9px!important;
    line-height:1.25!important;
    letter-spacing:.015em!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
  }
  .chart-page .current-chart-stack .chart-row-actions,
  .chart-page .chart-chase-stack .chart-chase-actions {
    margin-left:4px!important; /* 12px column gap + 4px = 16px after Score */
    gap:5px!important;
  }
  .chart-page .current-chart-stack .chart-row-track .chart-cover {
    width:44px!important;height:44px!important;flex-basis:44px!important;
  }
  .chart-page .current-chart-stack .chart-row-track .chart-row-play {
    width:28px!important;height:28px!important;flex-basis:28px!important;
  }
}
@container (max-width:850px) {
  .chart-page .current-chart-board .chart-leader {
    grid-template-columns:54px minmax(0,1fr)!important;
  }
  .chart-page .current-chart-board .chart-leader-rank {grid-row:1 / 4!important;}
  .chart-page .current-chart-board .chart-leader-main {grid-column:2!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-leader-stats {
    grid-column:2!important;grid-row:2!important;
    grid-template-columns:repeat(3,minmax(72px,1fr))!important;
  }
  .chart-page .current-chart-board .chart-leader-actions {
    grid-column:2!important;grid-row:3!important;
    justify-content:flex-start!important;
  }
}
/* Below ~814px of actual outer board width, six 60px metrics plus a readable
   track and three actions cannot fit. Desktop drops context metrics only
   here (not at 870px); their values remain recorded and untouched. */
@container (max-width:812px) {
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns:32px minmax(180px,1.75fr) repeat(3,minmax(60px,.56fr)) minmax(124px,auto)!important;
  }
  .chart-page .current-chart-head>span:nth-child(3),
  .chart-page .current-chart-head>span:nth-child(4),
  .chart-page .current-chart-head>span:nth-child(5),
  .chart-page .current-chart-stack .chart-row>.chart-stat:nth-child(3),
  .chart-page .current-chart-stack .chart-row>.chart-stat:nth-child(4),
  .chart-page .current-chart-stack .chart-row>.chart-stat:nth-child(5) {display:none!important;}
}
@container (max-width:660px) {
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row {
    grid-template-columns:32px minmax(150px,1fr) repeat(3,minmax(54px,.56fr)) minmax(124px,auto)!important;
  }
  .chart-page .chart-chase-head>span:nth-child(3),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-plays {display:none!important;}
}
@container (max-width:580px) {
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns:32px minmax(150px,1fr) minmax(58px,auto) minmax(124px,auto)!important;
  }
  .chart-page .current-chart-head>span:nth-child(6),
  .chart-page .current-chart-head>span:nth-child(7),
  .chart-page .current-chart-stack .chart-row>.chart-votes-stat,
  .chart-page .current-chart-stack .chart-row>.chart-saves-stat {display:none!important;}
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row {
    grid-template-columns:32px minmax(150px,1fr) minmax(58px,auto) minmax(124px,auto)!important;
  }
  .chart-page .chart-chase-head>span:nth-child(4),
  .chart-page .chart-chase-head>span:nth-child(5),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-votes,
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-saves {display:none!important;}
}
}

}
/* CH1.2 / RC2.34 — use the Manager desktop workspace for Chart.
   The single shared token retains Manager's existing computed width while
   making Chart's board + 16px gap + sidebar align with the Manager edges.
   No scoring, data, behaviour or other page-width change. */
:root { --riffelo-manager-workspace-max:1440px; }
@media (min-width:960px) {
  .manager-page .manager-shell{max-width:var(--riffelo-manager-workspace-max)!important;}
  .chart-page .chart-editorial-shell{
    box-sizing:border-box!important;
    width:calc(100% - 32px)!important;
    max-width:var(--riffelo-manager-workspace-max)!important;
    grid-template-columns:minmax(0,1fr) 310px!important;
    column-gap:16px!important;
    align-items:start!important;
  }
  .chart-page .chart-board{grid-column:1!important;min-width:0!important;}
  .chart-page .chart-side{grid-column:2!important;grid-row:2!important;min-width:0!important;}
  .chart-page .current-chart-board{container-type:inline-size;}
  /* Leader: track, play, six stats and three actions remain in one row
     when the newly available board width allows it. */
  .chart-page .current-chart-board .chart-leader{
    display:grid!important;
    grid-template-columns:52px minmax(320px,1.2fr) minmax(330px,1.1fr) 276px!important;
    column-gap:12px!important;row-gap:12px!important;
    align-items:center!important;padding:12px!important;
    min-height:0!important;
  }
  .chart-page .current-chart-board .chart-leader-rank,
  .chart-page .current-chart-board .chart-leader-main,
  .chart-page .current-chart-board .chart-leader-stats,
  .chart-page .current-chart-board .chart-leader-actions{
    grid-row:1!important;grid-column:auto!important;min-width:0!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-leader-main{
    width:100%!important;max-width:none!important;
    grid-template-columns:68px minmax(0,1fr) 38px!important;
    gap:10px!important;padding:10px 8px!important;
  }
  .chart-page .current-chart-board .chart-leader-cover {width:68px!important;height:68px!important;}
  .chart-page .current-chart-board .chart-leader-play {width:38px!important;height:38px!important;}
  .chart-page .current-chart-board .chart-leader-copy>strong{font-size:17px!important;}
  .chart-page .current-chart-board .chart-leader-copy{min-width:0!important;max-width:none!important;}
  .chart-page .current-chart-board .chart-leader-copy>strong{
    display:block!important;white-space:normal!important;overflow:visible!important;
    text-overflow:clip!important;overflow-wrap:break-word!important;line-height:1.2!important;
  }
  .chart-page .current-chart-board .chart-leader-stats{
    display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:4px!important;width:100%!important;
  }
  .chart-page .current-chart-board .chart-leader-stats>span{
    min-width:0!important;max-width:none!important;text-align:center!important;padding:9px 3px!important;
  }
  .chart-page .current-chart-board .chart-leader-stats small{
    display:block!important;white-space:normal!important;overflow-wrap:normal!important;
    font-size:10px!important;line-height:1.3!important;letter-spacing:.04em!important;
  }
  .chart-page .current-chart-board .chart-leader-actions{
    display:flex!important;flex-flow:row nowrap!important;
    align-items:center!important;justify-content:flex-end!important;
    padding:0!important;gap:6px!important;border:0!important;width:276px!important;
  }
  .chart-page .current-chart-board .chart-leader-actions .chart-leader-action-pill{
    width:88px!important;min-width:88px!important;max-width:88px!important;
    flex:0 0 88px!important;height:44px!important;min-height:44px!important;
    padding:0 7px!important;justify-content:center!important;
  }
  /* The six numeric columns line up precisely with the header and retain
     their full data at the owner's four target desktop viewport sizes. */
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row{
    display:grid!important;
    grid-template-columns:42px minmax(340px,3.2fr) repeat(6,minmax(52px,.5fr)) minmax(124px,auto)!important;
    column-gap:12px!important;align-items:center!important;padding-inline:12px!important;
  }
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row{
    display:grid!important;
    grid-template-columns:42px minmax(340px,3.2fr) repeat(4,minmax(60px,.8fr)) minmax(124px,auto)!important;
    column-gap:12px!important;align-items:center!important;padding-inline:12px!important;
  }
  .chart-page .current-chart-head>span,
  .chart-page .chart-chase-head>span{
    min-width:0!important;white-space:normal!important;
    line-height:1.3!important;letter-spacing:.035em!important;
  }
  .chart-page .current-chart-stack .chart-row-track,
  .chart-page .chart-chase-stack .chart-chase-track-cell{min-width:0!important;}
  .chart-page .current-chart-stack .chart-row-track .chart-track strong,
  .chart-page .chart-chase-stack .chart-chase-track-cell .chart-track strong{
    display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;
    white-space:normal!important;text-overflow:clip!important;overflow:hidden!important;
    overflow-wrap:break-word!important;line-height:1.25!important;
    font-size:16px!important;
  }
  .chart-page .current-chart-stack .chart-row-actions,
  .chart-page .chart-chase-stack .chart-chase-actions{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    gap:5px!important;min-width:0!important;margin:0 0 0 4px!important;
  }
  .chart-page .current-chart-head>span:nth-child(n+3),
  .chart-page .chart-chase-head>span:nth-child(n+3){text-align:center!important;}
  .chart-page .chart-leader-stats b,.chart-page .chart-stat b,
  .chart-page .chart-chase-stat b{font-variant-numeric:tabular-nums!important;}
}
/* At narrower desktop widths, keep the actual sidebar available below
   the chart rather than forcing six stats into a 600px board. */
@media(min-width:960px) and (max-width:1399px){
  .chart-page .chart-editorial-shell{grid-template-columns:minmax(0,1fr)!important;}
  .chart-page .chart-side{grid-column:1!important;grid-row:auto!important;}
}
/* When one-row leader cannot fit, only its statistics move to a single
   clean line beneath. Neither chart rows nor stat columns disappear. */
@media(min-width:960px){
  @container (max-width:1040px){
    .chart-page .current-chart-board .chart-leader{
      grid-template-columns:52px minmax(210px,1fr) 276px!important;
      grid-template-rows:auto auto!important;
      row-gap:10px!important;
    }
    .chart-page .current-chart-board .chart-leader-rank{grid-column:1!important;grid-row:1!important;}
    .chart-page .current-chart-board .chart-leader-main{grid-column:2!important;grid-row:1!important;}
    .chart-page .current-chart-board .chart-leader-actions{grid-column:3!important;grid-row:1!important;}
    .chart-page .current-chart-board .chart-leader-stats{
      grid-column:2 / 4!important;grid-row:2!important;
      grid-template-columns:repeat(6,minmax(0,1fr))!important;
    }
  }
}
@media (max-width:800px) {
  /* Preserve CH1's established mobile card/action structure. */
  .chart-page .chart-leader-stats {column-gap:10px!important;row-gap:12px!important;}
  .chart-page .chart-leader-stats small {
    white-space:normal!important;line-height:1.35!important;
    letter-spacing:.045em!important;overflow-wrap:normal!important;
  }
  .chart-page .chart-leader-copy>strong,
  .chart-page .chart-row .chart-track strong {overflow-wrap:anywhere;}
}
@media (max-width:800px) {
  /* Keep the rank clear of the 3+3 metric grid on narrow devices. */
  .chart-page .current-chart-board .chart-leader-rank {grid-row:1!important;}
  .chart-page .current-chart-board .chart-leader-stats {
    grid-column:1 / -1!important;grid-row:2!important;
  }
  .chart-page .current-chart-board .chart-leader-actions {
    grid-column:1 / -1!important;grid-row:3!important;
    margin-top:12px!important;gap:8px!important;
  }
}
@media (max-width:430px) {
  /* Long track titles deserve the full phone width: actions sit immediately
     beneath the track instead of consuming the title's horizontal space. */
  .chart-page .current-chart-stack .chart-row {
    grid-template-columns:34px minmax(0,1fr)!important;
    column-gap:12px!important;row-gap:10px!important;
    align-items:start!important;
  }
  .chart-page .current-chart-stack .chart-row-track {
    grid-column:2!important;grid-row:1!important;min-width:0!important;
    width:100%!important;
  }
  .chart-page .current-chart-stack .chart-row-actions {
    grid-column:2!important;grid-row:2!important;
    display:flex!important;justify-content:flex-start!important;
    gap:10px!important;margin:0!important;
  }
}


/* CH2 / RC2.35 — Chart presentation only. The score still ranks records in the API.
   Share one column geometry between the Top 10 and Chasing, leaving gaps in the
   Chasing row where Total Plays and Peak Position are not displayed. */
@media (min-width:801px) {
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row,
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row {
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:42px minmax(190px,1fr) repeat(5,minmax(52px,56px)) 148px!important;
    column-gap:12px!important;
    align-items:center!important;
    padding-inline:12px!important;
    width:100%!important;
  }
  .chart-page .chart-chase-head{min-height:40px!important;}
  .chart-page .chart-chase-stack .chart-chase-row{
    min-height:72px!important;grid-template-rows:minmax(0,auto)!important;
    padding-block:8px!important;
  }
  .chart-page .chart-chase-head>span:nth-child(1),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-position{grid-column:1!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span:nth-child(2),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-track-cell{grid-column:2!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span:nth-child(3),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-plays{grid-column:3!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span:nth-child(4),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-votes{grid-column:6!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span:nth-child(5),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-saves{grid-column:7!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span:nth-child(6),
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-actions{grid-column:8!important;grid-row:1!important;}
  .chart-page .chart-chase-head>span{
    white-space:nowrap!important;overflow:visible!important;
    line-height:1.25!important;letter-spacing:.015em!important;
    font-size:10px!important;
  }
  .chart-page .chart-chase-track-cell{
    display:grid!important;grid-template-columns:minmax(0,1fr) 44px!important;
    gap:10px!important;align-items:center!important;min-width:0!important;
  }
  .chart-page .chart-chase-track .chart-track strong,
  .chart-page .current-chart-stack .chart-row-track .chart-track strong{
    display:-webkit-box!important;-webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;line-clamp:2!important;
    white-space:normal!important;overflow:hidden!important;text-overflow:clip!important;
    overflow-wrap:break-word!important;line-height:1.3!important;
  }
  .chart-page .chart-chase-actions{
    display:flex!important;align-items:center!important;justify-content:flex-end!important;
    gap:6px!important;min-width:0!important;margin:0!important;
  }
  .chart-page .chart-chase-stat{min-width:0!important;text-align:center!important;}
  .chart-page .current-chart-board .chart-leader-stats{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
}
@media(min-width:801px) and (max-width:959px){
  .chart-page .current-chart-head,
  .chart-page .current-chart-stack .chart-row,
  .chart-page .chart-chase-head,
  .chart-page .chart-chase-stack .chart-chase-row{
    grid-template-columns:34px minmax(150px,1fr) repeat(5,minmax(38px,46px)) 148px!important;
    column-gap:7px!important;padding-inline:8px!important;
  }
}
@media(max-width:800px){
  /* Preserve the accepted narrow-screen cards, adjusting only the 5 leader metrics
     and Chasing's 2-line layout after removing the sixth metric. */
  .chart-page .current-chart-board .chart-leader-stats{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .chart-page .chart-chase-stack .chart-chase-row{
    grid-template-columns:34px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;gap:7px!important;
    min-height:104px!important;
  }
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-track-cell{
    grid-column:2!important;grid-row:1!important;min-width:0!important;
  }
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-mobile-meta{
    grid-column:2!important;grid-row:2!important;
    display:block!important;min-width:0!important;
    white-space:nowrap!important;font-size:12px!important;
    overflow:hidden!important;text-overflow:clip!important;
    padding-right:151px!important;line-height:44px!important;
    width:100%!important;
  }
  .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-actions{
    grid-column:2!important;grid-row:2!important;
    display:grid!important;grid-template-columns:repeat(3,44px)!important;
    gap:5px!important;justify-content:end!important;
    width:100%!important;margin:0!important;
  }
}

/* CH2: use the existing cover geometry in Chasing, matching Top 10 tracks.
   Keep the separate chase play control and all its existing styles unchanged. */
.chart-page .chart-chase-stack .chart-chase-track{
  display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;
  gap:10px!important;align-items:center!important;min-width:0!important;
}
.chart-page .chart-chase-stack .chart-chase-track>.chart-cover{
  display:block!important;width:54px!important;height:54px!important;
  min-width:54px!important;border-radius:12px!important;
  background-size:cover!important;background-position:center!important;
}
.chart-page .chart-chase-stack .chart-chase-track .chart-track,
.chart-page .chart-chase-stack .chart-chase-title-line{min-width:0!important;}
@media(max-width:800px){
  .chart-page .chart-chase-stack .chart-chase-track{
    grid-template-columns:44px minmax(0,1fr)!important;gap:8px!important;
  }
  .chart-page .chart-chase-stack .chart-chase-track>.chart-cover{
    width:44px!important;height:44px!important;min-width:44px!important;
  }
  .chart-page .chart-chase-stack .chart-chase-track .chart-track strong{
    display:-webkit-box!important;-webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;line-clamp:2!important;
    white-space:normal!important;overflow:hidden!important;text-overflow:clip!important;
    overflow-wrap:break-word!important;line-height:1.25!important;
  }
}
/* CH2: match thumbnail and title x-positions with their Top 10 counterparts. */
@media(min-width:801px){
 .chart-page .chart-chase-stack .chart-chase-track{box-sizing:border-box!important;padding-left:11px!important;}
}
@media(min-width:801px) and (max-width:959px){
 .chart-page .chart-chase-stack .chart-chase-track{grid-template-columns:44px minmax(0,1fr)!important;gap:20px!important;}
 .chart-page .chart-chase-stack .chart-chase-track>.chart-cover{width:44px!important;height:44px!important;min-width:44px!important;}
}
@media(max-width:800px){
 .chart-page .chart-chase-stack .chart-chase-track{box-sizing:border-box!important;padding-left:6px!important;gap:4px!important;}
}
/* CH2: small tablets still have room for a single Chasing record line. */
@media(min-width:701px) and (max-width:800px){
 .chart-page .chart-chase-head,
 .chart-page .chart-chase-stack .chart-chase-row{
   display:grid!important;
   grid-template-columns:34px minmax(170px,1fr) 54px 54px 54px 148px!important;
   grid-template-rows:auto!important;align-items:center!important;
   column-gap:8px!important;padding-inline:8px!important;
 }
 .chart-page .chart-chase-head{min-height:40px!important;}
 .chart-page .chart-chase-head>span{font-size:10px!important;white-space:nowrap!important;line-height:1.2!important;letter-spacing:0!important;}
 .chart-page .chart-chase-stack .chart-chase-row{min-height:72px!important;padding-block:8px!important;}
 .chart-page .chart-chase-head>span:nth-child(1),.chart-page .chart-chase-stack .chart-chase-row>.chart-position{grid-column:1!important;grid-row:1!important;}
 .chart-page .chart-chase-head>span:nth-child(2),.chart-page .chart-chase-stack .chart-chase-row>.chart-chase-track-cell{grid-column:2!important;grid-row:1!important;}
 .chart-page .chart-chase-head>span:nth-child(3),.chart-page .chart-chase-stack .chart-chase-row>.chart-chase-plays{grid-column:3!important;grid-row:1!important;}
 .chart-page .chart-chase-head>span:nth-child(4),.chart-page .chart-chase-stack .chart-chase-row>.chart-chase-votes{grid-column:4!important;grid-row:1!important;}
 .chart-page .chart-chase-head>span:nth-child(5),.chart-page .chart-chase-stack .chart-chase-row>.chart-chase-saves{grid-column:5!important;grid-row:1!important;}
 .chart-page .chart-chase-head>span:nth-child(6),.chart-page .chart-chase-stack .chart-chase-row>.chart-chase-actions{grid-column:6!important;grid-row:1!important;}
 .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-plays,
 .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-votes,
 .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-saves{display:flex!important;}
 .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-mobile-meta{display:none!important;}
 .chart-page .chart-chase-stack .chart-chase-row>.chart-chase-actions{
   display:flex!important;justify-content:flex-end!important;
   width:auto!important;min-width:0!important;margin:0!important;gap:5px!important;
 }
 .chart-page .chart-chase-stack .chart-chase-track{
   grid-template-columns:44px minmax(0,1fr)!important;gap:8px!important;padding-left:0!important;
 }
}

/* PB1 / RC2.36 — single presentation token for custom play/pause affordances.
   No playback event, song-open behaviour, native <audio controls>, ranking,
   markup or non-play action changes. PB2 owns one-press playback behaviour. */
:root{--riffelo-play-green:#18A05C}

/* Custom icon controls and embedded icons in existing song-opening groups. */
:is(.chart-leader-play,.chart-row-play,.chart-chase-play,.new-this-week-play,
    .discovery-row-play,.home-play,.first-run-play,.career-release-play,
    .mkpi-cover-play,.profile-row-play,.catalogue-mobile-play,.catalogue-desktop-play,
    .history-play,.rp-play,#successPlay,.profile-play-button,
    .landing-chart-cover > span,.play-fab,.preview-cover > i,.chart-cover > i){
  background:var(--riffelo-play-green)!important;
  color:#fff!important;
  border-color:var(--riffelo-play-green)!important;
  border-radius:999px!important;
  box-shadow:none!important;
}
:is(.chart-leader-play,.chart-row-play,.chart-chase-play,.new-this-week-play,
    .discovery-row-play,.home-play,.first-run-play,.career-release-play,
    .mkpi-cover-play,.profile-row-play,.catalogue-mobile-play,.catalogue-desktop-play,
    .history-play,.rp-play,#successPlay,.profile-play-button,
    .landing-chart-cover > span,.play-fab,.preview-cover > i,.chart-cover > i) svg{
  color:#fff!important;stroke:#fff!important;fill:none!important;
}
:is(.chart-leader-play,.chart-row-play,.chart-chase-play,.new-this-week-play,
    .discovery-row-play,.home-play,.first-run-play,.career-release-play,
    .profile-row-play,.catalogue-mobile-play,.catalogue-desktop-play,.history-play,
    .rp-play,#successPlay,.profile-play-button,.landing-chart-cover > span,
    .play-fab,.preview-cover > i,.chart-cover > i) svg path{
  fill:#fff!important;stroke:#fff!important;
}
/* Text play CTAs stay labelled pills, rather than circles. */
:is(.artist-play-latest,.profile-play-button,.manager-page .mkpi-release-actions .primary-cta[data-play-song]){
  background:var(--riffelo-play-green)!important;
  color:#fff!important;
  border-color:var(--riffelo-play-green)!important;
  box-shadow:none!important;
  min-height:44px!important;
}
:is(.artist-play-latest,.profile-play-button,.manager-page .mkpi-release-actions .primary-cta[data-play-song]) svg{
  color:#fff!important;stroke:#fff!important;
}
/* Constrain the effect to play controls: other primary CTAs retain brand pink. */
:is(button.chart-chase-play,button.new-this-week-play,button.discovery-row-play,
    button.catalogue-desktop-play,button.history-play,button.profile-row-play,
    button.profile-play-button,button.artist-play-latest,button.rp-play,
    button#successPlay,button.landing-chart-cover,button.mkpi-release-art,
    button[data-play-song].profile-play-button):hover:not(:disabled){
  filter:brightness(1.08);
}
:is(button.chart-chase-play,button.new-this-week-play,button.discovery-row-play,
    button.catalogue-desktop-play,button.history-play,button.profile-row-play,
    button.profile-play-button,button.artist-play-latest,button.rp-play,
    button#successPlay,button.landing-chart-cover,button.mkpi-release-art):active:not(:disabled){
  filter:brightness(.91);
}
:is(button.chart-chase-play,button.new-this-week-play,button.discovery-row-play,
    button.catalogue-desktop-play,button.history-play,button.profile-row-play,
    button.profile-play-button,button.artist-play-latest,button.rp-play,
    button#successPlay,button.landing-chart-cover,button.mkpi-release-art):focus-visible{
  outline:3px solid #fff!important;outline-offset:3px!important;
}
:is(button.chart-chase-play,button.new-this-week-play,button.discovery-row-play,
    button.catalogue-desktop-play,button.history-play,button.profile-row-play,
    button.profile-play-button,button.artist-play-latest,button.rp-play,
    button#successPlay,button.landing-chart-cover,button.mkpi-release-art):disabled{
  opacity:.48;filter:saturate(.5);cursor:not-allowed;
}
/* The actual song art remains visible; tint only its central play disc. */
.landing-chart-cover{background-color:transparent!important}
.landing-chart-cover > span{display:grid!important;place-items:center!important}
.mkpi-release-art .mkpi-cover-play{background:var(--riffelo-play-green)!important;border-color:var(--riffelo-play-green)!important;color:#fff!important}
/* Custom modal pause state shares the same green button without touching playback. */
.rp-play svg path,.rp-play svg rect{fill:#fff!important;stroke:#fff!important}

@media(max-width:800px){
  /* The existing parent group remains clickable; enlarge icons only where
     the row's grid allows it. No nested-button or DOM reordering. */
  :is(.chart-chase-play,.new-this-week-play,.discovery-row-play,
      .profile-row-play,.catalogue-desktop-play,.history-play,#successPlay,
      .rp-play){min-width:44px!important;min-height:44px!important;
                 width:44px!important;height:44px!important}
  :is(.chart-leader-play,.chart-row-play){
    min-width:44px!important;min-height:44px!important;
    width:44px!important;height:44px!important;
  }
  /* End-of-track play affordances remain on the right side of their song
     group; action buttons keep their original order and click meaning. */
  .chart-page .chart-row-track .chart-row-play,
  .chart-page .chart-chase-track-cell .chart-chase-play,
  .home-chart-track .home-play,.first-run-track .first-run-play,
  .catalogue-track-cell .catalogue-mobile-play{
    justify-self:end!important;
  }
  .artist-play-latest,.profile-play-button{min-height:44px!important}
}
@media(prefers-reduced-motion:reduce){
  :is(.rp-play,.chart-row-play,.chart-leader-play,.chart-chase-play){transition:none!important}
}

/* Keyboard navigation for the existing non-button chart leader group. */
.chart-page .chart-leader-main:focus-visible{outline:3px solid #fff!important;outline-offset:3px!important;border-radius:8px}

/* In the source this specific manager button says Play, but has data-song and
   opens details; PB2 will change that action after PB1 acceptance. */

/* PB1 V2 / RC2.36 — DOC alignment addendum, visual only.
   One shared grid for Chart #1, Top 10, Chasing, and both table headers.
   Same column x-centres by construction. Phone remains under legacy rules. */
@media (min-width:801px) {
  .chart-page .current-chart-board {
    --riffelo-chart-columns:42px minmax(0,1fr) repeat(5,56px) 148px;
    --riffelo-chart-gap:12px;
    --riffelo-chart-inset:12px;
  }
  .chart-page .current-chart-board :is(
    .chart-leader,.current-chart-head,.current-chart-stack>.chart-row,
    .chart-chase-head,.chart-chase-stack>.chart-chase-row) {
    display:grid!important;
    grid-template-columns:var(--riffelo-chart-columns)!important;
    column-gap:var(--riffelo-chart-gap)!important;
    box-sizing:border-box!important;
    align-items:center!important;
    padding-inline:var(--riffelo-chart-inset)!important;
    width:100%!important;
    min-width:0!important;
  }
  .chart-page .current-chart-board .chart-leader{
    padding-block:12px!important;row-gap:0!important;
    min-height:92px!important;
  }
  .chart-page .current-chart-board .chart-leader-rank {grid-column:1!important;grid-row:1!important;min-width:0!important;align-self:center!important;}
  .chart-page .current-chart-board .chart-leader-main {grid-column:2!important;grid-row:1!important;min-width:0!important;margin:0!important;}
  .chart-page .current-chart-board .chart-leader-stats{display:contents!important;}
  .chart-page .current-chart-board .chart-leader-stats>span{
    grid-row:1!important;display:grid!important;align-self:stretch!important;
    min-width:0!important;max-width:none!important;margin:0!important;
    padding:7px 0!important;text-align:center!important;
  }
  .chart-page .current-chart-board .chart-leader-stats>span:nth-child(1){grid-column:3!important}
  .chart-page .current-chart-board .chart-leader-stats>span:nth-child(2){grid-column:4!important}
  .chart-page .current-chart-board .chart-leader-stats>span:nth-child(3){grid-column:5!important}
  .chart-page .current-chart-board .chart-leader-stats>span:nth-child(4){grid-column:6!important}
  .chart-page .current-chart-board .chart-leader-stats>span:nth-child(5){grid-column:7!important}
  .chart-page .current-chart-board .chart-leader-stats small{
    display:block!important;letter-spacing:.015em!important;
    font-size:10px!important;line-height:1.25!important;white-space:normal!important;
    overflow-wrap:normal!important;
  }
  .chart-page .current-chart-board .chart-leader-actions{
    grid-column:8!important;grid-row:1!important;
    display:grid!important;grid-template-columns:repeat(3,44px)!important;
    gap:6px!important;justify-content:end!important;align-items:center!important;
    width:148px!important;min-width:0!important;max-width:148px!important;
    margin:0!important;padding:0!important;border:0!important;
    flex-flow:initial!important;
  }
  .chart-page .current-chart-board .chart-leader-actions>.chart-leader-action-pill{
    display:grid!important;place-items:center!important;
    box-sizing:border-box!important;flex:none!important;
    width:44px!important;min-width:44px!important;max-width:44px!important;
    height:44px!important;min-height:44px!important;max-height:44px!important;
    padding:0!important;border-radius:9px!important;
  }
  .chart-page .current-chart-board .chart-leader-actions>.chart-leader-action-pill .vote-icon{font-size:23px!important;line-height:1!important}
  .chart-page .current-chart-board .chart-leader-actions>.chart-leader-action-pill svg{width:17px!important;height:17px!important}
  .chart-page .current-chart-board :is(.chart-leader-main,.current-chart-stack .chart-row-track){
    display:grid!important;grid-template-columns:54px minmax(0,1fr) 44px!important;
    gap:10px!important;align-items:center!important;
    padding:0!important;margin:0!important;border:0!important;
    min-width:0!important;width:100%!important;max-width:none!important;
  }
  .chart-page .current-chart-board :is(.chart-leader-cover,.current-chart-stack .chart-row-track>.chart-cover){
    width:54px!important;height:54px!important;min-width:54px!important;max-width:54px!important;
    margin:0!important;
  }
  .chart-page .current-chart-board :is(.chart-leader-play,.current-chart-stack .chart-row-track>.chart-row-play){
    width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
    justify-self:end!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-leader-copy {min-width:0!important;padding:0!important;}
  .chart-page .current-chart-board .chart-leader-copy>strong {font-size:16px!important;}
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-track-cell{
    grid-column:2!important;grid-row:1!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) 44px!important;
    gap:10px!important;align-items:center!important;min-width:0!important;
    width:100%!important;padding:0!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-track{
    display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;
    gap:10px!important;align-items:center!important;min-width:0!important;
    width:100%!important;margin:0!important;padding:0!important;
  }
  .chart-page .current-chart-board .chart-chase-track>.chart-cover{
    width:54px!important;height:54px!important;min-width:54px!important;
    max-width:54px!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-chase-track-cell>.chart-chase-play{
    width:44px!important;height:44px!important;min-width:44px!important;
    min-height:44px!important;justify-self:end!important;margin:0!important;
  }
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-row>.chart-chase-plays{grid-column:3!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-row>.chart-chase-votes{grid-column:6!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-row>.chart-chase-saves{grid-column:7!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-stack .chart-chase-row>.chart-chase-actions{grid-column:8!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(1){grid-column:1!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(2){grid-column:2!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(3){grid-column:3!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(4){grid-column:6!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(5){grid-column:7!important;grid-row:1!important;}
  .chart-page .current-chart-board .chart-chase-head>span:nth-child(6){grid-column:8!important;grid-row:1!important;}
  .chart-page .current-chart-board :is(.chart-table-head,.chart-chase-head)>span{
    min-width:0!important;white-space:normal!important;overflow-wrap:normal!important;
    font-size:10px!important;line-height:1.25!important;letter-spacing:.015em!important;
  }
  .chart-page .current-chart-board .chart-leader-actions .vote-button.active{background:rgba(255,102,122,.12)!important;border-color:rgba(255,102,122,.72)!important;}
  .chart-page .current-chart-board .chart-leader-actions .save-button.active{background:rgba(233,243,255,.10)!important;border-color:rgba(233,243,255,.72)!important;}
}
@media(min-width:801px) and (max-width:959px) {
  .chart-page .current-chart-board {
    --riffelo-chart-columns:34px minmax(0,1fr) repeat(5,46px) 148px;
    --riffelo-chart-gap:7px;
    --riffelo-chart-inset:8px;
  }
}
/* The Top 10 stack has a 1px enclosing border and each row has a 2px
   accent border. Compensate for those existing 3px so its INNER grid has
   precisely the same origin and width as the other sections. */
@media(min-width:801px){
  .chart-page .current-chart-board .current-chart-stack>.chart-row{
    padding-left:9px!important;padding-right:11px!important;
  }
  .chart-page .current-chart-board .current-chart-stack>.chart-row>.chart-row-actions,
  .chart-page .current-chart-board .chart-chase-stack>.chart-chase-row>.chart-chase-actions{
    width:148px!important;max-width:148px!important;min-width:148px!important;
    padding:0!important;margin:0!important;
    justify-content:flex-end!important;
  }
}
@media(min-width:801px) and (max-width:959px){
  .chart-page .current-chart-board .current-chart-stack>.chart-row{
    padding-left:5px!important;padding-right:7px!important;
  }
}
@media(min-width:801px){
  /* A legacy leader vote override spans all grid columns; neutralise only
     that positioning so the three icon actions fit in one horizontal row. */
  .chart-page .current-chart-board .chart-leader-actions>.chart-leader-action-pill{
    grid-column:auto!important;grid-row:1!important;
  }
}

/* PB1 V2.1 — action-button geometry only; inherits the existing shared
   chart column grid unchanged. Equal button dimensions and pitch for the
   leader, numbered Top 10 rows and Chasing rows at desktop widths. */
@media (min-width:801px) {
  .chart-page .current-chart-board :is(
    .chart-leader-actions,
    .current-chart-stack .chart-row-actions,
    .chart-chase-stack .chart-chase-actions) {
    display:grid!important;
    grid-template-columns:repeat(3,44px)!important;
    column-gap:6px!important;
    row-gap:0!important;
    justify-content:end!important;
    align-items:center!important;
    box-sizing:border-box!important;
    width:148px!important;
    min-width:148px!important;
    max-width:148px!important;
    margin:0!important;
    padding:0!important;
  }
  .chart-page .current-chart-board :is(
    .chart-leader-actions,
    .current-chart-stack .chart-row-actions,
    .chart-chase-stack .chart-chase-actions) > button {
    box-sizing:border-box!important;
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    margin:0!important;
    padding:0!important;
    grid-column:auto!important;
    grid-row:1!important;
    justify-self:stretch!important;
    align-self:center!important;
    flex:none!important;
  }
}

/* PB1 V2.2 / RC2.37 — desktop chart action integrity.
   The real chartRow() appends a mobile-only second share control via
   chartOverflowMenu(). V2.1 sized all children and overrode its display:none.
   At the original >=701px breakpoint hide ONLY that mobile duplicate;
   keep it unchanged on phones and preserve the three primary icon controls. */
@media (min-width:701px) {
  .chart-page .current-chart-board :is(
    .current-chart-stack .chart-row-actions,
    .chart-chase-stack .chart-chase-actions
  ) > button.chart-mobile-share { display:none!important; }
}

/* PB2 / RC2.38 — converted play glyphs are real, keyboard-accessible buttons.
   Retain PB1 green, geometry and phone thumb positions; no other visual changes. */
:is(button.chart-leader-play,button.chart-row-play,button.catalogue-mobile-play,
    button.home-play,button.first-run-play,button.career-release-play){
  appearance:none;box-sizing:border-box;padding:0!important;border:0!important;
  display:grid!important;place-items:center!important;cursor:pointer;
}
:is(button.chart-leader-play,button.chart-row-play,button.catalogue-mobile-play,
    button.home-play,button.first-run-play,button.career-release-play):focus-visible{
  outline:3px solid #fff!important;outline-offset:3px!important;
}


/* MP1 / RC2.39 — THIS WEEK'S PERFORMANCE ONLY. The existing Manager shell,
   neighbouring panels, chart, playback and other KPI tiles are untouched. */
.manager-page .mkpi-panel{padding:12px 18px!important;gap:10px!important;}
.manager-page .mkpi-panel > .mkpi-heading{padding-bottom:7px!important;margin:0!important;min-height:0!important;}
.manager-page .mkpi-panel > .mkpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;border-bottom:0!important;align-items:stretch!important;}
.manager-page .mkpi-panel > .mkpi-grid.mkpi-six{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile{box-sizing:border-box!important;min-width:0!important;min-height:105px!important;height:105px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:4px!important;padding:10px 12px!important;background:transparent!important;border:0!important;border-right:1px solid var(--la-line)!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile:last-child{border-right:0!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-label{order:0!important;display:flex!important;align-items:center!important;gap:5px!important;min-height:23px!important;height:auto!important;margin:0!important;padding:0!important;font-size:12px!important;font-weight:650!important;line-height:1.22!important;white-space:normal!important;overflow:visible!important;overflow-wrap:normal!important;word-break:normal!important;color:var(--la-muted)!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-label > span:not(.mkpi-climb-icon){min-width:0!important;flex:1!important;overflow-wrap:normal!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-label > .mkpi-tile-icon{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;flex:0 0 15px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-label > .mkpi-info{min-width:28px!important;width:28px!important;min-height:28px!important;height:28px!important;flex:0 0 28px!important;font-size:13px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-value{order:1!important;display:flex!important;flex-direction:row!important;align-items:baseline!important;min-height:32px!important;height:auto!important;gap:6px!important;margin:0!important;padding:0!important;white-space:normal!important;font-size:clamp(25px,2.0vw,32px)!important;line-height:1.08!important;letter-spacing:-.04em!important;font-weight:750!important;overflow:visible!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-comparison{order:2!important;margin:0!important;min-height:0!important;font-size:11px!important;line-height:1.3!important;white-space:normal!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile.mkpi-alltime::after{display:none!important;content:none!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime > .mkpi-value{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;min-height:0!important;font-size:inherit!important;letter-spacing:normal!important;white-space:normal!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-count{display:flex!important;flex-direction:row!important;align-items:baseline!important;gap:5px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-count strong{font-size:23px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-count small{font-size:11px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-record{display:flex!important;flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;gap:3px 5px!important;min-width:0!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-record strong{font-size:17px!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-record small{font-size:11px!important;line-height:1.15!important;}
.manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-alltime-record svg{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;}
.manager-page .mkpi-panel > .mkpi-grid > button.mkpi-climbing{appearance:none;text-align:left;color:var(--la-strong);cursor:pointer;background:rgba(255,255,255,.02)!important;border:1px solid var(--la-line)!important;border-radius:10px!important;}
.manager-page .mkpi-panel .mkpi-climb-icon{font-size:18px;line-height:1;color:var(--la-pink);flex:0 0 15px;}
.manager-page .mkpi-panel .mkpi-climbing-body{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:7px;align-items:center;min-width:0;order:1;}
.manager-page .mkpi-panel .mkpi-climbing-body:not(:has(.mkpi-climbing-cover)){grid-template-columns:minmax(0,1fr)}
.manager-page .mkpi-panel .mkpi-climbing-title{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2;line-clamp:2;max-width:100%;overflow:hidden!important;text-overflow:ellipsis!important;overflow-wrap:normal!important;word-break:normal!important;font-size:13px!important;font-weight:700!important;line-height:1.35!important;letter-spacing:0!important;}
.manager-page .mkpi-panel .mkpi-climbing-cover{width:38px!important;height:38px!important;min-width:38px!important;flex:0 0 38px!important;border-radius:7px!important;}
.manager-page .mkpi-panel > .mkpi-grid > button.mkpi-climbing:hover{background:rgba(255,255,255,.065)!important;}
.manager-page .mkpi-panel > .mkpi-grid > button.mkpi-climbing:focus-visible{outline:2px solid var(--la-pink)!important;outline-offset:2px!important;}
.manager-page .mkpi-panel > .mkpi-loading-grid > .mkpi-loading-tile{gap:8px!important;}
.manager-page .mkpi-panel .mkpi-loading-tile .mkpi-shimmer{display:block!important;flex:none!important;margin:0!important;}
.manager-page .mkpi-panel .mkpi-loading-tile .mkpi-shimmer-label{order:0!important;height:16px!important;width:72%!important;}
.manager-page .mkpi-panel .mkpi-loading-tile .mkpi-shimmer-value{order:1!important;height:28px!important;width:55%!important;}
.manager-page .mkpi-panel .mkpi-loading-tile .mkpi-shimmer-support{order:2!important;height:12px!important;width:62%!important;}
@media(max-width:800px){
 .manager-page .mkpi-panel{padding:12px!important;gap:8px!important;}
 .manager-page .mkpi-panel > .mkpi-grid,.manager-page .mkpi-panel > .mkpi-grid.mkpi-six{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
 .manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile{min-height:112px!important;height:112px!important;padding:10px!important;border-bottom:1px solid var(--la-line)!important;}
 .manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile:nth-child(even){border-right:0!important;}
 .manager-page .mkpi-panel > .mkpi-grid:not(.mkpi-six):not(.mkpi-loading-grid) > .mkpi-tile:last-child{grid-column:1/-1!important;border-right:0!important;}
 .manager-page .mkpi-panel > .mkpi-loading-grid:not(:has(> :nth-child(6))) > .mkpi-loading-tile:last-child{grid-column:1/-1!important;border-right:0!important;}
 .manager-page .mkpi-panel > .mkpi-grid > .mkpi-tile > .mkpi-value{font-size:26px!important;}
 .manager-page .mkpi-panel > .mkpi-grid > .mkpi-alltime .mkpi-value{font-size:inherit!important;}
}

/* MP1: six-item phone row overrides the legacy fifth-tile full-span rule. */
@media(max-width:800px){.manager-page .mkpi-panel > .mkpi-grid.mkpi-six > .mkpi-alltime{grid-column:auto!important;}}
/* The old loading-only rule spans skeleton #5; six-placeholder states keep 3 x 2. */
@media(max-width:800px){.manager-page .mkpi-panel > .mkpi-loading-grid.mkpi-six > .mkpi-loading-tile:nth-child(5){grid-column:auto!important;width:auto!important;}}
