@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,ital,wght@6..96,400;6..96,500;6..96,600;6..96,400&family=DM+Mono:wght@300;400&family=DM+Sans:wght@400;500&display=swap");
:root{--paper:#f1eedf;--ink:#211f19;--soft:#7d786b;--line:rgba(33,31,25,.22);--card:#faf8f1}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--paper)}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}button,a{-webkit-tap-highlight-color:transparent}.album{width:100%;max-width:560px;margin:0 auto;overflow:hidden;background:var(--paper)}.tiny{margin:0;font:300 9px/1.4 "DM Mono",monospace;letter-spacing:.18em}.cover{width:100%;height:100svh;min-height:720px;display:flex;flex-direction:column;align-items:center;padding:5.2svh 38px 4.2svh;text-align:center;overflow:hidden}.cover-photo{flex:0 0 auto;width:82%;height:23.5svh;min-height:175px;max-height:245px;margin:0;padding:6px;background:var(--card);box-shadow:0 10px 30px rgba(45,40,25,.08);transform:translateY(16px)}.demo-crop{width:100%;height:100%;background:url("./demo-album.png") 50% 45%/cover;filter:grayscale(1)}.cover h1{margin:4.8svh 0 0;font:400 clamp(54px,15.2vw,76px)/.76 "Bodoni Moda",serif;letter-spacing:-.075em;transform:translateY(16px)}.cover h1 i{display:inline-block;margin:.18em .04em 0 0;font-size:.58em}.cover-note{margin-top:auto;font:400 13px/1.55 "Bodoni Moda",serif;letter-spacing:.015em}.date-line{width:100%;display:flex;justify-content:space-between;align-items:end;margin-top:auto}.date-line b,.date-line span{font:500 clamp(39px,11vw,52px)/.75 "Bodoni Moda",serif;letter-spacing:-.055em}.thanks{min-height:105svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:130px 34px;text-align:center}.thanks h2,.memory-title h2{margin:42px 0 48px;font:400 clamp(48px,14vw,72px)/.98 "Bodoni Moda",serif;letter-spacing:-.065em}.thanks p:not(.tiny){max-width:360px;margin:0;font:400 18px/1.75 "Bodoni Moda",serif}.fine-line{width:1px;height:95px;margin:62px 0;background:var(--line)}.thanks blockquote{margin:0;font:italic 400 21px/1.45 "Bodoni Moda",serif}.day-note{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:110px 34px;text-align:center}.day-photo{width:72%;height:330px;padding:7px;background:var(--card);box-shadow:0 12px 34px rgba(45,40,25,.07)}.day-photo .demo-crop{background-position:72% 78%}.day-note .tiny{order:-1;margin-bottom:48px}.day-note>p:last-child{margin:58px 0 0;font:400 18px/1.55 "Bodoni Moda",serif}.memories{padding:150px 22px 130px}.memory-title{text-align:center;padding:0 15px 100px}.memory-title .tiny,.memory-title>p:last-child{color:var(--soft)}.memory-title h2{margin:38px 0 30px}.memory-title>p:last-child{margin:0;font-size:12px;letter-spacing:.02em}.photo-wall{display:grid;grid-template-columns:1fr 1fr;gap:18px 14px;align-items:start}.tile{position:relative;min-height:205px;padding:7px;overflow:hidden;border:0;background:var(--card);box-shadow:0 8px 24px rgba(45,40,25,.06)}.tile img{width:100%;height:100%;min-height:inherit;display:block;object-fit:cover;transition:transform .45s ease}.tile:active img{transform:scale(1.025)}.tile span{position:absolute;right:12px;bottom:11px;color:#fff;font:9px "DM Mono",monospace;text-shadow:0 1px 8px #000}.tile-0{grid-column:1/3;height:390px;margin-bottom:58px}.tile-1{height:265px}.tile-2{height:220px;margin-top:70px}.tile-3{grid-column:1/3;width:78%;height:420px;margin:80px auto}.tile-4{height:235px}.tile-5{height:295px;margin-top:48px}.tile-6{grid-column:1/3;height:360px;margin:85px 24px}.tile-7{height:280px}.tile-8{height:215px;margin-top:78px}.tile-9{grid-column:1/3;width:72%;height:420px;margin:90px auto 0}.tile-0 img{object-position:4% 8%}.tile-1 img{object-position:27% 10%}.tile-2 img{object-position:51% 7%}.tile-3 img{object-position:73% 10%}.tile-4 img{object-position:94% 12%}.tile-5 img{object-position:5% 86%}.tile-6 img{object-position:28% 86%}.tile-7 img{object-position:51% 86%}.tile-8 img{object-position:73% 86%}.tile-9 img{object-position:96% 86%}.gift{min-height:78svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:120px 34px;text-align:center}.gift .tiny{margin-bottom:54px;color:var(--soft)}.gift p:not(.tiny){max-width:355px;margin:0;font:400 24px/1.35 "Bodoni Moda",serif;letter-spacing:-.025em}.gift:before,.gift:after{content:"";width:1px;height:74px;background:var(--line)}.gift:before{margin-bottom:56px}.gift:after{margin-top:56px}.outro{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:130px 34px;text-align:center}.monogram{width:78px;height:105px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;border:1px solid var(--ink);border-radius:50%;font:400 29px/.62 "Bodoni Moda",serif}.monogram span,.monogram small{display:block;width:100%;text-align:center}.monogram small{font-size:12px}.outro p{max-width:355px;margin:62px 0 32px;font:400 24px/1.35 "Bodoni Moda",serif;letter-spacing:-.025em}.outro .gift-note{max-width:310px;margin:0 0 48px;font:400 15px/1.75 "Bodoni Moda",serif;letter-spacing:.005em;color:var(--soft)}.download-all{display:flex;align-items:center;gap:20px;margin:0 0 54px;padding:16px 23px;border:1px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);font:500 13px "DM Sans",sans-serif}.download-all b{font-size:19px;font-weight:400}.outro span{font:300 9px "DM Mono",monospace;letter-spacing:.15em}.lightbox{position:fixed;z-index:10;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;background:rgba(9,8,7,.97)}.lightbox[hidden]{display:none}.lightbox>button{position:absolute;top:18px;right:18px;width:44px;height:44px;min-width:44px;min-height:44px;aspect-ratio:1/1;display:grid;place-items:center;padding:0;appearance:none;border:1px solid #777;border-radius:50%;background:transparent;color:#fff;font:300 28px/1 "DM Sans",sans-serif}.lightbox img{width:100%;max-height:77svh;object-fit:contain}.lightbox a{margin-top:18px;color:#f4f0e6;font-size:14px}@media(min-width:600px){.album{box-shadow:0 0 70px rgba(40,35,22,.08)}}@media(max-height:760px){.cover{min-height:680px;padding-top:28px;padding-bottom:28px}.cover-photo{height:180px;min-height:180px}.cover h1{margin-top:32px;font-size:54px}}