/**
 * `src/wedding-body-colors.css` — sample01 정적 템플릿용(톤 파생 변수).
 * `--body-palette-tone-en` 이 `.phone-shell` 에 있으면 아래 color-mix 가 실시간 반영됩니다.
 */

:root {
  --guestbook-body-ink: color-mix(in srgb, var(--ink) 90%, var(--body-palette-tone-en) 10%);
  --guestbook-body-muted: color-mix(in srgb, var(--muted) 88%, var(--body-palette-tone-en) 12%);
  --guestbook-accent-fill: color-mix(in srgb, var(--body-palette-tone-en) 58%, rgb(42 38 34) 42%);
  --guestbook-accent-fill-hover: color-mix(in srgb, var(--body-palette-tone-en) 50%, rgb(28 26 24) 50%);
}

/* 플로팅(BGM·공유·팔레트)은 `phone-shell` 밖 `phone-wrap`에 있음 */
.desktop-stage__phone-wrap,
.phone-shell {
  --body-palette-floating-btn-bg: color-mix(in srgb, var(--body-palette-tone-en) 42%, rgb(32 32 32 / 0.94));
  --body-palette-floating-btn-border: color-mix(in srgb, var(--body-palette-tone-en) 22%, rgb(255 255 255 / 0.38));
  --wcal-highlight: color-mix(in srgb, var(--body-palette-tone-en) 58%, rgb(42 38 34) 42%);
  --rsvp-accent: color-mix(in srgb, var(--body-palette-tone-en) 58%, rgb(42 38 34) 42%);
  --rsvp-accent-dark: color-mix(in srgb, var(--body-palette-tone-en) 44%, rgb(24 22 20) 56%);
  --body-palette-ui-border: color-mix(in srgb, var(--body-palette-tone-en) 34%, rgb(216 214 210));
  --body-palette-ui-border-hover: color-mix(in srgb, var(--body-palette-tone-en) 52%, rgb(118 114 108));
  --guestbook-body-ink: color-mix(in srgb, var(--ink) 90%, var(--body-palette-tone-en) 10%);
  --guestbook-body-muted: color-mix(in srgb, var(--muted) 88%, var(--body-palette-tone-en) 12%);
  --guestbook-accent-fill: color-mix(in srgb, var(--body-palette-tone-en) 58%, rgb(42 38 34) 42%);
  --guestbook-accent-fill-hover: color-mix(in srgb, var(--body-palette-tone-en) 50%, rgb(28 26 24) 50%);
}