@font-face{font-family:Editorial;src:local('Georgia');font-display:swap}
:root{--paper:#f6f2e9;--ink:#382e2b;--muted:#786d65;--red:#923e3d;--coral:#ce7255;--line:#ded8cc;--serif:Editorial,Georgia,'Times New Roman',serif;--sans:'Helvetica Neue',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6}button,input{font:inherit}button,a,input,label{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--coral);outline-offset:5px}img{display:block;max-width:100%}button{color:inherit}fieldset{min-width:0}.icon-library{position:absolute;width:0;height:0;overflow:hidden}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.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}[hidden]{display:none!important}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;line-height:1.6}.coral{color:var(--coral)}.handwritten{font-family:var(--serif);font-style:italic;font-size:23px;color:var(--red)}
.ticker { height: 38px; background: var(--red); color: var(--paper); overflow: hidden; position: relative; }
.ticker-track { width: max-content; display: flex; animation: marquee 80s linear infinite; }
.ticker-group { display: flex; flex-shrink: 0; align-items: center; justify-content: space-around; min-width: 100vw; gap: 32px; padding-right: 32px; }
.ticker-group > span { display: flex; align-items: center; flex-shrink: 0; height: 38px; white-space: nowrap; font-size: 12px; font-weight: 700; font-style: italic; letter-spacing: 1.4px; text-transform: uppercase; }
.ticker-toggle { position: absolute; right: 0; top: 0; width: 38px; height: 38px; border: 0; background: var(--red); color: var(--paper); box-shadow: -12px 0 16px var(--red); }
.ticker.paused .ticker-track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.wordmark{font-family:var(--serif);font-size:34px;font-weight:bold;letter-spacing:-1.5px;line-height:1}.wordmark span{display:inline-block;color:var(--coral);margin-left:6px;font-family:var(--sans);font-weight:400;font-size:32px;transform:rotate(-14deg)}
.letter{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 2.1fr;gap:60px;padding-block:45px;margin-bottom:88px}.letter-label{display:flex;flex-direction:column;gap:24px;align-items:flex-start}.letter-label .icon{width:46px;height:46px;color:var(--coral);transform:rotate(-15deg);stroke-width:1}.letter-text p{margin:0 0 16px;color:var(--muted);font-size:14px;line-height:1.9}.letter-text .handwritten{display:block;margin-top:24px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px}.section-heading .eyebrow{margin:0 0 13px}h2{font-family:var(--serif);font-size:clamp(38px,4vw,55px);letter-spacing:-1.8px;line-height:1.1;font-weight:400;margin:0}.section-heading>p{font-size:13px;color:var(--muted);line-height:1.8;margin:0 0 2px}.placeholder-note{font-size:11px;color:var(--muted);margin:-10px 0 24px}.gift-grid{padding:0;margin:0;border:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.gift-card{min-width:0}.gift-picture{display:block;position:relative;overflow:hidden;aspect-ratio:1.42;background:var(--line)}.gift-picture>img{width:100%;height:100%;object-fit:cover;transition:transform .45s}.gift-choice{cursor:pointer;display:block}.gift-choice:hover img{transform:scale(1.035)}.gift-number{position:absolute;left:15px;top:15px;font-size:12px;border-radius:50%;background:var(--paper);width:32px;height:32px;display:grid;place-items:center}.choice-mark{position:absolute;right:14px;bottom:14px;width:35px;height:35px;display:grid;place-items:center;background:var(--paper);border-radius:50%;font-size:25px;color:var(--red)}.gift-title{display:block;font:26px var(--serif);letter-spacing:-.5px;margin-top:20px}.gift-card>p{font-size:13px;color:var(--muted);line-height:1.8;min-height:47px;margin:10px 0 16px}.location{display:flex;align-items:center;gap:6px;font-size:11px;width:fit-content}.location .icon{width:15px;height:15px}.location>span{margin-left:8px}.location:hover{text-decoration:underline}.gift-radio{margin-top:23px;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:12px;position:relative}.gift-radio input{position:absolute;opacity:0;width:100%;height:100%;inset:0;margin:0;cursor:pointer}.radio-indicator{width:18px;height:18px;border:1px solid #a69b8f;border-radius:50%}.gift-radio input:checked~.radio-indicator{border:5px solid var(--red);background:var(--paper)}.gift-radio:focus-within{outline:2px solid var(--coral);outline-offset:4px}.gift-card:has(input:checked) .gift-title{color:var(--red)}.gift-card:has(input:checked) .choice-mark{background:var(--red);color:white}.gift-card:has(input:checked) .gift-radio{border-color:var(--red);color:var(--red)}.selection-note{font-size:11px;color:var(--muted);text-align:center;margin:25px 0 0;min-height:20px}.gifts{padding-bottom:90px}.button{border:1px solid var(--red);background:var(--red);color:#fffdf5;padding:13px 22px;display:inline-flex;gap:14px;align-items:center;justify-content:center;font-size:12px;line-height:1.5;border-radius:3px;transition:background .2s}.button:hover{background:#793332}.button .icon{width:17px;height:17px}#media-count{font-size:11px;color:var(--muted)}.gallery-caption{font-size:11px;color:var(--muted);margin-block:13px 20px}.gallery-canvas{position:relative;width:100%;overflow:hidden}.gallery-tile{position:absolute;overflow:hidden;padding:0;border:0;border-radius:0;background:#d3cebf;cursor:zoom-in;display:block}.gallery-tile>img,.gallery-tile>video{width:100%;height:100%;display:block;object-fit:cover;transition:filter .25s}.gallery-tile:hover>img{filter:brightness(.9)}.gallery-tile:focus-visible{outline:4px solid var(--paper);outline-offset:-6px;z-index:2}.tile-caption{position:absolute;bottom:0;left:0;right:0;color:#fff;background:linear-gradient(transparent,#0007);padding:35px 15px 12px;text-align:left;font-size:11px;opacity:0;transition:opacity .2s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gallery-tile:hover .tile-caption,.gallery-tile:focus-visible .tile-caption{opacity:1}.video-badge{position:absolute;right:13px;top:13px;background:#0005;color:white;font-size:10px;padding:4px 9px;border-radius:20px}.upload-message{font-size:12px;margin:8px 0;overflow-wrap:anywhere}.upload-message.error{color:#a1332b}.upload-message.success{color:#496d4e}progress{width:100%;height:8px;accent-color:var(--red)}.logout{font-size:11px;background:none;border:0;color:var(--muted);padding:10px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:13px 25px;background:var(--ink);color:var(--paper);border-radius:4px;box-shadow:0 4px 25px #0002;z-index:20;font-size:13px;text-align:center;max-width:90vw;width:max-content}.lightbox{border:0;background:#221d1b;color:var(--paper);padding:55px 20px 20px;max-width:95vw;max-height:95vh;width:fit-content;overflow:auto}.lightbox::backdrop{background:#17100de6}.lightbox>button{position:absolute;top:4px;right:13px;color:white;background:none;border:0;font-size:35px;padding:0 10px}.lightbox img,.lightbox video{max-width:88vw;max-height:75vh;object-fit:contain;display:block;margin:auto}.lightbox p{font-size:12px;text-align:center;margin-bottom:0;overflow-wrap:anywhere}
.login-page{min-height:calc(100vh - 38px);display:flex;flex-direction:column;align-items:center;padding:45px 24px 32px}.login-page>.wordmark{margin-bottom:40px}.login-card{text-align:center;max-width:530px;margin:auto}.login-flower{margin:0 auto 25px;transform:rotate(10deg)}.login-card h1{font-family:var(--serif);font-size:72px;line-height:1.05;letter-spacing:-3px;font-weight:400;margin:24px 0}.login-card h1 em{color:var(--red)}.login-card>p:not(.eyebrow){font-size:13px;color:var(--muted);line-height:1.9}.login-form{margin:30px auto 25px;max-width:340px;text-align:left}.login-form>label{font-size:11px;display:block;margin-bottom:8px}.password-row{display:flex}.password-row input{width:100%;min-width:0;padding:14px 16px;background:#fffaf3;border:1px solid var(--line);border-right:0;border-radius:3px 0 0 3px;font-size:12px;color:var(--ink)}.password-row button{border-radius:0 3px 3px 0;padding-inline:17px}.login-page>.handwritten{margin-top:40px;font-size:18px}.form-error{font-size:12px;color:var(--red)}
@media(min-width:1600px){}
@media(max-width:1050px){.gift-title{font-size:23px}.gift-grid{gap:20px}.letter{gap:30px}}
@media(max-width:760px){.wordmark{font-size:30px}.letter{grid-template-columns:1fr;gap:18px;padding-block:30px;margin-top:10px;margin-bottom:55px}.letter-label{flex-direction:row;justify-content:space-between;align-items:center}.letter-label .icon{height:28px;width:28px}.letter-text p{font-size:13px}.letter-text .handwritten{font-size:21px;margin-top:19px}.section-heading{align-items:flex-start;flex-direction:column;gap:16px;margin-bottom:24px}.section-heading .eyebrow{font-size:8px;letter-spacing:1.5px}h2{font-size:40px}.section-heading>p{font-size:12px}.gift-grid{grid-template-columns:1fr;gap:35px}.gift-picture{aspect-ratio:1.65}.gift-title{font-size:27px;margin-top:17px}.gift-card>p{min-height:0;margin-bottom:12px}.gift-radio{margin-top:16px}.gifts{padding-bottom:55px}.selection-note{font-size:10px}.gallery-caption{font-size:10px}.login-card h1{font-size:61px}.login-page>.wordmark{margin-bottom:25px}.login-flower{width:67px;height:67px}.login-page>.handwritten{text-align:center;font-size:17px}.eyebrow{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker-track{animation:none}*,*::before,*::after{transition:none!important}}

/* Minimal, anonymous entry screen. No birthday content before login. */
html:has(body.locked), body.locked { background: #000; color-scheme: dark; }
.locked .login-page { width: 100%; min-height: 100svh; margin: 0; padding: 24px; display: grid; place-items: center; background: #000; color: #eee; }
.locked .login-card { width: min(340px,100%); margin: 0; }
.locked .login-form { width: 100%; margin: 0; }
.locked .login-form > label { font-size: 14px; font-weight: 400; letter-spacing: 0; color: #bdbdbd; margin-bottom: 14px; }
.locked .password-row input { background: #000; color: #fff; border: 1px solid #555; border-right: 0; border-radius: 0; font-size: 16px; }
.locked .password-row button { background: #000; color: #fff; border: 1px solid #555; border-left: 0; border-radius: 0; box-shadow: none; font-size: 22px; padding: 9px 17px; }
.locked .password-row button:hover { background: #171717; }
.locked :is(button,input):focus-visible { outline: 2px solid #ccc; outline-offset: 3px; }
.locked .password-row:focus-within { outline: 1px solid #aaa; outline-offset: 3px; }
.locked .password-row input:focus-visible { outline: none; }
.locked .form-error { color: #ddd; }
.locked input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #000 inset; -webkit-text-fill-color: #fff; caret-color: #fff; }

/* Full-width album backdrop, with normal document scrolling. */
.ticker { z-index: 2; }
.album-page { position: relative; min-height: 100vh; isolation: isolate; }
.album-background { position: absolute; inset: 0 0 auto; width: 100%; }
.gallery-canvas { overflow-anchor: none; background: #d3cebf; }
.birthday-content { position: relative; z-index: 1; padding: 90px 32px 180px; pointer-events: none; }
.paper-panel { pointer-events: auto; background: #f6f2e9f5; box-shadow: 0 10px 55px #21190d24; backdrop-filter: blur(12px); margin-inline: auto; }
.letter { width: min(790px,100%); padding: 42px 48px; margin-top: 0; margin-bottom: 100px; grid-template-columns: 1fr; gap: 30px; border: 0; }
.letter-label .icon { width: 42px; height: 42px; }
.gifts { width: min(1100px,100%); padding: 44px; }
.gift-grid { gap: 25px; }
.gift-title { font-size: 25px; }
.gift-card > p { min-height: 70px; }
.gallery-caption { font-size: 10px; text-align: center; margin: 18px 0 0; }

/* The floating action opens the native photo/video picker. */
.upload-fab { position: fixed; right: max(28px,env(safe-area-inset-right)); bottom: max(28px,env(safe-area-inset-bottom)); z-index: 5; display: inline-flex; align-items: center; gap: 11px; border: 1px solid #ffffff38; border-radius: 40px; padding: 17px 23px; background: var(--red); color: #fffdf5; box-shadow: 0 5px 24px #241b1850; font-size: 13px; }
.upload-fab:hover { background: #793332; }
.upload-fab .icon { width: 24px; height: 24px; }
.upload-popover { position: fixed; z-index: 6; right: 28px; bottom: 108px; width: min(370px,calc(100vw - 40px)); max-height: min(460px,calc(100dvh - 150px)); overflow: auto; padding: 20px 24px; background: var(--paper); border-radius: 12px; box-shadow: 0 8px 40px #0003; }
.upload-popover-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.upload-popover-heading strong { font: 23px var(--serif); }
.upload-popover-heading button { background: none; border: 0; font-size: 27px; padding: 0 6px; }
.toast { bottom: 28px; left: 24px; transform: none; max-width: calc(100vw - 350px); }
@media(max-width:1050px) {
  .birthday-content { padding: 70px 30px 140px; }
  .gifts { padding: 35px; }
  .gift-grid { gap: 20px; }
  .gift-title { font-size: 23px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 16px; }
}
@media(max-width:760px) {
  .birthday-content { padding: 60px 20px 130px; }
  .letter { grid-template-columns: 1fr; gap: 18px; padding: 28px; margin-bottom: 90px; }
  .letter-label .icon { width: 28px; height: 28px; }
  .gifts { padding: 28px; }
  .gift-grid { gap: 35px; }
  .gift-title { font-size: 26px; }
  .gift-card > p { min-height: 0; }
  .upload-fab { right: max(18px,env(safe-area-inset-right)); bottom: max(20px,env(safe-area-inset-bottom)); padding: 17px; }
  .upload-fab span { display: none; }
  .upload-popover { right: 20px; bottom: 94px; }
  .toast { left: 20px; bottom: 90px; max-width: calc(100vw - 40px); }
}