/* One cover system for the gallery, picker, live preview and memorial. */
.template-example-note{font-size:13px;line-height:1.8;color:#6c7667;margin:16px auto 24px;max-width:1200px}
.space-page>.template-example-note,.space-page main>.template-example-note{padding-inline:24px}
#main .space-template-picker .template-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
#main .space-template-picker .template-choice{position:relative;display:block;padding:0;margin:0;border:1px solid #d6d6c9;border-radius:18px;overflow:hidden;background:#f5f3ea;box-shadow:0 5px 18px #283c2910;cursor:pointer}
#main .space-template-picker .template-choice:has(input:checked){outline:2px solid #738365;outline-offset:4px;box-shadow:0 8px 26px #344a301c}
#main .space-template-picker .template-choice:has(input:focus-visible){outline:3px solid #345e80;outline-offset:5px}
#main .space-template-picker .template-choice input[type=radio]{position:absolute;z-index:4;left:15px;top:15px;width:18px;height:18px;margin:0;accent-color:#637858;box-shadow:0 0 0 3px #fffcf0d9;border-radius:50%}
#main .template-choice-copy{position:relative;display:flex;flex-direction:column;gap:5px;min-height:124px;padding:18px 22px 43px;color:#3c5144;text-align:left}
#main .template-choice-copy strong{font:400 19px/1.5 var(--serif);letter-spacing:.035em}
#main .template-choice-copy .template-description{display:block;padding:0;font:11px/1.7 var(--sans);color:#687260}
#main .space-template-picker .template-choice>a{position:absolute;z-index:3;right:22px;bottom:13px;margin:0;padding:5px 0;font:11px/1.5 var(--sans);color:#465b45;border-bottom:1px solid #465b4566;min-height:28px}
#main .space-template-picker .template-choice>a:focus-visible{outline:2px solid #345e80;outline-offset:4px}

/* A compact 5:3 canvas keeps the same compositions across template previews. */
#main .memory-cover{display:block;position:relative;isolation:isolate;container-type:inline-size;width:100%;height:auto;min-height:0;aspect-ratio:5/3;padding:0;gap:0;overflow:hidden;background:#273b32;color:#fff8e9;border-radius:0}
#main .memory-cover::before{display:none}
#main .memory-cover::after{content:'';display:block;position:absolute;z-index:0;inset:0;border:0;border-radius:0;pointer-events:none;background:linear-gradient(110deg,#14201b38,#14201b7a)}
#main .memory-cover span{display:block;padding:0}
#main .memory-cover img{display:block;max-width:none;margin:0;padding:0;border:0;outline:0;filter:none;opacity:1}
#main .memory-cover img.cover-background{position:absolute;z-index:-1;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0}
#main .memory-cover .cover-art{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:6cqw;padding:5cqw 8cqw;height:60cqw;min-height:0}
#main .memory-cover :is(.cover-photo,.cover-second){
 position:relative;isolation:isolate;align-self:center;justify-self:center;grid-column:1;grid-row:1;
 width:100%;height:auto;min-width:0;min-height:0;max-width:none;aspect-ratio:1;overflow:visible;transform:none;
 border:0;border-radius:0;outline:0;background:none;box-shadow:none;
 filter:drop-shadow(0 .8cqw 1cqw #101c2938) drop-shadow(0 .15cqw .2cqw #101c2926);
}
#main .memory-cover .cover-frame{
 position:absolute;isolation:isolate;left:50%;top:50%;width:var(--frame-surface-width,100%);height:var(--frame-surface-height,100%);
 transform:translate(-50%,-50%);overflow:hidden;
 border:var(--frame-width,.35cqw) solid transparent;border-radius:var(--frame-radius,2cqw);outline:0;
 background:linear-gradient(135deg,var(--frame-paper,#fffaf0),var(--frame-shade,#e9ddc7)) padding-box,
 linear-gradient(135deg,var(--frame-light,#eee0b6),var(--frame-dark,#9c8050) 35%,var(--frame-light,#eee0b6) 58%,var(--frame-dark,#9c8050)) border-box;
 box-shadow:inset 0 0 0 1px #fff9;
}
#main .memory-cover .cover-frame::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:url('/static/paper-grain.svg');opacity:.12;mix-blend-mode:multiply}
#main .memory-cover .cover-frame::after{content:'';position:absolute;inset:var(--frame-mat,1.5cqw);z-index:3;pointer-events:none;border-radius:var(--frame-inner-radius,1cqw);border:1px solid #70593645;box-shadow:0 0 0 1px #fff9,inset 0 .15cqw .4cqw #32271530}
#main .memory-cover .cover-frame>img{position:absolute;inset:var(--frame-mat,1.5cqw);width:calc(100% - var(--frame-mat,1.5cqw)*2);height:calc(100% - var(--frame-mat,1.5cqw)*2);object-fit:cover;object-position:center;border-radius:var(--frame-inner-radius,1cqw)}
#main .memory-cover .cover-frame-detail{position:absolute;inset:0;z-index:4;width:100%;height:100%;fill:none;stroke:var(--frame-ornament,#a48b5d);stroke-width:.4;pointer-events:none;opacity:var(--frame-detail-opacity,0)}

/* Shapes echo the landscape; narrow metals and warm mats keep the finish quiet. */
.cover-portrait{--frame-surface-width:86%;--frame-radius:50% 50% 3% 3% / 43% 43% 3% 3%;--frame-inner-radius:50% 50% 2% 2% / 43% 43% 2% 2%;--frame-mat:1.1cqw;--frame-paper:#f1f0df;--frame-shade:#dfe1c9;--frame-light:#d7d3af;--frame-dark:#738068;--frame-width:.35cqw;--frame-detail-opacity:.5;--frame-ornament:#889275}
.cover-art[data-cover-template="memorial-quiet-forest"]{--frame-surface-width:100%;--frame-radius:0;--frame-inner-radius:0;--frame-detail-opacity:0;--frame-mask:url('/static/frames/cloud-mask.svg')}
.cover-letter{--frame-surface-width:88%;--frame-radius:50% 50% 3% 3% / 43% 43% 3% 3%;--frame-inner-radius:50% 50% 2% 2% / 43% 43% 2% 2%;--frame-mat:1.65cqw;--frame-paper:#fbf2dc;--frame-shade:#e5d8b7;--frame-light:#ecdbb2;--frame-dark:#9b7a48;--frame-width:.4cqw;--frame-detail-opacity:.55;--frame-ornament:#a78a51}
.cover-panorama{--frame-surface-width:88%;--frame-radius:50% 50% 3% 3% / 43% 43% 3% 3%;--frame-inner-radius:50% 50% 2% 2% / 43% 43% 2% 2%;--frame-mat:1.2cqw;--frame-paper:#f3e3cf;--frame-shade:#e5cbaa;--frame-light:#cda57d;--frame-dark:#79573c;--frame-width:.5cqw;--frame-detail-opacity:.4;--frame-ornament:#a88058}
.cover-minimal{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.25cqw;--frame-paper:#f2f8f3;--frame-shade:#c5d8d2;--frame-light:#ecf3ee;--frame-dark:#94aaa4;--frame-mask:url('/static/frames/cloud-mask.svg')}
.cover-gallery{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.1cqw;--frame-paper:#f9f8e8;--frame-shade:#cdd8b7;--frame-light:#d7ddba;--frame-dark:#7d8a60;--frame-mask:url('/static/frames/petal-mask.svg')}
.cover-editorial{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.45cqw;--frame-paper:#fff9e9;--frame-shade:#ddc9aa;--frame-light:#d0b18a;--frame-dark:#967654;--frame-mask:url('/static/frames/cloud-mask.svg')}
.cover-art[data-cover-template="memorial-warm-home"]{--frame-surface-width:110%;--frame-surface-height:110%}
.cover-journey{--frame-surface-width:88%;--frame-radius:50% 50% 3% 3% / 43% 43% 3% 3%;--frame-inner-radius:50% 50% 2% 2% / 43% 43% 2% 2%;--frame-mat:1.6cqw;--frame-paper:#edf2f7;--frame-shade:#c3cfdc;--frame-light:#f3f6fa;--frame-dark:#8194a9;--frame-width:.35cqw;--frame-detail-opacity:.55;--frame-ornament:#7d91a6}
.cover-framed{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.45cqw;--frame-paper:#fcf0e7;--frame-shade:#d3b2a1;--frame-light:#f2dbca;--frame-dark:#b08273;--frame-mask:url('/static/frames/petal-mask.svg')}
.cover-diptych{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.5cqw;--frame-paper:#fff5e0;--frame-shade:#d6be9b;--frame-light:#d1b58e;--frame-dark:#967a57;--frame-mask:url('/static/frames/petal-mask.svg')}
.cover-sanctuary{--frame-radius:0;--frame-inner-radius:0;--frame-mat:1.3cqw;--frame-paper:#fffbee;--frame-shade:#dfceaa;--frame-light:#f0dfab;--frame-dark:#ad9561;--frame-mask:url('/static/frames/cloud-mask.svg')}
#main .memory-cover .frame-fine-line{stroke-width:.2;opacity:.6}
#main .cover-journey .cover-frame{box-shadow:inset 0 0 0 1px #fff9}
/* SVG silhouettes scale with the frame and clip both real photos and empty states. */
#main :is(.cover-framed,.cover-sanctuary,.cover-editorial,.cover-diptych,.cover-minimal,.cover-gallery,[data-cover-template="memorial-quiet-forest"]) .cover-frame{border:0;background:linear-gradient(135deg,var(--frame-paper),var(--frame-shade) 50%,var(--frame-paper));mask:var(--frame-mask) center/100% 100% no-repeat;-webkit-mask:var(--frame-mask) center/100% 100% no-repeat;box-shadow:none}
#main :is(.cover-framed,.cover-sanctuary,.cover-editorial,.cover-diptych,.cover-minimal,.cover-gallery,[data-cover-template="memorial-quiet-forest"]) .cover-frame::after{display:none}
#main :is(.cover-framed,.cover-sanctuary,.cover-editorial,.cover-diptych,.cover-minimal,.cover-gallery,[data-cover-template="memorial-quiet-forest"]) .cover-frame>:is(img,.cover-placeholder){mask:var(--frame-mask) center/100% 100% no-repeat;-webkit-mask:var(--frame-mask) center/100% 100% no-repeat}

#main .memory-cover .cover-note{position:relative;display:flex;flex-direction:column;grid-column:2;grid-row:1;align-self:center;align-items:flex-start;justify-self:center;justify-content:center;width:100%;max-width:none;min-width:0;gap:1cqw;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;filter:none;color:#fff8e9;text-align:left;text-shadow:0 1px 5px #101c19bb,0 2px 20px #101c1970}
#main .memory-cover .cover-note::before,#main .memory-cover .cover-note::after,#main .memory-cover .cover-dedication::before{display:none;content:none}
#main .memory-cover .cover-eyebrow{display:none;font:400 1.65cqw/1.8 var(--sans);letter-spacing:.13em;margin:0 0 1cqw;color:#e5d3aa}
#main .memory-cover .cover-name{display:block;font:400 5.4cqw/1.35 "Gowun Batang",Batang,serif;letter-spacing:.04em;color:inherit;margin:0;overflow-wrap:anywhere;word-break:keep-all}
#main .memory-cover .cover-years{font:400 1.95cqw/1.8 "Gowun Batang",Batang,serif;letter-spacing:.07em;color:inherit;opacity:.92;margin-top:1cqw}
#main .memory-cover .cover-dedication{font:400 2.5cqw/1.85 "Gowun Batang",Batang,serif;margin:1.8cqw 0 0;padding:0;border:0;width:100%;text-align:inherit;color:inherit;word-break:keep-all;overflow-wrap:anywhere;text-wrap:pretty}
#main .memory-cover .cover-placeholder{position:absolute;inset:var(--frame-mat,1.5cqw);height:auto;min-height:0;border-radius:var(--frame-inner-radius,1cqw);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqw;background:#eee9da;color:#53604b;font:2.5cqw/1.8 var(--serif);text-align:center;padding:2cqw}
#main .memory-cover .cover-placeholder img{width:10cqw;height:auto}
#main .memory-cover .cover-letter-seal{display:none}
#main .memory-cover .cover-note[data-long-copy=true] .cover-name{font-size:4cqw}
/* Thumbnails are summaries; the actual memorial always retains the full text. */
#main .template-thumb :is(.cover-name,.cover-dedication){display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}

/* Centered compositions have the same canvas as the two-column covers. */
#main :is(.cover-minimal,.cover-journey,.cover-sanctuary,.cover-gallery,.cover-diptych) .cover-art{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:25cqw minmax(0,1fr);align-content:center;gap:2cqw 5cqw;padding:4cqw 10cqw}
#main :is(.cover-minimal,.cover-journey,.cover-sanctuary) .cover-photo{grid-column:1/-1;grid-row:1;width:25cqw}
#main :is(.cover-gallery,.cover-diptych) :is(.cover-photo,.cover-second){width:24cqw;grid-row:1}
#main :is(.cover-gallery,.cover-diptych) .cover-photo{grid-column:2;transform:rotate(3deg)}
#main :is(.cover-gallery,.cover-diptych) .cover-second{grid-column:1;transform:rotate(-4deg)}
#main :is(.cover-minimal,.cover-journey,.cover-sanctuary,.cover-gallery,.cover-diptych) .cover-note{grid-column:1/-1;grid-row:2;align-items:center;text-align:center}
#main :is(.cover-minimal,.cover-journey,.cover-sanctuary,.cover-gallery,.cover-diptych) .cover-name{font-size:4.9cqw}
#main :is(.cover-minimal,.cover-journey,.cover-sanctuary,.cover-gallery,.cover-diptych).memory-cover::after{background:linear-gradient(180deg,#19291f15,#15253430 35%,#111e30b8)}
#main .cover-journey img.cover-background{filter:saturate(.65);object-position:70% center}
#main .cover-journey .cover-eyebrow{display:block;color:#dae7f7;margin:0}
#main .cover-journey .cover-years{position:relative;padding:.7cqw 3cqw;border-top:1px solid #ccdef480;border-bottom:1px solid #ccdef430;color:#e3edfb}
#main .cover-journey .cover-years::before,#main .cover-journey .cover-years::after{content:'';position:absolute;top:-2px;width:4px;height:4px;border-radius:50%;background:#e0ebfa}
#main .cover-journey .cover-years::before{left:0}
#main .cover-journey .cover-years::after{right:0}

/* Two keepsake Polaroids, each clipped to a gently bowed jute cord. */
#main .memory-cover .cover-art.cover-hanging{grid-template-rows:28cqw minmax(0,1fr);padding-top:7cqw;gap:1cqw 5cqw}
#main .cover-hanging .cover-twine{position:absolute;z-index:0;left:0;top:4cqw;width:100%;height:12cqw;overflow:visible;fill:none;pointer-events:none}
#main .cover-hanging .cover-twine path{stroke-linecap:round;vector-effect:non-scaling-stroke}
#main .cover-hanging .twine-shadow{stroke:#24170e66;stroke-width:.5cqw;transform:translateY(1.5px)}
#main .cover-hanging .twine-base{stroke:#ac8856;stroke-width:.35cqw}
#main .cover-hanging .twine-fiber{stroke:#ead2a5;stroke-width:.16cqw;stroke-dasharray:.12cqw .25cqw}
#main .memory-cover .cover-hanging :is(.cover-photo,.cover-second){aspect-ratio:31/36;z-index:1;filter:drop-shadow(0 1cqw 1.1cqw #141a234d);transform-origin:50% 0}
#main .memory-cover .cover-hanging .cover-photo{transform:rotate(3deg)}
#main .memory-cover .cover-hanging .cover-second{transform:rotate(-4deg)}
#main .memory-cover .cover-hanging .cover-frame{width:100%;height:100%;border:0;border-radius:.2cqw;background:linear-gradient(145deg,#fffdf6,#f2ebdc);mask:none;-webkit-mask:none;box-shadow:inset 0 0 0 1px #fff9}
#main .memory-cover .cover-hanging .cover-frame::after{display:block;inset:1.4cqw 1.4cqw 5.6cqw;border:0;border-radius:0;box-shadow:inset 0 .15cqw .4cqw #32271538}
#main .memory-cover .cover-hanging .cover-frame>:is(img,.cover-placeholder){inset:1.4cqw 1.4cqw 5.6cqw;width:calc(100% - 2.8cqw);height:calc(100% - 7cqw);border-radius:0;mask:none;-webkit-mask:none}
#main .memory-cover .cover-hanging .cover-frame-detail{display:none}
#main .memory-cover .cover-hanging :is(.cover-photo,.cover-second)::before{content:'';position:absolute;z-index:5;top:-2cqw;left:calc(50% - .8cqw);width:1.6cqw;height:4.8cqw;border-radius:.25cqw .25cqw .15cqw .15cqw;background:repeating-linear-gradient(88deg,transparent 0 .28cqw,#855a2e24 .3cqw .36cqw),linear-gradient(90deg,#ac7843,#e5bf87 25%,#d9aa6e 68%,#976335);box-shadow:inset 0 0 0 1px #f5d4a144,.2cqw .3cqw .4cqw #30201566;transform:rotate(-5deg);pointer-events:none}
#main .memory-cover .cover-hanging :is(.cover-photo,.cover-second)::after{content:'';position:absolute;z-index:6;left:calc(50% - .83cqw);top:.1cqw;width:1.55cqw;height:.55cqw;border-radius:.1cqw;background:linear-gradient(#665d51,#d6cbbc 40%,#827769 55%,#c8bdad 75%,#61574b);box-shadow:0 .12cqw .12cqw #4b352555;transform:rotate(-5deg);pointer-events:none}

/* Starlight Letter: a photographic night garden, gilded corners and a seal. */
#main .memory-cover.cover-letter::after{background:linear-gradient(90deg,#09172e88,#11244720 60%,#14253b20),linear-gradient(0deg,#09172e88,transparent 45%)}
#main .cover-letter .cover-art{padding:5cqw 10cqw;gap:6cqw;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)}
#main .cover-letter .cover-art::before{content:'';position:absolute;inset:4cqw;border:1px solid #e5cd8f66;pointer-events:none;border-radius:.7cqw}
#main .cover-letter .cover-photo{grid-column:2;grid-row:1}
#main .cover-letter .cover-note{grid-column:1;grid-row:1}
#main .cover-letter .cover-eyebrow{display:block}
#main .cover-letter .cover-dedication{padding-top:2cqw;border-top:1px solid #e3c78a66}
#main .cover-letter .cover-letter-seal{display:block;width:7cqw;height:7cqw;margin-top:2cqw;fill:none;stroke:#e7cc8e;stroke-width:1;opacity:.9}

/* Match the home hero width while preserving each memorial's frame proportions. */
.space-page{--space-content-width:1440px;--space-content-gutter:6%}
#main .space-hero.memory-cover{max-width:var(--space-content-width);width:calc(100% - var(--space-content-gutter));margin:24px auto 0;border-radius:20px;box-shadow:0 16px 50px #283c2914}
#main .space-hero:has([data-long-copy=true]){aspect-ratio:auto}
#main .space-hero:has([data-long-copy=true]) .cover-art{height:auto;min-height:60cqw}
.space-cover-introduction{max-width:920px;padding:24px;margin:0 auto;text-align:center;color:#66715d}
.space-cover-introduction>p{font:400 clamp(17px,2vw,22px)/1.9 var(--serif);margin:10px 0;word-break:keep-all;overflow-wrap:anywhere}
.space-cover-introduction>span{font:12px/1.8 var(--sans);letter-spacing:.04em}

#main .application-preview{padding:22px 18px;background:linear-gradient(145deg,#f7f5eb,#eeefe3);border:1px solid #dce0cf;border-radius:20px;text-align:center}
#main .application-preview .application-preview-photo{display:none}
#main .application-preview .live-cover{border-radius:12px;margin:18px 0;overflow:hidden;text-align:left}
#main .application-preview h2{font-size:25px;line-height:1.6;margin:16px 0 8px;overflow-wrap:anywhere}
#main .application-preview .preview-divider{margin:16px 0}
#main .application-preview .field-hint{font-size:11px!important;line-height:1.8}
@media(min-width:1101px){
 #main .application-layout{max-width:1440px;padding-inline:28px;grid-template-columns:minmax(0,1fr) 280px;gap:28px}
 #main .application-section{padding:30px 26px}
}
@media(max-width:1100px){#main .space-template-picker .template-choice-grid{grid-template-columns:1fr;gap:20px}}
@media(max-width:760px){.space-page{--space-content-gutter:24px}}
@media(max-width:720px){
 #main .space-hero.memory-cover{margin-top:12px;border-radius:16px;aspect-ratio:auto}
 #main .space-hero.memory-cover .cover-art{height:auto;min-height:86cqw;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:34cqw auto;align-content:center;gap:3cqw;padding:5cqw 8cqw}
 #main .space-hero.memory-cover .cover-photo{grid-column:1/-1;grid-row:1;width:34cqw;max-width:none}
 #main .space-hero.memory-cover .cover-note{grid-column:1/-1;grid-row:2;width:100%;align-items:center;text-align:center;gap:.5cqw}
 #main .space-hero.memory-cover .cover-name{font-size:clamp(30px,9cqw,40px)}
 #main .space-hero.memory-cover .cover-years{font-size:clamp(12px,3.4cqw,16px);margin-top:.5cqw}
 #main .space-hero.memory-cover .cover-dedication{font-size:clamp(14px,4.2cqw,18px);margin-top:1cqw}
 #main .space-hero.memory-cover .cover-eyebrow{font-size:clamp(10px,2.8cqw,13px)}
 #main .space-hero.memory-cover .cover-letter-seal{width:6cqw;height:6cqw;margin-top:1cqw}
 #main .space-hero.memory-cover:is(.cover-gallery,.cover-diptych) :is(.cover-photo,.cover-second){width:28cqw;grid-row:1}
 #main .space-hero.memory-cover:is(.cover-gallery,.cover-diptych) .cover-photo{grid-column:2}
 #main .space-hero.memory-cover:is(.cover-gallery,.cover-diptych) .cover-second{grid-column:1}
 #main .space-hero.memory-cover .cover-art.cover-hanging{padding-top:7cqw;grid-template-rows:34cqw auto}
 #main .space-hero .cover-hanging .cover-twine{top:5cqw}
 #main .space-hero.memory-cover:has([data-long-copy=true]){aspect-ratio:auto}
 #main .space-hero.memory-cover:has([data-long-copy=true]) .cover-art{height:auto;min-height:86cqw;grid-template-rows:34cqw auto}
 #main .space-hero.memory-cover .cover-note[data-long-copy=true] .cover-name{font-size:7cqw}
 #main .application-preview{display:block;padding:18px}
 #main .application-preview .live-cover{max-width:320px;margin:12px auto}
 #main .application-preview .preview-label{font-size:12px}
 #main .application-preview p[data-pet-tagline]{font-size:13px;margin:8px 0}
 #main .application-preview a{display:inline-block;font-size:12px;padding:12px 0 4px}
 #main .template-choice-copy{padding:15px 18px 43px}
 #main .template-choice-copy strong{font-size:17px}
}
@media(prefers-reduced-motion:no-preference){
 #main .space-template-picker .template-choice{transition:box-shadow .2s,border-color .2s}
 #main .space-template-picker .template-choice:hover{box-shadow:0 10px 28px #263b2924;border-color:#a0ae91}
}
