/* The letter is the main invitation to join Secret Santa. */
.brand-logo{width:76px;height:76px;object-fit:contain;flex:none}
.site-header{height:110px;gap:20px}.site-footer .brand-logo{width:82px;height:82px}
.hero{grid-template-columns:1.05fr 1fr;gap:40px;padding-block:52px 56px;min-height:520px}
.hero-actions{gap:12px}.hero .hero-actions .button{padding-inline:18px;font-size:13px}
.hero-envelope{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:510px;justify-self:center;padding:18px 12px 22px;position:relative;color:var(--text);border-radius:24px;isolation:isolate}
.hero-envelope::before{content:"";position:absolute;inset:3% -1% 8%;border-radius:48% 52% 44% 56%;background:var(--ice);z-index:-1;transform:rotate(-5deg)}
.envelope-heading{font-size:12px;text-transform:uppercase;letter-spacing:2px;font-weight:700;color:var(--holly);align-self:flex-start;padding-left:28px;transform:rotate(-3deg)}
.envelope-heading>span{font-size:25px;display:inline-block;margin-left:8px;color:var(--gold)}
.envelope-scene{position:relative;display:block;width:94%;aspect-ratio:1.5;margin:25px 0 20px;transform:rotate(-6deg);transition:transform .3s}
.envelope-back{position:absolute;inset:18% 0 0;background:#c63f4a;border-radius:10px;box-shadow:0 18px 35px #503c3625}
.envelope-paper{position:absolute;left:9%;right:9%;top:0;height:83%;background:#fffcf3;border:1px solid #e1cdaa;box-shadow:0 -2px 12px #674c3320;border-radius:6px;padding:22px 26px;text-align:left;transform:rotate(3deg);transition:transform .3s}
.paper-salute{font-family:Georgia,serif;color:#394d47;font-size:clamp(20px,2.1vw,31px);font-style:italic;line-height:1.2;display:block}
.paper-lines{display:block;height:40px;margin-top:17px;background:repeating-linear-gradient(transparent 0 12px,#dfd7c6 12px 13px)}
.paper-paw{position:absolute;right:18px;top:12px;color:#bc3e49;font-size:32px;transform:rotate(16deg)}
.envelope-front{position:absolute;inset:19% 0 0;background:#e65d67;clip-path:polygon(0 0,50% 58%,100% 0,100% 100%,0 100%);border-radius:0 0 10px 10px}
.envelope-flap{position:absolute;inset:19% 0 0;background:#f17a80;clip-path:polygon(0 100%,50% 40%,100% 100%);border-radius:0 0 10px 10px}
.envelope-seal{position:absolute;top:52%;left:43%;width:14%;aspect-ratio:1;border-radius:50%;background:#fff5d4;color:#bb3743;border:3px double #cba672;display:grid;place-items:center;font-size:30px;box-shadow:0 3px 5px #8e2b3626}
.envelope-postmark{position:absolute;bottom:7%;right:5%;border:1px dashed #852d3990;border-radius:50%;font-size:8px;line-height:1.5;color:#71232d;padding:10px 8px;transform:rotate(-12deg);font-weight:700}
.envelope-call{font-size:clamp(20px,2vw,27px);font-weight:800;line-height:1.25;color:var(--green);text-align:center}.envelope-caption{font-size:12px;margin-top:10px;max-width:290px;line-height:1.5;color:var(--muted)}
.hero-envelope:hover .envelope-scene,.hero-envelope:focus-visible .envelope-scene{transform:rotate(-2deg) translateY(-5px)}
.hero-envelope:hover .envelope-paper,.hero-envelope:focus-visible .envelope-paper{transform:rotate(1deg) translateY(-12px)}
.hero-envelope:hover .envelope-call{text-decoration:underline;text-underline-offset:5px}
dialog:has(.letter-reveal){width:min(940px,calc(100% - 32px));padding:30px;max-height:92dvh;border-style:solid}
dialog:has(.letter-reveal)>.eyebrow{color:var(--holly)}
.letter-reveal{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;margin-top:24px;align-items:start}
.letter-photo{background:var(--mint);padding:9px 9px 16px;border-radius:7px;transform:rotate(-2deg);box-shadow:0 4px 0 #8fa6992e}
.letter-photo img{width:100%;height:auto;aspect-ratio:.8;object-fit:cover;border-radius:4px}.letter-photo>span{display:block;font-size:12px;line-height:1.7;margin:13px 7px 0;color:var(--holly)}
.letter-sheet{position:relative;background:#fffcf3;padding:22px 24px;border:1px solid #e7d9bf;border-radius:6px;color:#314a40}
.letter-stamp{display:block;text-align:right;color:#b6424b;font-size:9px;letter-spacing:1.3px;font-weight:700;margin-bottom:17px}
.letter-text p{font-family:Georgia,serif;font-size:16px;line-height:1.75;color:inherit;margin-bottom:16px}
.letter-signature{font-family:Georgia,serif;font-style:italic;font-size:15px;line-height:1.6;color:inherit;margin:24px 0}.letter-signature strong{font-size:24px;font-weight:normal;color:#b63d47}.letter-signature>span{font-size:25px;color:#b63d47}
.letter-sheet .primary{background:#bf3441;color:white}.letter-details{display:flex;color:#a6333e;font-size:12px}
.letter-tools{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:25px;flex-wrap:wrap}.letter-tools .button{margin:0!important}
#dialog-content>.letter-credit{font-size:11px;margin-bottom:0;color:var(--muted)}
.profile-letter{margin-top:30px;padding:27px;border:1px solid var(--line);border-radius:7px;background:var(--surface)}
.profile-letter .eyebrow{margin-bottom:20px}.profile-letter .letter-text p{font-size:15px;color:var(--text)}.profile-letter .letter-signature{color:var(--text)}.profile-letter .text-link{color:var(--green)}
.map-from-plan{aspect-ratio:1420/1120!important;min-width:740px;background:none!important}.shelter-plan{display:block;width:100%;height:100%;overflow:visible}
.map-viewport{max-height:650px;background:#eff7f5;overscroll-behavior:contain}
.map-home{cursor:pointer;outline:none}.map-home polygon{fill:#86b690;stroke:#456e51;stroke-width:2;stroke-linejoin:round;transition:fill .15s,stroke .15s}
.map-home text{font-family:"Trebuchet MS",sans-serif;font-size:10px;font-weight:700;fill:#173d26;pointer-events:none}
.map-home.has-residents polygon{fill:#56895d;stroke:#244e32;stroke-width:3}.map-home.has-residents text{fill:#fffdf2}
.map-home:hover polygon,.map-home[aria-pressed=true] polygon{fill:#c6444f;stroke:#96343d;stroke-width:4}.map-home:hover text,.map-home[aria-pressed=true] text{fill:white}
.map-home:focus-visible polygon{stroke:#152e7a;stroke-width:7;paint-order:stroke fill}.map-letter-dot{fill:#d53446;stroke:#fffcf3;stroke-width:2;pointer-events:none}
.map-legend{flex-wrap:wrap;gap:12px;align-items:center}.map-legend .legend-dot{background:#56895d}.letter-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#c6444f;margin-right:5px}.map-legend .text-link{font-size:11px;margin-left:auto}
.map-help{font-size:12px;margin-top:15px}.map-help .text-link{font-size:12px;margin-left:12px}.map-note{max-width:920px}.mobile-enclosure{display:flex;align-items:center;gap:20px;margin-top:14px;font-size:13px}.mobile-enclosure select{max-width:400px;flex:1;min-width:0}
.enclosure-panel{max-height:690px;overflow:auto}.enclosure-panel h3{font-size:25px}.enclosure-panel .map-demo-note{font-size:11px;margin-block:5px 12px}.map-preview{pointer-events:auto}
@media(max-width:1050px){.hero{gap:15px}.hero-envelope{padding-inline:5px}.paper-salute{font-size:22px}.envelope-paper{padding:16px 20px}.envelope-postmark{font-size:7px;padding:8px}.brand-logo{width:63px;height:63px}.site-header{height:95px}.site-header nav{gap:15px}.hero .hero-actions{align-items:stretch;gap:10px}.hero .hero-actions .button{font-size:12px;padding-inline:13px}}
@media(max-width:760px){.site-header{height:91px;gap:8px}.brand-logo{width:57px;height:64px}.brand strong{font-size:16px}.brand small{font-size:8px}.brand{gap:6px}.site-header nav{display:none}.header-actions{margin-left:auto}.hero{grid-template-columns:1fr;gap:18px;padding-block:30px 32px;min-height:0}.hero-copy{max-width:500px}.hero-envelope{max-width:400px;margin-top:8px;padding:12px 10px 22px}.envelope-heading{font-size:10px}.envelope-scene{max-width:345px;margin-block:20px}.paper-salute{font-size:25px}.envelope-caption{font-size:12px}.envelope-call{font-size:23px}.hero-actions{align-items:stretch!important}.hero .hero-actions .button{flex:1;min-width:135px;font-size:12px}.hero-description{max-width:420px}.map-viewport{max-height:490px}.map-legend .text-link{margin-left:0}.map-help{font-size:11px}.map-help .text-link{display:flex;margin-left:0}.mobile-enclosure{font-size:11px;gap:12px}.mobile-enclosure select{width:auto;max-width:70%;font-size:12px}.letter-reveal{grid-template-columns:1fr;gap:22px}.letter-photo{display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:center;padding:8px;transform:rotate(-1deg)}.letter-photo img{height:120px;aspect-ratio:auto}.letter-photo>span{margin:0;font-size:12px}.letter-sheet{padding:20px}.letter-text p{font-size:15px}dialog:has(.letter-reveal){padding:25px 18px;width:calc(100% - 20px)}dialog:has(.letter-reveal) h2{font-size:28px}.letter-tools{gap:8px}.letter-tools .button{font-size:12px}.letter-tools .text-link{font-size:12px}.profile-letter{padding:20px}.site-footer .brand-logo{width:72px;height:72px}}
@media(max-width:359px){.brand-logo{width:49px;height:55px}.brand strong{font-size:14px}.brand small{font-size:7px}.hero .hero-actions{flex-direction:column}.hero .hero-actions .button{width:100%;flex:auto}.envelope-call{font-size:20px}.envelope-seal{font-size:24px}.envelope-paper{padding:14px 17px}.paper-salute{font-size:22px}}
@media(prefers-reduced-motion:reduce){.hero-envelope:hover .envelope-scene,.hero-envelope:focus-visible .envelope-scene{transform:rotate(-6deg)}.hero-envelope:hover .envelope-paper,.hero-envelope:focus-visible .envelope-paper{transform:rotate(3deg)}}