/* ─────────── RESET ─────────── */
*,*::before,*::after{ box-sizing:border-box }
html,body{ margin:0; padding:0 }
html{ scroll-behavior:smooth }
body{
  font-family:var(--kor);
  color:var(--ink);
  background:var(--page-bg);
  overflow-x:hidden;
  line-height:1.75;
  position:relative;
}

/* ─────────── FIXED PAGE BACKGROUND ─────────── */
.bg-decor{
  position:fixed; inset:0; z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 0% 0%,   rgba(232,180,184,.35), transparent 55%),
    radial-gradient(ellipse at 100% 100%, rgba(212,197,232,.30), transparent 55%),
    radial-gradient(ellipse at 50% 50%, rgba(255,235,238,.5), transparent 70%),
    linear-gradient(180deg, var(--page-bg) 0%, var(--page-bg-deep) 50%, var(--page-bg) 100%);
}
.bg-watermark{
  position:fixed; inset:0; z-index:-1;
  pointer-events:none;
  opacity:.06;
  background-repeat:repeat;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'><g fill='none' stroke='%23C9A961' stroke-width='1.1'><circle cx='110' cy='110' r='3'/><path d='M110 70 C 95 85 95 105 110 110 C 125 105 125 85 110 70 Z'/><path d='M110 150 C 95 135 95 115 110 110 C 125 115 125 135 110 150 Z'/><path d='M70 110 C 85 95 105 95 110 110 C 105 125 85 125 70 110 Z'/><path d='M150 110 C 135 95 115 95 110 110 C 115 125 135 125 150 110 Z'/><circle cx='110' cy='110' r='30' stroke-dasharray='2 6'/><circle cx='30' cy='30' r='2'/><circle cx='190' cy='30' r='2'/><circle cx='30' cy='190' r='2'/><circle cx='190' cy='190' r='2'/></g></svg>");
}
.bg-particles{
  position:fixed; inset:0; z-index:-1;
  pointer-events:none; overflow:hidden;
}
.bg-particle{
  position:absolute;
  width:6px; height:6px;
  background: radial-gradient(circle, var(--gold-soft) 0%, transparent 70%);
  border-radius:50%;
  opacity:.55;
  animation: drift linear infinite, twinkle 4s ease-in-out infinite;
}

/* ─────────── SHARED KEYFRAMES ─────────── */
@keyframes drift{
  0%  { transform: translate3d(0, -10vh, 0) }
  100%{ transform: translate3d(40px, 110vh, 0) }
}
@keyframes twinkle{
  0%,100%{ opacity:.2; transform:scale(.8) }
  50%    { opacity:1;  transform:scale(1.4) }
}
@keyframes glow-pulse{
  0%  { filter: drop-shadow(0 0 0 rgba(201,169,97,0)) }
  100%{ filter: drop-shadow(0 0 8px rgba(201,169,97,.7)) }
}
@keyframes slow-spin{
  0%  { transform: rotate(0deg) }
  100%{ transform: rotate(360deg) }
}

/* ─────────── REDUCED MOTION ─────────── */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation: none !important;
    transition: none !important;
  }
  .petal, .star, .scroll-cue, .bg-particle, .float-heart, .msg-sparkle{ display:none }
  .reveal{ opacity:1; transform:none }
}