/* English and Japanese homepage view counter — 2026-08-11 */
.home-view-counter{
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  gap:11px;
  width:max-content;
  max-width:100%;
  margin-top:18px;
  padding:10px 15px 10px 12px;
  overflow:hidden;
  color:#f8ead0;
  border:1px solid rgba(229,199,142,.46);
  border-radius:14px;
  background:
    linear-gradient(115deg,rgba(255,255,255,.08),transparent 38%),
    linear-gradient(135deg,rgba(16,42,61,.95),rgba(24,52,74,.9));
  box-shadow:0 9px 24px rgba(11,35,51,.18),inset 0 1px 0 rgba(255,255,255,.09);
  font-variant-numeric:tabular-nums;
}
.home-view-counter::after{content:"";position:absolute;z-index:-1;inset:-90% -38%;background:linear-gradient(105deg,transparent 42%,rgba(234,211,159,.2) 49%,transparent 56%);transform:translateX(-34%);animation:homeViewCounterGleam 7s ease-in-out infinite;pointer-events:none}
.home-view-counter-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border:1px solid rgba(229,199,142,.42);border-radius:50%;background:rgba(229,199,142,.09)}
.home-view-counter-icon svg{width:19px;height:19px;fill:#e5c78e}.home-view-counter-copy{display:grid;gap:4px;min-width:0}.home-view-counter-label{color:#c7d1d2;font-size:10px;line-height:1;font-weight:700;letter-spacing:.1em}.home-view-counter-value{display:flex;align-items:baseline;gap:6px;line-height:1}.home-view-counter-value strong{color:#e5c78e;background:linear-gradient(100deg,#b9965f 0%,#f4deb0 42%,#c39a58 72%,#ead39f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-size:22px;font-weight:900;letter-spacing:.025em;text-shadow:0 4px 18px rgba(229,199,142,.12)}.home-view-counter-value span{color:#d7dfdf;font-size:11px;font-weight:700}.home-view-counter.is-unavailable::after{display:none}.home-view-counter.is-unavailable .home-view-counter-value strong{color:#aebbbc;background:none;-webkit-text-fill-color:currentColor}@keyframes homeViewCounterGleam{0%,68%{transform:translateX(-34%)}86%,100%{transform:translateX(34%)}}@media (prefers-reduced-motion:reduce){.home-view-counter::after{animation:none}}@media (max-width:560px){.home-view-counter{margin-top:15px;padding:9px 13px 9px 10px;gap:9px;border-radius:12px}.home-view-counter-icon{width:31px;height:31px;flex-basis:31px}.home-view-counter-value strong{font-size:20px}}

/* Fujian Qiqi mobile actor proportion and motion refinement — 2026-08-21.
   Individual scale/translate properties compose with the existing GSAP stage
   transform, so the actors keep a stable ratio while poses continue to move. */
@media screen and (max-width:780px){
  body.fq-page .fq-act.has-external-controls .fq-actors{
    --fq-female-width:clamp(176px,48vw,320px);
    --fq-male-width:clamp(176px,48vw,320px);
    --fq-female-left:-3.5vw;
    --fq-female-right:auto;
    --fq-male-left:auto;
    --fq-male-right:-3.5vw;
  }
  body.fq-page .fq-act.has-external-controls .fq-actors .fq-actor{
    height:min(50%,540px);
    overflow:visible;
    transform-origin:50% 100%;
  }
  @supports selector(.fq-actor:has(> .fq-actor__proportion)){
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="female"]:not(:has(> .fq-actor__proportion)){scale:.92}
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="male"]:not(:has(> .fq-actor__proportion)){scale:1.16}
    body.fq-page .fq-act.has-external-controls.is-playing .fq-actor[data-actor="female"]:not(:has(> .fq-actor__proportion)){animation:fqQiqiMobileFemaleBreath 4.6s ease-in-out infinite}
    body.fq-page .fq-act.has-external-controls.is-playing .fq-actor[data-actor="male"]:not(:has(> .fq-actor__proportion)){animation:fqQiqiMobileMaleBreath 5.1s ease-in-out infinite}
  }
  body.fq-page .fq-act[data-act="1"].has-external-controls .fq-actors{--fq-female-left:-4.5vw;--fq-male-right:-4.5vw}
  body.fq-page .fq-act[data-act="2"].has-external-controls .fq-actors{--fq-female-left:-2.5vw;--fq-male-right:-2.5vw}
  body.fq-page .fq-act[data-act="3"].has-external-controls .fq-actors{--fq-female-left:-5vw;--fq-male-right:-5vw}
  body.fq-page .fq-act[data-act="4"].has-external-controls .fq-actors{--fq-female-left:auto;--fq-female-right:-3.5vw;--fq-male-left:-3.5vw;--fq-male-right:auto}
  body.fq-page .fq-act[data-act="5"].has-external-controls .fq-actors{--fq-female-left:0;--fq-male-right:0}
  body.fq-page .fq-act.has-external-controls.is-playing .fq-actor{will-change:transform,scale,translate,opacity}
  body.fq-page .fq-act.has-external-controls:not(.is-playing) .fq-actor{will-change:auto}
}
@keyframes fqQiqiMobileFemaleBreath{0%,100%{translate:0 0}50%{translate:0 -.72px}}
@keyframes fqQiqiMobileMaleBreath{0%,100%{translate:0 0}50%{translate:0 -.58px}}
@media screen and (max-width:380px) and (orientation:portrait){
  body.fq-page .fq-act.has-external-controls .fq-actors{--fq-female-width:clamp(158px,49vw,226px);--fq-male-width:clamp(158px,49vw,226px)}
  @supports selector(.fq-actor:has(> .fq-actor__proportion)){
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="female"]:not(:has(> .fq-actor__proportion)){scale:.9}
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="male"]:not(:has(> .fq-actor__proportion)){scale:1.13}
  }
}
@media screen and (max-width:780px) and (max-height:560px) and (orientation:landscape){
  body.fq-page .fq-act.has-external-controls .fq-actors{--fq-female-width:clamp(184px,32vw,288px);--fq-male-width:clamp(184px,32vw,288px)}
  body.fq-page .fq-act.has-external-controls .fq-actors .fq-actor{height:min(56%,336px)}
  @supports selector(.fq-actor:has(> .fq-actor__proportion)){
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="female"]:not(:has(> .fq-actor__proportion)){scale:.94}
    body.fq-page .fq-act.has-external-controls .fq-actor[data-actor="male"]:not(:has(> .fq-actor__proportion)){scale:1.1}
  }
}
@media (prefers-reduced-motion:reduce){body.fq-page .fq-act .fq-actor{animation:none!important;translate:none!important}}
