/* Control ANDRIK v55.00 FINAL STABLE R2 — unified living eye, centred total, compact monitor and cyclic admin sections. */

@keyframes andrikUnifiedEyeR2{
  0%,100%{transform:translate(-50%,-50%) scale(.965);filter:brightness(1.10) saturate(1.28) drop-shadow(0 0 9px rgba(92,255,150,.66)) drop-shadow(0 0 24px rgba(35,232,103,.48));}
  50%{transform:translate(-50%,-50%) scale(1.055);filter:brightness(1.38) saturate(1.48) drop-shadow(0 0 16px rgba(135,255,180,.98)) drop-shadow(0 0 42px rgba(37,239,108,.86)) drop-shadow(0 0 68px rgba(6,175,65,.50));}
}
@keyframes andrikUnifiedHaloR2{
  0%,100%{transform:translate(-50%,-50%) scale(.76);opacity:.20}
  50%{transform:translate(-50%,-50%) scale(1.22);opacity:.68}
}

/* One topbar geometry for every Control detail page. */
.control-page .control-detail-topbar,
.youtube-admin-page .youtube-topbar-clean,
.comment-collection-page .control-detail-topbar{
  position:relative!important;
  top:auto!important;
  width:100%!important;
  height:92px!important;
  min-height:92px!important;
  max-height:92px!important;
  overflow:hidden!important;
  border-bottom:1px solid rgba(132,201,230,.15)!important;
  background:linear-gradient(90deg,#02070b,#061a12 50%,#02070b)!important;
}
.control-page .control-detail-topbar::before,
.youtube-admin-page .youtube-topbar-clean::before,
.comment-collection-page .control-detail-topbar::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  transform:none!important;
  background:radial-gradient(circle at 50% 50%,rgba(0,255,124,.18),transparent 31%)!important;
  opacity:1!important;
  pointer-events:none!important;
}
.control-page .control-detail-topbar::after,
.youtube-admin-page .youtube-topbar-clean::after,
.comment-collection-page .control-detail-topbar::after{display:none!important;content:none!important}
.control-page .control-detail-topbar .nav-shell,
.youtube-admin-page .youtube-topbar-clean .nav-shell,
.comment-collection-page .control-detail-topbar .nav-shell{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  height:92px!important;
  min-height:92px!important;
  max-height:92px!important;
  padding:0 clamp(12px,3vw,28px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
.control-page .control-detail-topbar .control-center-logo,
.youtube-admin-page .youtube-topbar-clean .control-center-logo,
.comment-collection-page .control-detail-topbar .control-center-logo{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  inset:auto auto auto auto!important;
  width:76px!important;
  height:76px!important;
  min-width:76px!important;
  min-height:76px!important;
  max-width:76px!important;
  max-height:76px!important;
  margin:0!important;
  padding:0!important;
  transform:translate(-50%,-50%)!important;
  transform-origin:center!important;
  border-radius:50%!important;
  overflow:visible!important;
  display:block!important;
  isolation:isolate!important;
  z-index:5!important;
}
.control-page .control-detail-topbar .control-center-logo::after,
.youtube-admin-page .youtube-topbar-clean .control-center-logo::after,
.comment-collection-page .control-detail-topbar .control-center-logo::after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:82px!important;
  height:82px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(92,255,151,.38),rgba(22,205,85,.15) 48%,transparent 72%)!important;
  transform:translate(-50%,-50%) scale(.8)!important;
  animation:andrikUnifiedHaloR2 2.45s ease-in-out infinite!important;
  pointer-events:none!important;
  z-index:0!important;
}
.control-page .control-detail-topbar .control-center-logo .logo-ok,
.youtube-admin-page .youtube-topbar-clean .control-center-logo .logo-ok,
.comment-collection-page .control-detail-topbar .control-center-logo .logo-ok{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  inset:auto!important;
  width:68px!important;
  height:68px!important;
  min-width:68px!important;
  min-height:68px!important;
  max-width:68px!important;
  max-height:68px!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;
  opacity:1!important;
  visibility:visible!important;
  z-index:2!important;
  animation:andrikUnifiedEyeR2 2.45s ease-in-out infinite!important;
  animation-play-state:running!important;
  will-change:transform,filter!important;
}
.control-page .control-detail-topbar .control-center-logo .logo-error,
.youtube-admin-page .youtube-topbar-clean .control-center-logo .logo-error,
.comment-collection-page .control-detail-topbar .control-center-logo .logo-error{
  position:absolute!important;left:50%!important;top:50%!important;width:62px!important;height:62px!important;transform:translate(-50%,-50%)!important;border-radius:50%!important;z-index:3!important;
}
.control-page .control-detail-topbar .control-detail-nav,
.comment-collection-page .control-detail-topbar .control-detail-nav{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  padding:0 clamp(12px,3vw,28px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
  pointer-events:none!important;
  z-index:4!important;
}
.control-page .control-detail-topbar .control-detail-nav>*:first-child,
.comment-collection-page .control-detail-topbar .control-detail-nav>*:first-child{grid-column:1;justify-self:start!important;pointer-events:auto!important}
.control-page .control-detail-topbar .control-detail-nav>*:last-child,
.comment-collection-page .control-detail-topbar .control-detail-nav>*:last-child{grid-column:3;justify-self:end!important;pointer-events:auto!important}
.control-page .control-detail-topbar .control-detail-nav a,
.control-page .control-detail-topbar .control-detail-current,
.comment-collection-page .control-detail-topbar .control-detail-nav a,
.comment-collection-page .control-detail-topbar .control-detail-current{
  min-width:0!important;
  max-width:min(31vw,190px)!important;
  min-height:42px!important;
  padding:0 13px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(139,210,238,.20)!important;
  border-radius:999px!important;
  background:rgba(7,22,31,.78)!important;
  color:#dff5ff!important;
  text-decoration:none!important;
  font-weight:850!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Keep the YouTube eye identical to the common Control eye. */
.youtube-admin-page .youtube-topbar-clean .analytics-topbar-minimal{display:flex!important;place-items:unset!important}

/* Total: label and number centered inside a complete cloud. */
.analytics-v54-46-page .world-map-total{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1!important;
  gap:8px!important;
  padding:0 17px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}
.analytics-v54-46-page .world-map-total span,
.analytics-v54-46-page .world-map-total strong{
  position:static!important;
  inset:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  transform:none!important;
  vertical-align:middle!important;
}
@media(orientation:landscape){
  .analytics-v54-46-page .world-map-total{
    width:196px!important;
    min-width:196px!important;
    max-width:196px!important;
    min-height:48px!important;
    justify-self:start!important;
    border:1px solid rgba(112,206,244,.30)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,rgba(8,30,42,.95),rgba(3,17,25,.98))!important;
    box-shadow:inset 0 0 15px rgba(109,220,255,.06),0 9px 24px rgba(0,0,0,.22)!important;
  }
}

/* Compact ANDRIK Monitor: chart and legend hug their real content. */
.observability-page .uptime-card{height:auto!important;min-height:0!important;align-self:start!important}
.observability-page .uptime-chart-shell{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  max-height:252px!important;
  overflow:hidden!important;
  align-self:start!important;
}
.observability-page #andrikMonitorChart{
  display:block!important;
  width:100%!important;
  height:184px!important;
  min-height:184px!important;
  max-height:184px!important;
  overflow:hidden!important;
}
.observability-page #andrikMonitorChart>svg,
.observability-page .uptime-chart-shell svg{
  display:block!important;
  width:100%!important;
  height:184px!important;
  min-height:184px!important;
  max-height:184px!important;
  object-fit:fill!important;
}
.observability-page .uptime-empty-chart{height:184px!important;min-height:184px!important;max-height:184px!important}
.observability-page .uptime-legend{position:static!important;min-height:0!important;margin:0!important;padding:9px 14px 12px!important}
@media(orientation:landscape){
  .observability-page .uptime-chart-shell{max-height:214px!important}
  .observability-page #andrikMonitorChart,
  .observability-page #andrikMonitorChart>svg,
  .observability-page .uptime-chart-shell svg,
  .observability-page .uptime-empty-chart{height:150px!important;min-height:150px!important;max-height:150px!important}
}

/* Cyclic section swipe indicator. */
.control-section-swipe-indicator{
  position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));z-index:2147481000;
  transform:translate(-50%,18px);display:flex;align-items:center;gap:9px;min-height:34px;padding:0 13px;
  border:1px solid rgba(126,209,239,.19);border-radius:999px;background:rgba(4,17,25,.90);color:#bfe9f8;
  font:800 .72rem/1 system-ui,-apple-system,"Segoe UI",sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:0;pointer-events:none;
  transition:opacity .16s ease,transform .16s ease;
}
.control-section-swipe-indicator.is-visible{opacity:1;transform:translate(-50%,0)}
.control-section-swipe-indicator .dots{display:flex;gap:5px}
.control-section-swipe-indicator i{width:6px;height:6px;border-radius:50%;background:#536a78}
.control-section-swipe-indicator i.is-active{width:18px;border-radius:999px;background:#76e0ff;box-shadow:0 0 12px rgba(91,219,255,.45)}

@media(max-width:420px){
  .control-page .control-detail-topbar .control-detail-nav a,
  .control-page .control-detail-topbar .control-detail-current,
  .comment-collection-page .control-detail-topbar .control-detail-nav a,
  .comment-collection-page .control-detail-topbar .control-detail-current{font-size:.72rem!important;padding-inline:9px!important;max-width:32vw!important}
}
@media(prefers-reduced-motion:reduce){
  .control-page .control-detail-topbar .control-center-logo::after,
  .youtube-admin-page .youtube-topbar-clean .control-center-logo::after,
  .comment-collection-page .control-detail-topbar .control-center-logo::after,
  .control-page .control-detail-topbar .control-center-logo .logo-ok,
  .youtube-admin-page .youtube-topbar-clean .control-center-logo .logo-ok,
  .comment-collection-page .control-detail-topbar .control-center-logo .logo-ok{animation-duration:4.4s!important;animation-iteration-count:infinite!important}
}
