/* 궁합 사주 입력 화면. 모양과 색은 재회 입력 화면(reunion-input.css)을 그대로 쓰고, 첫 화면 그림과 '지금 두 사람은' 고르기 칸만 더한다. */
.rl-intro[data-rl-art="flowers"] { --rl-art: url('/images/compat/vi-flower-shop-1024.webp'); }
.rl-intro[data-rl-art="flowers"] .rl-intro-art span { background-position: 46% 16%; }
.rl-intro[data-rl-art="blossom"] { --rl-art: url('/images/compat/sn-cherry-blossom-1024.webp'); }
.rl-intro[data-rl-art="blossom"] .rl-intro-art span { background-position: 40% 14%; }

/* 지금 두 사람은: 둥근 칩 다섯 개, 휴대폰에서는 줄을 바꿔 감싼다. */
html body #input-section.cp-input .cp-stage { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 0; }
html body #input-section.cp-input .cp-stage label { position: relative; display: inline-flex !important; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; cursor: pointer; }
html body #input-section.cp-input .cp-stage input { position: absolute; opacity: 0; width: 1px !important; height: 1px !important; pointer-events: none; }
html body #input-section.cp-input .cp-stage span { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 15px; border: 1px solid var(--rl-line); border-radius: 999px; background: var(--rl-bg); color: var(--rl-muted); font-size: 14px; font-weight: 700; white-space: nowrap; transition: border-color 0.15s, color 0.15s; }
html body #input-section.cp-input .cp-stage input:checked + span { border-color: var(--rl-rose); background: var(--rl-panel-2); color: var(--rl-rose); box-shadow: inset 0 0 0 1px var(--rl-rose); }
html body #input-section.cp-input .cp-stage input:focus-visible + span { outline: 3px solid var(--input-ring); }
html body #input-section.cp-input .note a { color: var(--rl-rose) !important; font-weight: 700; }
html body #input-section.cp-input .ri-trust [data-compat-price] { color: var(--rl-gold); font-weight: 800; }
@media (max-width: 760px) {
  html body #input-section.cp-input .ri-trust [data-compat-price] { flex-basis: 100%; text-align: center; }
  html body #input-section.cp-input .ri-trust [data-compat-price] + span::before { content: none; }
  html body #input-section.cp-input .cp-stage span { font-size: 13.5px; padding: 7px 13px; min-height: 38px; }
}