/**
 * @fileoverview 편지지 — "고급스럽고 사랑스럽게" 재테마 (Luxe)
 * @loads-after redesign.css  (마지막 로드 — 캐스케이드 우선)
 *
 * 방향: 아이보리 & 골드 베이스 + 은은한 블러시 핑크
 *       데클(찢긴 결) 테두리 + 종이 질감 카드, Gaegu 손글씨 유지, 골드 포인트
 *
 * 구성
 *  0. 토큰 재정의 (:root)            5. 피드 카드 = 편지지 (데클+종이+사진마운트)
 *  1. 배경 + 종이결 + 커서           6. 여정 카드 / 마일스톤 핀
 *  2. 헤더                           7. 모달 (상세/수정/라이트박스)
 *  3. 커버                           8. 로그인
 *  4. 효과 톤다운 (꽃잎)             9. 업로드 / 폼
 */

/* =========================================================================
   0. 토큰 재정의 — 아이보리 · 골드 · 블러시
   ========================================================================= */
:root {
  /* Primary → 블러시 로즈 (은은하게만) */
  --color-primary-900: #8A5366;
  --color-primary-700: #A8697E;
  --color-primary-500: #C58DA0;
  --color-primary-300: #E4C4CE;
  --color-primary-100: #F6E9EC;

  --color-secondary-700: #8A6E50;
  --color-secondary-400: #C7AE86;
  --color-secondary-100: #F1E7D4;

  --color-success: #6E8A66;
  --color-warning: #C9A24C;
  --color-error:   #B5667A;
  --color-info:    #9A8466;

  /* Background — 아이보리/크림 */
  --color-bg-page:    #F4ECD9;
  --color-bg-surface: #FAF3E4;
  --color-bg-card:    #FFFCF4;
  --color-bg-overlay: rgba(60, 44, 28, 0.55);

  /* Text — 따뜻한 잉크 브라운 */
  --color-text-primary:   #46382A;
  --color-text-secondary: #6E5A42;
  --color-text-muted:     #A08A6E;
  --color-text-on-dark:   #FBF5E8;

  /* Border */
  --color-border-default: #E2D2AE;
  --color-border-strong:  #C9A24C;
  --color-border-focus:   #C9A24C;

  /* Gold */
  --color-gold:       #C9A24C;
  --color-gold-light: #E8CD83;
  --color-gold-dark:  #9E7A2A;
  --gold-foil: linear-gradient(135deg, #B5862E 0%, #E8CD83 28%, #FBEBB0 48%, #C9A24C 70%, #9E7A2A 100%);

  /* Paper */
  --paper:       #FBF4E2;
  --paper-warm:  #F7EDD6;
  --paper-edge:  #EFE2C4;
  --ink:         #46382A;

  /* Shadow — 따뜻한 갈색 베이스 */
  --shadow-xs:    0 1px 2px rgba(90, 66, 30, 0.08);
  --shadow-sm:    0 2px 8px rgba(90, 66, 30, 0.12);
  --shadow-md:    0 6px 20px rgba(90, 66, 30, 0.16);
  --shadow-lg:    0 14px 40px rgba(90, 66, 30, 0.20);
  --shadow-gold:  0 2px 16px rgba(201, 162, 76, 0.30);
}

/* =========================================================================
   1. 배경 + 종이결 + 커서
   ========================================================================= */
body {
  background-color: var(--color-bg-page) !important;
  /* 잔잔한 플로럴/도트 패턴 (골드 + 블러시, 아주 옅게) */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none'%3E%3C!-- sprig --%3E%3Cpath d='M16 12 q3 5 0 10 q-3 -5 0 -10' fill='%23C9A24C' opacity='0.10'/%3E%3Ccircle cx='16' cy='10' r='1.4' fill='%23C9A24C' opacity='0.12'/%3E%3C!-- petite flower --%3E%3Cg opacity='0.10'%3E%3Ccircle cx='46' cy='40' r='2.1' fill='%23C58DA0'/%3E%3Ccircle cx='42.5' cy='37' r='1.6' fill='%23C58DA0'/%3E%3Ccircle cx='49.5' cy='37' r='1.6' fill='%23C58DA0'/%3E%3Ccircle cx='42.5' cy='43' r='1.6' fill='%23C58DA0'/%3E%3Ccircle cx='49.5' cy='43' r='1.6' fill='%23C58DA0'/%3E%3Ccircle cx='46' cy='40' r='1.3' fill='%23C9A24C'/%3E%3C/g%3E%3C!-- dots --%3E%3Ccircle cx='10' cy='46' r='1' fill='%23C9A24C' opacity='0.12'/%3E%3Ccircle cx='54' cy='12' r='1' fill='%23C58DA0' opacity='0.12'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(circle, rgba(201,162,76,0.05) 1px, transparent 1px);
  background-size: 128px 128px, 22px 22px !important;
  background-position: 0 0, 11px 11px !important;
  /* 블러시-골드 하트 커서 (유지, 색만 고급스럽게) */
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M14 24 C14 24 3 17 3 10 C3 6.5 5.5 4 8.5 4 C10.8 4 12.6 5.5 14 7.5 C15.4 5.5 17.2 4 19.5 4 C22.5 4 25 6.5 25 10 C25 17 14 24 14 24 Z' fill='%23C58DA0' stroke='%23F7EDD6' stroke-width='1.6'/%3E%3C/svg%3E") 14 14, auto !important;
}

button, a, [role="button"], label[for] {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M14 24 C14 24 3 17 3 10 C3 6.5 5.5 4 8.5 4 C10.8 4 12.6 5.5 14 7.5 C15.4 5.5 17.2 4 19.5 4 C22.5 4 25 6.5 25 10 C25 17 14 24 14 24 Z' fill='%23C9A24C' stroke='%23FBF4E2' stroke-width='1.6'/%3E%3C/svg%3E") 14 14, pointer !important;
}

/* 데스크탑 양쪽 여백 장식 — 더 옅고 차분하게 */
@media (min-width: 1100px) {
  .page-wrapper::before,
  .page-wrapper::after {
    opacity: 0.16 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='120' viewBox='0 0 90 120'%3E%3Cg fill='none' stroke='%23C9A24C' stroke-width='1' opacity='0.5'%3E%3Cpath d='M45 18 q10 14 0 30 q-10 -16 0 -30'/%3E%3Cpath d='M45 18 q-10 14 0 30'/%3E%3C/g%3E%3Cg opacity='0.45'%3E%3Ccircle cx='45' cy='78' r='3' fill='%23C58DA0'/%3E%3Ccircle cx='39' cy='73' r='2.3' fill='%23C58DA0'/%3E%3Ccircle cx='51' cy='73' r='2.3' fill='%23C58DA0'/%3E%3Ccircle cx='39' cy='83' r='2.3' fill='%23C58DA0'/%3E%3Ccircle cx='51' cy='83' r='2.3' fill='%23C58DA0'/%3E%3Ccircle cx='45' cy='78' r='2' fill='%23C9A24C'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: 90px 120px !important;
  }
}

/* =========================================================================
   2. 헤더 — 크림 글라스 + 골드 로고
   ========================================================================= */
.site-header {
  background: rgba(250, 243, 228, 0.66) !important;
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border-bottom: 1px solid rgba(201, 162, 76, 0.28) !important;
}
.site-header--scrolled {
  background: rgba(250, 243, 228, 0.88) !important;
  box-shadow: 0 4px 22px rgba(90, 66, 30, 0.10) !important;
}
.site-header__logo {
  font-family: 'Nanum Myeongjo', serif !important;
  letter-spacing: 0.04em;
  font-size: clamp(0.98rem, 2.6vw, 1.28rem) !important;
  white-space: nowrap;
  background: var(--gold-foil) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.site-header__logo::before { content: '' !important; }
.site-header__nav-link {
  font-family: 'Nanum Myeongjo', serif !important;
  letter-spacing: 0.05em;
  color: var(--color-text-secondary) !important;
}
.site-header__nav-link--active {
  color: var(--color-gold-dark) !important;
}
.site-header__nav-link--active::after {
  background: var(--gold-foil) !important;
}

/* =========================================================================
   3. 커버 — 따뜻한 크림 오버레이 + 골드 세리프
   ========================================================================= */
.cover-overlay {
  background: linear-gradient(
    180deg,
    rgba(40, 28, 16, 0.34) 0%,
    rgba(40, 28, 16, 0.10) 32%,
    rgba(244, 236, 217, 0.05) 58%,
    rgba(244, 236, 217, 0.55) 84%,
    var(--color-bg-page) 100%
  ) !important;
}
.cover-names {
  font-family: 'Nanum Myeongjo', serif !important;
  font-weight: 700;
  letter-spacing: 0.22em !important;
  color: #FFFBF2 !important;
  text-shadow: 0 2px 18px rgba(50, 30, 12, 0.5);
}
.cover-names::before,
.cover-names::after {
  content: '✦';
  font-size: 0.4em;
  color: var(--color-gold-light);
  vertical-align: middle;
  margin: 0 0.6em;
  -webkit-text-fill-color: var(--color-gold-light);
  opacity: 0.9;
}
.cover-dday {
  font-family: 'Nanum Myeongjo', serif !important;
  font-weight: 800;
  background: var(--gold-foil) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 4px 14px rgba(40, 24, 8, 0.4)) !important;
}
.cover-start-date {
  font-family: 'Gaegu', cursive !important;
  color: #FBF1DE !important;
  letter-spacing: 0.18em !important;
  opacity: 0.92 !important;
  text-shadow: 0 1px 10px rgba(50, 30, 12, 0.5);
}
/* 커버 하단 wave → 크림으로 자연스럽게 */
.cover-wave svg path { fill: var(--color-bg-page) !important; }

/* =========================================================================
   4. 효과 톤다운 — 꽃잎만, 느리고 옅게
   ========================================================================= */
.petal {
  opacity: 0.5 !important;
  font-size: 1rem;
  filter: saturate(0.7) brightness(1.05);
}
/* 클릭 하트도 차분하게 */
.click-heart { opacity: 0.7 !important; filter: saturate(0.7); }

/* =========================================================================
   5. 피드 카드 = 편지지 (데클 엣지 + 종이결 + 사진 마운트)
   ========================================================================= */
.feed__list {
  padding: 3rem 7vw 3.5rem !important;
  gap: 2.6rem !important;
  align-items: center !important;
}

/* 종이 시트 — 카드 자체에 크림 종이(항상 보임) + 골드 헤어라인 + 그림자 */
.polaroid {
  background-color: var(--paper) !important;
  background-image:
    repeating-linear-gradient(92deg, rgba(120,90,40,0.022) 0 2px, transparent 2px 5px),
    radial-gradient(120% 80% at 20% 0%, rgba(255,252,244,0.85), transparent 60%),
    radial-gradient(140% 120% at 90% 100%, rgba(201,162,76,0.10), transparent 55%),
    linear-gradient(180deg, #FFFCF4 0%, #FAF1DC 100%) !important;
  border: 1px solid rgba(201, 162, 76, 0.42) !important;
  border-radius: 2px !important;
  box-shadow: 0 12px 22px rgba(90, 66, 30, 0.18) !important;
  overflow: visible !important;
  padding: 12px 12px 8px !important;
  isolation: isolate;
}

/* 데클(찢긴 결) 가장자리 — 카드보다 살짝 큰 종이를 뒤에 깔고 필터로 결을 낸다.
   필터 미지원 시에도 은은한 크림 종이로 자연스럽게 폴백된다. */
.polaroid::before {
  content: '';
  position: absolute;
  inset: -9px -11px -12px;
  z-index: -1;
  border-radius: 3px;
  background-color: var(--paper-warm);
  background-image: linear-gradient(180deg, #FBF4E2 0%, #F3E6CC 100%);
  filter: url(#deckle) drop-shadow(0 10px 16px rgba(90, 66, 30, 0.16));
}
/* 안쪽 골드 헤어라인은 카드 보더로 충분 — 제거 */
.polaroid:hover {
  transform: rotate(0deg) translateY(-8px) scale(1.02) !important;
  box-shadow: 0 22px 34px rgba(90, 66, 30, 0.24) !important;
}

/* 사진 — 종이 위에 마운트된 느낌 (크림 매트 + 인셋 + 위쪽 테이프) */
.polaroid__photo-wrap {
  border-radius: 1px;
  box-shadow:
    0 0 0 5px #FFFDF6,
    0 1px 0 6px rgba(201,162,76,0.30),
    inset 0 0 28px rgba(60, 40, 16, 0.12);
  overflow: visible;
}
.polaroid__photo-wrap img,
.letter-card__photo {
  border-radius: 1px;
}
/* 반투명 워시 테이프 (위쪽 중앙) */
.polaroid__photo-wrap::before {
  content: '';
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%) rotate(-3deg);
  width: 92px;
  height: 26px;
  background:
    repeating-linear-gradient(45deg, rgba(201,162,76,0.16) 0 4px, rgba(231,201,120,0.10) 4px 8px),
    rgba(251, 244, 226, 0.55);
  border: 1px solid rgba(201,162,76,0.22);
  box-shadow: 0 1px 4px rgba(90,66,30,0.12);
  z-index: 5;
  pointer-events: none;
}

/* 본문 — 손글씨 + 줄글 + 잉크 브라운 */
.polaroid__body {
  padding: 14px 8px 6px !important;
}
.polaroid__meta {
  border-bottom: 1px dashed rgba(201, 162, 76, 0.40) !important;
  margin-bottom: 0.7rem !important;
}
.polaroid__nthday {
  font-family: 'Gaegu', cursive !important;
  background: var(--gold-foil) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-size: 1.5rem !important;
}
.polaroid__nthday::before {
  content: '❥ ';
  -webkit-text-fill-color: var(--color-primary-500);
  font-size: 0.8em;
}
.polaroid__date {
  font-family: 'Gaegu', cursive !important;
  color: var(--color-secondary-700) !important;
  opacity: 0.9 !important;
}
.polaroid__text {
  font-family: 'Gaegu', cursive !important;
  color: var(--ink) !important;
  font-size: 1.06rem !important;
  line-height: 1.95 !important;
  /* 옅은 편지 괘선 */
  background-image: repeating-linear-gradient(
    transparent,
    transparent calc(1.95em - 1px),
    rgba(201, 162, 76, 0.16) calc(1.95em - 1px),
    rgba(201, 162, 76, 0.16) 1.95em
  );
  background-position: 0 0.5em;
  padding-bottom: 2px;
}

/* 앨범 배지 — 크림 + 골드 보더 + 블러시 글자 */
.album-badge {
  font-family: 'Gaegu', cursive !important;
  background: rgba(251, 244, 226, 0.9) !important;
  color: var(--color-primary-700) !important;
  border: 1px solid rgba(201, 162, 76, 0.45) !important;
  border-radius: 20px !important;
  letter-spacing: 0.02em;
}
.album-badge:hover {
  background: var(--color-primary-100) !important;
  border-color: var(--color-primary-500) !important;
}

/* Featured(첫 추억) — 골드 더블 라인 강조 */
.letter-card--featured .polaroid__photo-wrap {
  box-shadow:
    0 0 0 5px #FFFDF6,
    0 0 0 7px rgba(201,162,76,0.55),
    inset 0 0 28px rgba(60, 40, 16, 0.12);
}

/* 피드 네비 버튼 — 크림/골드 */
.feed-nav {
  background: rgba(251, 244, 226, 0.92) !important;
  color: var(--color-gold-dark) !important;
  border: 1px solid rgba(201,162,76,0.4) !important;
  box-shadow: 0 4px 16px rgba(90,66,30,0.18) !important;
}
.feed-nav:hover { background: #FFFCF4 !important; }

/* =========================================================================
   6. 여정 시작 카드 / 마일스톤 핀  (journey.js 가 삽입)
   ========================================================================= */

/* --- 여정 시작 카드 (오프닝 레터) --- */
.journey-opener {
  position: relative;
  flex: 0 0 clamp(300px, 30vw, 400px);
  width: clamp(300px, 30vw, 400px);
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 3.2rem 2.2rem;
  scroll-snap-align: center;
  isolation: isolate;
  background-color: var(--paper);
  background-image:
    repeating-linear-gradient(92deg, rgba(120,90,40,0.022) 0 2px, transparent 2px 5px),
    radial-gradient(130% 90% at 50% 0%, rgba(255,252,244,0.9), transparent 60%),
    linear-gradient(180deg, #FFFDF6 0%, #F6EBD2 100%);
  border: 1px solid rgba(201, 162, 76, 0.5);
  border-radius: 3px;
  box-shadow: 0 16px 30px rgba(90, 66, 30, 0.22);
}
.journey-opener::before {
  content: '';
  position: absolute;
  inset: -10px;
  z-index: -1;
  border-radius: 4px;
  background-color: var(--paper-warm);
  background-image: linear-gradient(180deg, #FBF4E2 0%, #F1E2C4 100%);
  filter: url(#deckle) drop-shadow(0 14px 26px rgba(90, 66, 30, 0.20));
}
.journey-opener::after {
  content: '';
  position: absolute;
  inset: 10px;
  z-index: -1;
  border-radius: 2px;
  border: 1.5px solid rgba(201, 162, 76, 0.5);
  pointer-events: none;
}
.journey-opener__eyebrow {
  font-family: 'Nanum Myeongjo', serif;
  font-size: 0.82rem;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: var(--color-gold-dark);
  margin-bottom: 1.4rem;
  padding-left: 0.42em;
}
/* 왁스 씰 메달리온 */
.journey-seal {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  background:
    radial-gradient(circle at 36% 30%, #E9C4CE, #C58DA0 42%, #A85E72 100%);
  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.5),
    inset 0 -4px 10px rgba(120, 40, 60, 0.45),
    0 6px 16px rgba(120, 40, 60, 0.3);
  position: relative;
}
.journey-seal::before {
  content: '';
  position: absolute;
  inset: 9px;
  border-radius: 50%;
  border: 1px dashed rgba(255, 246, 240, 0.6);
}
.journey-seal__monogram {
  font-family: 'Nanum Myeongjo', serif;
  font-size: 1.7rem;
  font-weight: 800;
  color: #FFF3F6;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 2px rgba(120,40,60,0.5);
}
.journey-opener__names {
  font-family: 'Nanum Myeongjo', serif;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--ink);
  margin-bottom: 0.2rem;
}
.journey-opener__since {
  font-family: 'Gaegu', cursive;
  font-size: 1.02rem;
  color: var(--color-secondary-700);
  letter-spacing: 0.06em;
  margin-bottom: 1.7rem;
}
.journey-opener__count {
  font-family: 'Nanum Myeongjo', serif;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.journey-opener__count b {
  display: block;
  font-size: 3.2rem;
  font-weight: 800;
  background: var(--gold-foil);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.journey-opener__count span {
  font-family: 'Gaegu', cursive;
  font-size: 0.92rem;
  letter-spacing: 0.3em;
  color: var(--color-gold-dark);
}
.journey-opener__caption {
  font-family: 'Gaegu', cursive;
  font-size: 1.04rem;
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-top: 1.5rem;
  max-width: 17em;
}
.journey-opener__arrow {
  margin-top: 1.7rem;
  font-family: 'Gaegu', cursive;
  font-size: 0.84rem;
  letter-spacing: 0.22em;
  color: var(--color-gold-dark);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  opacity: 0.85;
}
.journey-opener__arrow::after {
  content: '';
  width: 34px;
  height: 1px;
  background: linear-gradient(90deg, var(--color-gold), transparent);
}

/* --- 마일스톤 핀 (기념일 표식) --- */
.milestone-pin {
  position: relative;
  flex: 0 0 96px;
  width: 96px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  scroll-snap-align: center;
  padding: 1rem 0;
}
/* 세로 골드 점선 실 */
.milestone-pin::before {
  content: '';
  position: absolute;
  top: 8%;
  bottom: 8%;
  width: 0;
  border-left: 2px dotted rgba(201, 162, 76, 0.55);
}
.milestone-medallion {
  position: relative;
  z-index: 1;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  background:
    radial-gradient(circle at 36% 30%, #FBEBB0, #E8CD83 38%, #C9A24C 72%, #9E7A2A 100%);
  box-shadow:
    inset 0 2px 5px rgba(255,255,255,0.6),
    inset 0 -4px 9px rgba(120, 90, 30, 0.4),
    0 6px 16px rgba(120, 90, 30, 0.3);
  border: 2px solid #FFFDF6;
}
.milestone-medallion b {
  font-family: 'Nanum Myeongjo', serif;
  font-size: 1.18rem;
  font-weight: 800;
  color: #5C440F;
  line-height: 1;
}
.milestone-medallion span {
  font-family: 'Gaegu', cursive;
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  color: #6E5418;
}
.milestone-pin__date {
  position: relative;
  z-index: 1;
  margin-top: 0.7rem;
  font-family: 'Gaegu', cursive;
  font-size: 0.74rem;
  color: var(--color-secondary-700);
  background: rgba(251,244,226,0.92);
  padding: 1px 8px;
  border-radius: 10px;
  border: 1px solid rgba(201,162,76,0.35);
  white-space: nowrap;
}
.milestone-pin--big .milestone-medallion {
  width: 92px;
  height: 92px;
}
.milestone-pin--big { flex-basis: 112px; width: 112px; }
.milestone-pin--big .milestone-medallion b { font-size: 1.4rem; }
.milestone-pin { transition: transform 0.2s ease; }
.milestone-pin:hover { transform: translateY(-4px); }
.milestone-pin:hover .milestone-medallion { box-shadow: inset 0 2px 5px rgba(255,255,255,0.6), inset 0 -4px 9px rgba(120, 90, 30, 0.4), 0 9px 22px rgba(120, 90, 30, 0.4); }
.milestone-pin:focus-visible { outline: 2px solid var(--color-gold); outline-offset: 4px; border-radius: 8px; }

/* --- 여정 마무리 카드 --- */
.journey-closer {
  position: relative;
  flex: 0 0 clamp(240px, 24vw, 300px);
  width: clamp(240px, 24vw, 300px);
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 2.4rem 1.8rem;
  scroll-snap-align: center;
  isolation: isolate;
  background-color: var(--paper);
  background-image:
    repeating-linear-gradient(92deg, rgba(120,90,40,0.022) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, #FFFDF6 0%, #F6EBD2 100%);
  border: 1px solid rgba(201, 162, 76, 0.5);
  border-radius: 3px;
  box-shadow: 0 14px 26px rgba(90, 66, 30, 0.20);
}
.journey-closer::before {
  content: '';
  position: absolute;
  inset: -9px;
  z-index: -1;
  border-radius: 4px;
  background-color: var(--paper-warm);
  background-image: linear-gradient(180deg, #FBF4E2 0%, #F1E2C4 100%);
  filter: url(#deckle) drop-shadow(0 12px 22px rgba(90, 66, 30, 0.18));
}
.journey-closer__heart {
  font-size: 1.7rem;
  margin-bottom: 0.8rem;
  filter: saturate(0.85);
}
.journey-closer__title {
  font-family: 'Nanum Myeongjo', serif;
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--ink);
  margin-bottom: 0.6rem;
}
.journey-closer__sub {
  font-family: 'Gaegu', cursive;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--color-text-secondary);
  max-width: 14em;
}
.journey-closer__dday {
  margin-top: 1.3rem;
  font-family: 'Gaegu', cursive;
  font-size: 0.92rem;
  letter-spacing: 0.06em;
  color: var(--color-gold-dark);
  border-top: 1px dashed rgba(201,162,76,0.4);
  padding-top: 1rem;
}

@media (max-width: 640px) {
  .journey-opener { flex-basis: 84vw; width: 84vw; padding: 2.6rem 1.6rem; }
  .journey-closer { flex-basis: 72vw; width: 72vw; }
}

/* =========================================================================
   7. 모달 — 크림/골드 재테마
   ========================================================================= */
.card-detail__inner,
.edit-modal__box {
  background: var(--paper) !important;
  box-shadow: 0 30px 70px rgba(50, 34, 16, 0.34) !important;
  border: 1px solid rgba(201,162,76,0.3) !important;
}
.card-detail__body {
  background:
    repeating-linear-gradient(
      transparent, transparent 31px,
      rgba(201,162,76,0.14) 31px, rgba(201,162,76,0.14) 32px
    ) !important;
}
.card-detail__text,
.card-detail__date,
.card-detail__album-badge {
  font-family: 'Gaegu', cursive !important;
}
.card-detail__text { color: var(--ink) !important; line-height: 2 !important; }
.card-detail__date { color: var(--color-gold-dark) !important; }
.card-detail__album-badge {
  color: var(--color-primary-700) !important;
  background: rgba(201,162,76,0.12) !important;
}
.card-detail__overlay,
.edit-modal__overlay,
.lightbox__overlay {
  background: rgba(46, 32, 18, 0.7) !important;
}
.edit-modal__title {
  font-family: 'Nanum Myeongjo', serif !important;
  color: var(--color-gold-dark) !important;
}
.lightbox__caption { font-family: 'Gaegu', cursive !important; }

/* 수정/디테일 버튼 색 — 골드/블러시 */
.polaroid__edit-btn { background: var(--color-gold) !important; }
.polaroid__edit-btn:hover { background: var(--color-gold-dark) !important; }
.polaroid__delete-btn { background: var(--color-primary-700) !important; }
.polaroid__delete-btn:hover { background: var(--color-primary-900) !important; }

/* =========================================================================
   8. 로그인 — 아이보리/골드 오프닝
   ========================================================================= */
.login-page {
  background:
    radial-gradient(120% 90% at 50% 0%, #FBF1DC 0%, #F0E2C2 48%, #E6D2A8 100%) !important;
}
.login-page::before {
  content: '✦  ❀  ✦  ❀  ✦  ❀  ✦  ❀  ✦  ❀  ✦  ❀  ✦  ❀  ✦  ❀' !important;
  color: var(--color-gold) !important;
  opacity: 0.14 !important;
  font-size: 1.6rem !important;
  line-height: 3.4rem !important;
}
.login-card {
  background: rgba(255, 252, 244, 0.86) !important;
  backdrop-filter: blur(10px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.1) !important;
  border: 1px solid rgba(201, 162, 76, 0.5) !important;
  border-radius: 6px !important;
  box-shadow:
    0 24px 60px rgba(90, 66, 30, 0.26),
    inset 0 0 0 6px rgba(255,253,247,0.6),
    inset 0 0 0 7px rgba(201,162,76,0.3) !important;
}
.login-card__icon {
  font-size: 0 !important;
  margin-bottom: 1.2rem !important;
}
/* 이모지 하트 → 골드 왁스 씰 */
.login-card__icon::after {
  content: '';
  display: inline-block;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, #E9C4CE, #C58DA0 42%, #A85E72 100%);
  box-shadow:
    inset 0 2px 5px rgba(255,255,255,0.5),
    inset 0 -4px 9px rgba(120,40,60,0.45),
    0 6px 14px rgba(120,40,60,0.28);
  position: relative;
  vertical-align: middle;
}
.login-card__title {
  font-family: 'Nanum Myeongjo', serif !important;
  color: var(--color-gold-dark) !important;
  text-shadow: none !important;
  letter-spacing: 0.06em;
}
.login-card__subtitle {
  font-family: 'Gaegu', cursive !important;
  color: var(--color-text-secondary) !important;
}
.login-card__input {
  background: rgba(255, 253, 247, 0.85) !important;
  border: 1px solid rgba(201, 162, 76, 0.45) !important;
  border-radius: 4px !important;
  color: var(--ink) !important;
}
.login-card__input::placeholder { color: var(--color-text-muted) !important; }
.login-card__input:focus {
  border-color: var(--color-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,162,76,0.18) !important;
  background: #FFFDF7 !important;
}
.login-card__btn {
  background: var(--gold-foil) !important;
  color: #4A370F !important;
  font-family: 'Gaegu', cursive !important;
  border-radius: 4px !important;
  letter-spacing: 0.08em;
  box-shadow: 0 4px 14px rgba(201,162,76,0.35) !important;
}
.login-card__btn:hover {
  filter: brightness(1.05);
  box-shadow: 0 8px 22px rgba(158, 122, 42, 0.4) !important;
}
.login-card__error { color: var(--color-error) !important; }

/* =========================================================================
   9. 업로드 / 폼 — 골드 포인트
   ========================================================================= */
.upload-page__title,
.upload-section__title,
.modal__title {
  font-family: 'Nanum Myeongjo', serif !important;
  color: var(--color-gold-dark) !important;
}
.btn--primary {
  background: var(--gold-foil) !important;
  border: none !important;
  color: #4A370F !important;
}
.btn--primary:hover {
  filter: brightness(1.05);
  box-shadow: var(--shadow-gold) !important;
}
.upload-type-btn--active,
#upload-submit-btn {
  color: var(--color-gold-dark) !important;
}
#upload-submit-btn {
  background: var(--gold-foil) !important;
  color: #4A370F !important;
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color: var(--color-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,162,76,0.16) !important;
}
.form-textarea {
  font-family: 'Gaegu', cursive !important;
  background-image: repeating-linear-gradient(
    transparent, transparent calc(1.9em - 1px),
    rgba(201,162,76,0.18) calc(1.9em - 1px), rgba(201,162,76,0.18) 1.9em
  ) !important;
}

/* 푸터 */
.site-footer { border-top: 1px dashed rgba(201,162,76,0.4) !important; }
.site-footer__text {
  font-family: 'Gaegu', cursive !important;
  color: var(--color-text-muted) !important;
}

/* =========================================================================
   10. 가로 피드 — 스크롤 리빌 비활성화 (항상 보이게, 틸트/호버 유지)
   ========================================================================= */
.feed__list > .card-animate {
  opacity: 1 !important;        /* 가시성은 애니메이션에 의존하지 않음 */
  transition: opacity 0.5s ease;
}
/* 사진 카드는 살짝 기울임 유지 */
.feed__list > .letter-card {
  transform: rotate(var(--rotate, 0deg));
}
/* 여정 요소는 똑바로 */
.feed__list > .journey-opener,
.feed__list > .milestone-pin,
.feed__list > .journey-closer {
  transform: none;
}
@keyframes luxe-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .feed__list > .card-animate { animation: none; }
}

/* =========================================================================
   11. 스켈레톤(로딩) — 크림/골드 톤
   ========================================================================= */
.skeleton-block,
.skeleton-line {
  background: linear-gradient(90deg, #EFE3C6 25%, #FBF4E2 50%, #EFE3C6 75%) !important;
  background-size: 800px 100% !important;
}
.polaroid--skeleton {
  background: var(--paper) !important;
  border: 1px solid rgba(201,162,76,0.25) !important;
  box-shadow: 0 6px 18px rgba(90,66,30,0.10) !important;
  border-radius: 3px !important;
  padding: 10px !important;
}

/* =========================================================================
   12. 은은한 데코 디테일 (커버 · 카드 · 핀 · 여정)
   ========================================================================= */

/* --- 커버: 시작일 위 작은 장식 --- */
.cover-names {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cover-start-date::before {
  content: '❀';
  display: block;
  font-size: 0.7em;
  color: var(--color-gold-light);
  opacity: 0.85;
  margin-bottom: 0.35em;
  letter-spacing: 0;
}

/* --- 커버: 네 모서리 골드 코너 장식 (데스크탑) --- */
@media (min-width: 900px) {
  .cover-content { position: relative; }
  .cover-content::before,
  .cover-content::after {
    content: '';
    position: absolute;
    width: 46px;
    height: 46px;
    border: 1.5px solid rgba(232, 205, 131, 0.55);
    pointer-events: none;
  }
  .cover-content::before {
    top: -26px; left: -26px;
    border-right: none; border-bottom: none;
    border-top-left-radius: 4px;
  }
  .cover-content::after {
    bottom: -26px; right: -26px;
    border-left: none; border-top: none;
    border-bottom-right-radius: 4px;
  }
}

/* --- 카드: 사진 위 골드 코너 (양 위 모서리) --- */
.polaroid__photo-wrap { position: relative; }
.polaroid__photo-wrap::after {
  content: '';
  position: absolute;
  inset: 4px;
  pointer-events: none;
  z-index: 4;
  background:
    linear-gradient(90deg, rgba(232,205,131,0.9), transparent 18px) top left/22px 1.5px no-repeat,
    linear-gradient(180deg, rgba(232,205,131,0.9), transparent 18px) top left/1.5px 22px no-repeat,
    linear-gradient(270deg, rgba(232,205,131,0.9), transparent 18px) top right/22px 1.5px no-repeat,
    linear-gradient(180deg, rgba(232,205,131,0.9), transparent 18px) top right/1.5px 22px no-repeat;
}

/* --- 마일스톤 핀: 메달 위 작은 ✦ 장식 --- */
.milestone-medallion { position: relative; }
.milestone-medallion::after {
  content: '✦';
  position: absolute;
  top: -9px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.6rem;
  color: var(--color-gold);
  text-shadow: 0 1px 2px rgba(255,255,255,0.6);
}
.milestone-pin--big .milestone-medallion::after { top: -11px; font-size: 0.72rem; }

/* --- 여정 시작 카드: 모서리 골드 코너 프레임 --- */
.journey-opener::after {
  content: '';
  position: absolute;
  inset: 14px;
  z-index: 0;
  border-radius: 2px;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(201,162,76,0.5), transparent 30px) top left/34px 1.5px no-repeat,
    linear-gradient(180deg, rgba(201,162,76,0.5), transparent 30px) top left/1.5px 34px no-repeat,
    linear-gradient(270deg, rgba(201,162,76,0.5), transparent 30px) top right/34px 1.5px no-repeat,
    linear-gradient(180deg, rgba(201,162,76,0.5), transparent 30px) top right/1.5px 34px no-repeat,
    linear-gradient(90deg, rgba(201,162,76,0.5), transparent 30px) bottom left/34px 1.5px no-repeat,
    linear-gradient(0deg, rgba(201,162,76,0.5), transparent 30px) bottom left/1.5px 34px no-repeat,
    linear-gradient(270deg, rgba(201,162,76,0.5), transparent 30px) bottom right/34px 1.5px no-repeat,
    linear-gradient(0deg, rgba(201,162,76,0.5), transparent 30px) bottom right/1.5px 34px no-repeat;
}
.journey-opener__arrow::before {
  content: '❀';
  color: var(--color-primary-500);
  opacity: 0.8;
  font-size: 0.9em;
}

/* --- 여정 마무리 카드: 하트 양옆 골드 포인트 --- */
.journey-closer__heart { position: relative; }
.journey-closer__heart::before,
.journey-closer__heart::after {
  content: '·';
  color: var(--color-gold);
  margin: 0 0.5em;
  vertical-align: middle;
}

/* =========================================================================
   13. 에피소드 라벨 — "에피소드"(노래) 시리즈 느낌
   ========================================================================= */
.ep-tag {
  display: inline-block;
  font-family: 'Nanum Myeongjo', serif;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  color: var(--color-gold-dark);
  background: linear-gradient(180deg, rgba(255,253,247,0.9), rgba(241,226,196,0.7));
  border: 1px solid rgba(201,162,76,0.45);
  border-radius: 2px;
  padding: 2px 8px 2px 9px;
  margin-bottom: 0.5rem;
  position: relative;
  text-indent: 0.28em;
}
.ep-tag::after {
  content: '';
  position: absolute;
  right: -10px;
  top: 50%;
  width: 7px;
  height: 1px;
  background: linear-gradient(90deg, var(--color-gold), transparent);
  transform: translateY(-50%);
}
.journey-opener__eyebrow {
  position: relative;
}
.journey-opener__eyebrow::after {
  content: '✦';
  display: block;
  font-size: 0.7em;
  letter-spacing: 0;
  color: var(--color-gold-light);
  margin-top: 0.5em;
}


