/* Gift photography belongs to the letter, with room for its materials. */
.space-page #main .gift-anchor{display:block;scroll-margin-top:100px}
.space-page #main .letter-gifts{padding:24px 0 12px;border:0;border-top:1px solid #e4dace;border-radius:0;margin:28px 0 18px;background:none}
.space-page #main .letter-gifts legend{padding:0 14px 0 0;font:400 18px/1.7 var(--serif);color:#705e4c}
.space-page #main .letter-gifts>p{font:13px/1.9 var(--sans);color:#8a7967;margin:8px 0 18px}
.space-page #main .gift-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0!important}
.space-page #main .gift-option{padding:12px 0!important;gap:0;border:1px solid #e6ddd2;border-radius:12px;background:#fcfaf6;overflow:hidden;box-shadow:0 3px 14px #6f543207;transition:border-color .18s,box-shadow .18s}
.space-page #main .gift-artwork{display:block;object-fit:contain;aspect-ratio:1;background:#f8f5ef;border:0;max-width:100%;flex-shrink:0}
.space-page #main .gift-option .gift-artwork{width:50%;height:auto;border-radius:8px;margin:24px 0 10px}
.space-page #main .gift-option>input{position:absolute;top:11px;left:11px;z-index:1;width:17px!important;height:17px;accent-color:#927351}
.space-page #main .gift-option>span{padding:0 8px;font:13px/1.6 var(--serif);color:#675642}
.space-page #main .gift-option>small{margin-top:5px}
.space-page #main .gift-option:hover{border-color:#b6a083;box-shadow:0 6px 20px #6f543214}
.space-page #main .gift-option:has(input:checked){border-color:#947750;box-shadow:0 0 0 1px #947750;background:#f1e9dc}
.space-page #main .gift-option:has(input:focus-visible){outline:3px solid #947750;outline-offset:4px}
.space-page #main .letter-gift-badge{padding:0;gap:20px;border:1px solid #e3d8c9;border-radius:12px;background:#fbf8f2;overflow:hidden;align-items:center;justify-content:flex-start;font:14px/1.8 var(--serif);color:#7a654d}
.space-page #main .letter-gift-badge .gift-artwork{width:60px;height:60px;align-self:center}
.space-page #main .letter-gift-badge>span{padding:16px 18px 16px 0;overflow-wrap:anywhere}
.space-page #main .letter-gift-examples{margin-top:30px;padding-top:24px;border-top:1px solid #e4dace}
.space-page #main .gift-examples-heading{font:16px/1.7 var(--serif);color:#79654e;margin:0}
.space-page #main .gift-examples-heading span{font:10px var(--sans);margin-left:10px;color:#9c8a77}
.space-page #main .offering-art{height:auto;aspect-ratio:1;border:0;box-shadow:none;background:#f8f5ef;overflow:hidden;border-radius:9px}
.space-page #main .offering-art .gift-artwork{width:100%;height:100%;object-fit:contain}
.space-page #main .gift-preview-note{font:12px/1.8 var(--sans);color:#8a7967}
@media(max-width:700px){
 .space-page #main .gift-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .space-page #main .letter-gifts{padding-top:18px}
 .space-page #main .gift-option>span{font-size:12px}
 .space-page #main .letter-gift-badge{gap:12px;font-size:12px}
 .space-page #main .letter-gift-badge .gift-artwork{width:45px;height:45px}
 .space-page #main .letter-gift-badge>span{padding:10px 10px 10px 0}
}
@media(prefers-reduced-motion:reduce){.space-page #main .gift-option{transition:none}}

.space-page #main .letter-gift-badge[hidden]{display:none}
.space-page #main [data-demo-letter-body]{white-space:pre-wrap}
.space-page #main .letter-gifts :is(.gift-none,summary){min-height:44px}
.space-page #main .letter-gifts summary{display:flex;align-items:center;gap:8px}
.space-page #main .letter-gifts summary::before{content:'▸';font-size:12px}
.space-page #main .letter-gifts details[open]>summary::before{content:'▾'}
.space-page #main .letter-gifts summary{list-style:none}
.space-page #main .letter-gifts summary::-webkit-details-marker{display:none}
.space-page #main .letter-gifts legend{max-width:100%;overflow-wrap:anywhere}
.space-page #main .letter-form .button{min-height:44px;max-width:100%;overflow-wrap:anywhere}
.space-page #main .gift-catalog-count{margin-left:auto;padding:4px 9px;border:1px solid #e1d4c1;border-radius:20px;color:#8d785d;font:10px/1.6 var(--sans);white-space:nowrap}
.space-page #main .letter-gifts summary{flex-wrap:wrap}

/* A gift rests beside its letter, including on narrow screens. */
.space-page #main [data-letter-entry]:has(>.letter-gift-badge:not([hidden])) {
  display:grid;
  grid-template-columns:clamp(130px,15vw,174px) minmax(0,1fr);
  column-gap:clamp(22px,3vw,40px);
  align-items:start;
}
.space-page #main [data-letter-entry]>:not(.letter-gift-badge) { grid-column:2; min-width:0; }
.space-page #main [data-letter-entry]>.letter-gift-badge {
  grid-column:1;
  grid-row:1 / span 3;
  display:flex;
  flex-direction:column;
  align-self:start;
  align-items:center;
  gap:12px;
  margin:0;
  padding:12px 12px 15px;
  border:1px solid #e5dbcb;
  border-radius:12px;
  background:#f7f2e8;
  color:#79664f;
  text-align:center;
}
.space-page #main [data-letter-entry]>.letter-gift-badge .gift-artwork { width:100%; height:auto; aspect-ratio:1; border-radius:8px; }
.space-page #main [data-letter-entry]>.letter-gift-badge>span { padding:0; font:12px/1.75 var(--serif); word-break:keep-all; overflow-wrap:anywhere; }
.space-page #main [data-letter-entry]>.letter-gift-badge>span::before { content:'함께 놓은 선물'; display:block; margin-bottom:5px; color:#a08c73; font:9px/1.6 var(--sans); }
.space-page #main [data-letter-entry]>.letter-gift-badge[hidden] { display:none; }
.space-page #main [data-letter-entry]>.letter-signature>span { font:10px/1.6 var(--sans); color:#9d8a72; }
.space-page #main [data-letter-entry]>.content-social,
.space-page #main [data-letter-entry]>.letter-moderation { grid-column:1 / -1; }
@media(max-width:600px) {
  .space-page #main .letter-browser [data-letter-entry] { padding:22px 14px; }
  .space-page #main [data-letter-entry]:has(>.letter-gift-badge:not([hidden])) { grid-template-columns:74px minmax(0,1fr); column-gap:14px; }
  .space-page #main [data-letter-entry]>.letter-gift-badge { padding:6px 6px 10px; gap:8px; border-radius:8px; }
  .space-page #main [data-letter-entry]>.letter-gift-badge>span { font-size:10px; line-height:1.65; }
  .space-page #main [data-letter-entry]>.letter-gift-badge>span::before { font-size:8px; }
  .space-page #main [data-letter-entry] .letter-recipient { font-size:21px; line-height:1.65; }
  .space-page #main [data-letter-entry] .stationery-postage { display:none; }
  .space-page #main [data-letter-entry]>.stationery-letter-heading { margin-bottom:14px; padding-bottom:0; }
  .space-page #main [data-letter-entry] .letter-stamp { margin-bottom:8px; font-size:8px; }
  .space-page #main [data-letter-entry]>.letter-signature { gap:5px 10px; font-size:12px; }
}
@media(max-width:360px) {
  .space-page #main .letter-browser [data-letter-entry] { padding-inline:12px; }
  .space-page #main [data-letter-entry]:has(>.letter-gift-badge:not([hidden])) { grid-template-columns:62px minmax(0,1fr); column-gap:12px; }
  .space-page #main [data-letter-entry] .letter-recipient { font-size:19px; }
}
