/* Shared ocean surface for the board and the three company ranking pages. */
body[data-app=front].serene-rebuild .metric-ranking-page [data-leaderboard-component] .metric-leaderboard-row.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3.has-rank-ocean-canvas{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.76),rgba(214,244,255,.54) 45%,rgba(202,238,251,.64)),
    rgba(225,247,255,.74)!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page [data-leaderboard-component] .metric-leaderboard-row.has-rank-ocean-canvas::before,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas::before,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1.has-rank-ocean-canvas::before{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page [data-leaderboard-component] .metric-leaderboard-row.has-rank-ocean-canvas::after,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas::after{
  content:""!important;
  position:absolute!important;
  inset:1px!important;
  z-index:1!important;
  width:auto!important;
  height:auto!important;
  border-radius:inherit!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.18) 34%,transparent 72%),
    linear-gradient(100deg,transparent 0 28%,rgba(255,255,255,.24) 40%,transparent 52% 100%)!important;
  opacity:.78!important;
  filter:none!important;
  transform:none!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > .ranking-ocean-layer,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-layer{
  position:absolute!important;
  inset:-18% -7%!important;
  z-index:0!important;
  display:block!important;
  border-radius:inherit!important;
  background-image:url("media/ranking-ocean-wave.png")!important;
  background-repeat:no-repeat!important;
  background-size:126% auto!important;
  background-position:50% 58%;
  opacity:.58;
  filter:saturate(1.16) contrast(.96) brightness(1.26);
  transform:translateZ(0) scale(1.05);
  transform-origin:center;
  pointer-events:none!important;
  will-change:transform,background-position,opacity;
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas .ranking-ocean-glint,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-glint{
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(75% 120% at 24% 86%,rgba(255,255,255,.46),transparent 58%),
    radial-gradient(65% 90% at 72% 8%,rgba(111,214,255,.30),transparent 62%),
    linear-gradient(105deg,transparent 0 22%,rgba(255,255,255,.32) 32%,transparent 44% 100%);
  opacity:.52;
  mix-blend-mode:screen;
  pointer-events:none;
  will-change:transform,opacity;
}

body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas td,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas td:first-child,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas td:last-child,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas td + td,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank.has-rank-ocean-canvas td,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank.has-rank-ocean-canvas td:first-child,
body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank.has-rank-ocean-canvas td:nth-child(2){
  position:relative!important;
  z-index:2!important;
  border-left:0!important;
  border-right:0!important;
  border-color:transparent!important;
  background:transparent!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > :not(.ranking-ocean-layer){
  position:relative!important;
  z-index:2!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas:hover .ranking-ocean-layer,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas:hover .ranking-ocean-layer{
  opacity:.66!important;
}

body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-award,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-standard,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-badge{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-award,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-standard{
  width:auto!important;
  min-width:0!important;
  padding:0!important;
}

body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .rank-badge{
  width:auto!important;
  height:auto!important;
  color:#0f4354!important;
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > .ranking-ocean-layer,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-layer{
    inset:-20% -10%!important;
    background-size:138% auto!important;
    opacity:.54;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > .ranking-ocean-layer,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-layer{
    opacity:.48!important;
    will-change:auto;
  }
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas::after{
  animation:ranking-ocean-glass-sheen 7.8s ease-in-out infinite alternate!important;
}

body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas :is(.metric-leaderboard-name strong,.metric-leaderboard-value strong,.metric-leaderboard-value span,.metric-leaderboard-value small){
  color:#062b38!important;
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas::after{
    animation:none!important;
  }
}

/* Three-end compatibility pass: keep the top capsule usable on narrow phones. */
@media(max-width:420px){
  body[data-app=front].serene-rebuild .sidebar.public-sidebar{
    height:auto!important;
    min-height:0!important;
    padding:8px 10px!important;
    border-radius:22px!important;
  }

  body[data-app=front].serene-rebuild .sidebar.public-sidebar .brand-block{
    min-height:32px!important;
    margin-bottom:6px!important;
    padding:0!important;
    justify-content:center!important;
  }

  body[data-app=front].serene-rebuild .sidebar.public-sidebar .brand-switch-logo{
    width:28px!important;
    height:28px!important;
    border-radius:999px!important;
  }

  body[data-app=front].serene-rebuild .sidebar.public-sidebar .brand-block strong{
    font-size:15px!important;
  }

  body[data-app=front].serene-rebuild .nav-menu{
    flex-wrap:nowrap!important;
    gap:6px!important;
  }

  body[data-app=front].serene-rebuild .nav-item{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    min-height:40px!important;
  }

  body[data-app=front].serene-rebuild .nav-item.is-active{
    min-width:142px!important;
    gap:7px!important;
    padding:0 10px 0 7px!important;
  }

  body[data-app=front].serene-rebuild .nav-item.is-active svg{
    width:28px!important;
    height:28px!important;
    flex-basis:28px!important;
    padding:6px!important;
  }

  body[data-app=front].serene-rebuild .nav-item.is-active span{
    max-width:86px!important;
    font-size:13px!important;
  }
}

/* Mobile ranking cards: keep every enterprise readable inside one pearl component. */
@media(max-width:767px){
  body[data-app=front].serene-rebuild .ranking-panel .table-wrap{
    overflow:visible!important;
  }

  body[data-app=front].serene-rebuild .ranking-table,
  body[data-app=front].serene-rebuild .ranking-table thead,
  body[data-app=front].serene-rebuild .ranking-table tbody,
  body[data-app=front].serene-rebuild .ranking-table tr,
  body[data-app=front].serene-rebuild .ranking-table th,
  body[data-app=front].serene-rebuild .ranking-table td{
    display:block!important;
    width:100%!important;
    min-width:0!important;
  }

  body[data-app=front].serene-rebuild .ranking-table{
    table-layout:auto!important;
  }

  body[data-app=front].serene-rebuild .ranking-table thead{
    display:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody{
    display:grid!important;
    gap:12px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr) minmax(74px,auto)!important;
    grid-template-areas:
      "rank company perf"
      "rank customers opportunities"
      "rank progress progress"!important;
    gap:8px 10px!important;
    min-height:0!important;
    padding:12px!important;
    border-radius:24px!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.78),rgba(213,243,255,.54) 52%,rgba(230,248,255,.66)),
      rgba(225,247,255,.70)!important;
    color:#103242!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr::after,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas::after{
    height:44%!important;
    opacity:.48!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank td,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas td{
    height:auto!important;
    min-height:0!important;
    width:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(1){
    grid-area:rank!important;
    display:grid!important;
    place-items:center!important;
    align-self:stretch!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(2){
    grid-area:company!important;
    align-self:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(3){
    grid-area:perf!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(4){
    grid-area:customers!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(5){
    grid-area:opportunities!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td:nth-child(6){
    grid-area:progress!important;
    align-self:stretch!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-award,
  body[data-app=front].serene-rebuild .ranking-table .rank-standard{
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:100%!important;
    min-height:96px!important;
    padding:0!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.54)!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-award span{
    display:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-trophy{
    width:18px!important;
    height:18px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-badge{
    font-size:12px!important;
    font-weight:800!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-cell{
    gap:8px!important;
    overflow:hidden!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-avatar,
  body[data-app=front].serene-rebuild .ranking-table .company-avatar-badge{
    width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-name{
    color:#0e3547!important;
    font-size:14px!important;
    font-weight:800!important;
    line-height:1.2!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .number-cell{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:6px!important;
    min-height:34px!important;
    padding:6px 8px!important;
    border:1px solid rgba(255,255,255,.54)!important;
    border-radius:999px!important;
    color:#11384a!important;
    font-size:12px!important;
    font-weight:800!important;
    background:rgba(255,255,255,.36)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.70)!important;
    white-space:nowrap!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .money-cell{
    justify-content:flex-end!important;
    min-width:74px!important;
    font-size:11.5px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table td:nth-child(3)::before,
  body[data-app=front].serene-rebuild .ranking-table td:nth-child(4)::before,
  body[data-app=front].serene-rebuild .ranking-table td:nth-child(5)::before{
    display:block!important;
    margin-bottom:0!important;
    color:#53798b!important;
    font-family:"Inter",sans-serif!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .ranking-table td:nth-child(3)::before{content:"业绩"!important;}
  body[data-app=front].serene-rebuild .ranking-table td:nth-child(4)::before{content:"新客户"!important;}
  body[data-app=front].serene-rebuild .ranking-table td:nth-child(5)::before{content:"商机"!important;}

  body[data-app=front].serene-rebuild .ranking-table .progress-line{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
    align-items:center!important;
    min-height:30px!important;
    padding:4px 2px 0!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .progress-track{
    height:6px!important;
    background:rgba(71,139,174,.18)!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .progress-value{
    color:#0f3546!important;
    font-size:12px!important;
    font-weight:800!important;
  }
}

@media(max-width:370px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas{
    grid-template-columns:42px minmax(0,1fr) minmax(68px,auto)!important;
    gap:7px!important;
    padding:11px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-award,
  body[data-app=front].serene-rebuild .ranking-table .rank-standard{
    width:38px!important;
    min-height:92px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-name{
    font-size:13px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .number-cell{
    min-height:40px!important;
    padding-inline:6px!important;
    font-size:12px!important;
  }
}

/* Ocean layer is injected before table cells; target cells by type/class so mobile grids stay aligned. */
@media(max-width:767px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.rank-cell{
    grid-area:rank!important;
    display:grid!important;
    place-items:center!important;
    align-self:stretch!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(2){
    grid-area:company!important;
    align-self:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell{
    grid-area:perf!important;
    align-self:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4){
    grid-area:customers!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell{
    grid-area:opportunities!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.progress-cell{
    grid-area:progress!important;
    align-self:stretch!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody td::before{
    content:none!important;
    display:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{
    display:block!important;
    margin-bottom:0!important;
    color:#53798b!important;
    font-family:"Inter",sans-serif!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before{content:"业绩"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before{content:"新客户"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{content:"商机"!important;}

  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > .ranking-ocean-layer,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-layer{
    opacity:.36!important;
    filter:saturate(1.02) contrast(.94) brightness(1.28)!important;
  }

  body[data-app=front].serene-rebuild .metric-ranking-page [data-leaderboard-component] .metric-leaderboard-row.has-rank-ocean-canvas::after,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas::after{
    opacity:.82!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.32) 42%,rgba(255,255,255,.12) 100%),
      linear-gradient(100deg,transparent 0 24%,rgba(255,255,255,.30) 38%,transparent 54% 100%)!important;
  }
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td::before{
    content:none!important;
    display:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{
    display:block!important;
    color:#53798b!important;
    font-family:"Inter",sans-serif!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before{content:"业绩"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before{content:"新客户"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{content:"商机"!important;}
}

/* Ocean-style liquid flow for the top navigation capsule. */
body[data-app=front].serene-rebuild .sidebar.public-sidebar{
  position:fixed!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-color:rgba(255,255,255,.76)!important;
  background:
    linear-gradient(90deg,rgba(255,238,241,.74),rgba(250,253,255,.66) 30%,rgba(221,242,255,.70) 100%),
    rgba(255,255,255,.62)!important;
  box-shadow:
    0 18px 54px rgba(83,94,108,.12),
    inset 0 1px rgba(255,255,255,.90)!important;
}

body[data-app=front].serene-rebuild .sidebar.public-sidebar::before{
  content:""!important;
  position:absolute!important;
  inset:-70% -18%!important;
  z-index:0!important;
  display:block!important;
  border-radius:inherit!important;
  background:
    radial-gradient(48% 58% at 72% 46%,rgba(58,145,255,.48),transparent 68%),
    radial-gradient(40% 48% at 57% 42%,rgba(109,235,255,.34),transparent 70%),
    radial-gradient(38% 52% at 82% 54%,rgba(119,95,255,.24),transparent 70%),
    radial-gradient(44% 56% at 16% 44%,rgba(255,161,174,.22),transparent 70%),
    linear-gradient(90deg,rgba(255,255,255,.88),rgba(228,244,255,.52) 46%,rgba(84,163,255,.34));
  background-size:160% 160%,140% 140%,150% 150%,130% 130%,100% 100%;
  background-position:78% 42%,58% 36%,86% 58%,12% 42%,center;
  opacity:.72!important;
  filter:blur(10px) saturate(1.24) brightness(1.05);
  transform:translate3d(-2%,0,0) scale(1.03);
  animation:top-nav-ocean-flow 9.5s ease-in-out infinite alternate;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild .sidebar.public-sidebar .brand-block,
body[data-app=front].serene-rebuild .sidebar.public-sidebar .nav-menu,
body[data-app=front].serene-rebuild .sidebar.public-sidebar .season-card{
  position:relative!important;
  z-index:2!important;
}

body[data-app=front].serene-rebuild .sidebar.public-sidebar::after{
  z-index:3!important;
}

body[data-app=front].serene-rebuild.nav-is-scrolled .sidebar.public-sidebar::before{
  opacity:.52!important;
  filter:blur(12px) saturate(1.12) brightness(1.08);
}

@keyframes top-nav-ocean-flow{
  0%{
    background-position:78% 42%,58% 36%,86% 58%,12% 42%,center;
    transform:translate3d(-4%,0,0) scale(1.03);
  }
  48%{
    background-position:58% 58%,72% 48%,68% 42%,24% 54%,center;
    transform:translate3d(2%,-1%,0) scale(1.07);
  }
  100%{
    background-position:42% 46%,84% 62%,54% 50%,32% 38%,center;
    transform:translate3d(5%,1%,0) scale(1.04);
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .sidebar.public-sidebar::before{
    animation:none!important;
    opacity:.56!important;
  }
}

/* Dashboard company components: mountain-push GSAP background. */
body[data-app=front].serene-rebuild .cockpit-main-grid.business-main-grid,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-main-grid.business-main-grid{
  grid-template-columns:minmax(0,1fr)!important;
  width:100%!important;
}

body[data-app=front].serene-rebuild [data-panel=dashboard] .cockpit-shell{
  width:100%!important;
  max-width:none!important;
  gap:clamp(14px,1.8vw,24px)!important;
}

body[data-app=front].serene-rebuild .top-five-panel,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel{
  width:100%!important;
  padding:clamp(10px,1.2vw,18px)!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars{
  display:grid!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  width:100%!important;
  max-width:min(100%,1760px)!important;
  margin-inline:auto!important;
  gap:clamp(12px,1vw,16px)!important;
  background:transparent!important;
  border-radius:36px!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-columns:42px 52px minmax(220px,.62fr) minmax(220px,1fr) minmax(58px,72px)!important;
  align-items:center!important;
  gap:clamp(10px,1.1vw,18px)!important;
  min-height:76px!important;
  padding:12px clamp(14px,1.55vw,24px)!important;
  border:1px solid rgba(255,255,255,.74)!important;
  border-bottom:1px solid rgba(255,255,255,.74)!important;
  border-radius:999px!important;
  background:
    linear-gradient(110deg,rgba(255,255,255,.76),rgba(222,247,255,.58) 52%,rgba(244,253,255,.72)),
    rgba(224,247,255,.72)!important;
  box-shadow:
    0 16px 40px rgba(56,129,176,.11),
    inset 0 1px rgba(255,255,255,.92),
    inset 0 -1px rgba(85,158,204,.13)!important;
  backdrop-filter:blur(26px) saturate(158%)!important;
  -webkit-backdrop-filter:blur(26px) saturate(158%)!important;
  transform:none!important;
  transition:border-color .22s ease,box-shadow .22s ease,background .22s ease!important;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-company-card{
  z-index:2!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover{
  border-color:rgba(136,215,255,.82)!important;
  background:
    linear-gradient(110deg,rgba(255,255,255,.82),rgba(221,248,255,.64) 54%,rgba(247,254,255,.78)),
    rgba(226,249,255,.78)!important;
  box-shadow:
    0 20px 48px rgba(56,129,176,.14),
    inset 0 1px rgba(255,255,255,.96),
    inset 0 -1px rgba(85,158,204,.15)!important;
  transform:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-mountain-layer{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  transform:translateZ(0);
  transform-origin:50% 100%;
  will-change:transform,background-position,opacity;
}

body[data-app=front].serene-rebuild .dashboard-company-card .mountain-sky{
  inset:-76% -18%!important;
  background-image:
    linear-gradient(90deg,rgba(229,250,255,.88),rgba(219,244,255,.52) 44%,rgba(255,255,255,.72)),
    url("media/serene-art-poster.png")!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%,142% auto!important;
  background-position:center,50% 54%;
  opacity:.52;
  filter:saturate(.58) hue-rotate(170deg) brightness(1.15) contrast(.9);
}

body[data-app=front].serene-rebuild .dashboard-company-card .mountain-far,
body[data-app=front].serene-rebuild .dashboard-company-card .mountain-near{
  left:-30%!important;
  right:-38%!important;
  top:auto!important;
  bottom:-2px!important;
  height:74%!important;
  background-repeat:repeat-x!important;
  background-size:50% 100%!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .mountain-far{
  background:
    linear-gradient(180deg,rgba(255,255,255,0),rgba(132,209,239,.16) 52%,rgba(94,177,220,.22)),
    linear-gradient(122deg,transparent 0 13%,rgba(157,220,243,.38) 13% 22%,transparent 22% 31%,rgba(119,199,234,.32) 31% 45%,transparent 45% 58%,rgba(143,216,242,.36) 58% 72%,transparent 72% 100%);
  clip-path:polygon(0 100%,0 72%,8% 61%,15% 72%,25% 47%,34% 70%,43% 45%,53% 72%,63% 52%,72% 68%,82% 43%,92% 70%,100% 55%,100% 100%);
  opacity:.58;
  filter:blur(.35px);
}

body[data-app=front].serene-rebuild .dashboard-company-card .mountain-near{
  background:
    linear-gradient(180deg,rgba(255,255,255,.14),rgba(134,218,245,.24) 56%,rgba(62,148,201,.28)),
    linear-gradient(118deg,rgba(255,255,255,.06),rgba(84,183,225,.40) 42%,rgba(37,126,184,.22));
  clip-path:polygon(0 100%,0 78%,7% 58%,14% 76%,24% 41%,34% 77%,44% 50%,54% 79%,63% 45%,72% 74%,82% 40%,91% 76%,100% 53%,100% 100%);
  opacity:.50;
}

body[data-app=front].serene-rebuild .dashboard-company-card::after{
  content:""!important;
  position:absolute!important;
  inset:1px!important;
  z-index:1!important;
  border-radius:inherit!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.64),rgba(255,255,255,.16) 42%,transparent 78%),
    linear-gradient(102deg,transparent 0 26%,rgba(255,255,255,.26) 36%,transparent 48% 100%)!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card > :not(.dashboard-mountain-layer),
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-logo,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-badge,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block,
body[data-app=front].serene-rebuild .dashboard-company-card .combat-track,
body[data-app=front].serene-rebuild .dashboard-company-card > strong{
  position:relative!important;
  z-index:1!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-rank,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-1,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-2,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-3{
  width:34px!important;
  height:34px!important;
  border:1px solid rgba(255,255,255,.66)!important;
  background:rgba(218,245,255,.70)!important;
  color:#13556d!important;
  box-shadow:inset 0 1px rgba(255,255,255,.84),0 8px 20px rgba(76,149,196,.10)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-logo,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-badge{
  width:44px!important;
  height:44px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.76)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.92),0 10px 22px rgba(63,135,182,.10)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block label{
  color:#0d3344!important;
  font-size:14px!important;
  font-weight:700!important;
  letter-spacing:0!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  margin-top:7px!important;
  overflow:hidden!important;
  white-space:normal!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small em{
  border:1px solid rgba(255,255,255,.52)!important;
  border-radius:999px!important;
  background:rgba(238,251,255,.54)!important;
  color:#4e7687!important;
  box-shadow:inset 0 1px rgba(255,255,255,.78)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small b{
  color:#123f53!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-track{
  height:8px!important;
  border-radius:999px!important;
  background:rgba(80,151,188,.16)!important;
  box-shadow:inset 0 1px 2px rgba(57,110,143,.08)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-track i{
  background:linear-gradient(90deg,#79d7ff,#d1f4ff)!important;
  box-shadow:0 0 16px rgba(92,205,255,.24)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card > strong{
  color:#0d3344!important;
  font-size:14px!important;
  font-weight:700!important;
  text-align:right!important;
}

@media(max-width:920px){
  body[data-app=front].serene-rebuild .top-five-panel,
  body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel{
    padding:8px!important;
  }

  body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card{
    grid-template-columns:36px 44px minmax(0,1fr) minmax(48px,60px)!important;
    min-height:90px!important;
    border-radius:28px!important;
    padding:12px!important;
    gap:9px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .combat-track{
    grid-column:1/-1!important;
    grid-row:2!important;
    display:block!important;
    width:100%!important;
    height:7px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card > strong{
    grid-column:4!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small{
    display:flex!important;
    max-height:42px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .mountain-sky{
    inset:-54% -24%!important;
    background-size:100% 100%,178% auto!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .mountain-far,
  body[data-app=front].serene-rebuild .dashboard-company-card .mountain-near{
    height:62%!important;
  }
}

@media(max-width:560px){
  body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars,
  body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bars{
    gap:10px!important;
  }

  body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card{
    grid-template-columns:32px 40px minmax(0,1fr) 50px!important;
    min-height:96px!important;
    border-radius:24px!important;
    padding:11px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .combat-rank{
    width:30px!important;
    height:30px!important;
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-logo,
  body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-badge{
    width:38px!important;
    height:38px!important;
    border-radius:12px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block label{
    font-size:12.5px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small em{
    padding:2px 5px!important;
    font-size:9px!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card > strong{
    font-size:12px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-mountain-layer{
    transform:none!important;
    will-change:auto!important;
  }
}

/* Dashboard KPI cards: soft flowing pearl-blue blobs inside the glass surface. */
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(n){
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.76),rgba(223,248,255,.54) 58%,rgba(246,253,255,.70)),
    rgba(232,249,255,.66)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
  position:absolute!important;
  inset:-24% -22%!important;
  z-index:0!important;
  display:block!important;
  border-radius:inherit!important;
  overflow:hidden!important;
  opacity:.96;
  pointer-events:none!important;
  transform:translateZ(0);
  will-change:transform,opacity;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::before{
  content:""!important;
  position:absolute!important;
  inset:8% 3%!important;
  border-radius:999px!important;
  background:
    radial-gradient(46% 62% at 22% 48%,rgba(255,255,255,.76),transparent 70%),
    radial-gradient(44% 64% at 66% 46%,rgba(86,151,235,.34),transparent 72%),
    radial-gradient(28% 54% at 88% 46%,rgba(255,180,148,.20),transparent 70%),
    linear-gradient(92deg,rgba(255,255,255,.34),rgba(202,239,255,.30),rgba(255,255,255,.38));
  filter:blur(14px) saturate(1.16);
  opacity:.84;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  background:
    linear-gradient(105deg,transparent 0 28%,rgba(255,255,255,.30) 39%,transparent 52% 100%),
    radial-gradient(70% 92% at 50% 12%,rgba(255,255,255,.34),transparent 72%);
  mix-blend-mode:screen;
  opacity:.56;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud{
  position:absolute!important;
  display:block!important;
  border-radius:999px!important;
  filter:blur(24px) saturate(1.18);
  opacity:.86;
  transform:translateZ(0);
  will-change:transform;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-a{
  left:-16%!important;
  top:14%!important;
  width:62%!important;
  height:74%!important;
  background:
    radial-gradient(closest-side,rgba(255,255,255,.82),rgba(210,244,255,.48) 52%,transparent 78%),
    radial-gradient(closest-side at 76% 42%,rgba(130,214,255,.34),transparent 70%);
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-b{
  left:30%!important;
  top:2%!important;
  width:68%!important;
  height:86%!important;
  background:
    radial-gradient(closest-side,rgba(85,139,226,.44),rgba(111,207,255,.36) 55%,transparent 78%),
    radial-gradient(closest-side at 22% 72%,rgba(255,255,255,.54),transparent 70%);
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-c{
  right:-14%!important;
  bottom:-8%!important;
  width:48%!important;
  height:70%!important;
  background:
    radial-gradient(closest-side,rgba(255,184,154,.24),rgba(156,219,248,.31) 48%,transparent 78%),
    radial-gradient(closest-side at 30% 28%,rgba(255,255,255,.46),transparent 70%);
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring,
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card footer,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card footer{
  position:relative!important;
  z-index:2!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring{
  background:conic-gradient(#75d4ff 0 var(--metric-progress),rgba(103,184,224,.11) var(--metric-progress) 360deg)!important;
  box-shadow:
    0 18px 38px rgba(79,148,190,.12),
    0 0 0 10px rgba(216,243,255,.40),
    inset 0 0 0 1px rgba(255,255,255,.62)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card footer{
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
    inset:-18% -20%!important;
    opacity:.78;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud{
    filter:blur(20px) saturate(1.06);
    opacity:.66;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer,
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud{
    transform:none!important;
    will-change:auto!important;
  }
}

/* KPI final pass: remove the large backing plate, keep animated glass cards only. */
body[data-app=front].serene-rebuild .cockpit-kpis,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpis{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(n){
  border:1px solid rgba(255,255,255,.72)!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.48),rgba(242,253,255,.28)),
    rgba(245,253,255,.18)!important;
  box-shadow:
    0 18px 44px rgba(49,118,164,.10),
    inset 0 1px rgba(255,255,255,.82),
    inset 0 -1px rgba(92,171,218,.10)!important;
  backdrop-filter:blur(24px) saturate(155%)!important;
  -webkit-backdrop-filter:blur(24px) saturate(155%)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
  inset:-30% -26%!important;
  opacity:1;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::before{
  inset:0!important;
  background:
    radial-gradient(46% 68% at 22% 50%,rgba(255,255,255,.72),transparent 68%),
    radial-gradient(44% 68% at 58% 50%,rgba(83,157,236,.36),transparent 70%),
    radial-gradient(26% 60% at 84% 48%,rgba(255,183,151,.20),transparent 68%),
    linear-gradient(92deg,rgba(255,255,255,.24),rgba(196,238,255,.28),rgba(255,255,255,.24));
  filter:blur(18px) saturate(1.18);
  opacity:.86;
  animation:metric-flow-veil 8.6s ease-in-out infinite alternate;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::after{
  opacity:.48;
  animation:metric-flow-sheen 5.8s ease-in-out infinite alternate;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud{
  filter:blur(26px) saturate(1.16);
  opacity:.82;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(2) .metric-flow-layer::before{animation-delay:-1.2s;}
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(3) .metric-flow-layer::before{animation-delay:-2.4s;}
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(4) .metric-flow-layer::before{animation-delay:-3.6s;}

@keyframes metric-flow-veil{
  0%{
    background-position:0% 50%,42% 52%,80% 48%,center;
    transform:translate3d(-5%,0,0) scale(1.02);
  }
  50%{
    background-position:22% 46%,62% 50%,90% 54%,center;
    transform:translate3d(3%,-1%,0) scale(1.07);
  }
  100%{
    background-position:40% 52%,82% 48%,62% 50%,center;
    transform:translate3d(8%,1%,0) scale(1.04);
  }
}

@keyframes metric-flow-sheen{
  0%{transform:translate3d(-7%,0,0);opacity:.34;}
  100%{transform:translate3d(9%,0,0);opacity:.56;}
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .cockpit-kpis,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpis{
    gap:10px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
    inset:-22% -24%!important;
    opacity:.92;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::before,
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::after{
    animation:none!important;
  }
}

/* Board page: remove the remaining pale grey backing layer behind ranking capsules. */
html.board-mode{
  background:#fff!important;
}

html.board-mode body[data-app=front].serene-rebuild{
  background:#fff!important;
}

html.board-mode body[data-app=front].serene-rebuild::before{
  content:none!important;
  display:none!important;
}

html.board-mode body[data-app=front].serene-rebuild .cinematic-bg{
  background:transparent!important;
}

html.board-mode body[data-app=front].serene-rebuild .cinematic-bg-video,
html.board-mode body[data-app=front].serene-rebuild .cinematic-bg-veil,
html.board-mode body[data-app=front].serene-rebuild .cinematic-node-map,
html.board-mode body[data-app=front].serene-rebuild .cinematic-orb{
  opacity:0!important;
  display:none!important;
}

html.board-mode body[data-app=front].serene-rebuild .workspace,
html.board-mode body[data-app=front].serene-rebuild .page-content,
html.board-mode body[data-app=front].serene-rebuild [data-panel=board],
html.board-mode body[data-app=front].serene-rebuild .board-layout,
html.board-mode body[data-app=front].serene-rebuild .ranking-panel,
html.board-mode body[data-app=front].serene-rebuild .ranking-panel .table-wrap{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}

html.board-mode body[data-app=front].serene-rebuild .ranking-panel::before,
html.board-mode body[data-app=front].serene-rebuild .ranking-panel::after{
  content:none!important;
  display:none!important;
}

/* KPI visible motion pass: make the flowing light band obvious inside each card. */
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(n){
  background:
    linear-gradient(145deg,rgba(255,255,255,.64),rgba(246,253,255,.22)),
    rgba(247,253,255,.16)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
  inset:-34% -42%!important;
  z-index:1!important;
  opacity:1!important;
  background:
    linear-gradient(90deg,
      transparent 0%,
      rgba(255,255,255,.96) 14%,
      rgba(109,220,255,.46) 30%,
      rgba(55,145,236,.28) 42%,
      rgba(255,190,158,.16) 52%,
      rgba(103,218,255,.48) 66%,
      rgba(255,255,255,.94) 80%,
      transparent 100%)!important;
  background-size:230% 100%!important;
  background-position:0% 50%!important;
  filter:blur(18px) saturate(1.12) brightness(1.08);
  mix-blend-mode:normal;
  animation:metric-visible-current 3.6s ease-in-out infinite alternate!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::before{
  inset:-6% 0!important;
  background:
    radial-gradient(30% 72% at 18% 50%,rgba(255,255,255,.92),transparent 70%),
    radial-gradient(28% 70% at 52% 50%,rgba(70,156,238,.36),transparent 72%),
    radial-gradient(24% 64% at 80% 50%,rgba(114,228,255,.40),transparent 72%)!important;
  filter:blur(15px) saturate(1.16);
  opacity:.88!important;
  animation:metric-visible-cloud 4.2s ease-in-out infinite alternate!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::after{
  background:
    linear-gradient(102deg,transparent 0 16%,rgba(255,255,255,.80) 31%,rgba(255,255,255,.18) 40%,transparent 52% 100%),
    radial-gradient(46% 90% at 72% 16%,rgba(255,255,255,.38),transparent 74%)!important;
  opacity:.82!important;
  animation:metric-visible-sheen 2.4s ease-in-out infinite alternate!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud{
  z-index:1!important;
  filter:blur(22px) saturate(1.12) brightness(1.04)!important;
  opacity:.68!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-a{
  width:70%!important;
  height:82%!important;
  background:
    radial-gradient(closest-side,rgba(255,255,255,.92),rgba(194,241,255,.38) 56%,transparent 80%),
    radial-gradient(closest-side at 78% 46%,rgba(87,196,255,.34),transparent 72%)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-b{
  width:78%!important;
  height:90%!important;
  background:
    radial-gradient(closest-side,rgba(63,139,232,.36),rgba(100,213,255,.34) 56%,transparent 78%),
    radial-gradient(closest-side at 26% 74%,rgba(255,255,255,.62),transparent 72%)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-cloud.cloud-c{
  background:
    radial-gradient(closest-side,rgba(255,185,151,.20),rgba(120,222,255,.30) 50%,transparent 78%),
    radial-gradient(closest-side at 30% 28%,rgba(255,255,255,.52),transparent 72%)!important;
}

body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(2) .metric-flow-layer{animation-delay:-.8s!important;}
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(3) .metric-flow-layer{animation-delay:-1.6s!important;}
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(4) .metric-flow-layer{animation-delay:-2.4s!important;}

@keyframes metric-visible-current{
  0%{
    background-position:0% 50%;
    transform:translate3d(-12%,0,0) scale(1.03);
  }
  100%{
    background-position:100% 50%;
    transform:translate3d(12%,0,0) scale(1.08);
  }
}

@keyframes metric-visible-cloud{
  0%{transform:translate3d(-14%,2%,0) scale(1.02);opacity:.82;}
  100%{transform:translate3d(16%,-2%,0) scale(1.12);opacity:1;}
}

@keyframes metric-visible-sheen{
  0%{transform:translate3d(-18%,0,0);opacity:.42;}
  100%{transform:translate3d(18%,0,0);opacity:.78;}
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer{
    inset:-30% -46%!important;
    filter:blur(13px) saturate(1.18);
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer,
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::before,
  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-flow-layer::after{
    animation:none!important;
  }
}

/* PK page card grid: remove the old left menu and render every battle as one card. */
body[data-app=front].serene-rebuild.pk-screen-mode .view-panel[data-panel="pk"]{
  width:100%!important;
  max-width:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-screen,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-screen{
  display:block!important;
  width:100%!important;
  min-height:0!important;
  padding:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-screen::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-screen::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-screen::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-screen::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-menu{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-stage,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-duel-stage{
  display:block!important;
  width:100%!important;
  min-height:0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-stage::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-stage::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-duel-stage::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-duel-stage::after{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
  width:100%!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card{
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  min-width:0!important;
  min-height:390px!important;
  padding:18px!important;
  overflow:hidden!important;
  border:1px solid rgba(126,199,232,.36)!important;
  border-radius:26px!important;
  color:#173244!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.72),rgba(227,247,255,.44) 48%,rgba(255,236,238,.36)),
    rgba(238,250,255,.42)!important;
  box-shadow:
    0 18px 42px rgba(56,130,171,.12),
    inset 0 1px rgba(255,255,255,.76),
    inset 0 -1px rgba(117,199,229,.14)!important;
  backdrop-filter:blur(22px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.18)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card::before{
  content:""!important;
  position:absolute!important;
  inset:1px!important;
  z-index:-1!important;
  border-radius:inherit!important;
  background:
    radial-gradient(52% 58% at 12% 0%,rgba(255,255,255,.72),transparent 70%),
    radial-gradient(46% 58% at 94% 12%,rgba(117,210,245,.28),transparent 72%),
    linear-gradient(105deg,transparent 0 28%,rgba(255,255,255,.32) 42%,transparent 56% 100%)!important;
  opacity:.92!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card::after{
  content:""!important;
  position:absolute!important;
  left:-18%!important;
  right:-18%!important;
  bottom:-32%!important;
  height:46%!important;
  z-index:-1!important;
  border-radius:50%!important;
  background:radial-gradient(closest-side,rgba(112,207,239,.28),rgba(255,196,202,.18) 50%,transparent 76%)!important;
  filter:blur(22px)!important;
  opacity:.72!important;
  pointer-events:none!important;
  animation:pk-card-breath 6.5s ease-in-out infinite alternate!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metrics,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot{
  position:relative!important;
  z-index:1!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head time,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot span{
  display:inline-flex!important;
  align-items:center!important;
  min-width:0!important;
  color:#527184!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.02em!important;
  line-height:1.2!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head span{
  min-height:30px!important;
  padding:0 12px!important;
  border:1px solid rgba(114,195,232,.34)!important;
  border-radius:999px!important;
  color:#147191!important;
  background:rgba(255,255,255,.56)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.72)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head time{
  margin-left:auto!important;
  justify-content:flex-end!important;
  text-align:right!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title{
  display:grid!important;
  gap:7px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title h2{
  margin:0!important;
  overflow-wrap:anywhere!important;
  color:#152f3e!important;
  font-family:"Noto Serif SC","Inter",serif!important;
  font-size:clamp(18px,1.65vw,25px)!important;
  font-weight:900!important;
  line-height:1.14!important;
  letter-spacing:0!important;
  text-shadow:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title h2 em{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:38px!important;
  min-height:24px!important;
  margin:0 6px!important;
  border-radius:999px!important;
  color:#dd5963!important;
  font-family:"Inter",sans-serif!important;
  font-size:12px!important;
  font-style:normal!important;
  font-weight:800!important;
  background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(255,220,224,.62))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title p{
  margin:0!important;
  min-height:28px!important;
  overflow-wrap:anywhere!important;
  color:#5a7685!important;
  font-size:13px!important;
  line-height:1.45!important;
  white-space:pre-line!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:stretch!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  gap:8px 10px!important;
  min-width:0!important;
  padding:10px!important;
  border:1px solid rgba(136,207,236,.28)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.48)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.62)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-logo{
  grid-row:1 / span 2!important;
  width:42px!important;
  height:42px!important;
  overflow:hidden!important;
  border:1px solid rgba(128,198,228,.34)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.68)!important;
  box-shadow:0 8px 18px rgba(43,117,153,.10)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-logo img,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-logo-badge{
  display:flex!important;
  width:100%!important;
  height:100%!important;
  align-items:center!important;
  justify-content:center!important;
  object-fit:contain!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-logo-badge{
  color:#187b99!important;
  font-size:13px!important;
  font-weight:900!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name{
  min-width:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name strong{
  display:block!important;
  overflow:hidden!important;
  color:#173244!important;
  font-size:15px!important;
  font-weight:900!important;
  line-height:1.2!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name span{
  display:block!important;
  margin-top:3px!important;
  overflow:hidden!important;
  color:#6a8593!important;
  font-size:11px!important;
  line-height:1.25!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team>b{
  grid-column:2!important;
  color:#197c99!important;
  font-family:"Inter",sans-serif!important;
  font-size:22px!important;
  font-weight:800!important;
  line-height:1!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team.right>b{
  color:#d85361!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs strong{
  display:grid!important;
  width:42px!important;
  height:42px!important;
  place-items:center!important;
  border:1px solid rgba(232,139,150,.34)!important;
  border-radius:50%!important;
  color:#d85361!important;
  font-size:18px!important;
  font-weight:900!important;
  background:rgba(255,255,255,.62)!important;
  box-shadow:0 8px 24px rgba(202,80,92,.12), inset 0 1px rgba(255,255,255,.7)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs span{
  color:#668493!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.25!important;
  text-align:center!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  min-height:30px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-dots{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-width:34px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-dots i{
  display:block!important;
  width:9px!important;
  height:9px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#c9f2ff,#4bc4ec)!important;
  box-shadow:0 0 14px rgba(75,196,236,.30)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-dots i.right{
  background:linear-gradient(135deg,#ffd6dc,#f27482)!important;
  box-shadow:0 0 14px rgba(242,116,130,.26)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-score{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  width:100%!important;
  padding:7px 10px!important;
  border:1px solid rgba(124,199,231,.26)!important;
  border-radius:999px!important;
  color:#173244!important;
  font-size:13px!important;
  font-weight:900!important;
  line-height:1!important;
  text-align:center!important;
  background:rgba(255,255,255,.56)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-score.left{
  color:#147c99!important;
  background:linear-gradient(135deg,rgba(255,255,255,.66),rgba(218,247,255,.46))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-score.right{
  color:#d85361!important;
  border-color:rgba(239,152,163,.28)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.66),rgba(255,226,230,.44))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 12px!important;
  border:1px solid rgba(128,199,228,.25)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.42)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary strong{
  min-width:0!important;
  overflow:hidden!important;
  color:#173244!important;
  font-size:14px!important;
  font-weight:900!important;
  text-align:right!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metrics{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric{
  display:grid!important;
  gap:8px!important;
  min-width:0!important;
  padding:9px 10px!important;
  border:1px solid rgba(133,205,235,.25)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.38)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-empty{
  grid-column:1 / -1!important;
  color:#668493!important;
  font-size:13px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric header,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric header span{
  color:#526f7d!important;
  font-size:12px!important;
  font-weight:800!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric header strong{
  color:#173244!important;
  font-size:12px!important;
  font-weight:900!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars{
  position:relative!important;
  display:grid!important;
  gap:5px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars::after{
  content:""!important;
  display:block!important;
  height:6px!important;
  border-radius:999px!important;
  background:rgba(197,225,236,.62)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars i{
  position:absolute!important;
  left:0!important;
  height:6px!important;
  border-radius:999px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars i.left{
  top:0!important;
  background:linear-gradient(90deg,#d9f7ff,#4bc4ec)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars i.right{
  top:11px!important;
  background:linear-gradient(90deg,#ffdbe0,#f27482)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer small{
  min-width:0!important;
  overflow:hidden!important;
  color:#65808e!important;
  font-size:11px!important;
  line-height:1.2!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer b{
  margin-left:5px!important;
  color:#173244!important;
  font-weight:900!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-top:auto!important;
  padding-top:10px!important;
  border-top:1px solid rgba(118,195,228,.22)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot strong{
  min-width:0!important;
  color:#173244!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.45!important;
  text-align:right!important;
  white-space:pre-line!important;
}

@keyframes pk-card-breath{
  0%{transform:translate3d(-4%,2%,0) scale(1);opacity:.58;}
  100%{transform:translate3d(4%,-2%,0) scale(1.08);opacity:.82;}
}

@media(max-width:1500px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:1180px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    gap:14px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card{
    padding:15px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel{
    grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr)!important;
  }
}

@media(max-width:900px){
  body[data-app=front].serene-rebuild.pk-screen-mode .view-panel[data-panel="pk"]{
    max-width:100%!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:620px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card{
    min-height:0!important;
    padding:13px!important;
    border-radius:22px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head{
    align-items:flex-start!important;
    flex-direction:column!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head time{
    text-align:left!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title h2{
    font-size:20px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel{
    grid-template-columns:1fr!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs{
    flex-direction:row!important;
    justify-content:flex-start!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs strong{
    width:34px!important;
    height:34px!important;
    font-size:15px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metrics{
    grid-template-columns:1fr!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot{
    align-items:flex-start!important;
    flex-direction:column!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary strong,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot strong{
    width:100%!important;
    text-align:left!important;
    white-space:normal!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card::after{
    animation:none!important;
  }
}

/* Mobile summit banner: center the red champion area horizontally. */
@media(max-width:767px){
  body[data-app=front].product-ui.serene-rebuild .summit-banner-main{
    justify-items:center!important;
    text-align:center!important;
  }

  body[data-app=front].product-ui.serene-rebuild .summit-title{
    justify-self:center!important;
    justify-content:center!important;
    text-align:center!important;
  }

  body[data-app=front].product-ui.serene-rebuild .summit-champion{
    justify-self:center!important;
    width:min(100%,310px)!important;
    max-width:310px!important;
    grid-template-columns:62px minmax(0,1fr)!important;
    justify-content:center!important;
  }

  body[data-app=front].product-ui.serene-rebuild .summit-champion-copy{
    text-align:left!important;
  }
}

@media(max-width:390px){
  body[data-app=front].product-ui.serene-rebuild .summit-champion{
    width:min(100%,286px)!important;
    max-width:286px!important;
    grid-template-columns:58px minmax(0,1fr)!important;
  }
}

/* Duty page: componentized azure glass calendar with a dynamic operator. */
body[data-app=front].serene-rebuild.operation-calendar-mode .view-panel[data-panel="duty"]{
  width:100%!important;
  max-width:none!important;
  padding-top:0!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .public-operation-mount{
  width:100%!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-panel.duty-component-panel{
  display:grid!important;
  gap:clamp(14px,1.4vw,20px)!important;
  width:100%!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-panel.duty-component-panel::before,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-panel.duty-component-panel::after{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(330px,430px)!important;
  gap:clamp(16px,2vw,28px)!important;
  align-items:stretch!important;
  min-height:240px!important;
  padding:clamp(18px,2.1vw,30px)!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.76)!important;
  border-radius:30px!important;
  color:#12384b!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(232,250,255,.52) 45%,rgba(243,253,255,.70)),
    rgba(230,248,255,.52)!important;
  box-shadow:
    0 24px 70px rgba(67,132,171,.13),
    inset 0 1px rgba(255,255,255,.96),
    inset 0 -1px rgba(95,171,213,.14)!important;
  backdrop-filter:blur(26px) saturate(160%)!important;
  -webkit-backdrop-filter:blur(26px) saturate(160%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command::before{
  content:""!important;
  position:absolute!important;
  inset:-35% -18% auto 35%!important;
  height:118%!important;
  z-index:-2!important;
  border-radius:999px!important;
  background:
    radial-gradient(closest-side,rgba(104,207,255,.38),transparent 72%),
    radial-gradient(closest-side at 28% 70%,rgba(255,176,187,.18),transparent 72%),
    radial-gradient(closest-side at 78% 54%,rgba(255,255,255,.52),transparent 70%)!important;
  filter:blur(12px) saturate(1.12)!important;
  animation:duty-ambient-flow 9s ease-in-out infinite alternate!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command::after{
  content:""!important;
  position:absolute!important;
  inset:1px!important;
  z-index:-1!important;
  border-radius:inherit!important;
  background:
    linear-gradient(110deg,transparent 0 28%,rgba(255,255,255,.38) 40%,transparent 54% 100%),
    radial-gradient(80% 95% at 15% 0,rgba(255,255,255,.58),transparent 74%)!important;
  opacity:.72!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command-copy{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-kicker{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:30px!important;
  padding:0 12px!important;
  border:1px solid rgba(129,205,235,.38)!important;
  border-radius:999px!important;
  color:#3e7589!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.02em!important;
  background:rgba(255,255,255,.48)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.78)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
  margin:18px 0 8px!important;
  color:#102f41!important;
  font-family:"Noto Serif SC","Playfair Display",serif!important;
  font-size:clamp(28px,3.4vw,52px)!important;
  font-weight:700!important;
  letter-spacing:-.04em!important;
  line-height:1.08!important;
  text-wrap:balance!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command p{
  max-width:660px!important;
  margin:0!important;
  color:#557587!important;
  font-size:clamp(13px,1.05vw,16px)!important;
  font-weight:600!important;
  line-height:1.7!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
  margin-top:auto!important;
  padding-top:clamp(18px,2vw,28px)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
  position:relative!important;
  display:grid!important;
  grid-template-columns:1fr auto!important;
  align-items:end!important;
  gap:4px 8px!important;
  min-width:0!important;
  min-height:82px!important;
  padding:13px 14px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.70)!important;
  border-radius:20px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.58),rgba(220,247,255,.34)),
    rgba(244,253,255,.34)!important;
  box-shadow:
    0 12px 28px rgba(70,140,177,.09),
    inset 0 1px rgba(255,255,255,.82)!important;
  backdrop-filter:blur(18px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(145%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile::before{
  content:""!important;
  position:absolute!important;
  inset:-45% -35% auto auto!important;
  width:80%!important;
  height:110%!important;
  border-radius:999px!important;
  background:radial-gradient(closest-side,rgba(109,211,255,.34),transparent 72%)!important;
  filter:blur(10px)!important;
  opacity:.84!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile span,
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile strong,
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile small{
  position:relative!important;
  z-index:1!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile span{
  grid-column:1/-1!important;
  color:#577889!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.25!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile strong{
  color:#10394d!important;
  font-size:clamp(28px,2.5vw,40px)!important;
  font-weight:800!important;
  line-height:.95!important;
  font-variant-numeric:tabular-nums!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile small{
  color:#6e8d9b!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:minmax(132px,1fr) minmax(0,1.08fr)!important;
  align-items:stretch!important;
  min-width:0!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:26px!important;
  background:
    radial-gradient(92% 84% at 24% 22%,rgba(255,255,255,.56),transparent 70%),
    linear-gradient(150deg,rgba(230,249,255,.55),rgba(255,255,255,.30))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.84),0 14px 34px rgba(54,127,170,.10)!important;
  backdrop-filter:blur(20px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(150%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
  position:relative!important;
  min-height:100%!important;
  overflow:hidden!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-orbit{
  position:absolute!important;
  inset:18% 6% 18% 8%!important;
  border:1px solid rgba(96,190,230,.28)!important;
  border-radius:50%!important;
  transform:rotate(-16deg);
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-orbit.orbit-two{
  inset:27% 14% 24% 2%!important;
  border-color:rgba(255,173,185,.22)!important;
  transform:rotate(28deg);
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-signal{
  position:absolute!important;
  z-index:3!important;
  width:10px!important;
  height:10px!important;
  border-radius:50%!important;
  background:#67d7ff!important;
  box-shadow:0 0 0 7px rgba(103,215,255,.16),0 0 22px rgba(103,215,255,.58)!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-signal.signal-one{left:18%!important;top:26%!important;}
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-signal.signal-two{right:22%!important;bottom:26%!important;background:#ff9eac!important;box-shadow:0 0 0 7px rgba(255,158,172,.13),0 0 22px rgba(255,158,172,.42)!important;}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-shadow{
  position:absolute!important;
  left:50%!important;
  bottom:22%!important;
  width:86px!important;
  height:18px!important;
  border-radius:50%!important;
  background:rgba(56,119,154,.18)!important;
  filter:blur(8px)!important;
  transform:translateX(-50%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person{
  position:absolute!important;
  left:50%!important;
  bottom:19%!important;
  width:118px!important;
  height:152px!important;
  transform:translateX(-50%) translateZ(0);
  transform-origin:50% 85%!important;
  will-change:transform!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-head{
  position:absolute!important;
  left:40px!important;
  top:8px!important;
  width:42px!important;
  height:42px!important;
  border-radius:18px 18px 16px 16px!important;
  background:linear-gradient(145deg,#fff4e7,#ffd0b6)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.88),0 8px 18px rgba(108,127,143,.13)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-head::before{
  content:""!important;
  position:absolute!important;
  left:5px!important;
  right:5px!important;
  top:-5px!important;
  height:18px!important;
  border-radius:16px 16px 8px 8px!important;
  background:linear-gradient(135deg,#18384b,#2d6075)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-head i{
  position:absolute!important;
  left:10px!important;
  top:21px!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:#244454!important;
  box-shadow:17px 0 #244454,8px 10px 0 -2px rgba(36,68,84,.72)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-body{
  position:absolute!important;
  left:31px!important;
  top:55px!important;
  width:58px!important;
  height:82px!important;
  border-radius:28px 28px 22px 22px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.62),rgba(162,223,247,.44)),
    linear-gradient(180deg,#8ddfff,#3f9fcd)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.86),
    inset 0 -12px 22px rgba(25,100,143,.14),
    0 14px 26px rgba(61,126,167,.15)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-body::after{
  content:""!important;
  position:absolute!important;
  left:17px!important;
  top:13px!important;
  width:24px!important;
  height:7px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-arm{
  position:absolute!important;
  top:66px!important;
  width:17px!important;
  height:58px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#71cbed,#367fa9)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.54)!important;
  transform-origin:50% 10%!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-arm.arm-left{
  left:20px!important;
  transform:rotate(17deg);
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-arm.arm-right{
  right:20px!important;
  transform:rotate(-22deg);
  will-change:transform!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet{
  position:absolute!important;
  right:8px!important;
  top:93px!important;
  width:50px!important;
  height:34px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:10px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.76),rgba(221,248,255,.62)),
    rgba(229,248,255,.74)!important;
  box-shadow:0 8px 18px rgba(37,105,151,.16),inset 0 1px rgba(255,255,255,.88)!important;
  will-change:transform!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet b,
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet i{
  position:absolute!important;
  left:8px!important;
  right:8px!important;
  height:4px!important;
  border-radius:999px!important;
  background:#6bd7ff!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet b{top:10px!important;width:24px!important;}
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet i{top:20px!important;background:#ff9dac!important;}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot{
  --look-x:0px;
  --look-y:0px;
  --head-x:0deg;
  --head-y:0deg;
  width:132px!important;
  height:162px!important;
  perspective:520px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-halo{
  position:absolute!important;
  left:50%!important;
  top:8px!important;
  width:112px!important;
  height:112px!important;
  border:1px solid rgba(122,215,248,.22)!important;
  border-radius:50%!important;
  background:
    radial-gradient(closest-side,rgba(255,255,255,.38),transparent 66%),
    conic-gradient(from 180deg,rgba(118,220,255,.0),rgba(118,220,255,.34),rgba(255,157,173,.20),rgba(118,220,255,.0))!important;
  filter:blur(.2px)!important;
  transform:translateX(-50%)!important;
  opacity:.82!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-head{
  left:50%!important;
  top:12px!important;
  width:68px!important;
  height:56px!important;
  border:1px solid rgba(255,255,255,.82)!important;
  border-radius:24px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.92),rgba(214,246,255,.70) 54%,rgba(174,229,249,.62)),
    rgba(236,251,255,.84)!important;
  box-shadow:
    0 16px 32px rgba(55,127,171,.18),
    inset 0 1px rgba(255,255,255,.96),
    inset 0 -10px 18px rgba(63,158,209,.14)!important;
  transform:translate3d(calc(-50% + var(--look-x) * .42),calc(var(--look-y) * .24),0) rotateX(var(--head-x)) rotateY(var(--head-y));
  transform-origin:50% 75%!important;
  transform-style:preserve-3d!important;
  transition:transform .16s ease-out!important;
  will-change:transform!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-head::before{
  left:50%!important;
  right:auto!important;
  top:-10px!important;
  width:28px!important;
  height:10px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#6ed9ff,#b8f0ff)!important;
  box-shadow:0 0 18px rgba(103,215,255,.46)!important;
  transform:translateX(-50%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-ear{
  position:absolute!important;
  top:17px!important;
  width:12px!important;
  height:24px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  background:linear-gradient(180deg,rgba(210,246,255,.86),rgba(111,199,235,.58))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.82)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-ear.ear-left{
  left:-8px!important;
  border-radius:10px 3px 3px 10px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-ear.ear-right{
  right:-8px!important;
  border-radius:3px 10px 10px 3px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face{
  position:absolute!important;
  left:8px!important;
  right:8px!important;
  top:12px!important;
  height:32px!important;
  border:1px solid rgba(23,109,151,.18)!important;
  border-radius:16px!important;
  background:
    radial-gradient(80% 120% at 50% 0,rgba(255,255,255,.22),transparent 62%),
    linear-gradient(180deg,#12374d,#0d2638)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.18),0 8px 16px rgba(18,66,92,.12)!important;
  overflow:hidden!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(105deg,transparent 0 25%,rgba(122,224,255,.20) 40%,transparent 56% 100%)!important;
  transform:translateX(calc(var(--look-x) * .7))!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face i{
  position:absolute!important;
  top:8px!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:#8ae6ff!important;
  box-shadow:0 0 8px rgba(138,230,255,.78)!important;
  transform:translate3d(var(--look-x),var(--look-y),0)!important;
  transition:transform .12s ease-out!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face .eye-left{
  left:calc(50% - 13px)!important;
  right:auto!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face .eye-right{
  left:calc(50% + 8px)!important;
  right:auto!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-face b{
  position:absolute!important;
  left:50%!important;
  bottom:5px!important;
  width:10px!important;
  height:2px!important;
  border-radius:999px!important;
  background:rgba(255,168,184,.82)!important;
  box-shadow:0 0 7px rgba(255,168,184,.44)!important;
  transform:translateX(calc(-50% + var(--look-x) * .22))!important;
  transition:transform .12s ease-out!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-neck{
  position:absolute!important;
  left:50%!important;
  top:64px!important;
  width:24px!important;
  height:18px!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,rgba(204,243,255,.86),rgba(105,195,231,.56))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.76)!important;
  transform:translateX(-50%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-body{
  left:34px!important;
  top:76px!important;
  width:66px!important;
  height:72px!important;
  border:1px solid rgba(255,255,255,.78)!important;
  border-radius:28px 28px 24px 24px!important;
  background:
    radial-gradient(80% 72% at 50% 18%,rgba(255,255,255,.82),transparent 64%),
    linear-gradient(160deg,rgba(225,249,255,.86),rgba(113,205,239,.70) 58%,rgba(71,157,210,.64))!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.94),
    inset 0 -14px 22px rgba(22,105,156,.16),
    0 16px 28px rgba(55,126,170,.16)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-body::after{
  left:21px!important;
  top:11px!important;
  width:24px!important;
  height:6px!important;
  background:rgba(255,255,255,.74)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-core{
  position:absolute!important;
  left:50%!important;
  top:30px!important;
  width:30px!important;
  height:22px!important;
  border:1px solid rgba(255,255,255,.66)!important;
  border-radius:12px!important;
  background:
    radial-gradient(circle at 34% 48%,#7ce2ff 0 4px,transparent 5px),
    radial-gradient(circle at 66% 48%,#ff9aaa 0 4px,transparent 5px),
    rgba(255,255,255,.44)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.72),0 8px 14px rgba(45,125,170,.10)!important;
  transform:translateX(-50%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-arm{
  top:84px!important;
  width:16px!important;
  height:54px!important;
  background:linear-gradient(180deg,rgba(164,230,252,.92),rgba(53,150,205,.72))!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-arm.arm-left{
  left:25px!important;
  transform:rotate(16deg)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-arm.arm-right{
  right:25px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot .duty-person-tablet{
  right:7px!important;
  top:108px!important;
  width:52px!important;
  height:36px!important;
  border-radius:13px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
  position:relative!important;
  z-index:4!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
  padding:16px 16px 16px 0!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card > span{
  width:max-content!important;
  max-width:100%!important;
  padding:7px 10px!important;
  border:1px solid rgba(117,201,235,.30)!important;
  border-radius:999px!important;
  color:#47788d!important;
  font-size:11px!important;
  font-weight:800!important;
  background:rgba(255,255,255,.48)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo{
  display:grid!important;
  place-items:center!important;
  width:min(100%,176px)!important;
  min-height:66px!important;
  margin:12px 0!important;
  padding:10px 14px!important;
  border:1px solid rgba(255,255,255,.74)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.62)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.92),0 10px 24px rgba(53,124,169,.11)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo .calendar-logo,
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo .calendar-logo-badge{
  width:100%!important;
  max-width:142px!important;
  max-height:48px!important;
  object-fit:contain!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card strong{
  min-width:0!important;
  overflow:hidden!important;
  color:#12384b!important;
  font-size:15px!important;
  font-weight:800!important;
  line-height:1.35!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card small{
  display:-webkit-box!important;
  margin-top:6px!important;
  overflow:hidden!important;
  color:#608090!important;
  font-size:12px!important;
  font-weight:650!important;
  line-height:1.45!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-scroll,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer{
  border:1px solid rgba(255,255,255,.74)!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.64),rgba(229,249,255,.38)),
    rgba(243,253,255,.40)!important;
  box-shadow:
    0 18px 44px rgba(62,129,169,.10),
    inset 0 1px rgba(255,255,255,.88)!important;
  backdrop-filter:blur(22px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(150%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
  grid-template-columns:minmax(230px,1fr) auto auto!important;
  min-height:76px!important;
  padding:14px 16px!important;
  border-radius:24px!important;
  border-bottom:1px solid rgba(255,255,255,.74)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-title strong{
  color:#12384b!important;
  font-size:22px!important;
  letter-spacing:-.04em!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-title small{
  color:#5c7d8f!important;
  font-size:11px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-icon{
  display:grid!important;
  place-items:center!important;
  width:40px!important;
  height:40px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:14px!important;
  color:#1597cf!important;
  background:rgba(222,247,255,.62)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.86),0 8px 18px rgba(60,133,178,.10)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-icon svg{
  width:18px!important;
  height:18px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-summary-stat{
  min-height:42px!important;
  padding:7px 12px!important;
  border:1px solid rgba(255,255,255,.62)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.46)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.78)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary b{
  color:#1398ce!important;
  font-size:20px!important;
  font-weight:900!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary span span{
  color:#607f8f!important;
  font-weight:750!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
  gap:8px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
  min-height:42px!important;
  border:1px solid rgba(255,255,255,.70)!important;
  border-radius:999px!important;
  color:#173f52!important;
  background:rgba(255,255,255,.56)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.86),0 8px 20px rgba(54,124,168,.08)!important;
  backdrop-filter:blur(14px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(14px) saturate(145%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step{
  width:42px!important;
  font-size:22px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
  gap:8px!important;
  padding:0 13px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker span{
  color:#5d7d8e!important;
  font-size:12px!important;
  font-weight:800!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker input{
  color:#143b4d!important;
  font-size:12px!important;
  font-weight:800!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button{
  padding:0 14px!important;
  font-size:12px!important;
  font-weight:850!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step:hover,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button:hover{
  background:rgba(217,246,255,.74)!important;
  transform:translateY(-1px)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-scroll{
  overflow:auto!important;
  border-radius:28px!important;
  scrollbar-color:rgba(92,164,202,.32) transparent!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
  min-width:980px!important;
  grid-template-columns:repeat(7,minmax(140px,1fr))!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays{
  position:sticky!important;
  top:0!important;
  z-index:4!important;
  border-bottom:1px solid rgba(120,179,207,.18)!important;
  background:rgba(230,248,255,.62)!important;
  backdrop-filter:blur(16px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(145%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays span{
  padding:12px 8px!important;
  color:#527484!important;
  font-size:12px!important;
  font-weight:850!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
  gap:8px!important;
  padding:10px!important;
  background:transparent!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
  min-height:138px!important;
  padding:10px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.60)!important;
  border-radius:20px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.58),rgba(232,249,255,.32)),
    rgba(248,253,255,.34)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.76),0 10px 26px rgba(64,132,171,.055)!important;
  transition:background .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day::before{
  content:""!important;
  position:absolute!important;
  inset:-40% -28% auto auto!important;
  width:86%!important;
  height:86%!important;
  border-radius:999px!important;
  background:radial-gradient(closest-side,rgba(109,207,247,.20),transparent 74%)!important;
  opacity:.75!important;
  pointer-events:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day.has-events{
  background:
    linear-gradient(145deg,rgba(255,255,255,.66),rgba(223,247,255,.42)),
    rgba(240,253,255,.48)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day.has-events:hover{
  border-color:rgba(117,206,244,.66)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.82),0 15px 34px rgba(61,137,181,.10)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day.is-outside{
  opacity:.58!important;
  background:rgba(245,251,253,.20)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header{
  position:relative!important;
  z-index:2!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header time{
  width:28px!important;
  height:28px!important;
  color:#21495b!important;
  font-size:12px!important;
  font-weight:900!important;
  background:rgba(255,255,255,.56)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.78)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day.is-today > header time{
  background:linear-gradient(135deg,#ff6f7e,#ff9aa8)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(255,105,123,.28),inset 0 1px rgba(255,255,255,.42)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header span{
  color:#ee5264!important;
  font-size:10px!important;
  font-weight:900!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-events{
  position:relative!important;
  z-index:2!important;
  gap:7px!important;
  margin-top:9px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  min-height:38px!important;
  padding:6px 9px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.70)!important;
  border-radius:14px!important;
  background:
    linear-gradient(110deg,rgba(255,255,255,.62),rgba(214,246,255,.46)),
    rgba(229,250,255,.52)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.88),0 8px 18px rgba(57,130,174,.07)!important;
  transform:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event::before{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-flow{
  position:absolute!important;
  inset:-35% -48%!important;
  z-index:-1!important;
  display:block!important;
  border-radius:999px!important;
  background:
    linear-gradient(90deg,transparent,rgba(255,255,255,.82),rgba(106,216,255,.34),rgba(255,255,255,.76),transparent)!important;
  filter:blur(11px) saturate(1.15)!important;
  opacity:.88!important;
  transform:translate3d(-20%,0,0);
  pointer-events:none!important;
  will-change:transform!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-logo-inner{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo-badge{
  width:100%!important;
  height:28px!important;
  max-width:102px!important;
  max-height:30px!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo-badge{
  display:grid!important;
  place-items:center!important;
  width:auto!important;
  min-width:58px!important;
  padding:0 10px!important;
  color:#137da9!important;
  font-size:12px!important;
  font-weight:900!important;
  background:rgba(255,255,255,.54)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-action:focus-visible{
  outline:3px solid rgba(39,168,219,.38)!important;
  outline-offset:2px!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-more{
  display:grid!important;
  place-items:center!important;
  min-height:30px!important;
  border:1px solid rgba(255,255,255,.56)!important;
  border-radius:12px!important;
  color:#39708a!important;
  font-size:11px!important;
  font-weight:900!important;
  background:rgba(255,255,255,.42)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:12px 16px!important;
  border-radius:20px!important;
  color:#5c7d8d!important;
  font-size:12px!important;
  font-weight:700!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer span,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer strong{
  min-width:0!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer strong{
  color:#21495a!important;
  text-align:right!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-modal-dialog{
  border:1px solid rgba(255,255,255,.74)!important;
  border-radius:26px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.82),rgba(230,249,255,.72)),
    rgba(245,253,255,.82)!important;
  box-shadow:0 30px 90px rgba(17,56,80,.26),inset 0 1px rgba(255,255,255,.90)!important;
  backdrop-filter:blur(24px) saturate(155%)!important;
  -webkit-backdrop-filter:blur(24px) saturate(155%)!important;
}

body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-modal-record{
  border:1px solid rgba(255,255,255,.64)!important;
  border-radius:18px!important;
  background:rgba(232,249,255,.58)!important;
}

@keyframes duty-ambient-flow{
  0%{transform:translate3d(-6%,0,0) scale(1.02);opacity:.68;}
  52%{transform:translate3d(4%,-2%,0) scale(1.09);opacity:.88;}
  100%{transform:translate3d(9%,2%,0) scale(1.04);opacity:.74;}
}

@media(max-width:1180px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    grid-template-columns:1fr!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:minmax(160px,.56fr) minmax(0,1fr)!important;
    min-height:220px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    grid-template-columns:minmax(220px,1fr) auto!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary{
    grid-column:1/-1!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    grid-column:1/-1!important;
    overflow:auto!important;
    padding-bottom:2px!important;
  }
}

@media(max-width:760px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    min-height:0!important;
    padding:16px!important;
    border-radius:24px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    margin-top:14px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
    min-height:74px!important;
    border-radius:18px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:1fr!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:186px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    padding:0 14px 14px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card strong{
    white-space:normal!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    grid-template-columns:1fr!important;
    padding:12px!important;
    border-radius:22px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    grid-column:auto!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    gap:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-summary-stat{
    justify-content:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    width:100%!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    min-width:760px!important;
    grid-template-columns:repeat(7,minmax(100px,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
    min-height:122px!important;
    border-radius:17px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer{
    align-items:flex-start!important;
    flex-direction:column!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-footer strong{
    width:100%!important;
    text-align:left!important;
  }
}

@media(max-width:460px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    gap:9px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person{
    width:104px!important;
    height:140px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker input{
    width:106px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
    min-height:40px!important;
  }
}

@media(min-width:761px) and (max-width:1180px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    grid-template-columns:minmax(0,1fr) minmax(300px,360px)!important;
    gap:18px!important;
    min-height:0!important;
    padding:20px!important;
    border-radius:26px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    margin-top:14px!important;
    font-size:clamp(34px,4.2vw,44px)!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command p{
    font-size:14px!important;
    line-height:1.55!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin-top:16px!important;
    padding-top:0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
    min-height:66px!important;
    padding:10px 12px!important;
    border-radius:18px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile strong{
    font-size:32px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:minmax(125px,.72fr) minmax(0,1fr)!important;
    min-height:218px!important;
    border-radius:23px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:218px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    padding:14px 14px 14px 0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo{
    width:min(100%,154px)!important;
    min-height:58px!important;
    margin:10px 0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card strong{
    white-space:normal!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    grid-template-columns:minmax(210px,1fr) auto auto!important;
    gap:12px!important;
    min-height:72px!important;
    padding:12px 14px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    grid-column:auto!important;
    grid-row:auto!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    overflow:visible!important;
    padding-bottom:0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    min-width:100%!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    gap:6px!important;
    padding:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
    min-height:126px!important;
    padding:9px!important;
    border-radius:18px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
    min-height:36px!important;
    padding-inline:7px!important;
  }
}

@media(max-width:760px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-panel.duty-component-panel{
    gap:12px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    gap:12px!important;
    padding:14px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-kicker{
    min-height:28px!important;
    padding-inline:10px!important;
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    font-size:clamp(28px,8vw,34px)!important;
    line-height:1.02!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command p{
    font-size:12px!important;
    line-height:1.45!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    gap:8px!important;
    padding-top:12px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
    min-height:64px!important;
    padding:9px 10px!important;
    border-radius:16px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile span{
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile strong{
    font-size:30px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    min-height:0!important;
    border-radius:20px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:162px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot{
    width:108px!important;
    height:142px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-halo{
    width:96px!important;
    height:96px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    padding:0 14px 14px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo{
    min-height:54px!important;
    margin:9px 0!important;
    border-radius:17px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    gap:9px!important;
    padding:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-summary-stat{
    min-height:36px!important;
    padding:6px 10px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary b{
    font-size:18px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) 40px!important;
    gap:7px!important;
    overflow:visible!important;
    padding-bottom:0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
    min-height:38px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step{
    width:40px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
    min-width:0!important;
    justify-content:center!important;
    padding-inline:10px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button{
    grid-column:1/-1!important;
    width:100%!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    min-width:700px!important;
    grid-template-columns:repeat(7,minmax(92px,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    gap:6px!important;
    padding:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
    min-height:116px!important;
    padding:8px!important;
    border-radius:17px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
    min-height:38px!important;
    padding-inline:6px!important;
    border-radius:13px!important;
  }
}

/* Duty mobile final pass: shorter command card, same glass language, no clipped text. */
@media(max-width:760px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:12px!important;
    border-radius:22px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command-copy{
    display:grid!important;
    gap:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-kicker{
    min-height:26px!important;
    width:max-content!important;
    max-width:100%!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    margin-top:0!important;
    font-size:clamp(25px,7.6vw,32px)!important;
    line-height:1.05!important;
    overflow-wrap:anywhere!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command p{
    font-size:11.5px!important;
    line-height:1.36!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    margin-top:0!important;
    padding-top:0!important;
    gap:7px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
    min-height:58px!important;
    padding:8px!important;
    border-radius:15px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile span{
    font-size:10.5px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile strong{
    font-size:27px!important;
    line-height:.95!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    display:grid!important;
    grid-template-columns:minmax(112px,.62fr) minmax(0,1fr)!important;
    align-items:center!important;
    min-height:164px!important;
    border-radius:19px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:164px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot{
    width:92px!important;
    height:122px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot-halo{
    width:82px!important;
    height:82px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    align-self:stretch!important;
    justify-content:center!important;
    padding:10px 11px 10px 0!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card span{
    width:max-content!important;
    max-width:100%!important;
    min-height:28px!important;
    padding-inline:10px!important;
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo{
    width:100%!important;
    min-height:48px!important;
    margin:8px 0!important;
    border-radius:16px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo img,
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-logo .calendar-logo{
    max-height:30px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card strong{
    font-size:13px!important;
    line-height:1.34!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card small{
    font-size:11px!important;
    line-height:1.35!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding:10px!important;
    border-radius:20px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-title{
    justify-content:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-title strong{
    font-size:20px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-summary-stat{
    min-height:34px!important;
    padding:6px 8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    gap:6px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker{
    min-height:38px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-step{
    width:38px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-today-button{
    min-height:38px!important;
  }
}

@media(max-width:370px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    padding:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    font-size:25px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:100px minmax(0,1fr)!important;
    min-height:156px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:156px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-robot{
    width:86px!important;
    height:116px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    padding-right:9px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card strong{
    font-size:12.5px!important;
  }
}

@media(max-width:370px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    padding:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command h2{
    font-size:25px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    gap:7px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-tile{
    padding:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker span{
    display:none!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-month-picker input{
    width:112px!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    min-width:672px!important;
    grid-template-columns:repeat(7,minmax(88px,1fr))!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command::before,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-flow{
    animation:none!important;
    transform:none!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person,
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-orbit,
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-signal,
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-arm,
  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-person-tablet{
    will-change:auto!important;
  }
}

/* RWD final compatibility pass: phones, portrait tablets, and desktop keep the same product system without clipping. */
body[data-app=front].serene-rebuild .workspace,
body[data-app=front].serene-rebuild .page-content,
body[data-app=front].serene-rebuild .view-panel,
body[data-app=front].serene-rebuild .board-layout,
body[data-app=front].serene-rebuild .cockpit-shell,
body[data-app=front].serene-rebuild .pk-card-grid,
body[data-app=front].serene-rebuild .public-operation-mount,
body[data-app=front].serene-rebuild .calendar-panel.duty-component-panel{
  min-width:0!important;
  max-width:100%!important;
}

body[data-app=front].serene-rebuild .cinematic-bg,
body[data-app=front].serene-rebuild .summit-banner-wrap,
body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas,
body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
body[data-app=front].serene-rebuild .dashboard-company-card,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card,
body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day,
body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
  contain:paint!important;
}

@media(max-width:900px) and (min-width:768px){
  body[data-app=front].serene-rebuild .page-content{
    padding-inline:12px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-command{
    grid-template-columns:1fr!important;
    gap:14px!important;
    min-height:0!important;
    padding:20px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-stat-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:minmax(180px,.52fr) minmax(0,1fr)!important;
    min-height:220px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-scene{
    min-height:220px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    min-width:0!important;
    justify-content:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar.duty-toolbar{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-title{
    justify-content:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-toolbar-summary{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-controls{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 44px auto!important;
    width:100%!important;
    overflow:visible!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    min-width:700px!important;
    grid-template-columns:repeat(7,minmax(92px,1fr))!important;
  }
}

@media(max-width:767px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas{
    grid-template-columns:48px repeat(3,minmax(0,1fr))!important;
    grid-template-areas:
      "rank company company company"
      "rank perf customers opportunities"
      "progress progress progress progress"!important;
    gap:9px 8px!important;
    min-height:142px!important;
    padding:12px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > .ranking-ocean-layer{
    grid-area:1 / 1 / -1 / -1!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.rank-cell{
    grid-area:rank!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(2){
    grid-area:company!important;
    align-self:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell{
    grid-area:perf!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4){
    grid-area:customers!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell{
    grid-area:opportunities!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.progress-cell{
    grid-area:progress!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-child(3)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-child(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-child(5)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-child(6)::before{
    content:none!important;
    display:none!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{
    display:block!important;
    margin:0!important;
    color:#5d8090!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before{content:"业绩"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before{content:"新客户"!important;}
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{content:"商机"!important;}

  body[data-app=front].serene-rebuild .ranking-table .company-cell{
    min-height:42px!important;
    gap:9px!important;
    align-items:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-avatar,
  body[data-app=front].serene-rebuild .ranking-table .company-avatar-badge{
    width:36px!important;
    height:36px!important;
    flex:0 0 36px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-name{
    display:-webkit-box!important;
    overflow:hidden!important;
    color:#10394b!important;
    font-size:13.5px!important;
    font-weight:700!important;
    line-height:1.22!important;
    text-overflow:ellipsis!important;
    white-space:normal!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-award,
  body[data-app=front].serene-rebuild .ranking-table .rank-standard{
    width:42px!important;
    min-height:100%!important;
    border-radius:18px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .rank-badge{
    font-weight:700!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .number-cell,
  body[data-app=front].serene-rebuild .ranking-table .money-cell,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4),
  body[data-app=front].serene-rebuild .ranking-table .actual-cell{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    min-height:44px!important;
    padding:6px!important;
    gap:4px!important;
    border-radius:16px!important;
    font-size:12px!important;
    font-weight:700!important;
    line-height:1!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .progress-line{
    min-height:24px!important;
    padding:0!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .progress-track{
    height:6px!important;
  }

  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas > .ranking-ocean-layer,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-layer{
    opacity:.28!important;
    filter:saturate(.92) contrast(.88) brightness(1.36)!important;
  }

  body[data-app=front].serene-rebuild .metric-ranking-page .metric-leaderboard-row.has-rank-ocean-canvas .ranking-ocean-glint,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas .ranking-ocean-glint{
    opacity:.30!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpis,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card{
    min-width:0!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring{
    width:min(112px,34vw)!important;
    height:min(112px,34vw)!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title p,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot strong,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer small{
    overflow-wrap:anywhere!important;
  }
}

@media(max-width:370px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas{
    grid-template-columns:42px repeat(3,minmax(0,1fr))!important;
    gap:8px 7px!important;
    min-height:138px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-avatar,
  body[data-app=front].serene-rebuild .ranking-table .company-avatar-badge{
    width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .company-name{
    font-size:12.5px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table .number-cell,
  body[data-app=front].serene-rebuild .ranking-table .money-cell,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4),
  body[data-app=front].serene-rebuild .ranking-table .actual-cell{
    min-height:42px!important;
    padding-inline:4px!important;
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{
    font-size:9px!important;
  }
}

@media(max-width:340px){
  body[data-app=front].serene-rebuild .sidebar.public-sidebar{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    padding-inline:8px!important;
  }

  body[data-app=front].serene-rebuild .nav-menu{
    gap:5px!important;
  }

  body[data-app=front].serene-rebuild .nav-item{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
  }

  body[data-app=front].serene-rebuild .nav-item.is-active{
    min-width:126px!important;
    padding-inline:6px 8px!important;
  }

  body[data-app=front].serene-rebuild .nav-item.is-active span{
    max-width:74px!important;
    font-size:12px!important;
  }

  body[data-app=front].serene-rebuild .page-content{
    padding-inline:10px!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-1,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-2,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.top-rank-3,
  body[data-app=front].serene-rebuild .ranking-table tbody tr.has-rank-ocean-canvas{
    grid-template-columns:38px repeat(3,minmax(0,1fr))!important;
    padding:10px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-operator-card{
    grid-template-columns:1fr!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .duty-next-card{
    padding:0 10px 10px!important;
  }
}

/* PK mobile centering: keep every PK card and its inner content balanced left-to-right. */
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
  justify-content:center!important;
  justify-items:stretch!important;
  margin-inline:auto!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card{
  width:100%!important;
  margin-inline:auto!important;
}

@media(max-width:900px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-stage,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-duel-stage,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    max-width:min(100%,720px)!important;
    margin-inline:auto!important;
  }
}

@media(max-width:620px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-stage,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-duel-stage,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    width:100%!important;
    max-width:100%!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card{
    align-items:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head{
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head span,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-head time{
    margin-inline:auto!important;
    justify-content:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title h2,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-title p{
    width:100%!important;
    justify-items:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team{
    grid-template-columns:42px minmax(0,1fr)!important;
    width:100%!important;
    justify-items:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-logo{
    justify-self:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name strong,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team-name span,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team>b{
    justify-self:center!important;
    width:100%!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-vs{
    width:100%!important;
    justify-content:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot{
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-summary strong,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-foot strong{
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metrics{
    width:100%!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric header,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer{
    justify-content:center!important;
    text-align:center!important;
  }
}

/* Board mobile metric cleanup: ranks 4-11 use the same flat metric treatment as the top three. */
@media(max-width:767px){
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4),
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    justify-self:center!important;
    min-width:0!important;
    width:100%!important;
    min-height:34px!important;
    padding:2px 0!important;
    gap:4px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.money-cell::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4)::before,
  body[data-app=front].serene-rebuild .ranking-table tbody tr > td.actual-cell::before{
    width:100%!important;
    margin:0!important;
    display:block!important;
    text-align:center!important;
  }

body[data-app=front].serene-rebuild .ranking-table tbody tr > td:nth-of-type(4){
    place-self:center!important;
  }
}

/* Duty calendar phone fit: show all seven date columns without horizontal clipping. */
@media(max-width:760px){
  body[data-app=front].serene-rebuild.operation-calendar-mode,
  body[data-app=front].serene-rebuild.operation-calendar-mode .workspace,
  body[data-app=front].serene-rebuild.operation-calendar-mode .page-content,
  body[data-app=front].serene-rebuild.operation-calendar-mode .view-panel[data-panel="duty"],
  body[data-app=front].serene-rebuild.operation-calendar-mode .public-operation-mount,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-panel.duty-component-panel,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-scroll{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-scroll{
    display:grid!important;
    grid-template-rows:auto auto!important;
    padding:0!important;
    border-radius:22px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays{
    min-height:32px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-weekdays span{
    min-width:0!important;
    padding:8px 1px!important;
    overflow:hidden!important;
    color:#557a8d!important;
    font-size:clamp(8px,2.45vw,11px)!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    gap:4px!important;
    padding:6px!important;
    grid-auto-flow:row!important;
    grid-template-rows:repeat(6,minmax(82px,auto))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
    min-width:0!important;
    width:100%!important;
    min-height:82px!important;
    padding:5px 3px!important;
    border-radius:13px!important;
    grid-template-rows:22px minmax(0,1fr)!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header{
    height:22px!important;
    min-width:0!important;
    justify-content:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header time{
    width:22px!important;
    height:22px!important;
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header span{
    display:none!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-events{
    width:100%!important;
    min-width:0!important;
    gap:3px!important;
    margin-top:4px!important;
    overflow:hidden!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
    width:100%!important;
    min-width:0!important;
    min-height:22px!important;
    padding:2px!important;
    border-radius:9px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event::before,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-flow{
    display:none!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event-logo-inner{
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    display:grid!important;
    place-items:center!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo-badge{
    width:100%!important;
    max-width:34px!important;
    height:18px!important;
    max-height:18px!important;
    object-fit:contain!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-more{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    font-size:8px!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
}

@media(max-width:430px){
  body[data-app=front].serene-rebuild.operation-calendar-mode .page-content{
    padding-inline:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-grid{
    gap:3px!important;
    padding:5px!important;
    grid-template-rows:repeat(6,minmax(76px,auto))!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day{
    min-height:76px!important;
    padding:4px 2px!important;
    border-radius:11px!important;
    grid-template-rows:20px minmax(0,1fr)!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header time{
    height:20px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-day > header time{
    width:20px!important;
    font-size:10px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event{
    min-height:20px!important;
    border-radius:8px!important;
  }

  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo,
  body[data-app=front].serene-rebuild.operation-calendar-mode .calendar-event .calendar-logo-badge{
    max-width:29px!important;
    height:16px!important;
    max-height:16px!important;
  }
}

/* Dashboard phone KPI fit: keep the four rings compact inside the two-column grid. */
@media(max-width:760px){
  body[data-app=front].serene-rebuild .cockpit-kpis,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    align-items:stretch!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(n){
    min-height:0!important;
    height:clamp(142px,38vw,158px)!important;
    padding:10px 8px!important;
    gap:7px!important;
    box-sizing:border-box!important;
    justify-content:center!important;
    align-items:center!important;
    overflow:hidden!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring{
    width:82px!important;
    min-width:82px!important;
    max-width:82px!important;
    height:82px!important;
    min-height:82px!important;
    max-height:82px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring::before,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring::before{
    inset:7px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core{
    width:58px!important;
    max-width:58px!important;
    height:58px!important;
    max-height:58px!important;
    gap:4px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core strong,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core strong{
    font-size:22px!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core span,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core span{
    font-size:10px!important;
    line-height:1.15!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card footer,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card footer{
    margin:0!important;
    gap:3px!important;
    min-height:0!important;
    line-height:1!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card footer b,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card footer b{
    font-size:16px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card footer span,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card footer span{
    font-size:11px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
}

@media(max-width:370px){
  body[data-app=front].serene-rebuild .cockpit-kpis,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpis{
    gap:8px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card:nth-child(n){
    height:clamp(134px,39vw,146px)!important;
    padding:9px 6px!important;
    gap:6px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring{
    width:76px!important;
    min-width:76px!important;
    max-width:76px!important;
    height:76px!important;
    min-height:76px!important;
    max-height:76px!important;
  }

  body[data-app=front].serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core,
  body[data-app=front].cinematic-atlas.serene-rebuild .cockpit-kpi.metric-ring-card .metric-ring-core{
    width:54px!important;
    max-width:54px!important;
    height:54px!important;
    max-height:54px!important;
  }
}

/* Dashboard enterprise cards: pure CSS meteors shower night-sky background. */
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-mountain-layer{
  display:none!important;
  opacity:0!important;
  animation:none!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card{
  border-color:rgba(229,249,255,.46)!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#f7fbff!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover{
  border-color:rgba(255,255,255,.68)!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.22)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card::before{
  content:none!important;
  display:none!important;
  animation:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card::after{
  content:none!important;
  display:none!important;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-canvas{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
  opacity:1!important;
  mix-blend-mode:normal;
  -webkit-mask-image:none;
  mask-image:none;
}

/* Keep row gaps open to the site background; capsules retain their own glass. */
body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars::before,
body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars::after{
  content:none!important;
  display:none!important;
  background:none!important;
  animation:none!important;
}

body[data-app=front].serene-rebuild #cockpitTopFive{
  scroll-margin-top:94px!important;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-sky{
  position:absolute!important;
  inset:-90px 0 -120px!important;
  z-index:3!important;
  overflow:hidden!important;
  border-radius:34px!important;
  pointer-events:none!important;
  opacity:.88!important;
  mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%);
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:2px!important;
  height:2px!important;
  border-radius:999px!important;
  background:#fff!important;
  opacity:0;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.20),
    0 0 12px rgba(255,255,255,.98),
    0 0 30px rgba(151,229,255,.82),
    0 0 62px rgba(75,184,255,.38)!important;
  animation:dashboard-panel-meteor-fall var(--fall-duration,3.4s) linear infinite;
  animation-delay:var(--fall-delay,0s);
  will-change:transform,opacity;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:var(--fall-tail,clamp(118px,9vw,184px))!important;
  height:1.65px!important;
  border-radius:999px!important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.96) 0%,
      rgba(228,249,255,.82) 16%,
      rgba(122,220,255,.44) 48%,
      rgba(122,220,255,.10) 82%,
      rgba(255,255,255,0) 100%)!important;
  transform:translateY(-50%) rotate(215deg)!important;
  transform-origin:left center!important;
  filter:drop-shadow(0 0 10px rgba(130,224,255,.44))!important;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:10px!important;
  height:10px!important;
  border-radius:999px!important;
  background:radial-gradient(circle,#fff 0 28%,rgba(235,251,255,.92) 44%,rgba(136,222,255,.16) 72%,transparent 100%)!important;
  box-shadow:
    0 0 10px rgba(255,255,255,.98),
    0 0 30px rgba(150,231,255,.92),
    0 0 68px rgba(72,178,255,.40)!important;
  transform:translate(-50%,-50%)!important;
}

body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(1){--fall-tail:clamp(122px,9vw,188px);--fall-duration:3.2s;--fall-delay:-.7s;left:10%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(2){--fall-tail:clamp(100px,8vw,154px);--fall-duration:3.7s;--fall-delay:-2.1s;left:18%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(3){--fall-tail:clamp(116px,8.6vw,176px);--fall-duration:3.4s;--fall-delay:-1.2s;left:27%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(4){--fall-tail:clamp(96px,7.4vw,144px);--fall-duration:3.9s;--fall-delay:-3.0s;left:36%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(5){--fall-tail:clamp(126px,9.2vw,194px);--fall-duration:3.5s;--fall-delay:-2.4s;left:45%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(6){--fall-tail:clamp(104px,8vw,160px);--fall-duration:4.1s;--fall-delay:-3.4s;left:54%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(7){--fall-tail:clamp(118px,8.8vw,180px);--fall-duration:3.6s;--fall-delay:-.3s;left:63%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(8){--fall-tail:clamp(100px,7.8vw,150px);--fall-duration:4.0s;--fall-delay:-1.8s;left:72%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(9){--fall-tail:clamp(124px,9vw,190px);--fall-duration:3.3s;--fall-delay:-2.8s;left:81%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(10){--fall-tail:clamp(104px,8vw,158px);--fall-duration:4.2s;--fall-delay:-.9s;left:89%!important;}
body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall:nth-child(11){--fall-tail:clamp(116px,8.6vw,174px);--fall-duration:3.8s;--fall-delay:-3.8s;left:96%!important;}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars.has-dashboard-gsap-meteor .dashboard-meteor-fall{
  animation:none!important;
}

@keyframes dashboard-panel-meteor-fall{
  0%{
    opacity:0;
    transform:translate3d(-22px,-180px,0) scale(.84);
  }
  5%{opacity:0;}
  11%{opacity:.94;}
  54%{opacity:.86;}
  78%{
    opacity:0;
    transform:translate3d(54px,960px,0) scale(1.04);
  }
  100%{
    opacity:0;
    transform:translate3d(54px,960px,0) scale(1.04);
  }
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  overflow:hidden!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  opacity:.78!important;
  mix-blend-mode:screen;
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field::before{
  content:""!important;
  position:absolute!important;
  inset:-15% -8%!important;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.38) 0 .7px,transparent 1.35px),
    radial-gradient(circle,rgba(102,213,255,.24) 0 .85px,transparent 1.5px)!important;
  background-size:76px 38px,118px 54px!important;
  background-position:0 0,28px 17px!important;
  opacity:.54!important;
  animation:dashboard-starfield-pan 18s linear infinite!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor{
  position:absolute!important;
  left:var(--meteor-left,96%)!important;
  top:var(--meteor-top,8%)!important;
  width:2px!important;
  height:2px!important;
  border-radius:999px!important;
  background:#ffffff!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.16),
    0 0 8px rgba(255,255,255,.92),
    0 0 18px rgba(146,227,255,.74),
    0 0 34px rgba(68,174,255,.30)!important;
  opacity:0;
  transform:translate3d(-72px,-96px,0) scale(.82);
  transform-origin:center!important;
  animation:dashboard-meteor-shower var(--meteor-duration,5.4s) linear infinite!important;
  animation-delay:var(--meteor-delay,0s);
  will-change:transform,opacity;
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor::before{
  content:""!important;
  position:absolute!important;
  left:1px!important;
  top:50%!important;
  width:var(--meteor-tail,176px)!important;
  height:1.2px!important;
  border-radius:999px!important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.88) 0%,
      rgba(226,249,255,.60) 22%,
      rgba(121,218,255,.22) 54%,
      rgba(121,218,255,.05) 84%,
      rgba(255,255,255,0) 100%)!important;
  transform:translateY(-50%) rotate(215deg)!important;
  transform-origin:left center!important;
  filter:drop-shadow(0 0 8px rgba(130,224,255,.40))!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:8px!important;
  height:8px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:
    0 0 8px rgba(255,255,255,.98),
    0 0 19px rgba(163,233,255,.92),
    0 0 34px rgba(91,190,255,.50)!important;
  transform:translate(-50%,-50%)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .meteor-one{
  --meteor-left:42%;
  --meteor-top:30%;
  --meteor-tail:clamp(86px,6.4vw,118px);
  --meteor-duration:5.2s;
  --meteor-delay:-.8s;
}

body[data-app=front].serene-rebuild .dashboard-company-card .meteor-two{
  display:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .meteor-three{
  display:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .meteor-four{
  display:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .meteor-five{
  display:none!important;
}

body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(3n+1) .dashboard-meteor{
  animation-delay:calc(var(--meteor-delay,0s) - 1.1s)!important;
}

body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(3n+2) .dashboard-meteor{
  animation-delay:calc(var(--meteor-delay,0s) - 2.35s)!important;
}

body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(4n) .dashboard-meteor{
  animation-duration:calc(var(--meteor-duration,6.8s) + 1.15s)!important;
}

body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(1) .meteor-one{animation-delay:-.25s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(2) .meteor-one{animation-delay:-3.4s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(3) .meteor-one{animation-delay:-1.8s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(4) .meteor-one{animation-delay:-4.9s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(5) .meteor-one{animation-delay:-2.7s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(6) .meteor-one{animation-delay:-5.8s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(7) .meteor-one{animation-delay:-1.1s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(8) .meteor-one{animation-delay:-4.1s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(9) .meteor-one{animation-delay:-2.2s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(10) .meteor-one{animation-delay:-5.3s!important;}
body[data-app=front].serene-rebuild .cockpit-bars .dashboard-company-card:nth-child(11) .meteor-one{animation-delay:-3.0s!important;}

body[data-app=front].serene-rebuild .dashboard-company-card.has-dashboard-gsap-meteor .dashboard-meteor{
  animation:none!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card > :not(.dashboard-mountain-layer):not(.dashboard-meteor-field),
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-logo,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-badge,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block,
body[data-app=front].serene-rebuild .dashboard-company-card .combat-track,
body[data-app=front].serene-rebuild .dashboard-company-card > strong{
  position:relative!important;
  z-index:5!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-rank,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-1,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-2,
body[data-app=front].serene-rebuild .dashboard-company-card .rank-3{
  border-color:rgba(213,245,255,.58)!important;
  background:rgba(218,244,255,.16)!important;
  color:#eefbff!important;
  box-shadow:inset 0 1px rgba(255,255,255,.32),0 0 24px rgba(90,198,255,.16)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-logo,
body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-bar-badge{
  border-color:rgba(221,247,255,.58)!important;
  background:rgba(235,249,255,.86)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.86),0 10px 22px rgba(1,14,28,.20)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block label{
  color:#f7fbff!important;
  text-shadow:0 1px 12px rgba(2,10,20,.34)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small em{
  border-color:rgba(217,244,255,.28)!important;
  background:rgba(226,246,255,.10)!important;
  color:rgba(232,247,255,.78)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.18)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .cockpit-company-block small b{
  color:#ffffff!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-track{
  background:rgba(220,244,255,.16)!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.28)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card .combat-track i{
  background:linear-gradient(90deg,#58d0ff,#d8f7ff 72%,#ffffff)!important;
  box-shadow:0 0 16px rgba(109,211,255,.55),0 0 32px rgba(109,211,255,.18)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card > strong{
  color:#f7fbff!important;
  text-shadow:0 0 16px rgba(99,213,255,.36)!important;
}

@keyframes dashboard-meteor-shower{
  0%{
    opacity:0;
    transform:translate3d(-72px,-96px,0) scale(.78);
  }
  4%{
    opacity:0;
  }
  9%{
    opacity:.92;
  }
  44%{
    opacity:.84;
  }
  68%{
    opacity:0;
    transform:translate3d(80px,126px,0) scale(1);
  }
  100%{
    opacity:0;
    transform:translate3d(80px,126px,0) scale(1);
  }
}

@keyframes dashboard-meteor-shower-mobile{
  0%{
    opacity:0;
    transform:translate3d(-46px,-82px,0) scale(.76);
  }
  4%{
    opacity:0;
  }
  10%{
    opacity:.86;
  }
  45%{
    opacity:.72;
  }
  72%{
    opacity:0;
    transform:translate3d(54px,118px,0) scale(.96);
  }
  100%{
    opacity:0;
    transform:translate3d(54px,118px,0) scale(.96);
  }
}

@keyframes dashboard-starfield-drift{
  0%{
    opacity:.64;
    transform:translate3d(0,0,0) scale(1);
  }
  100%{
    opacity:.82;
    transform:translate3d(-10px,3px,0) scale(1.02);
  }
}

@keyframes dashboard-starfield-pan{
  0%{
    background-position:0 0,28px 17px;
    opacity:.44;
  }
  50%{
    opacity:.62;
  }
  100%{
    background-position:-76px 28px,-34px 43px;
    opacity:.48;
  }
}

@media(max-width:920px){
  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor{
    animation-name:dashboard-meteor-shower-mobile!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor::before{
    width:var(--meteor-mobile-tail,98px)!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .meteor-one{--meteor-mobile-tail:108px;}
  body[data-app=front].serene-rebuild .dashboard-company-card .meteor-two{--meteor-mobile-tail:86px;}
  body[data-app=front].serene-rebuild .dashboard-company-card .meteor-three{--meteor-mobile-tail:96px;}
}

@media(max-width:560px){
  body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
  body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card{
    background:transparent!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field{
    opacity:.84!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-app=front].serene-rebuild .dashboard-company-card::before,
  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field::before,
  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor,
  body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall{
    animation:none!important;
    transform:none!important;
    will-change:auto!important;
  }

  body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor{
    opacity:.18!important;
  }

  body[data-app=front].serene-rebuild .top-five-panel .dashboard-meteor-fall{
    opacity:0!important;
  }
}

/* Uniform capsule tint keeps the meteor sky legible at both ends. */
body[data-app=front].serene-rebuild #cockpitTopFive,
body[data-app=front].cinematic-atlas.serene-rebuild #cockpitTopFive{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:transparent!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bars,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bars{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-radius:36px!important;
  background:transparent!important;
}

body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
body[data-app=front].serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card,
body[data-app=front].cinematic-atlas.serene-rebuild .top-five-panel .cockpit-bar-row.dashboard-company-card:hover{
  border:1px solid rgba(225,248,255,.68)!important;
  border-bottom:1px solid rgba(225,248,255,.68)!important;
  background:rgba(28,79,108,.90)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.34),
    inset 0 -1px rgba(16,80,112,.14)!important;
  backdrop-filter:blur(15px) saturate(128%)!important;
  -webkit-backdrop-filter:blur(15px) saturate(128%)!important;
}

body[data-app=front].serene-rebuild .dashboard-company-card::before,
body[data-app=front].serene-rebuild .dashboard-company-card::after,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-mountain-layer,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor-field::before,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor::before,
body[data-app=front].serene-rebuild .dashboard-company-card .dashboard-meteor::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  background:none!important;
  animation:none!important;
  transform:none!important;
}

/* Three-party PK: keep every participant and metric legible as a peer. */
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:9px!important;
  align-items:stretch!important;
}

/* A three-way contest is a shared arena, not an orphaned final grid cell. */
@media(min-width:901px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card.is-triple{
    grid-column:1 / -1!important;
  }
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-triple-label{
  display:inline-flex!important;
  grid-column:1 / -1!important;
  align-items:center!important;
  justify-self:center!important;
  min-height:25px!important;
  padding:0 12px!important;
  border:1px solid rgba(164,125,220,.34)!important;
  border-radius:999px!important;
  color:#7443a5!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
  line-height:1!important;
  text-align:center!important;
  background:linear-gradient(135deg,rgba(255,255,255,.74),rgba(241,229,255,.62))!important;
  box-shadow:0 7px 16px rgba(112,70,158,.10),inset 0 1px rgba(255,255,255,.82)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-vs{
  display:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team{
  grid-template-columns:36px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  gap:7px 8px!important;
  min-height:78px!important;
  padding:9px!important;
  border-radius:16px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-logo{
  width:36px!important;
  height:36px!important;
  border-radius:12px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name strong{
  font-size:14px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name span{
  font-size:10px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team>b{
  font-size:20px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.middle,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.center,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="middle"]{
  border-color:rgba(164,125,220,.34)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(241,229,255,.54))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(2) .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.middle .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.center .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="middle"] .pk-card-team-logo{
  border-color:rgba(164,125,220,.34)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(2)>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.middle>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.center>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="middle"]>b{
  color:#8550b8!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.third,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.team-c,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="third"]{
  border-color:rgba(222,167,70,.38)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(255,240,205,.58))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(3) .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.third .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.team-c .pk-card-team-logo,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="third"] .pk-card-team-logo{
  border-color:rgba(222,167,70,.38)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team:nth-of-type(3)>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.third>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team.team-c>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple>.pk-card-team[data-pk-side="third"]>b{
  color:#ae7420!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-dots,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-dots{
  display:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score{
  min-height:32px!important;
  padding:0 6px!important;
  font-size:17px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score.middle,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score.center,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score.middle,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score.center{
  color:#8550b8!important;
  border-color:rgba(164,125,220,.28)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(241,229,255,.52))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score.third,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score.third{
  color:#ae7420!important;
  border-color:rgba(222,167,70,.30)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(255,240,205,.54))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric{
  grid-column:1 / -1!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars{
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:repeat(3,6px)!important;
  gap:5px!important;
  overflow:hidden!important;
  background:
    linear-gradient(rgba(197,225,236,.62),rgba(197,225,236,.62)) 0 0 / 100% 6px no-repeat,
    linear-gradient(rgba(220,205,240,.60),rgba(220,205,240,.60)) 0 11px / 100% 6px no-repeat,
    linear-gradient(rgba(239,218,177,.62),rgba(239,218,177,.62)) 0 22px / 100% 6px no-repeat!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars::after,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars::after{
  display:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars>i,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple>i,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars>i,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars>i{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  grid-column:1!important;
  height:6px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars>i:nth-of-type(1),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple>i:nth-of-type(1),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars>i:nth-of-type(1),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars>i:nth-of-type(1){
  grid-row:1!important;
  background:linear-gradient(90deg,#d9f7ff,#4bc4ec)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars>i:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple>i:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars>i:nth-of-type(2),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars>i:nth-of-type(2){
  grid-row:2!important;
  background:linear-gradient(90deg,#eee2ff,#a775d9)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple .pk-card-metric-bars>i:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple>i:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric-bars>i:nth-of-type(3),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric-bars>i:nth-of-type(3){
  grid-row:3!important;
  background:linear-gradient(90deg,#ffe8b9,#dfa13b)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer small,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer small,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer small{
  display:block!important;
  overflow-wrap:anywhere!important;
  text-align:center!important;
  white-space:normal!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer.is-triple small>span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer.is-triple small>span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer.is-triple small>span{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  color:#65808e!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1.2!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer small:nth-of-type(1) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer small:nth-of-type(1) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer small:nth-of-type(1) b{
  color:#147c99!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer small:nth-of-type(2) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer small:nth-of-type(2) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer small:nth-of-type(2) b{
  color:#8550b8!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer small:nth-of-type(3) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer small:nth-of-type(3) b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer small:nth-of-type(3) b{
  color:#ae7420!important;
}

/* Optional labeled rows are used by richer three-party metric markup. */
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple:has(.pk-card-metric-bar-row),
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple:has(.pk-card-metric-row){
  grid-template-rows:none!important;
  overflow:visible!important;
  background:none!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-bar-row,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(42px,auto) minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-bar-row::before,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-row::before{
  content:""!important;
  display:block!important;
  grid-column:2!important;
  grid-row:1!important;
  height:6px!important;
  border-radius:999px!important;
  background:rgba(197,225,236,.62)!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-bar-row>span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-row>span{
  min-width:0!important;
  overflow:hidden!important;
  color:#65808e!important;
  font-size:10px!important;
  font-weight:800!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-bar-row>i,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-row>i{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  z-index:1!important;
  grid-column:2!important;
  grid-row:1!important;
  height:6px!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-bar-row>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric-bars.is-triple .pk-card-metric-row>b{
  color:#173244!important;
  font-family:"Inter",sans-serif!important;
  font-size:10px!important;
  font-weight:900!important;
}

@media(max-width:620px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-triple-label{
    min-height:23px!important;
    padding:0 10px!important;
    font-size:10px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    gap:5px!important;
    width:auto!important;
    min-height:0!important;
    padding:8px 4px!important;
    justify-items:center!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-logo,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team>b{
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name strong{
    overflow:visible!important;
    font-size:12px!important;
    text-align:center!important;
    text-overflow:clip!important;
    white-space:normal!important;
    word-break:break-word!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name span{
    display:none!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team>b{
    width:100%!important;
    font-size:16px!important;
    text-align:center!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.pk-card-spectrum-triple .pk-card-spectrum-score{
    min-height:30px!important;
    font-size:15px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric.is-triple footer small,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card.is-triple .pk-card-metric footer small,
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-battle-card:has(.pk-card-duel.is-triple) .pk-card-metric footer small{
    font-size:10px!important;
  }
}

@media(max-width:390px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple{
    gap:5px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team{
    padding:7px 3px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-logo{
    width:31px!important;
    height:31px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team-name strong{
    font-size:11px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team>b{
    font-size:15px!important;
  }
}

/* A named PK participant without a synchronized enterprise record must never look like a zero score. */
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team.is-unavailable{
  border:1px dashed rgba(190,137,43,.58)!important;
  background:linear-gradient(135deg,rgba(255,250,235,.82),rgba(255,239,204,.48))!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team.is-unavailable .pk-card-team-name span,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer small.is-unavailable{
  color:#96702d!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-team.is-unavailable>b,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum-score.is-unavailable,
body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer small.is-unavailable b{
  color:#a2711f!important;
  font-size:13px!important;
  letter-spacing:0!important;
}

body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-metric footer small.is-unavailable b{
  display:block!important;
  margin-top:2px!important;
}

@media(max-width:620px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-duel.is-triple .pk-card-team.is-unavailable>b{
    font-size:11px!important;
    white-space:nowrap!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-spectrum.is-triple .pk-card-spectrum-score.is-unavailable{
    font-size:12px!important;
  }
}

/* Desktop PK lineup: two spotlight battles, three follow-up battles, then one shared arena. */
@media(min-width:1101px){
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:18px!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card{
    grid-column:span 2!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card:nth-child(1),
  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card:nth-child(2){
    grid-column:span 3!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card.is-triple{
    grid-column:1 / -1!important;
  }

  body[data-app=front].serene-rebuild.pk-screen-mode .pk-card-grid>.pk-battle-card:only-child:not(.is-triple){
    grid-column:2 / span 4!important;
  }
}

/* Dashboard desktop composition: three spotlight cards, then four and four. */
@media(min-width:1440px){
  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode #cockpitTopFive{
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode #cockpitTopFive > .dashboard-company-card{
    grid-column:span 3!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode #cockpitTopFive > .dashboard-company-card:nth-of-type(-n + 3){
    grid-column:span 4!important;
  }
}

@media(min-width:1440px) and (max-width:1599px){
  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode #cockpitTopFive{
    gap:calc(6px / var(--front-ui-scale))!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode #cockpitTopFive > .dashboard-company-card{
    padding:12px 9px!important;
    gap:10px 7px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-visuals{
    grid-template-columns:64px minmax(0,1fr)!important;
    min-height:78px!important;
    gap:10px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-gauge{
    max-width:72px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-gauge>strong{
    font-size:16px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-gauge.has-long-rate>strong{
    font-size:13px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-progress{
    gap:6px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-mini-copy{
    font-size:10px!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-company-metrics :is(th,td){
    padding:4px 1px!important;
    font-size:10px!important;
    line-height:1.25!important;
  }

  body[data-app="front"].cinematic-atlas.serene-rebuild.cockpit-mode .dashboard-metric-unit{
    font-size:8.5px!important;
  }
}