/* Control ANDRIK v55.00n — stable unified headers, aligned daily-summary actions,
   native landscape scrolling and centre-only pull-down on the admin menu. */

@keyframes andrikEyeBreathN{
  0%,100%{transform:translate(-50%,-50%) scale(.965);filter:drop-shadow(0 0 12px rgba(0,255,124,.30)) brightness(.96)}
  50%{transform:translate(-50%,-50%) scale(1.045);filter:drop-shadow(0 0 28px rgba(0,255,124,.58)) brightness(1.08)}
}
@keyframes andrikEyeBreathGridN{
  0%,100%{transform:scale(.965);filter:drop-shadow(0 0 12px rgba(0,255,124,.30)) brightness(.96)}
  50%{transform:scale(1.045);filter:drop-shadow(0 0 28px rgba(0,255,124,.58)) brightness(1.08)}
}

/* --------------------------------------------------------------------------
   Comment collection — a self-contained Control header that cannot expand to
   the natural size of the source JPG, even if an older stylesheet is cached.
   -------------------------------------------------------------------------- */
html:has(body.comment-collection-page),
body.comment-collection-page{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}
body.comment-collection-page .collection-topbar{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:100%!important;
  height:118px!important;
  min-height:118px!important;
  max-height:118px!important;
  padding:0 clamp(12px,3vw,26px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 84px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  overflow:hidden!important;
  border-bottom:1px solid rgba(132,201,230,.15)!important;
  background:
    radial-gradient(circle at 50% 50%,rgba(0,255,124,.20),transparent 25%),
    linear-gradient(90deg,#02070b,#061a12 50%,#02070b)!important;
}
body.comment-collection-page .collection-logo{
  position:relative!important;
  inset:auto!important;
  grid-column:2!important;
  justify-self:center!important;
  align-self:center!important;
  width:82px!important;
  height:82px!important;
  min-width:82px!important;
  min-height:82px!important;
  max-width:82px!important;
  max-height:82px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#010807!important;
  overflow:hidden!important;
  display:block!important;
  box-shadow:0 0 28px rgba(0,255,124,.24)!important;
  text-decoration:none!important;
}
body.comment-collection-page .collection-logo img{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:78px!important;
  height:78px!important;
  min-width:78px!important;
  min-height:78px!important;
  max-width:78px!important;
  max-height:78px!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:50%!important;
  clip-path:circle(49% at 50% 50%)!important;
  animation:andrikEyeBreathN 3.8s ease-in-out infinite!important;
}
body.comment-collection-page .collection-nav{
  position:relative!important;
  inset:auto!important;
  min-width:0!important;
  width:auto!important;
  max-width:180px!important;
  min-height:46px!important;
  margin:0!important;
  padding:0 15px!important;
  border:1px solid rgba(139,210,238,.23)!important;
  border-radius:999px!important;
  background:rgba(7,22,31,.88)!important;
  color:#dff5ff!important;
  text-decoration:none!important;
  font:900 clamp(.74rem,2.5vw,.94rem)/1 system-ui,-apple-system,"Segoe UI",sans-serif!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(12px)!important;
}
body.comment-collection-page .collection-nav-back{grid-column:1!important;justify-self:start!important}
body.comment-collection-page .collection-nav-map{grid-column:3!important;justify-self:end!important}
body.comment-collection-page main{
  width:min(1120px,100%)!important;
  max-width:100%!important;
  margin:0 auto!important;
  padding-top:22px!important;
}
body.comment-collection-page .hero{
  width:100%!important;
  max-width:930px!important;
  margin:0 auto!important;
  text-align:center!important;
}
body.comment-collection-page .hero h1{
  max-width:880px!important;
  margin:7px auto 8px!important;
  font-size:clamp(2.25rem,9vw,4.8rem)!important;
  line-height:.94!important;
  letter-spacing:-.025em!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  text-wrap:balance!important;
  text-align:center!important;
}
body.comment-collection-page .hero p{
  max-width:760px!important;
  margin:0 auto!important;
  text-align:center!important;
  text-wrap:balance!important;
}
body.comment-collection-page .status{
  width:min(760px,100%)!important;
  margin:20px auto 0!important;
}

/* --------------------------------------------------------------------------
   Lyrics — same compact, centred, breathing-eye header as Service/Admin.
   -------------------------------------------------------------------------- */
html:has(body.lyrics-admin-page),
body.lyrics-admin-page{overflow-x:hidden!important}
body.lyrics-admin-page .control-detail-topbar{
  position:relative!important;
  width:100%!important;
  height:118px!important;
  min-height:118px!important;
  max-height:118px!important;
  overflow:hidden!important;
  border-bottom:1px solid rgba(132,201,230,.15)!important;
  background:
    radial-gradient(circle at 50% 50%,rgba(0,255,124,.19),transparent 25%),
    linear-gradient(90deg,#02070b,#061a12 50%,#02070b)!important;
}
body.lyrics-admin-page .control-detail-topbar::before,
body.lyrics-admin-page .control-detail-topbar::after{
  content:none!important;
  display:none!important;
  background:none!important;
}
body.lyrics-admin-page .control-detail-topbar .nav-shell{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  height:118px!important;
  min-height:118px!important;
  max-height:118px!important;
  padding:0 clamp(12px,3vw,26px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
body.lyrics-admin-page .control-detail-topbar .control-center-logo{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:82px!important;
  height:82px!important;
  min-width:82px!important;
  min-height:82px!important;
  max-width:82px!important;
  max-height:82px!important;
  margin:0!important;
  padding:0!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  overflow:visible!important;
  z-index:4!important;
}
body.lyrics-admin-page .control-detail-topbar .control-center-logo img{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:78px!important;
  height:78px!important;
  min-width:78px!important;
  min-height:78px!important;
  max-width:78px!important;
  max-height:78px!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  border-radius:50%!important;
  clip-path:circle(49% at 50% 50%)!important;
}
body.lyrics-admin-page .control-detail-topbar .control-center-logo .logo-ok{
  animation:andrikEyeBreathN 3.8s ease-in-out infinite!important;
}
body.lyrics-admin-page .control-detail-topbar .control-detail-nav{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  z-index:3!important;
}
body.lyrics-admin-page .control-detail-topbar .control-detail-nav a,
body.lyrics-admin-page .control-detail-topbar .control-detail-current{
  min-width:0!important;
  max-width:180px!important;
  min-height:44px!important;
  padding:0 14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(139,210,238,.22)!important;
  border-radius:999px!important;
  background:rgba(7,22,31,.86)!important;
  color:#dff5ff!important;
  text-decoration:none!important;
  font-size:clamp(.72rem,2.2vw,.9rem)!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
body.lyrics-admin-page .admin-main{padding-top:0!important;overflow-x:hidden!important}
body.lyrics-admin-page .admin-header.control-header{
  width:100%!important;
  max-width:1000px!important;
  margin:0 auto!important;
  padding:clamp(22px,5vw,44px) 16px 18px!important;
  text-align:center!important;
  overflow:hidden!important;
}
body.lyrics-admin-page .admin-header.control-header h1{
  max-width:100%!important;
  margin:6px auto 10px!important;
  font-size:clamp(2.25rem,11vw,5rem)!important;
  line-height:.94!important;
  letter-spacing:-.03em!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  text-wrap:balance!important;
  text-align:center!important;
}
body.lyrics-admin-page .admin-header.control-header p{
  max-width:860px!important;
  margin:0 auto!important;
  text-align:center!important;
  text-wrap:balance!important;
}

/* --------------------------------------------------------------------------
   Daily summary — both floating actions share exactly the same baseline.
   -------------------------------------------------------------------------- */
body.control-home-page.control-summary-visible .control-comment-collection-button,
body.control-home-page.control-summary-visible .control-summary-refresh{
  display:inline-flex!important;
  position:fixed!important;
  top:auto!important;
  bottom:calc(16px + env(safe-area-inset-bottom))!important;
  inset-block-end:calc(16px + env(safe-area-inset-bottom))!important;
  height:58px!important;
  min-height:58px!important;
  max-height:58px!important;
  margin:0!important;
  padding:0 16px!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-radius:999px!important;
  transform:translate3d(0,0,0)!important;
  z-index:2147482500!important;
  font-size:clamp(.72rem,2.45vw,.94rem)!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
body.control-home-page.control-summary-visible .control-comment-collection-button{
  left:max(12px,env(safe-area-inset-left))!important;
  right:auto!important;
  width:min(43vw,248px)!important;
  max-width:43vw!important;
}
body.control-home-page.control-summary-visible .control-summary-refresh{
  left:auto!important;
  right:max(12px,env(safe-area-inset-right))!important;
  width:min(49vw,292px)!important;
  max-width:49vw!important;
}
body.control-home-page.control-summary-visible .control-comment-collection-button:active,
body.control-home-page.control-summary-visible .control-summary-refresh:active,
body.control-home-page.control-summary-visible .control-summary-refresh.is-pressed{
  transform:translate3d(0,0,0) scale(.98)!important;
}
body.control-home-page.control-summary-visible .control-summary-page>.control-swipe-page-inner{
  padding-bottom:calc(104px + env(safe-area-inset-bottom))!important;
}

/* --------------------------------------------------------------------------
   Control Home landscape — the page itself scrolls natively. The JS pull-down
   gesture is enabled only from the centre third of the admin-menu screen.
   -------------------------------------------------------------------------- */
@media (orientation:landscape){
  html:has(body.control-home-page){
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    overflow:hidden!important;
  }
  body.control-home-page{
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    display:grid!important;
    grid-template-rows:68px minmax(0,1fr)!important;
    overflow:hidden!important;
  }
  body.control-home-page .control-topbar,
  body.control-home-page .control-topbar .nav-shell{
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
  }
  body.control-home-page .admin-main.control-swipe-main{
    grid-row:2!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  body.control-home-page .control-swipe-shell,
  body.control-home-page .control-swipe-track{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
    touch-action:pan-y!important;
    -ms-touch-action:pan-y!important;
  }
  body.control-home-page .control-swipe-page,
  body.control-home-page .control-swipe-page[aria-hidden="false"],
  body.control-home-page .control-summary-page,
  body.control-home-page .control-menu-page,
  body.control-home-page .control-activity-page{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    -ms-touch-action:pan-y!important;
    overscroll-behavior-y:contain!important;
    scrollbar-gutter:stable!important;
  }
  body.control-home-page .control-swipe-page>.control-swipe-page-inner{
    width:100%!important;
    height:auto!important;
    min-height:calc(100% + 6px)!important;
    max-height:none!important;
    overflow:visible!important;
    padding-bottom:calc(90px + env(safe-area-inset-bottom))!important;
    touch-action:pan-y!important;
    -ms-touch-action:pan-y!important;
  }
  body.control-home-page.control-summary-visible .control-comment-collection-button,
  body.control-home-page.control-summary-visible .control-summary-refresh{
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
    inset-block-end:calc(12px + env(safe-area-inset-bottom))!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
  }
  body.control-home-page.control-summary-visible .control-comment-collection-button{
    left:max(18px,env(safe-area-inset-left))!important;
    width:min(30vw,260px)!important;
    max-width:30vw!important;
  }
  body.control-home-page.control-summary-visible .control-summary-refresh{
    right:max(18px,env(safe-area-inset-right))!important;
    width:min(34vw,300px)!important;
    max-width:34vw!important;
  }
  body.comment-collection-page .collection-topbar{
    height:82px!important;
    min-height:82px!important;
    max-height:82px!important;
    grid-template-columns:minmax(180px,1fr) 66px minmax(180px,1fr)!important;
    padding-inline:22px!important;
  }
  body.comment-collection-page .collection-logo{
    width:64px!important;
    height:64px!important;
    min-width:64px!important;
    min-height:64px!important;
    max-width:64px!important;
    max-height:64px!important;
  }
  body.comment-collection-page .collection-logo img{
    width:60px!important;
    height:60px!important;
    min-width:60px!important;
    min-height:60px!important;
    max-width:60px!important;
    max-height:60px!important;
  }
  body.comment-collection-page .collection-nav{
    min-height:42px!important;
    max-width:190px!important;
    font-size:.88rem!important;
  }
  body.comment-collection-page main{padding-top:14px!important}
  body.comment-collection-page .hero h1{
    max-width:1080px!important;
    margin:5px auto 5px!important;
    font-size:clamp(2.05rem,4.4vw,3.5rem)!important;
    line-height:.94!important;
  }
  body.comment-collection-page .hero p{
    font-size:.86rem!important;
    line-height:1.34!important;
  }
  body.comment-collection-page .status{
    min-height:46px!important;
    margin-top:11px!important;
  }
  body.comment-collection-page .card{margin-top:14px!important}

  body.lyrics-admin-page .control-detail-topbar,
  body.lyrics-admin-page .control-detail-topbar .nav-shell{
    height:82px!important;
    min-height:82px!important;
    max-height:82px!important;
  }
  body.lyrics-admin-page .control-detail-topbar .control-center-logo{
    width:64px!important;
    height:64px!important;
    min-width:64px!important;
    min-height:64px!important;
    max-width:64px!important;
    max-height:64px!important;
  }
  body.lyrics-admin-page .control-detail-topbar .control-center-logo img{
    width:60px!important;
    height:60px!important;
    min-width:60px!important;
    min-height:60px!important;
    max-width:60px!important;
    max-height:60px!important;
  }
  body.lyrics-admin-page .control-detail-topbar .control-detail-nav a,
  body.lyrics-admin-page .control-detail-topbar .control-detail-current{
    min-height:40px!important;
    max-width:190px!important;
    font-size:.84rem!important;
  }
  body.lyrics-admin-page .admin-header.control-header{
    padding:14px 16px 14px!important;
  }
  body.lyrics-admin-page .admin-header.control-header .eyeline{
    font-size:clamp(.65rem,1.2vw,.88rem)!important;
    letter-spacing:.24em!important;
  }
  body.lyrics-admin-page .admin-header.control-header h1{
    margin:4px auto 7px!important;
    font-size:clamp(2rem,4.8vw,3.55rem)!important;
    line-height:.94!important;
  }
  body.lyrics-admin-page .admin-header.control-header p{
    max-width:920px!important;
    font-size:clamp(.74rem,1.2vw,.92rem)!important;
    line-height:1.4!important;
  }
}

@media (max-width:390px){
  body.comment-collection-page .collection-topbar{
    grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr)!important;
    padding-inline:8px!important;
    gap:6px!important;
  }
  body.comment-collection-page .collection-logo{
    width:70px!important;height:70px!important;min-width:70px!important;min-height:70px!important;max-width:70px!important;max-height:70px!important;
  }
  body.comment-collection-page .collection-logo img{
    width:66px!important;height:66px!important;min-width:66px!important;min-height:66px!important;max-width:66px!important;max-height:66px!important;
  }
  body.comment-collection-page .collection-nav{padding-inline:9px!important;font-size:.72rem!important}
  body.comment-collection-page .hero h1{font-size:clamp(2rem,12vw,2.8rem)!important}

  body.lyrics-admin-page .control-detail-topbar .control-detail-nav a,
  body.lyrics-admin-page .control-detail-topbar .control-detail-current{
    max-width:118px!important;
    padding-inline:9px!important;
    font-size:.68rem!important;
  }
  body.control-home-page.control-summary-visible .control-comment-collection-button,
  body.control-home-page.control-summary-visible .control-summary-refresh{
    padding-inline:10px!important;
    font-size:.68rem!important;
  }
}

@media (prefers-reduced-motion:reduce){
  body.comment-collection-page .collection-logo img,
  body.lyrics-admin-page .control-detail-topbar .control-center-logo .logo-ok{
    animation:none!important;
  }
}

/* Final ID-level override: legacy v54 rules target #controlSummaryRefresh and
   otherwise lift it above the comments button. */
body.control-home-page.control-summary-visible #controlSummaryRefresh{
  left:auto!important;
  right:max(12px,env(safe-area-inset-right))!important;
  bottom:calc(16px + env(safe-area-inset-bottom))!important;
  inset-block-end:calc(16px + env(safe-area-inset-bottom))!important;
  width:min(49vw,292px)!important;
  min-width:0!important;
  max-width:49vw!important;
  height:58px!important;
  min-height:58px!important;
  max-height:58px!important;
  margin:0!important;
  padding:0 16px!important;
  transform:translate3d(0,0,0)!important;
}
body.control-home-page.control-summary-visible #controlSummaryRefresh:active,
body.control-home-page.control-summary-visible #controlSummaryRefresh.is-pressed{
  transform:translate3d(0,0,0) scale(.98)!important;
}
@media (orientation:landscape){
  body.control-home-page.control-summary-visible #controlSummaryRefresh{
    right:max(18px,env(safe-area-inset-right))!important;
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
    inset-block-end:calc(12px + env(safe-area-inset-bottom))!important;
    width:min(34vw,300px)!important;
    max-width:34vw!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
  }
}
@media (max-width:390px) and (orientation:portrait){
  body.control-home-page.control-summary-visible #controlSummaryRefresh{
    right:max(7px,env(safe-area-inset-right))!important;
    bottom:calc(16px + env(safe-area-inset-bottom))!important;
    width:min(49vw,250px)!important;
    max-width:49vw!important;
    min-height:58px!important;
    height:58px!important;
  }
}
