.gift-app { width:min(100%,520px); min-height:100vh; margin:0 auto; padding:calc(env(safe-area-inset-top) + 10px) 20px calc(32px + env(safe-area-inset-bottom)); background:linear-gradient(155deg,#fff 0%,#fff8fa 52%,#f4f6fb 100%); color:var(--ink,#182b46); }
.gift-received-link { position:relative; z-index:1; text-decoration:none; }
.gift-form { display:grid; gap:14px; padding-top:20px; }
.gift-card { padding:19px 17px; border:1px solid #f0e4e8; border-radius:15px; background:#fff; box-shadow:0 5px 18px #243c5908; }
.gift-content-card { padding:13px 17px; }
.gift-book-viewer { display:block; }
.gift-book-viewer > .gift-book-nav { display:none; }
.gift-book-track { min-width:0; touch-action:pan-y; }
.gift-book-option { width:100%; min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:14px; padding:4px; border:0; border-radius:13px; background:#fff; color:inherit; font:inherit; text-align:left; cursor:pointer; user-select:none; }
.gift-book-option:active { cursor:grabbing; }
.gift-book-option img { -webkit-user-drag:none; user-select:none; }
.gift-book-option[hidden] { display:none; }
.gift-book-option:focus-visible { outline:1px solid #d83d70; outline-offset:2px; }
.gift-book-nav { width:27px; height:42px; display:grid; place-items:center; padding:0; border:0; background:transparent; color:#56657a; font-size:30px; line-height:1; font-weight:400; }
.gift-book-nav:disabled { color:#c7cbd2; cursor:default; }
.gift-book-nav:focus-visible { outline:1px solid #d83d70; }
.gift-book-cover-column { min-width:0; width:100%; display:grid; align-content:start; gap:6px; }
.gift-book-cover-wrap { position:relative; display:block; width:60%; flex:0 0 60%; }
.gift-book-cover-column .gift-book-cover-wrap { width:100%; flex:auto; }
.gift-book-cover-wrap.gift-book-cover--portrait { width:45%; flex:0 0 45%; aspect-ratio:2 / 3; overflow:hidden; }
.gift-book-cover-wrap.gift-book-cover--portrait > img { height:100%; aspect-ratio:auto; object-fit:cover; }
.gift-book-cover-wrap > img { display:block; width:100%; max-width:none; height:auto; aspect-ratio:1.5; object-fit:contain; }
.gift-book-check { position:absolute; top:4px; right:4px; width:20px; height:20px; display:none; place-items:center; border-radius:50%; background:#ff075f; color:#fff; font-size:13px; line-height:1; font-weight:900; box-shadow:0 2px 7px #182b4633; }
.gift-book-option.is-selected .gift-book-check { display:grid; }
.gift-book-check[hidden] { display:none !important; }
.gift-selected-info { min-width:0; flex:1; display:grid; gap:4px; color:#354e6d; font-size:12px; line-height:1.35; }
.gift-selected-info .gift-book-title { margin:0 0 2px; color:#252a35; font-size:16px; line-height:1.35; font-weight:900; }
.gift-selected-info > span { display:flex; gap:6px; overflow-wrap:anywhere; }
.gift-selected-info > span b { color:#293a54; font-weight:700; }
.gift-selected-info > .gift-price-row b { color:#d62760; font-size:15px; font-weight:900; }
.gift-price-row[hidden] { display:none; }
.gift-selected-info i { flex:0 0 auto; color:#8994a3; font-style:normal; }
.gift-section-heading { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.gift-step { width:29px; height:29px; flex:0 0 29px; display:grid; place-items:center; border-radius:50%; background:#fff0f4; color:#e72b6a; font-size:12px; font-weight:900; }
.gift-content-heading { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.gift-content-heading h2 { margin:0; color:#1a2d48; font-size:18px; line-height:1.4; font-weight:900; }
.gift-content-type { display:grid; place-items:center; padding:4px 10px; border-radius:8px; background:#fff0f4; color:#e72b6a; font-size:13px; line-height:1.3; font-weight:800; white-space:nowrap; }
.gift-section-heading h2 { margin:0; color:#1a2d48; font-size:18px; font-weight:900; }
.gift-section-heading p { margin:4px 0 0; color:#8491a2; font-size:12px; line-height:1.5; }
.gift-field { display:block; margin-top:15px; }
.gift-field[hidden] { display:none; }
.gift-field > span { display:flex; align-items:center; gap:6px; margin-bottom:8px; color:#263a57; font-size:14px; font-weight:800; }
.gift-field i { color:#d83d70; font-style:normal; }
.gift-field small { color:#8994a3; font-size:11px; font-weight:500; }
.gift-field input:not(.address-postal-code) { width:100%; height:49px; padding:0 13px; border:1.5px solid #e89ab1; border-radius:10px; background:#fff; color:#1d304a; font:inherit; font-size:15px; outline:none; }
.gift-field input:not(.address-postal-code)::placeholder { color:#8994a3; opacity:1; }
.gift-field input:not(.address-postal-code):focus { border-color:#d83d70; }
.gift-delivery-options { display:grid; gap:8px; min-width:0; margin:17px 0 0; padding:0; border:0; }
.gift-delivery-options legend { margin-bottom:8px; padding:0; color:#263a57; font-size:14px; font-weight:800; }
.gift-delivery-option { min-height:64px; display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid #d7dce4; border-radius:10px; background:#fff; cursor:pointer; }
.gift-delivery-option.is-selected { border-color:#e89ab1; background:#fff8fa; }
.gift-delivery-option:focus-within { border-color:#d83d70; }
.gift-delivery-option input { width:17px; height:17px; flex:0 0 17px; margin:0; accent-color:#d83d70; }
.gift-delivery-option strong,.gift-delivery-option small { display:block; }
.gift-delivery-option strong { color:#293a54; font-size:14px; font-weight:800; }
.gift-delivery-option small { margin-top:3px; color:#7f8b9c; font-size:11px; line-height:1.4; }
.gift-delivery { display:flex; align-items:flex-start; gap:10px; margin-top:17px; padding:13px; border:1px solid #f3d7e0; border-radius:11px; background:#fff7fa; }
.gift-delivery-icon { width:27px; height:27px; flex:0 0 27px; display:grid; place-items:center; border-radius:50%; background:#ffe7ef; color:#d83d70; font-size:18px; font-weight:700; }
.gift-delivery strong { display:block; color:#9f3155; font-size:14px; font-weight:800; }
.gift-delivery p { margin:4px 0 0; color:#68758a; font-size:12px; line-height:1.5; }
.gift-sender-note { margin:12px 0 0; color:#8491a2; font-size:12px; line-height:1.55; }
.gift-form > .register-button { margin-top:0; }
@media (max-width:370px) { .gift-app { padding-right:15px; padding-left:15px; } .gift-card { padding-right:14px; padding-left:14px; } }
@media (min-width:521px) { .gift-app { padding-top:calc(env(safe-area-inset-top) + 26px); padding-bottom:calc(48px + env(safe-area-inset-bottom)); } .gift-form { gap:18px; } }

.gift-showcase { margin-top:20px; overflow:hidden; }
.gift-showcase-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.gift-showcase-heading h2 { margin:0; font-size:21px; }
.gift-showcase-heading button { flex-shrink:0; }
.gift-showcase-note { color:#68758a; font-size:13px; line-height:1.6; margin:12px 0 0; }
.gift-conveyor { overflow:hidden; margin:18px -17px 0; padding:3px 0; }
.gift-conveyor-track { display:flex; width:max-content; animation:gift-conveyor-roll var(--gift-roll-duration,32s) linear infinite; }
.gift-conveyor-group { display:flex; align-items:center; gap:18px; padding-right:18px; }
.gift-conveyor-item { display:flex; flex-direction:column; align-items:center; width:142px; flex:0 0 142px; gap:8px; padding:5px; border:0; background:transparent; color:#263a57; text-align:center; font:inherit; cursor:pointer; }
.gift-conveyor-cover { display:block; width:132px; }
.gift-conveyor-cover img { display:block; width:100%; height:auto; max-height:180px; object-fit:contain; }
.gift-conveyor.is-paused .gift-conveyor-track,.gift-conveyor:hover .gift-conveyor-track,.gift-conveyor:focus-within .gift-conveyor-track { animation-play-state:paused; }
.gift-conveyor-item[aria-pressed=true] .gift-conveyor-cover { box-shadow:0 0 0 2px #ff075f; }
@keyframes gift-conveyor-roll { to { transform:translateX(-50%); } }
@media (max-width:370px) { .gift-conveyor { margin-right:-14px; margin-left:-14px; } }

.gift-create-link { display:inline-flex; align-items:center; text-decoration:none; white-space:nowrap; font-size:12px; padding:8px; }
.gift-showcase-heading { flex-wrap:wrap; }

/* 선물 컨텐츠 롤링: drag to move (2026-11-11). */
.gift-conveyor { touch-action:pan-y; }
.gift-conveyor-group { transform:translateX(var(--gift-drag, 0px)); }
.gift-conveyor.is-dragging .gift-conveyor-track { animation-play-state:paused; }
.gift-conveyor.is-dragging { cursor:grabbing; }