/* 랜딩 화면 테마 (뉴트럴 다크) — 랜딩 14종 공통
   scripts/extract-tokens.mjs가 페이지들의 동일한 :root를 끌어올린 것. 여기서 고치면 14개 화면에 한 번에 반영된다. */
:root{
  --brand: #875AEF;
  --brand-deep: #6C47BE;
  --brand-night: #2E2356;
  --brand-soft: #ECEAF6;
  --accent: #A78BFA;
  --accent-strong: #7C3AED;
  --accent-soft: #F2ECFE;
  --gold: #C8A24E;
  --gold-deep: #9A7B3A;
  --gold-light: #E6C98A;
  --bg: #121217;
  --surface: #19191E;
  --ink: #F1EDFC;
  --ink-2: #C9C2E6;
  --ink-3: #9CA3AF;
  --line: rgba(255,255,255,.07);
  --good: #C8A24E;
  --good-soft: #FAF3E2;
  --warn: #E0726E;
  --warn-soft: #FBEDEC;
  --serif: 'Pretendard','Pretendard Variable',-apple-system,system-ui,sans-serif;
  --sans: 'Pretendard','Pretendard Variable',-apple-system,system-ui,sans-serif;
  --r: 16px;
  --shadow: 0 2px 6px rgba(30,18,70,.09),0 16px 38px rgba(70,45,140,.17);
}

/* ── 1차 CTA 그라데이션 일렁임 ─────────────────────────────────────────
   색이 8초 주기로 연↔찐 순환(반짝임 아님). 라인업 전체가 같은 문법을 쓰도록
   여기 한 곳에만 정의한다 — 예전엔 랜딩·밀서·자서전이 각자 인라인으로 갖고 있었다.
   결과 화면의 자서전 CTA는 이 문법을 쓰지 않는다 — 거긴 테두리 림라이트가 의도된 디자인이다. */
@keyframes btnGradientDrift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
.btn-drift.btn-drift.btn-drift{
  background-image:linear-gradient(120deg,#9B72FF 0%,#6B4BEC 28%,#5A3FDC 50%,#6B4BEC 72%,#9B72FF 100%);
  background-size:260% 100%;
  animation:btnGradientDrift 8s ease-in-out infinite alternate;
}
@media (prefers-reduced-motion: reduce){
  .btn-drift.btn-drift.btn-drift{animation:none;background-position:30% 50%}
}

/* ── 스크롤바 ─────────────────────────────────────────────────────────
   얇은 중립 그레이 필 + 투명 트랙. 결과 15종(theme-result 계열)·SPA(src/styles/index.css)와
   같은 정의를 쓴다 — 랜딩만 빠져 있어 여기서만 OS 기본 스크롤바가 콘텐츠 옆에 굵게 떴다. */
html,*{scrollbar-width:thin;scrollbar-color:rgba(200,200,205,.25) transparent}  /* 상속 안 되는 속성이라 내부 스크롤 영역까지 전 요소에 */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(200,200,205,.22);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:rgba(200,200,205,.4)}

/* ── 닫기 버튼 히트 영역 ───────────────────────────────────────────────
   실측 .mm-x 28×28, .ps-x 32×32. iOS 권고 44×44보다 작아 폰에서 오탭이 잦다.
   동그라미 크기는 디자인이라 그대로 두고, 보이지 않는 영역만 밖으로 넓힌다
   (padding으로 키우면 아이콘 위치와 레이아웃이 함께 밀린다). */
.mm-x, .ps-x{position:relative}
.mm-x::after, .ps-x::after{content:"";position:absolute;inset:-8px;border-radius:50%}