@import"https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&family=DM+Serif+Display:ital@0;1&family=Manrope:wght@400;500&display=swap";:root{--ink: #59604c;--soft: #7a8171;--paper: #f8faf5;--paper-alt: #f1f4eb;--line: #dce2d3;--accent: #879272}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:#e3e9dc;color:var(--ink);font-family:Manrope,sans-serif}button,input,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.book{width:min(100%,1100px);min-height:100vh;margin:auto;overflow:hidden;background:var(--paper);box-shadow:0 0 28px #2b48341f}.page{position:relative;min-height:100svh;padding:clamp(82px,10vw,125px) clamp(9vw,15vw,165px) 90px;overflow:hidden;border-bottom:1px solid var(--line)}.page h1,.page h2{margin:0;font-family:"DM Serif Display",serif;font-weight:400;line-height:.98;letter-spacing:-.035em}.main-title>span,.section-title>span{display:block}h1{font-size:clamp(57px,8vw,86px)}h2{font-size:clamp(48px,6.2vw,72px)}em{color:#718050;font-weight:400}.tiny-title{margin:0 0 22px;color:var(--accent);font:500 13px/1.4 Manrope,sans-serif;letter-spacing:.06em;text-transform:uppercase}.copy{max-width:520px;color:var(--soft);font-size:14px;line-height:1.8}.page-one{padding-top:clamp(120px,14vw,165px)}.phrase-card{display:flex;align-items:center;gap:10px;width:100%;max-width:560px;height:154px;margin:42px 0 24px;padding:22px clamp(18px,3vw,30px);overflow:hidden;color:#58634a;background:#edf2e5;border:1px solid #ced7be;border-radius:6px;box-shadow:5px 6px #5b6f4712}.phrase-card p{flex:1;min-width:0;margin:0;overflow:hidden;overflow-wrap:anywhere;font-size:clamp(20px,2.5vw,25px);line-height:1.16}.phrase-card span{flex:none;color:#9aa77e;font:42px/.5 Georgia,serif}.phrase-card span:last-child{align-self:flex-end}.doodle{position:absolute;color:#7b8964;opacity:.72;pointer-events:none}.doodle svg{display:block;width:100%;height:100%}.doodle svg *{fill:none!important;stroke:currentColor!important}.doodle-mate{top:78px;left:12%;width:72px;height:72px}.doodle-turtle{top:23%;right:12%;width:96px;height:72px}.doodle-cat{right:13%;bottom:15%;width:70px;height:70px}.doodle-snoopy,.doodle-courage{top:14%;right:10%;width:95px;height:80px}.doodle-cat-two{bottom:16%;left:9%;width:68px;height:68px}.doodle-turtle-two{right:11%;bottom:24px;width:95px;height:70px}.page-two{padding-top:110px;background:var(--paper-alt)}.page-two h2{margin-bottom:35px}.spotify-card{width:min(100%,720px);padding:19px;background:#415349;border-radius:6px;box-shadow:8px 9px #365b401f}.spotify-topline{margin-bottom:13px;color:#d8e4d8;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.spotify-dot{display:inline-block;width:7px;height:7px;margin-right:7px;background:#9cc47e;border-radius:50%}.small-arrow{float:right}.spotify-card iframe{display:block;width:100%;height:352px;border:0}.page-three{display:flex;flex-direction:column;justify-content:center}.page-three h2{margin-bottom:23px}.page-three>.copy{margin-bottom:34px}.gift-button{align-self:flex-start;padding:13px 22px;color:#fff;background:#5d886a;border:0;border-radius:4px;cursor:pointer;font:19px Caveat,cursive}.book-footer{padding:25px 12%;color:#83a08b;background:var(--paper);text-align:center;font:19px Caveat,cursive}.book-footer span{color:#5f916c}.theme-toggle{position:absolute;top:24px;right:11%;z-index:3;width:34px;height:34px;color:var(--ink);background:transparent;border:1px solid #bdc8b0;border-radius:50%;cursor:pointer}.dark-mode{--ink: #d9e1d3;--soft: #b4c0ae;--paper: #273229;--paper-alt: #202a24;--line: #435346;--accent: #b4c59a;color:var(--ink);background:var(--paper)}.dark-mode .phrase-card{color:#e0e8da;background:#344338;border-color:#536653}.dark-mode .doodle{color:#a7ba8b}.dark-mode .gift-button{color:#172118;background:#78956d}.album-lock{width:min(100%,520px);margin-top:35px;color:var(--soft);line-height:1.7}.album-lock label{display:block;margin:20px 0 6px;color:var(--accent);font-size:12px;text-transform:uppercase}.answer-row{display:flex;border-bottom:1px solid var(--ink)}.answer-row input{flex:1;min-width:0;padding:8px 0;color:var(--ink);background:transparent;border:0;outline:0}.answer-row button{color:var(--ink);background:transparent;border:0;cursor:pointer}.album-content{margin-top:30px}.album-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;color:var(--soft);font-size:12px}.upload-button{padding:10px 14px;color:#fff;background:#5d886a;border-radius:4px;cursor:pointer;font-size:13px}.upload-button input{display:none}.album-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.photo-thumb{position:relative;display:block;margin:0;overflow:visible;background:transparent;border:0;cursor:pointer;outline:none}.photo-image-frame{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;background:var(--paper-alt);border:1px solid var(--line)}.photo-image-frame img{display:block;width:100%;height:100%;padding:6px;object-fit:contain;transition:transform .2s ease}.photo-thumb:hover .photo-image-frame img{transform:scale(1.025)}.photo-caption{position:absolute;right:7px;bottom:-6px;z-index:2;display:flex;flex-direction:column;gap:2px;width:calc(100% - 22px);min-height:48px;padding:7px 11px 8px;overflow:hidden;color:#4f5745;background:#eee8c8;border:1px solid rgba(166,157,111,.55);box-shadow:2px 3px #3c4b3221,inset 0 0 18px #a196621f;transform:rotate(-1.8deg);pointer-events:none}.photo-caption:before{position:absolute;top:-7px;left:50%;width:48px;height:15px;background:#cac19194;content:"";transform:translate(-50%) rotate(-2deg)}.photo-caption strong{position:relative;overflow:hidden;color:#4d533f;font-family:Caveat,cursive;font-size:22px;font-weight:600;line-height:.95;text-overflow:ellipsis;white-space:nowrap}.photo-caption span{position:relative;display:-webkit-box;overflow:hidden;color:#686b57;font-family:Caveat,cursive;font-size:17px;line-height:.98;-webkit-box-orient:vertical;-webkit-line-clamp:2}.album-nav{position:relative;z-index:5;display:flex;align-items:center;justify-content:center;gap:22px;margin-top:30px;color:var(--soft);font-size:13px}.album-nav button{width:34px;height:34px;padding:0;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:50%;cursor:pointer}.album-nav button:disabled{opacity:.3;cursor:default}.album-empty{padding:60px 20px;color:var(--soft);border:1px dashed var(--line);text-align:center}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;padding:18px;background:#22281fc7;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);place-items:center}.gift-modal{position:relative;width:min(92vw,475px);max-height:94vh;padding:24px 26px 26px;overflow-y:auto;background:var(--paper);box-shadow:9px 11px #525e4224}.gift-modal .section-title{margin:0;font-size:clamp(43px,6vw,58px);line-height:.9}.gift-modal .section-title span{display:block}.gift-modal .section-title span:first-child{color:var(--ink)}.gift-modal .section-title span:last-child{margin-left:10px}.close-button{position:absolute;top:12px;right:12px;z-index:3;display:grid;width:34px;height:34px;padding:0;color:#456846;background:var(--paper);border:1.5px solid #456846;border-radius:50%;cursor:pointer;font-size:22px;line-height:1;place-items:center}.close-button:hover{color:var(--paper);background:#456846}.gift-modal .bouquet-frame{display:flex;width:min(100%,385px);height:min(62vh,510px);margin:17px auto 18px;overflow:hidden;background:#e9eee3;border:1px solid var(--line);box-shadow:4px 5px #525e421a;align-items:center;justify-content:center}.gift-modal .bouquet-frame img{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:center}.final-note{max-width:390px;margin:0 auto;padding-left:12px;color:var(--soft);border-left:2px solid #a8b18f;font-size:13px;line-height:1.6}.photo-viewer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;padding:18px;background:#22281fdb;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);place-items:center}.photo-viewer-inner{position:relative;width:fit-content;max-width:calc(100vw - 48px);max-height:calc(100vh - 48px);padding:10px;overflow:auto;background:var(--paper);box-shadow:0 10px 35px #00000047}.photo-viewer-inner>img{display:block;width:auto;height:auto;max-width:calc(100vw - 68px);max-height:calc(100vh - 110px);object-fit:contain}.photo-details{width:min(100%,620px);padding:14px 8px 2px;color:var(--ink);text-align:center}.photo-details h3{margin:0 0 7px;font-family:Caveat,cursive;font-size:31px;font-weight:600;line-height:.95}.photo-details p{margin:0;color:var(--soft);font-family:Caveat,cursive;font-size:21px;line-height:1.05}.photo-options-toggle{display:block;margin:12px auto 0;padding:7px 14px;color:var(--soft);background:transparent;border:1px solid var(--line);border-radius:20px;cursor:pointer;font-size:12px}.photo-options-toggle:hover,.photo-options-toggle.active{color:var(--ink);background:var(--paper-alt)}.photo-options-menu{display:flex;justify-content:center;gap:7px;margin:10px auto 0;animation:menu-appear .18s ease}.photo-options-menu button,.menu-replace-button{padding:7px 10px;color:var(--ink);background:var(--paper-alt);border:1px solid var(--line);border-radius:4px;cursor:pointer;font-size:11px}.menu-replace-button{display:inline-block}.menu-replace-button input{display:none}.photo-options-menu .menu-delete-button{color:#a05750;border-color:#d7aaa5}@keyframes menu-appear{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.photo-edit-form{width:min(100%,620px);padding:16px 8px 4px;text-align:left}.photo-edit-form label{display:block;margin:0 0 5px;color:var(--accent);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.photo-edit-form input,.photo-edit-form textarea{display:block;width:100%;margin-bottom:13px;padding:9px 10px;color:var(--ink);background:var(--paper-alt);border:1px solid var(--line);border-radius:4px;outline:none}.photo-edit-form textarea{min-height:82px;resize:vertical}.photo-edit-actions{display:flex;justify-content:flex-end;gap:9px}.cancel-edit-button,.save-edit-button{padding:8px 12px;border-radius:4px;cursor:pointer;font-size:12px}.cancel-edit-button{color:var(--ink);background:transparent;border:1px solid var(--line)}.save-edit-button{color:#fff;background:#5d886a;border:1px solid #5d886a}.delete-confirm-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;display:grid;padding:20px;background:#22281f94;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);place-items:center}.delete-confirm-modal{width:min(100%,390px);padding:30px;color:var(--ink);background:var(--paper);border:1px solid var(--line);box-shadow:8px 9px #364b3529}.delete-confirm-modal h2{margin:0;font-size:42px;line-height:.98}.delete-confirm-text{margin:20px 0 25px;color:var(--soft);font-size:13px;line-height:1.6}.delete-confirm-actions{display:flex;justify-content:flex-end;gap:9px}.delete-cancel-button,.delete-final-button{padding:9px 15px;border-radius:4px;cursor:pointer;font-size:12px}.delete-cancel-button{color:var(--ink);background:transparent;border:1px solid var(--line)}.delete-final-button{color:#fff;background:#a05750;border:1px solid #a05750}.delete-final-button:disabled{cursor:default;opacity:.55}@media (max-width: 760px){.page{padding-right:9vw;padding-left:9vw}.page h1{font-size:clamp(50px,13vw,72px)}.theme-toggle{right:9vw}.album-toolbar{align-items:flex-start;flex-direction:column}.album-grid{gap:9px}.photo-caption{right:5px;bottom:-5px;width:calc(100% - 14px);min-height:42px;padding:6px 8px 7px}.photo-caption:before{width:38px;height:12px}.photo-caption strong{font-size:19px}.photo-caption span{font-size:15px}.gift-modal{width:calc(100vw - 28px);max-height:94vh;padding:22px 18px 21px}.gift-modal .section-title{font-size:46px}.gift-modal .bouquet-frame{width:min(100%,305px);height:min(61vh,440px);margin-top:14px;margin-bottom:15px}.final-note{font-size:13px}.photo-viewer{padding:14px}.photo-viewer-inner{max-width:calc(100vw - 28px);max-height:calc(100vh - 28px);padding:8px}.photo-viewer-inner>img{max-width:calc(100vw - 44px);max-height:calc(100vh - 80px)}.photo-options-menu{align-items:stretch;flex-direction:column;width:min(100%,220px)}.photo-options-menu button,.menu-replace-button{width:100%;text-align:center}.delete-confirm-modal{padding:25px}.delete-confirm-modal h2{font-size:38px}.delete-confirm-actions{justify-content:stretch}.delete-cancel-button,.delete-final-button{flex:1}}@media (max-width: 760px){.gift-modal{text-align:center}.gift-modal .section-title{width:100%;text-align:center}.gift-modal .section-title span{display:block;margin-left:0}.gift-modal .bouquet-frame{display:flex;margin-right:auto;margin-left:auto}.gift-modal .final-note{width:min(100%,330px);margin-right:auto;margin-left:auto;padding:0;border-left:0;text-align:center}.gift-modal .tiny-title,.gift-modal .riddle,.gift-modal .modal-tip{text-align:center}.gift-modal .answer-form{width:100%;text-align:left}}