@font-face{font-family:Diary Hand;src:url("../fonts/lemon-signature.c161c6708d0e.ttf") format('truetype');font-weight:400;font-display:swap}
body.family-diary{background:#f1f2df;color:#233b2c;font:18px/1.6 Manrope,Arial,sans-serif}
.family-diary .diary-page{position:relative;isolation:isolate;width:100%;margin:auto;overflow:hidden;background:
 radial-gradient(ellipse at 0% 8%,#dce5cc99 0%,transparent 48%),
 radial-gradient(ellipse at 100% 27%,#f4e8b899 0%,transparent 45%),
 radial-gradient(ellipse at 5% 57%,#e0e9cf99 0%,transparent 43%),
 radial-gradient(ellipse at 95% 85%,#e5e9c999 0%,transparent 48%),
 linear-gradient(160deg,#f4f2df 0%,#f8f3d9 38%,#eef1df 70%,#f6f0d8 100%);box-shadow:0 0 70px #78613c10;padding-bottom:30px}
.diary-page:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.17;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%239f8e6d' filter='url(%23n)' opacity='.35' d='M0 0h200v200H0z'/%3E%3C/svg%3E")}
.family-diary .diary-page :is(p,span,time,a,button,input,label,summary,small,select,textarea){font-family:Manrope,Arial,sans-serif;font-size:18px;line-height:1.6}
.family-diary .diary-page h1,.family-diary .diary-page h2{font-family:Diary Hand,'Bad Script',cursive!important;font-weight:400!important;letter-spacing:-.045em;line-height:1.4;color:#203e2c;text-wrap:balance;overflow-wrap:anywhere}
.family-diary .diary-page h1{font-size:clamp(44px,7.5vw,81px)!important;margin:0}
.family-diary .diary-page h2{font-size:clamp(34px,5.5vw,52px)!important;margin:0 0 18px}
.family-diary .diary-page p{margin:0 0 14px;overflow-wrap:anywhere}
.diary-hero{position:relative;min-height:600px;padding:150px 43% 65px 8%}
.family-diary .diary-margin-note{position:absolute;left:8%;top:38px;max-width:220px;font:22px/1.4 Diary Hand,cursive!important;transform:rotate(-9deg)}
.diary-dinosaur{position:absolute;right:-2%;top:35px;width:40%;height:90%;object-fit:contain;object-position:top right;pointer-events:none}
.diary-title-paper{position:relative;padding:40px 32px 18px;background:#fffbed;transform:rotate(-5deg);box-shadow:0 5px 15px #66553218;z-index:1}
.family-diary .diary-date{position:relative;margin:18px -32px -12px;padding:12px 14px;background:#d4dcb4;color:#243b2a;text-align:center;transform:rotate(2deg);box-shadow:0 3px 4px #62512918}
.diary-scene{position:relative;margin:0 8%;padding:30px 0}
.diary-welcome{text-align:center;padding-top:32px;padding-bottom:30px}
.diary-paper{background:#f4ecd4;box-shadow:0 4px 13px #73634416;border:1px solid #e4d9bb;border-radius:2px 5px 3px 7px}
.diary-venue{display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:35px 0 65px;gap:6%}
.diary-trail{position:absolute;right:-7%;top:-60px;width:180px;height:calc(100% + 150px);object-fit:fill;z-index:0;pointer-events:none}
.diary-trail path{fill:none;stroke:#ad915b;stroke-width:1.3}
.diary-polaroid{position:relative;padding:12px 12px 18px;background:#fffdf3;margin:0;box-shadow:0 5px 15px #5c513522;transform:rotate(-4deg)}
.diary-polaroid:before{content:"";position:absolute;z-index:2;width:35%;height:24px;top:-12px;left:32%;background:#c5aa6d66;transform:rotate(-3deg)}
.diary-polaroid img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}
.family-diary .diary-polaroid figcaption{font:22px/1.5 Diary Hand,cursive;padding:16px 4px 0;color:#554f3b}
.diary-venue-note{position:relative;padding:22px 18px;transform:rotate(3deg);margin-left:-6px}
.family-diary .diary-venue-note h2{font-size:clamp(28px,4vw,40px)!important}
.family-diary .diary-venue-note p{font-size:16px}
.diary-map{display:inline-flex;min-height:44px;align-items:center;color:#47683e;text-decoration:underline;text-underline-offset:4px}
.diary-sprig{width:65px;height:95px}
.venue-sprig{position:absolute;right:6%;bottom:15px;transform:rotate(20deg)}
.diary-plan h2{text-align:center}
.diary-plan-layout{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:20px;align-items:center}
.diary-timetable{padding:22px;transform:rotate(-2deg)}
.diary-time{display:grid;grid-template-columns:26px 64px minmax(0,1fr);align-items:start;gap:12px;padding:13px 0}
.diary-time time{font-weight:700}
.family-diary .diary-stop{color:#789363;font:24px/1.4 Diary Hand,cursive}
.diary-plan aside{text-align:center;transform:rotate(9deg)}
.family-diary .diary-page .diary-plan aside p{font:30px/1.5 Diary Hand,cursive!important}
.diary-plan aside>span{font:52px Diary Hand,cursive!important}
.diary-outfit{text-align:center;padding-top:44px}
.diary-palette{display:flex;justify-content:center;gap:20px;margin:10px 0 18px}
.diary-palette i{width:72px;height:72px;border-radius:50%;border:1px solid #fff9}
.diary-parents{margin:32px 8%;padding:26px 70px 26px 26px;transform:rotate(-2deg)}
.parents-sprig{position:absolute;right:10px;top:16px;width:52px;transform:rotate(18deg)}
.diary-closing{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:25px 8% 0;min-height:130px}
.family-diary .diary-closing p{font:24px/1.5 Diary Hand,cursive;max-width:210px;transform:rotate(-9deg)}
.diary-mountains{width:45%;height:auto}
.diary-rsvp{position:relative;padding:14px 8% 36px;text-align:center}
.family-diary .diary-rsvp .rsvp-disclosure{margin:0}
.family-diary .diary-rsvp .rsvp-disclosure>summary{display:flex;align-items:center;justify-content:center;min-height:64px;padding:15px 24px;background:#4d713d;color:#fff;border:3px solid #9ba879;border-radius:999px;font:700 18px/1.4 Manrope,Arial,sans-serif;box-shadow:0 4px 10px #304f2320}
.family-diary .diary-rsvp .rsvp-disclosure__panel{padding:24px;background:#fffdf5;color:#263e2b;border:1px solid #dfd4b6;border-radius:18px;text-align:left;margin-top:20px}
.diary-footer{padding:55px 20px 20px;text-align:center}
.family-diary .diary-footer a{font-size:14px!important;color:#716e5d;text-decoration:none}
.diary-personal{margin:24px auto;max-width:100%;border:10px solid #fffdf3;box-shadow:0 4px 12px #66553220}
.diary-personal img{display:block;width:100%;max-height:500px;object-fit:cover}
.diary-gallery{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:35px 0}
.diary-gallery .diary-polaroid:nth-child(even){transform:rotate(4deg)}
.family-diary :is(a,button,input,summary,textarea,select):focus-visible{outline:3px solid #86723b;outline-offset:4px}
.diary-enter>*{opacity:0;translate:0 16px;transition:opacity .7s ease,translate .7s ease}
.diary-enter.diary-seen>*{opacity:1;translate:0 0}
.diary-enter>:nth-child(2){transition-delay:.12s}
.diary-enter>:nth-child(3){transition-delay:.22s}
@media(max-width:600px){
 .diary-hero{min-height:370px;padding:110px 28% 34px 8%}
 .family-diary .diary-page h1{font-size:clamp(38px,9.5vw,54px)!important}
 .diary-title-paper{padding:18px 15px 0}
 .family-diary .diary-margin-note{top:24px;font-size:17px!important;max-width:150px}
 .family-diary .diary-date{font-size:16px;margin:12px -20px -8px;padding:10px 6px}
 .diary-scene{margin-left:7%;margin-right:7%;padding-top:22px;padding-bottom:22px}
 .family-diary .diary-page h2{font-size:34px!important;margin-bottom:15px}
 .family-diary .diary-page p{font-size:16px}
 .diary-venue{padding-top:30px;padding-bottom:55px}
 .diary-polaroid{padding:8px 8px 12px}
 .family-diary .diary-polaroid figcaption{font-size:17px}
 .diary-venue-note{padding:16px 12px}
 .family-diary .diary-venue-note h2{font-size:27px!important}
 .diary-plan-layout{grid-template-columns:minmax(0,1fr);gap:20px}
 .diary-timetable{padding:15px 10px}
 .diary-time{grid-template-columns:18px 48px minmax(0,1fr);gap:7px}
 .family-diary .diary-time :is(span,time){font-size:16px}
 .family-diary .diary-page .diary-plan aside p{font-size:26px!important;max-width:220px;margin:0 auto}
 .diary-plan aside svg{width:45px}
 .diary-palette{gap:16px}.diary-palette i{width:58px;height:58px}
 .diary-parents{padding:24px 42px 24px 20px;margin-top:24px}
 .parents-sprig{width:35px;right:5px}
 .diary-closing{min-height:110px}
 .family-diary .diary-closing p{font-size:19px;max-width:155px}
 .family-diary .diary-rsvp .rsvp-disclosure>summary{font-size:17px}
}
@media(prefers-reduced-motion:reduce){.diary-page *{animation:none!important;transition:none!important}.diary-enter>*{opacity:1;translate:none}}
.diary-dinosaur{-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.diary-title-paper{background-image:linear-gradient(120deg,#fffbed,#f6efdb)}
.family-diary .diary-hero h1{line-height:1.2}
.diary-footer{position:relative;padding-top:75px;padding-bottom:24px;isolation:isolate}
.diary-footer>img{position:absolute;bottom:0;left:0;width:100%;height:auto;z-index:-1;pointer-events:none}
.diary-paper{clip-path:polygon(0 1%,7% 0,18% .8%,29% 0,42% .6%,55% 0,71% .8%,86% 0,99% 1%,100% 19%,99.5% 45%,100% 72%,99% 99%,85% 100%,68% 99.3%,51% 100%,31% 99.2%,12% 100%,0 99%,.7% 78%,0 55%,.5% 30%)}

/* Full-width paper with a readable, spacious journal composition. */
body.family-diary .diary-footer{background:transparent;color:#716e5d}
.diary-scene,.diary-closing{max-width:1040px;margin-left:auto;margin-right:auto;width:84%}
.diary-parents{width:84%;margin:32px auto}
.diary-rsvp{max-width:760px;margin:auto}
.diary-footer>img{max-height:220px;object-fit:fill}
.diary-footer{margin-top:40px;padding-top:130px}
.diary-mountains{max-width:400px}
@media(min-width:1500px){.diary-hero{padding-left:calc((100% - 1260px)/2);padding-right:48%}.diary-dinosaur{right:calc((100% - 1400px)/2);width:540px}}
@media(max-width:600px){
 .diary-hero{min-height:350px;padding:120px 19% 18px 7%}
 .diary-dinosaur{width:48%;height:300px;right:-7%;top:4px}
 .diary-title-paper{padding:26px 22px 16px}
 .diary-margin-note{width:45%}
 .diary-scene,.diary-closing,.diary-parents{width:86%}
 .diary-venue{grid-template-columns:1fr;gap:28px;padding-right:12%}
 .diary-venue-note{margin-left:10%;padding:24px}
 .diary-polaroid{max-width:300px}
 .diary-trail{right:-11%;width:120px;top:-25px;height:calc(100% + 65px)}
 .diary-footer{padding-top:70px}
 .diary-footer>img{min-height:110px}
}
.family-diary .diary-page .diary-dinosaur{width:40%;max-width:none}
.family-diary .diary-page .diary-trail{width:180px;max-width:none}
.family-diary .diary-page .diary-mountains{width:45%}
@media(min-width:1500px){.family-diary .diary-page .diary-dinosaur{width:540px}}
@media(max-width:600px){.family-diary .diary-page .diary-dinosaur{width:48%}.family-diary .diary-page .diary-trail{width:120px}}
body.family-diary .diary-page .diary-footer a{color:#716e5d!important}

/* Generous inner margins protect the handwritten ascenders and descenders. */
.family-diary .diary-title-paper{padding:48px 42px 30px}
.family-diary .diary-hero h1{line-height:1.08;padding:0 4px 18px}
.family-diary .diary-title-paper .diary-date{margin:22px 0 0;padding:12px 10px;font-size:16px}
.family-diary .diary-page .diary-dinosaur{width:44%;height:96%;top:14px}
.family-diary .diary-page .diary-closing p{font:34px/1.5 Diary Hand,cursive;max-width:340px}
@media(min-width:1500px){.family-diary .diary-page .diary-dinosaur{width:590px}}
@media(max-width:600px){
 .family-diary .diary-title-paper{padding:30px 26px 24px}
 .family-diary .diary-hero h1{line-height:1.12;padding-bottom:14px}
 .family-diary .diary-title-paper .diary-date{margin:18px -8px 0;font-size:16px}
 .family-diary .diary-page .diary-dinosaur{width:53%;height:320px;top:0}
 .family-diary .diary-page .diary-closing p{font-size:27px;max-width:58%}
}
body.family-diary .diary-page .diary-closing p{font-family:Diary Hand,cursive!important;font-size:34px!important;line-height:1.5!important}
@media(max-width:600px){body.family-diary .diary-page .diary-closing p{font-size:27px!important}}

/* Trail connects the photo corner with the left edge of the page. */
.family-diary .diary-page .diary-hero-trail{position:absolute;left:calc(17% - 130px);top:-365px;width:260px;height:640px;max-width:none;object-fit:fill;transform:rotate(-72deg);pointer-events:none;z-index:0}
@media(max-width:600px){.family-diary .diary-page .diary-hero-trail{display:none}}

/* Narrow previews need separate space for the illustration and the title. */
@media(max-width:600px){
 body.family-diary .diary-hero{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 1.2fr);align-items:center;gap:12px;min-height:0;padding:24px 7% 32px}
 body.family-diary .diary-hero .diary-margin-note{position:static;grid-column:1;grid-row:1;width:auto;max-width:none;margin:0;transform:rotate(-5deg);font-size:17px!important}
 body.family-diary .diary-page .diary-hero .diary-dinosaur{position:relative;grid-column:2;grid-row:1;inset:auto;width:100%;height:auto;max-height:280px;max-width:100%;object-fit:contain!important;object-position:center;transform:none}
 body.family-diary .diary-hero .diary-title-paper{grid-column:1 / -1;padding:24px 20px 20px;transform:rotate(-3deg);margin:0 3%}
 body.family-diary .diary-page .diary-closing{flex-direction:column;gap:12px;min-height:0;margin-top:24px;text-align:center}
 body.family-diary .diary-page .diary-closing p{font-size:24px!important;line-height:1.4!important;max-width:100%;margin:0;transform:none;overflow-wrap:normal;text-wrap:balance}
 body.family-diary .diary-page .diary-mountains{width:100%;max-width:360px;height:auto;object-fit:contain}
 body.family-diary .diary-rsvp .rsvp-disclosure>summary{width:100%;min-width:0;max-width:100%;box-sizing:border-box;padding:12px 10px;min-height:52px;font-size:16px!important;line-height:1.4!important;white-space:normal;gap:6px;overflow-wrap:normal}
 body.family-diary .diary-rsvp .rsvp-disclosure>summary>span{font-size:16px!important;flex:0 0 auto}
}
@media(max-width:300px){
 body.family-diary .diary-hero .diary-margin-note{grid-column:1 / -1;grid-row:1;text-align:center;transform:none;text-wrap:balance}
 body.family-diary .diary-page .diary-hero .diary-dinosaur{grid-column:1 / -1;grid-row:2;width:100%;height:210px}
 body.family-diary .diary-hero .diary-title-paper{grid-row:3}
}
/* One form surface leaves room for readable answers in the phone preview. */
@media(max-width:600px){
 body.family-diary .diary-rsvp{padding-inline:5%}
 body.family-diary .diary-rsvp .rsvp-disclosure__panel{padding:14px 10px;width:100%;max-width:100%;box-sizing:border-box}
 body.family-diary .diary-rsvp .rsvp-form{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;width:100%;min-width:0;max-width:100%;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;box-sizing:border-box}
 body.family-diary .diary-rsvp .rsvp-form :is(div,fieldset,legend,label){min-width:0;max-width:100%;box-sizing:border-box}
 body.family-diary .diary-rsvp .rsvp-form fieldset{margin:0;padding:0;border:0}
 body.family-diary .diary-rsvp .rsvp-form :is(input:not([type=radio]):not([type=checkbox]),textarea,select){width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:16px!important}
 body.family-diary .diary-rsvp .rsvp-form label{font-size:16px!important;line-height:1.5!important;overflow-wrap:break-word}
 body.family-diary .diary-rsvp .rsvp-form label:has(input[type=radio]),body.family-diary .diary-rsvp .rsvp-form label:has(input[type=checkbox]){display:grid;grid-template-columns:20px minmax(0,1fr);align-items:start;gap:8px;width:100%;padding:10px 8px;white-space:normal}
 body.family-diary .diary-rsvp .rsvp-form input:is([type=radio],[type=checkbox]){width:18px;height:18px;min-width:18px;margin:3px 0 0;flex:none}
 body.family-diary .diary-rsvp .rsvp-form>div:has(>input[type=checkbox]){display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px}
 body.family-diary .diary-rsvp .rsvp-form .btn{width:100%;min-width:0;max-width:100%;min-height:50px;padding:12px 8px;white-space:normal;font-size:16px!important;line-height:1.4!important;box-sizing:border-box}
}
/* A single layered journal cover, including narrow editor frames. */
@media(max-width:600px){
 body.family-diary .diary-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:24px 8% 36px;isolation:isolate}
 body.family-diary .diary-hero .diary-margin-note{position:relative;grid-column:1;grid-row:1;text-align:left;width:78%;max-width:240px;margin:0 0 10px;transform:rotate(-4deg);text-wrap:balance;z-index:2}
 body.family-diary .diary-page .diary-hero .diary-dinosaur{position:relative;grid-column:1;grid-row:2;justify-self:end;align-self:start;inset:auto;width:78%;height:240px;max-height:none;max-width:280px;object-fit:contain!important;object-position:right bottom;transform:rotate(4deg);margin:0 -5% -65px 0;z-index:0}
 body.family-diary .diary-hero .diary-title-paper{grid-column:1;grid-row:3;justify-self:start;width:92%;margin:0;padding:24px 16px 18px;box-sizing:border-box;transform:rotate(-4deg);z-index:1;text-align:center;box-shadow:0 8px 18px #66553220}
 body.family-diary .diary-hero h1{font-size:clamp(36px,10vw,52px)!important;line-height:1.2;padding:0 0 8px;text-align:center;text-wrap:balance}
 body.family-diary .diary-hero .diary-title-paper .diary-date{margin:12px -4px 0;padding:10px 6px;font-size:16px;line-height:1.5;transform:rotate(2deg)}
}
