/* Effets décoratifs des pages serveur. Les positions sont injectées par css/user-assets.css. */
.standalone-effect-layer {
  position: fixed;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}

.standalone-effect-layer > span {
  position: absolute;
  display: block;
  overflow: visible;
  pointer-events: none;
  transform-origin: center;
}

body#party-upload .party-upload-compass-effect,
body#transfer-page .transfer-page-compass-effect {
  left: 5.2%;
  top: 79%;
  width: 5.8%;
  height: 10.4%;
}

body#party-upload .party-upload-lantern-flame,
body#transfer-page .transfer-page-lantern-flame {
  left: 91.5%;
  top: 8.5%;
  width: 3.2%;
  height: 6.4%;
  opacity: 0.82;
}

body#party-upload .party-upload-camera-glow,
body#transfer-page .transfer-page-camera-glow {
  left: 84.5%;
  top: 72.5%;
  width: 4.6%;
  height: 8%;
  opacity: 0.6;
}

.standalone-compass-effect {
  contain: layout paint;
}

.standalone-compass-effect::before,
.standalone-compass-effect::after,
.standalone-practical-light::before,
.standalone-practical-light::after {
  position: absolute;
  left: 50%;
  top: 50%;
  content: "";
  pointer-events: none;
  transform: translate(-50%, -50%);
  transform-origin: center;
}

.standalone-compass-effect::before {
  width: var(--compass-needle-width, 7%);
  height: 78%;
  border-radius: var(--compass-needle-tip-radius, 999px);
  background: linear-gradient(to bottom, var(--compass-needle-north, #ffec9d) 0 48%, var(--compass-needle-south, #6e2214) 50% 100%);
  box-shadow: 0 0 0.45em rgba(255, 205, 86, 0.55), 0 0 1.1em rgba(255, 188, 62, 0.24);
  opacity: var(--compass-needle-opacity, 0.88);
  animation: standalone-compass-needle 12.5s cubic-bezier(0.38, 0, 0.2, 1) infinite;
}

.standalone-compass-effect::after {
  width: 16%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #fff7c9 0 18%, #d59a28 38%, rgba(63, 28, 7, 0.78) 64%, transparent 70%);
  box-shadow: 0 0 0.7em rgba(255, 209, 85, 0.35);
}

.standalone-practical-light {
  border: 0;
  border-radius: 999px;
  background: transparent;
  mix-blend-mode: screen;
  isolation: isolate;
}

.standalone-flame-light::before {
  width: 32%;
  height: 56%;
  border-radius: 58% 42% 56% 44% / 72% 72% 34% 34%;
  background: radial-gradient(ellipse at 50% 28%, rgba(255, 255, 224, 0.98) 0 10%, rgba(255, 226, 116, 0.95) 20%, rgba(255, 146, 45, 0.78) 47%, rgba(255, 87, 28, 0.22) 68%, transparent 76%);
  filter: drop-shadow(0 0 0.28em rgba(255, 190, 75, 0.72));
  animation: standalone-flame-core 1.25s infinite ease-in-out alternate;
}

.standalone-flame-light::after {
  width: 260%;
  height: 230%;
  border-radius: 999px;
  background: radial-gradient(ellipse at 50% 58%, rgba(255, 238, 164, 0.42) 0 10%, rgba(255, 178, 58, 0.23) 28%, rgba(255, 116, 34, 0.1) 46%, rgba(255, 116, 34, 0.025) 62%, transparent 74%);
  opacity: 0.68;
  animation: standalone-flame-halo 1.9s infinite ease-in-out alternate;
}

.standalone-camera-glow::before {
  width: 86%;
  height: 86%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 40% 34%, rgba(255, 255, 240, 0.88) 0 4%, rgba(255, 218, 132, 0.7) 9%, rgba(228, 142, 44, 0.2) 30%, transparent 58%),
    conic-gradient(from 18deg, transparent 0 17%, rgba(255, 230, 170, 0.2) 20% 24%, transparent 30% 100%);
  animation: standalone-camera-glint 4.4s infinite ease-in-out;
}

.standalone-camera-glow::after {
  width: 170%;
  height: 170%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 232, 168, 0.34) 0 14%, rgba(255, 189, 74, 0.13) 34%, rgba(255, 189, 74, 0.035) 57%, transparent 74%);
  animation: standalone-camera-halo 5.8s infinite ease-in-out;
}

@keyframes standalone-compass-needle {
  0%, 62% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(var(--compass-idle-angle, -18deg)); }
  66% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 52deg)); }
  68% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 102deg)); }
  70% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 232deg)); }
  72% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 28deg)); }
  74% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 12deg)); }
  76% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) - 8deg)); }
  79% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(calc(var(--compass-idle-angle, -18deg) + 4deg)); }
  83%, 100% { transform: translate(-50%, -50%) rotateX(var(--compass-tilt-x, 0deg)) rotateY(var(--compass-tilt-y, 0deg)) rotate(var(--compass-idle-angle, -18deg)); }
}

@keyframes standalone-flame-core {
  0% { opacity: 0.74; transform: translate(-50%, -50%) rotate(-3deg) scale(0.9, 1.08); }
  28% { opacity: 0.98; transform: translate(-49%, -53%) rotate(2deg) scale(1.06, 0.96); }
  56% { opacity: 0.84; transform: translate(-52%, -49%) rotate(-1deg) scale(0.95, 1.14); }
  100% { opacity: 1; transform: translate(-50%, -54%) rotate(4deg) scale(1.03, 1.01); }
}

@keyframes standalone-flame-halo {
  0% { opacity: 0.34; transform: translate(-50%, -50%) scale(0.86); }
  45% { opacity: 0.78; transform: translate(-50%, -51%) scale(1.08); }
  100% { opacity: 0.52; transform: translate(-50%, -50%) scale(0.98); }
}

@keyframes standalone-camera-glint {
  0%, 100% { opacity: 0.26; transform: translate(-50%, -50%) scale(0.92); }
  33% { opacity: 0.68; transform: translate(-49%, -51%) scale(1.04); }
  52% { opacity: 0.4; transform: translate(-51%, -49%) scale(0.98); }
  72% { opacity: 0.82; transform: translate(-48%, -52%) scale(1.08); }
}

@keyframes standalone-camera-halo {
  0%, 100% { opacity: 0.12; transform: translate(-50%, -50%) scale(0.92); }
  45% { opacity: 0.4; transform: translate(-50%, -50%) scale(1.08); }
  70% { opacity: 0.22; transform: translate(-50%, -50%) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .standalone-effect-layer *::before,
  .standalone-effect-layer *::after {
    animation: none !important;
  }
}
/* Coordonnées de virement positionnées depuis le calibrage administrateur. */
body#transfer-page .transfer-page-positioned-field {
  position: fixed;
  z-index: 4;
  display: grid;
  align-content: center;
  gap: 0.22em;
  box-sizing: border-box;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(235, 191, 98, 0.5);
  border-radius: 10px;
  padding: clamp(7px, 0.65vw, 12px) clamp(9px, 0.9vw, 16px);
  background: rgba(5, 12, 11, 0.88);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.35);
  color: #fff3cb;
}

body#transfer-page .transfer-page-positioned-field dt {
  margin: 0;
  color: #d3a44b;
  font-size: 0.68em;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body#transfer-page .transfer-page-positioned-field dd {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.65em;
  min-width: 0;
  margin: 0;
}

body#transfer-page .transfer-page-positioned-field dd span {
  overflow: hidden;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 1em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body#transfer-page .transfer-page-positioned-field dd button {
  min-height: 0;
  padding: 0.46em 0.72em;
  font-size: 0.68em;
}

@media (max-width: 720px) {
  body#transfer-page .transfer-page-positioned-field {
    padding: 7px 9px;
  }

  body#transfer-page .transfer-page-positioned-field dd button {
    padding-inline: 0.55em;
  }
}
/* v191 : valeurs de virement sans carte */
body#transfer-page .transfer-page-positioned-field {
  position: fixed;
  z-index: 4;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  overflow: visible;
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: 18px;
  background: transparent;
  box-shadow: none;
  color: #2b180d;
}

body#transfer-page .transfer-page-positioned-field dt {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

body#transfer-page .transfer-page-positioned-field dd {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
}

body#transfer-page .transfer-page-positioned-field dd span {
  display: block;
  width: 100%;
  overflow: visible;
  color: inherit;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  font-weight: 700;
  line-height: inherit;
  text-overflow: clip;
  text-shadow: 0 1px 1px rgba(255, 240, 196, 0.48);
  white-space: nowrap;
}

body#party-upload .party-upload-drop-zone {
  position: fixed;
  z-index: 4;
}
/* Même rendu que le calibrage pour les étincelles des pages autonomes. */
.standalone-sparkler-light {
  border: 0;
  background: transparent;
  mix-blend-mode: screen;
  isolation: isolate;
}
.standalone-sparkler-light::before,
.standalone-sparkler-light::after {
  position: absolute;
  left: 50%;
  content: "";
  pointer-events: none;
  transform-origin: 50% 100%;
}
.standalone-sparkler-light::before {
  bottom: 0;
  width: 9%;
  height: 82%;
  border-radius: 999px;
  background: linear-gradient(to top, rgba(130, 68, 15, 0.15), #ffb62e 42%, #fff9cf 76%, transparent 100%);
  box-shadow: 0 0 0.28em rgba(255, 184, 53, 0.78), 0 0 0.8em rgba(255, 134, 24, 0.42);
  animation: standalone-sparkler-stem 0.44s steps(2, end) infinite;
}
.standalone-sparkler-light::after {
  top: 0;
  width: 118%;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, #fffde2 0 5%, #ffd25d 8%, transparent 22%),
    repeating-conic-gradient(from 7deg, transparent 0 8deg, rgba(255, 245, 188, 0.92) 10deg 12deg, transparent 14deg 30deg);
  filter: drop-shadow(0 0 0.22em rgba(255, 203, 84, 0.95));
  animation: standalone-sparkler-burst-a 0.82s steps(5, end) infinite;
}
.standalone-sparkler-light.sparkler-variant-b::after {
  width: 92%;
  background:
    radial-gradient(circle, #fff 0 7%, #ffe49b 10%, transparent 24%),
    repeating-conic-gradient(from 20deg, transparent 0 13deg, rgba(255, 255, 226, 0.95) 15deg 17deg, transparent 19deg 40deg);
  animation-name: standalone-sparkler-burst-b;
  animation-duration: 1.08s;
}
.standalone-sparkler-light.sparkler-variant-c::after {
  width: 138%;
  background:
    radial-gradient(circle, #fffbd1 0 4%, #ffad2f 9%, transparent 21%),
    repeating-conic-gradient(from -8deg, transparent 0 6deg, rgba(255, 188, 69, 0.95) 8deg 11deg, transparent 13deg 25deg);
  animation-name: standalone-sparkler-burst-c;
  animation-duration: 0.68s;
}
@keyframes standalone-sparkler-stem {
  0%, 100% { opacity: 0.68; transform: translateX(-50%) rotate(-1deg) scaleY(0.94); }
  50% { opacity: 1; transform: translateX(-50%) rotate(1deg) scaleY(1.04); }
}
@keyframes standalone-sparkler-burst-a {
  0%, 100% { opacity: 0.38; transform: translate(-50%, -8%) rotate(0deg) scale(0.68); }
  45% { opacity: 1; transform: translate(-50%, -8%) rotate(17deg) scale(1.08); }
}
@keyframes standalone-sparkler-burst-b {
  0%, 100% { opacity: 0.28; transform: translate(-50%, -6%) rotate(0deg) scale(0.8); }
  62% { opacity: 0.96; transform: translate(-50%, -6%) rotate(-22deg) scale(1.16); }
}
@keyframes standalone-sparkler-burst-c {
  0%, 100% { opacity: 0.34; transform: translate(-50%, -10%) rotate(0deg) scale(0.62); }
  35% { opacity: 1; transform: translate(-50%, -10%) rotate(28deg) scale(1.14); }
  70% { opacity: 0.58; transform: translate(-50%, -10%) rotate(44deg) scale(0.88); }
}
/* Décalage stable des effets répétés v9. */
.standalone-compass-effect::before,
.standalone-practical-light::before,
.standalone-sparkler-light::before {
  animation-delay: var(--effect-phase, 0s) !important;
}

.standalone-compass-effect::after,
.standalone-practical-light::after,
.standalone-sparkler-light::after {
  animation-delay: calc(var(--effect-phase, 0s) - 0.37s) !important;
}
/* v10 : conserver seulement la petite barre scintillante sur les pages soirée. */
body#party-upload .standalone-sparkler-light::after,
body#party-gallery .standalone-sparkler-light::after {
  display: none !important;
}