:root{color-scheme:dark;--cream:#e9cda1;--gold:#9f7846}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#080b0d;color:var(--cream)}body{font-family:Georgia,'Times New Roman',serif;display:flex;align-items:center;justify-content:center;min-height:100svh}.entrance{position:relative;isolation:isolate;width:min(100%,133.333333svh);aspect-ratio:4/3;container-type:inline-size}.scenery{position:absolute;inset:0;z-index:-1;overflow:hidden}.scenery img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;transition:filter .08s linear}#weather{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;clip-path:polygon(0 0,33% 0,33% 29%,70% 29%,70% 0,100% 0,100% 83%,0 83%)}.yard-space,.ornament,.email-wrap span{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.invitation{position:absolute;top:84.1%;left:22.55%;width:55%;text-align:center}#entry{display:grid;grid-template-columns:1.5fr 1fr;gap:1cqw;align-items:stretch}input,button{font:inherit;border-radius:2px;min-width:0}input{width:100%;height:3.8cqw;border:1px solid #a97431;background:#0c0b09;color:#f1dfbf;padding:0 1.6cqw;font-family:'Courier New',monospace;font-size:1.4cqw;letter-spacing:.04em}input::placeholder{color:#ac915e;opacity:1}button{border:1px solid #c58b35;background:linear-gradient(#1c0903,#250b02);color:#efd1a0;cursor:pointer;touch-action:manipulation;letter-spacing:.12em;font-weight:bold}#entry button{height:3.8cqw;font-size:1.45cqw;padding:0 .8cqw;white-space:nowrap}button:hover{background:#492113}button:focus-visible,input:focus-visible{outline:2px solid #f3d59f;outline-offset:3px}.invitation-copy{width:100%;margin:1.1cqw 0 0;padding:.15cqw 0;background:#0c0b09;font-size:1.35cqw;line-height:1.5;letter-spacing:.035em}.preview-note{margin:.25cqw 0 0;padding:.15cqw 0;background:#0c0b09;color:#9b886f;font: .95cqw/1.5 'Courier New',monospace}.noscript{position:absolute;bottom:0;text-align:center;width:100%}#landing-sound{position:absolute;right:1.9%;top:2.5%;width:13.8%;height:4.3%;font-size:.85cqw;background:#100b06;border-color:#b87932;z-index:5}#welcome-back{position:absolute;bottom:100%;width:100%;margin:0 0 .5cqw;padding:.5cqw;background:#0c0b09;font-size:1.4cqw;letter-spacing:.15em}.returning #entry{grid-template-columns:1fr}.returning #entry button{width:100%}[hidden]{display:none!important}body:after{content:'';position:fixed;inset:0;z-index:20;background:#000;opacity:0;pointer-events:none;transition:opacity .85s ease}body.entering:after{opacity:1;pointer-events:auto}.entering #entry button{cursor:wait;background:#62303a}
/* On touch-sized layouts keep the exact artwork above a real, readable form. */
@media(max-width:700px),(pointer:coarse) and (orientation:portrait){body{display:block}.entrance{width:100%;min-height:100svh;aspect-ratio:auto;padding:62.2% 18px max(24px,env(safe-area-inset-bottom));background:#080b0d}.scenery{height:62.2vw;inset:0 0 auto;z-index:0}.scenery img{height:75vw;object-fit:fill}#weather{clip-path:none}.invitation{position:relative;top:auto;left:auto;z-index:1;width:min(480px,100%);margin:0 auto;padding:18px 12px;background:#100c09;border:1px solid #76532c}#entry{grid-template-columns:1fr;gap:12px}input{height:50px;padding:12px 14px;font-size:16px}#entry button{height:50px;font-size:14px;white-space:normal}.invitation-copy{font-size:13px;margin:14px 0 0;background:transparent;padding:0}.preview-note{font-size:10px;margin:8px 0 0;background:transparent;padding:0}#landing-sound{right:1.8%;top:1.8vw;width:26%;height:44px;font-size:9px;padding:5px;background:#100b06;max-width:155px}#welcome-back{position:static;margin:0 0 14px;font-size:17px;background:transparent}.sr-only{z-index:-1}}
@media(prefers-reduced-motion:reduce){body:after{transition:opacity .15s}.scenery img{transition:none}}
/* Give the phone artwork enough room for the title and silhouette to read clearly. */
@media(max-width:700px) and (orientation:portrait){
 .entrance{padding-top:calc(100vw + 52px)}
 .scenery{top:52px;height:100vw}
 .scenery img{position:absolute;left:-30%;width:160%;height:120vw}
 #landing-sound{top:max(6px,env(safe-area-inset-top));right:12px;width:140px;height:40px;font-size:10px}
}

/* Fill any viewport ratio without cropping or stretching the approved 4:3 art. */
.viewport-backdrop{position:fixed;inset:-48px;z-index:-1;pointer-events:none;background:linear-gradient(#080b0d55,#080b0d77),url('/entrance/landing-v227.png') center/cover no-repeat;filter:blur(36px);transform:scale(1.06)}
body{isolation:isolate;background:transparent}
@media(min-width:701px) and (pointer:fine){
 .entrance{width:min(100vw,133.333333dvh);flex-shrink:0}
}
@media(pointer:coarse) and (orientation:portrait),(max-width:700px) and (orientation:portrait){.viewport-backdrop{display:none}body{background:#080b0d}}
/* A dedicated horizontal phone layout: complete scene left, usable form right. */
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){
 html,body{min-height:100%;height:auto;overflow-x:hidden}
 body{display:block}
 .entrance{--visual-width:min(58vw,calc((100svh - 24px)*1.6));width:100%;aspect-ratio:auto;min-height:100svh;padding:16px max(16px,env(safe-area-inset-right)) 16px calc(60vw + 12px);display:flex;align-items:center;background:transparent;container-type:inline-size}
 .scenery{inset:auto;left:calc((60vw - var(--visual-width))/2);top:50%;transform:translateY(-50%);width:var(--visual-width);height:calc(var(--visual-width)*.622);background:transparent;z-index:0}
 .scenery img{position:absolute;top:0;left:0;transform:none;width:100%;height:auto;object-fit:contain;clip-path:none}
 #weather{clip-path:none}
 #landing-sound{left:calc((60vw - var(--visual-width))/2 + var(--visual-width)*.835);right:auto;top:calc(50% - var(--visual-width)*.311 + var(--visual-width)*.017);width:calc(var(--visual-width)*.15);height:44px;min-width:72px;max-width:none;font-size:8px;padding:4px;background:#100b06;white-space:normal}
 .invitation{position:relative;left:auto;top:auto;width:100%;margin:0;padding:14px 12px;background:#100c09f5;border:1px solid #76532c;z-index:1}
 #entry{display:grid;grid-template-columns:1fr;gap:10px}
 input{width:100%;height:48px;font-size:16px;padding:10px 9px;letter-spacing:0}
 input::placeholder{font-size:clamp(11px,1.7vw,16px)}
 #entry button{height:48px;font-size:clamp(10px,1.6vw,14px);letter-spacing:.08em;padding:8px 5px;white-space:normal}
 .invitation-copy{font-size:11px;margin:12px 0 0;padding:0;background:transparent}
 .preview-note{font-size:9px;margin:7px 0 0;padding:0;background:transparent;line-height:1.45}
 #welcome-back{position:static;margin:0 0 12px;font-size:14px;background:transparent;padding:0}
}
.scenery picture{display:contents}
/* Approved wide artwork fills desktop edge to edge. Touch layouts retain v227. */
@media(min-width:701px) and (pointer:fine){
 html,body{width:100%;min-height:100%;margin:0;background:#080b0d}
 body{display:block}
 .viewport-backdrop{display:none}
 .entrance{width:100%;height:100dvh;min-height:500px;aspect-ratio:auto;--art-width:100vw;--art-height:56.22vw;--art-left:0px}
 .scenery{inset:0;width:100%;height:100%;z-index:-1}
 .scenery img{width:100%;height:100%;object-fit:cover;object-position:center top}
 #weather{clip-path:polygon(0 0,36% 0,36% 30%,65% 30%,65% 0,100% 0,100% 83%,0 83%)}
 .invitation{left:calc(var(--art-left) + var(--art-width)*.303);top:min(calc(var(--art-height)*.846),calc(100% - 132px));width:calc(var(--art-width)*.394);max-width:calc(100% - 48px)}
 #entry{grid-template-columns:1.5fr 1fr;gap:clamp(8px,.7vw,14px)}
 input,#entry button{height:clamp(44px,calc(var(--art-height)*.048),64px)}
 input{font-size:clamp(14px,1.1vw,21px);padding:0 18px}
 #entry button{font-size:clamp(13px,1.05vw,20px);padding:0 8px}
 .invitation-copy{font-size:clamp(12px,1.05vw,19px);margin:12px 0 0;padding:2px 0}
 .preview-note{font-size:clamp(10px,.8vw,14px);margin:5px 0 0;padding:2px 0}
 #landing-sound{top:2.8%;right:1.8%;width:14%;min-width:170px;height:48px;font-size:clamp(10px,.8vw,15px);max-width:none}
 #welcome-back{font-size:clamp(15px,1.15vw,21px);margin-bottom:8px;padding:5px}
 .returning #entry{grid-template-columns:1fr}
}
@media(min-width:701px) and (pointer:fine){
 /* Hide the mockup's painted form so only the live controls are ever visible. */
 .scenery img{mask-image:linear-gradient(to bottom,#000 0,#000 calc(var(--art-height)*.832),transparent calc(var(--art-height)*.844));-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(var(--art-height)*.832),transparent calc(var(--art-height)*.844))}
 #landing-sound{right:auto;left:min(calc(var(--art-left) + var(--art-width)*.846),calc(100% - max(150px,var(--art-width)*.135) - 12px));top:calc(var(--art-height)*.028);width:max(150px,calc(var(--art-width)*.135));height:max(44px,calc(var(--art-height)*.055));min-width:0}
}
/* The desktop artwork now contains clean pavement, not a painted form. */
@media(min-width:701px) and (pointer:fine){
 .scenery img{mask-image:none;-webkit-mask-image:none}
 .invitation-copy,.preview-note,#welcome-back{background:transparent;text-shadow:0 1px 3px #000,0 0 8px #000}
}

/* Signup disclosure and recoverable submission feedback. */
.signup-consent,.privacy-link{font:12px/1.5 Georgia,serif;letter-spacing:.01em;margin:7px 0 0;color:#e9cda1;text-shadow:0 1px 3px #000}
.privacy-link a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#signup-status{grid-column:1/-1;margin:8px 0 0;padding:8px;background:#160d09;color:#ffdbbf;font:14px/1.45 Georgia,serif}
#entry button:disabled{cursor:wait;opacity:.8}
@media(min-width:701px) and (pointer:fine){.invitation{top:auto;bottom:18px}.signup-consent,.privacy-link{font-size:clamp(11px,.8vw,14px)}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.signup-consent,.privacy-link{font-size:11px}}