/* V23 supplied UI visual effects, adapted to existing real pages. */
/* 2. 全局指尖双重各向异性冲击波环 + 瞬时核心闪光点 */
.click-core-flash {
  position: fixed;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 16px 4px var(--pink), 0 0 32px 8px var(--gold);
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%) scale(1);
  animation: coreFlashOut 0.28s ease-out forwards;
}
@keyframes coreFlashOut {
  0%   { opacity: 1; transform: translate(-50%, -50%) scale(0.5); }
  50%  { opacity: 0.9; transform: translate(-50%, -50%) scale(1.6); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.1); }
}

.click-shockwave-inner {
  position: fixed;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 9998;
  border: 1.8px solid var(--pink);
  box-shadow: 0 0 12px var(--pink), inset 0 0 8px var(--gold);
  transform: translate(-50%, -50%) scale(0.3);
  animation: shockInnerBurst 0.52s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes shockInnerBurst {
  0%   { opacity: 0.95; transform: translate(-50%, -50%) scale(0.3); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(4.2); }
}

.click-shockwave-outer {
  position: fixed;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 9997;
  border: 1px dashed var(--gold);
  transform: translate(-50%, -50%) scale(0.2) rotate(0deg);
  animation: shockOuterSpin 0.68s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes shockOuterSpin {
  0%   { opacity: 0.85; transform: translate(-50%, -50%) scale(0.2) rotate(0deg); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(3.6) rotate(90deg); }
}

/* 陀飞轮星轨准星特效 (Horology Compass Reticle) */
.click-horology-reticle {
  position: fixed;
  width: 58px;
  height: 58px;
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%) scale(0.35) rotate(-45deg);
  animation: reticleLockIn 0.62s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes reticleLockIn {
  0%   { opacity: 1; transform: translate(-50%, -50%) scale(0.35) rotate(-45deg); }
  65%  { opacity: 0.85; transform: translate(-50%, -50%) scale(1.15) rotate(15deg); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.45) rotate(45deg); }
}

/* 赛博量子六边形脉冲特效 (Cyber Quantum Hex) */
.click-cyber-hex {
  position: fixed;
  width: 44px;
  height: 44px;
  pointer-events: none;
  z-index: 9998;
  clip-path: polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%);
  background: radial-gradient(circle, transparent 48%, var(--pink) 72%, var(--pink2) 100%);
  transform: translate(-50%, -50%) scale(0.25);
  animation: cyberHexPulse 0.54s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes cyberHexPulse {
  0%   { opacity: 1; transform: translate(-50%, -50%) scale(0.25) rotate(0deg); filter: hue-rotate(0deg); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(2.5) rotate(60deg); filter: hue-rotate(90deg); }
}

/* 重力抛物线星钻/樱花微粒 */
.click-phys-particle {
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  color: var(--gold);
  font-size: 12px;
  font-weight: 800;
  text-shadow: 0 0 8px var(--pink);
  transform: translate(-50%, -50%);
  animation: physParticleArc 0.72s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes physParticleArc {
  0%   { opacity: 1; transform: translate(-50%, -50%) scale(0.5) rotate(0deg); }
  60%  { opacity: 0.95; }
  100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.2) rotate(var(--rot)); }
}

/* 悬浮微反馈胶囊标 & 连击 Combo 徽章 */
.click-micro-hud {
  position: fixed;
  pointer-events: none;
  z-index: 10000;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(10, 12, 18, 0.88);
  border: 1px solid var(--pink);
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: 0 6px 18px rgba(0,0,0,0.55), 0 0 12px color-mix(in srgb, var(--pink) 42%, transparent);
  white-space: nowrap;
  transform: translate(-50%, -100%);
  animation: microHudFloat 0.78s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes microHudFloat {
  0%   { opacity: 0; transform: translate(-50%, -40%) scale(0.7); }
  25%  { opacity: 1; transform: translate(-50%, -130%) scale(1.06); }
  100% { opacity: 0; transform: translate(-50%, -220%) scale(0.94); }
}


.v22-real [data-v22-feedback].v23-bounce{animation:v23SourceBounce .42s cubic-bezier(.34,1.56,.64,1)}
@keyframes v23SourceBounce{0%{scale:1}22%{scale:.91}58%{scale:1.045}82%{scale:.985}100%{scale:1}}
@keyframes v23ViewSpring{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes v23CardRise{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.v23-page-enter{animation:v23ViewSpring .42s cubic-bezier(.22,1,.36,1) both}
.v23-card-enter{animation:v23CardRise .42s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--v23-delay,0ms)}
.v22-palette-box .wheel-stage .tourbillon-cage-cw{animation:tourbillonCW 24s linear infinite!important}
.v22-palette-box .wheel-stage .tourbillon-cage-ccw{animation:tourbillonCCW 16s linear infinite!important}
.v22-real .v18-hero-art>svg{animation:spinAstrolabe 36s linear infinite!important}
@media(prefers-reduced-motion:reduce){.v23-bounce,.v23-page-enter,.v23-card-enter{animation:none!important}.v22-palette-box .wheel-stage .tourbillon-cage-cw,.v22-palette-box .wheel-stage .tourbillon-cage-ccw,.v22-real .v18-hero-art>svg{animation:none!important}.click-core-flash,.click-shockwave-inner,.click-shockwave-outer,.click-horology-reticle,.click-cyber-hex,.click-phys-particle,.click-micro-hud{display:none}}

@keyframes spinAstrolabe{to{transform:rotate(360deg)}}
.v22-palette-mask:not(.open) .tourbillon-cage-cw,.v22-palette-mask:not(.open) .tourbillon-cage-ccw{animation-play-state:paused!important}

.spark-star {
  position: fixed; pointer-events: none; z-index: 9999;
  color: var(--gold); font-size: 12px;
  transform: translate(-50%, -50%);
  animation: sparkFly 0.68s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes sparkFly {
  0% { opacity: 1; transform: translate(-50%, -50%) scale(0.6) rotate(0deg); }
  100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.25) rotate(var(--rot)); }
}


#v23-weather-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:110;pointer-events:none;opacity:.72}
.v23-fx-panel{margin:16px 0;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:left}.v23-fx-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}.v23-fx-heading small{font-size:9px;color:var(--gold)}.v23-fx-panel h3{font-size:12px;margin:16px 0 9px}.v23-fx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:8px}.v23-skin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v23-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v23-fx-panel button{min-height:42px;padding:7px 5px;border:1px solid var(--line);border-radius:12px;background:var(--pane);color:var(--text);font:inherit;font-size:11px}.v23-fx-panel button[aria-pressed="true"]{border-color:var(--pink);background:var(--pane2);color:var(--pink)}.v23-fx-fullscreen{width:100%;margin-top:8px}.v22-haptic-setting [data-click-skin]{width:132px}

/* Individual scale leaves positioning transforms and island morphs intact. */
.v22-real :is(button,a[href],[role="button"],[role="tab"],.character-card,.community-post-card) { -webkit-tap-highlight-color:transparent; }
.v22-real [data-v22-feedback] { transition:scale 110ms cubic-bezier(.2,.8,.2,1),opacity 110ms ease-out;transform-origin:center; }
.v22-real [data-v22-feedback="control"][data-v22-pressed] { scale:.965;opacity:.76; }
.v22-real [data-v22-feedback="card"][data-v22-pressed] { scale:.987;opacity:.85; }
.v22-real [data-v22-feedback]:focus-visible { outline:2px solid var(--pink);outline-offset:3px; }
.v22-real [data-v22-feedback]:disabled,.v22-real [data-v22-feedback][aria-disabled="true"] { scale:1;opacity:.45; }
.v22-real [data-v22-feedback][aria-busy="true"] { scale:1;cursor:progress; }
@media(prefers-reduced-motion:reduce){.v22-real [data-v22-feedback]{transition:none!important}.v22-real [data-v22-pressed]{scale:1!important;opacity:.78}}

.rulan-effects-dialog{margin:auto;max-width:620px;width:calc(100vw - 24px);max-height:85dvh;overflow:auto;border:1px solid var(--line);border-radius:24px;padding:20px;background:var(--pane,#fff);color:var(--text,#24372b)}.rulan-effects-dialog::backdrop{background:#15291d66}.rulan-effects-close{float:right;border:1px solid var(--line);border-radius:12px;padding:8px 16px;color:inherit;background:var(--pane2,#edf3e9)}