:root{--night:#171322;--night2:#201a30;--plum:#332343;--pink:#ff91b5;--hot:#ff628f;--lilac:#c9b9ec;--butter:#ffdc88;--paper:#fff5ee;--ink:#241629;--mono:'DM Mono',monospace;--sans:'DM Sans',sans-serif;--serif:'Playfair Display',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--night);color:var(--paper);font-family:var(--sans);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 80% 13%,#3b2754 0,transparent 35%),radial-gradient(ellipse at 11% 65%,#30203e 0,transparent 36%)}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}::selection{background:var(--pink);color:var(--ink)}:focus-visible{outline:3px solid var(--butter);outline-offset:5px}.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}
.starfield{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.45;background-image:radial-gradient(1px 1px at 19% 28%,#ffe8c8 99%,transparent),radial-gradient(1px 1px at 73% 18%,#f8b2d4 99%,transparent),radial-gradient(1.5px 1.5px at 86% 71%,#d7bfff 99%,transparent),radial-gradient(1px 1px at 33% 79%,#ffdeab 99%,transparent),radial-gradient(1px 1px at 52% 46%,#fff 99%,transparent);background-size:213px 237px,277px 293px,337px 303px,181px 199px,409px 431px;animation:twinkle 8s ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.72}}
.site,.gate{position:relative;z-index:1}.pixel-window{border:2px solid #8872a4;background:#261b37;box-shadow:8px 8px 0 #100d19,0 0 0 5px #110e1a,0 0 36px #ff91b522}.window-bar{height:33px;background:#72578e;border-bottom:2px solid #a18bb9;display:flex;justify-content:space-between;align-items:center;padding:0 10px 0 12px;font:11px var(--mono);letter-spacing:.02em;color:#fff5ff}.window-icons{color:#ffc2dc;letter-spacing:.12em;font-size:10px;text-shadow:1px 1px #382345}
.gate{min-height:100svh;width:100%;display:flex;align-items:center;justify-content:center;padding:26px 18px;background:radial-gradient(ellipse at 50% 38%,#38264688,transparent 60%);overflow:hidden}.gate-window{width:100%;max-width:min(482px,calc(100vw - 36px));min-width:0;flex:0 1 482px;position:relative;animation:windowIn .85s cubic-bezier(.2,.8,.2,1) both}.gate-inside{text-align:center;padding:14px clamp(14px,6vw,45px) 25px;min-width:0}.gate-art{height:140px;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:2px}.envelope{width:108px;image-rendering:pixelated;filter:drop-shadow(0 7px 0 #15101c);animation:float 3s ease-in-out infinite}.gate-cat{width:78px;image-rendering:pixelated;position:absolute;right:calc(50% - 110px);bottom:2px;filter:drop-shadow(0 5px 0 #16101f)}.pixel-note,.gate-foot{font:10px var(--mono);letter-spacing:.08em;color:var(--butter)}.pixel-note{margin:2px 0 10px}.gate h1{font:500 clamp(26px,6vw,38px)/1.12 var(--serif);margin:0 0 10px;overflow-wrap:anywhere}.gate h1 span{color:var(--pink);font-style:italic}.gate-copy{font-size:14px;line-height:1.7;color:#d3c7df;margin:0 0 20px}.gate-form{display:flex;gap:8px;justify-content:center;min-width:0}.gate-form input{min-width:0;width:56%;border:1px solid #705b80;background:#171322;color:white;padding:12px 13px;font:12px var(--mono);letter-spacing:.09em}.gate-form input::placeholder{color:#a390b4}.pixel-button{border:1px solid #ffc2d9;color:#26152c;background:var(--pink);padding:11px 17px;font:11px var(--mono);box-shadow:3px 3px 0 #402b51;cursor:pointer;transition:transform .15s,background .2s}.pixel-button:hover{background:#ffb1ca;transform:translate(-1px,-1px)}.gate-error{height:20px;margin:8px 0 4px;color:#ff9db7;font-size:12px}.gate-foot{color:#9d8da9;font-size:9px}.gate-orbit{position:absolute;color:var(--pink);font-size:25px;animation:orbit 5s ease-in-out infinite}.orbit-one{top:20%;left:calc(50% - 225px)}.orbit-two{right:calc(50% - 230px);bottom:22%;color:var(--butter);animation-delay:-2s}@keyframes windowIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}@keyframes float{50%{transform:translateY(-7px)}}@keyframes orbit{50%{transform:translateY(-9px) rotate(12deg)}}.gate.opening .envelope{animation:openEnvelope .7s ease-in forwards}.gate.opening .gate-cat{animation:catHop .6s .2s ease-in-out 2}@keyframes openEnvelope{to{transform:translateY(-35px) rotate(-7deg) scale(1.12);filter:brightness(1.35) drop-shadow(0 0 24px #ffd38f)}}@keyframes catHop{50%{transform:translateY(-17px) rotate(-6deg)}}.gate.leave{animation:gateOut .9s .35s ease forwards}@keyframes gateOut{to{opacity:0;visibility:hidden;transform:scale(1.05)}}
.site{display:none;position:relative;z-index:1;opacity:0;pointer-events:none}.site.visible{display:block;opacity:1;pointer-events:auto;animation:siteIn 1s .1s both}.gate{position:fixed;inset:0;z-index:10}
.gate[hidden]{display:none}
.topline{height:64px;padding:0 clamp(20px,6vw,92px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff11;font:10px var(--mono);letter-spacing:.03em;color:#d3c7df}.wordmark{font:12px var(--mono);color:var(--paper)}.wordmark span:last-child{color:var(--pink)}.mini-heart{color:var(--pink);margin-right:6px}.topline-right span{color:var(--butter);margin-left:10px}.hero{min-height:calc(100svh - 64px);position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);align-items:center;gap:5vw;padding:clamp(50px,8vw,112px) clamp(24px,10vw,150px) 90px;overflow:hidden}.hero:before{content:"";position:absolute;width:min(58vw,680px);aspect-ratio:1;right:5%;top:12%;border-radius:50%;border:1px solid #ff91b523;box-shadow:0 0 0 42px #ff91b508,0 0 0 84px #ff91b506}.hero-copy{position:relative;z-index:1;max-width:590px}.hero-kicker,.section-mark,.poem-label,.celebrate-kicker{font:11px var(--mono);letter-spacing:.045em;color:var(--pink)}.hero-kicker{margin:0 0 18px}.hero h2{font:500 clamp(53px,8.2vw,105px)/.99 var(--serif);letter-spacing:-.055em;margin:0 0 26px}.hero h2 em,.section-heading h2 em,.words-heading h2 em{font-weight:500;color:var(--pink)}.hero-spark{font:24px var(--sans);color:var(--butter);vertical-align:top;margin-left:13px;display:inline-block;animation:orbit 4s ease-in-out infinite}.hero-intro{max-width:405px;color:#c8bed1;font-size:15px;line-height:1.8}.scroll-link{display:inline-flex;align-items:center;gap:17px;margin-top:28px;font:10px var(--mono);color:var(--butter)}.scroll-arrow{display:grid;place-items:center;width:30px;height:30px;border:1px solid #ffdc884d;border-radius:50%;font-size:15px;animation:float 2s infinite}.hero-window{width:min(100%,380px);justify-self:center;position:relative;transform:rotate(2deg);z-index:1}.hero-pixel{min-height:267px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 60%,#725584,#332644 57%,#261b37);position:relative;overflow:hidden}.hero-pixel:before,.hero-pixel:after{content:"✦";position:absolute;color:#ffdc88;font-size:16px;top:29px;left:21%}.hero-pixel:after{content:"♡";font-size:19px;left:auto;right:18%;top:72px;color:#ff91b5}.hero-pixel img{width:135px;height:135px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 0 #281a36)}.pixel-caption{font:10px var(--mono);color:#f2d6e7;margin-top:11px}.window-doodle{position:absolute;width:29px;height:29px;object-fit:cover;bottom:8px;left:12px;opacity:.12;pointer-events:none}.hero-stamp{position:absolute;right:-17px;bottom:32px;border:1px dashed var(--pink);background:#21182e;border-radius:50%;width:69px;height:69px;display:grid;place-content:center;text-align:center;color:var(--pink);font-size:20px;transform:rotate(10deg)}.hero-stamp small{font:9px var(--mono);color:var(--paper)}.hero-bottom{position:absolute;bottom:24px;left:clamp(24px,10vw,150px);right:clamp(24px,10vw,150px);display:flex;justify-content:space-between;font:9px var(--mono);color:#8f829a;letter-spacing:.03em}
.reading-progress{position:fixed;inset:0 0 auto;height:3px;z-index:80;background:#fff1;pointer-events:none}.reading-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--pink),var(--butter));transform:scaleX(0);transform-origin:left;box-shadow:0 0 10px #ff91b5aa}.topline{position:sticky;top:3px;z-index:12;background:#171322eF;backdrop-filter:blur(14px)}.topline-nav{display:flex;gap:clamp(10px,2.6vw,36px);font:9px var(--mono);color:#bcb0c8}.topline-nav a{transition:color .2s}.topline-nav a:hover{color:var(--butter)}
.beginning{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(38px,8vw,112px);align-items:center;background:radial-gradient(ellipse at 6% 82%,#472c4b88,transparent 45%),#191522;position:relative;overflow:hidden}.beginning-intro{max-width:400px;position:relative}.beginning-intro h2{font:500 clamp(52px,7vw,82px)/.99 var(--serif);letter-spacing:-.055em;margin:0 0 23px}.beginning-intro h2 em{color:var(--pink)}.beginning-intro>p:not(.section-mark){font:15px/1.9 var(--sans);color:#d0c4d5}.beginning-intro strong{color:var(--butter);font-weight:500}.beginning-stamp{display:inline-block;margin-top:17px;padding:9px 13px;border:1px dashed #ff91b58a;color:#e8c6d9;font:9px var(--mono);transform:rotate(-3deg)}.beginning-stamp b{color:var(--pink);margin-left:6px}.month-thread{position:relative;padding-left:30px}.month-thread:before{content:"";position:absolute;left:11px;top:8px;bottom:10px;border-left:1px dashed #ff91b566}.thread-note{position:relative;display:grid;grid-template-columns:35px 1fr 34px;gap:13px;align-items:center;padding:23px 19px 23px 0;border-bottom:1px solid #ffffff15}.thread-note:last-child{border-bottom:0}.thread-dot{display:grid;place-items:center;width:25px;height:25px;border:1px solid #ff91b57d;border-radius:50%;background:#201629;color:var(--pink);font:9px var(--mono);position:relative;z-index:1}.thread-note time{font:9px var(--mono);letter-spacing:.07em;color:var(--butter)}.thread-note h3{font:italic 500 23px var(--serif);margin:5px 0;color:#fff1f1}.thread-note p{font:12px/1.7 var(--sans);color:#bdb1c8;margin:0;max-width:430px}.thread-doodle{font-size:23px;color:var(--pink);opacity:.8;animation:orbit 4s ease-in-out infinite}.thread-note:nth-child(even) .thread-doodle{color:var(--butter);animation-delay:-2s}
.month-things{background:#211a30;position:relative;overflow:hidden}.little-list{max-width:980px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(15px,3vw,35px);align-items:center}.little-note{position:relative;min-height:235px;padding:29px 23px 26px;background:#34263f;border-top:2px solid #f493bb;box-shadow:5px 6px 0 #15111d;transform:rotate(var(--tilt,0deg));transition:transform .4s,background .3s}.little-note:nth-child(2){--tilt:1.4deg;background:#30283f;border-color:var(--butter);margin-top:28px}.little-note:nth-child(3){--tilt:-1.2deg;background:#3b2942;border-color:#b39ae5;margin-top:-12px}.little-note:hover{transform:translateY(-8px) rotate(0)}.little-icon{color:var(--pink);font-size:22px}.little-note h3{font:italic 500 24px/1.15 var(--serif);margin:19px 0 10px}.little-note p{font:12px/1.7 var(--sans);color:#c6b9cf;margin:0}.note-scribble{display:block;margin-top:18px;font:9px var(--mono);color:var(--butter);transform:rotate(-2deg)}
.section-pad{padding:clamp(86px,12vw,160px) clamp(24px,10vw,150px)}.memories{background:#211a30;position:relative;overflow:hidden}.memories:before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,#ff91b507 55%,transparent 80%);pointer-events:none}.section-heading{text-align:center;max-width:610px;margin:0 auto 61px}.section-mark{margin:0 0 18px}.section-mark span{color:var(--butter);margin-right:7px}.section-heading h2,.words-heading h2{font:500 clamp(42px,6vw,69px)/1.04 var(--serif);letter-spacing:-.035em;margin:0}.section-heading h2 em,.words-heading h2 em{font-style:italic}.section-deck{max-width:450px;margin:18px auto 0;color:#b9adca;font-size:14px;line-height:1.8}.collage{max-width:870px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(120px,17vw,190px);gap:clamp(12px,2vw,23px);position:relative}.photo-tile{position:relative;padding:8px 8px 26px;background:#f8eee5;color:#463549;box-shadow:4px 7px 0 #120e19,0 12px 28px #09070d44;transform:rotate(var(--tilt));transition:transform .35s cubic-bezier(.2,.8,.2,1),z-index 0s;z-index:0}.photo-tile:hover{transform:rotate(0) scale(1.055);z-index:4}.photo-tile:nth-child(4n+2){background:#fff3f2}.photo-tile:nth-child(4n+3){background:#e8e2f1}.photo-tile.wide{grid-column:span 2}.photo-tile.tall{grid-row:span 2}.photo-tile img{width:100%;height:100%;object-fit:cover;background:#42344d}.photo-placeholder{position:absolute;inset:8px 8px 26px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#473553,#34283f);border:1px dashed #b891a8;color:#d8c6d5;text-align:center}.photo-placeholder strong{font:26px var(--serif);color:var(--pink)}.photo-placeholder span{margin-top:6px;font:9px var(--mono);letter-spacing:.02em}.photo-tile figcaption{position:absolute;bottom:6px;left:10px;right:10px;text-align:center;font:9px var(--mono);color:#604a60;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.photo-tile .sticker{position:absolute;z-index:2;right:-12px;top:-14px;color:var(--hot);font-size:24px;text-shadow:1px 2px #fff}.photo-tile:nth-child(3n) .sticker{left:-14px;right:auto;color:#886ac2}.collage-note{max-width:850px;margin:37px auto 0;display:flex;align-items:center;justify-content:center;gap:21px;color:#a89ab4;font:10px var(--mono)}.tape-sticker{background:var(--butter);color:#3d2b37;padding:7px 12px;transform:rotate(-4deg);font-size:9px}.pixel-flower{font-size:20px;color:var(--pink)}
.words{position:relative;background:#171322}.words-grid{max-width:1050px;margin:auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(35px,9vw,120px);align-items:start}.words-heading{position:sticky;top:90px}.words-heading h2{font-size:clamp(44px,6vw,73px)}.tiny-cat{display:flex;align-items:center;gap:10px;margin-top:36px;color:#a89bb3;font:10px var(--mono)}.tiny-cat img{width:59px;height:59px;object-fit:contain;image-rendering:pixelated}.writing{padding-top:8px}.poem-label{color:var(--butter);padding-bottom:14px;border-bottom:1px solid #ffffff20;margin:0 0 19px}.poem{font:italic clamp(19px,2.35vw,25px)/1.8 var(--serif);color:#f3e9e9}.poem .line{display:block}.quote-list{margin-top:45px;border-left:1px solid #ff91b55c;padding-left:22px;display:grid;gap:23px}.quote{font:italic 16px/1.65 var(--serif);color:#cbbddd;max-width:470px}.quote:before{content:"“";color:var(--pink);font-size:24px;margin-right:5px}.quote:after{content:"”";color:var(--pink);font-size:24px;margin-left:3px}.words-end{display:flex;justify-content:center;gap:17px;margin:80px 0 -80px;color:#ff91b563;font-size:18px}
.proposal{min-height:100svh;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 48%,#422c50 0,transparent 55%),#211a30}.proposal-frame{width:min(100%,780px);position:relative;z-index:1;transform:rotate(-.5deg)}.proposal-inner{text-align:center;padding:clamp(29px,7vw,67px) 22px 35px}.proposal-cat-wrap{width:135px;height:119px;margin:0 auto 15px;position:relative;display:grid;place-items:center}.proposal-cat-wrap img{height:108px;width:108px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 5px 0 #171121)}.proposal-cat-wrap span{position:absolute;right:-84px;top:5px;background:#fcf1e8;color:#322237;font:9px var(--mono);padding:8px 10px;transform:rotate(4deg)}.proposal-cat-wrap span:after{content:"";position:absolute;left:-6px;bottom:3px;border-width:5px 6px 5px 0;border-style:solid;border-color:transparent #fcf1e8 transparent transparent}.proposal-inner .section-mark{margin-bottom:11px}.proposal h2{font:500 clamp(35px,6.7vw,65px)/1.08 var(--serif);letter-spacing:-.035em;margin:0 auto 14px;max-width:660px}.proposal h2 em{color:var(--pink)}.proposal-note{color:#bdb0ca;font-size:13px;line-height:1.7;margin:0}.choice-area{display:flex;justify-content:center;align-items:center;gap:24px;position:relative;min-height:132px;margin-top:18px}.yes-button,.no-button{cursor:pointer;border:0;transition:transform .22s cubic-bezier(.2,.8,.2,1),background .2s,box-shadow .2s}.yes-button{background:var(--pink);color:#291930;padding:15px 22px;font:11px var(--mono);box-shadow:4px 4px 0 #815079;transform:scale(var(--yes-scale,1));z-index:1;white-space:nowrap}.yes-button:hover{background:#ffa9c3}.yes-button span{margin-left:6px}.no-button{background:transparent;border:1px solid #a493b6;color:#c6b6d0;padding:12px 20px;font:10px var(--mono)}.no-button:hover{color:white}.no-button.roaming{position:absolute;z-index:3;transition:left .25s cubic-bezier(.2,.8,.2,1),top .25s cubic-bezier(.2,.8,.2,1),transform .2s}.proposal-foot{font:9px var(--mono);color:#8f809e}.proposal-float{position:absolute;color:var(--pink);font-size:clamp(35px,6vw,73px);opacity:.45;animation:float 4s ease-in-out infinite}.float-heart{left:10%;top:20%}.float-star{right:10%;bottom:18%;color:var(--butter);animation-delay:-2s}
.proposal-cat-wrap img.nervous{animation:catNervous .12s ease-in-out infinite alternate}@keyframes catNervous{to{transform:translateX(3px) rotate(3deg)}}
footer{text-align:center;padding:43px 20px 48px;background:#15111f;border-top:1px solid #ffffff0c}.footer-heart{font-size:22px;color:var(--pink)}footer p{font:italic 18px var(--serif);margin:7px 0 11px}footer .footer-small{font:9px var(--mono);color:#94869f}footer .footer-small span{color:#ffc0d7}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .85s cubic-bezier(.2,.8,.2,1),transform .85s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}.site.visible{animation:siteIn 1s .1s both}@keyframes siteIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.mote{position:absolute;bottom:-5vh;color:var(--pink);font:15px var(--serif);opacity:0;animation:floatUp 17s linear infinite;filter:drop-shadow(0 0 8px #ff91b555)}@keyframes floatUp{8%{opacity:.42}92%{opacity:.3}100%{transform:translateY(-108vh) translateX(35px) rotate(35deg);opacity:0}}.gate-form input.shake{animation:shake .42s;border-color:var(--hot)}@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.celebration{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 50% 37%,#6d3c6d,#271a38 54%,#171322 100%);opacity:0;visibility:hidden;transform:scale(1.035);transition:opacity .7s,visibility .7s,transform .7s;overflow:hidden}.celebration.show{opacity:1;visibility:visible;transform:none}.celebrate-content{position:relative;z-index:2;text-align:center;max-width:560px}.celebrate-content>img{width:150px;height:130px;object-fit:contain;image-rendering:pixelated;margin:0 auto 11px;filter:drop-shadow(0 7px 0 #171121)}.celebrate-kicker{color:var(--butter);margin:0 0 11px}.celebrate-content h2{font:italic 600 clamp(53px,10vw,96px)/.98 var(--serif);letter-spacing:-.05em;color:#fff0f4;text-shadow:0 4px 0 #a24e84;margin:0 0 17px;animation:celebratePop .7s cubic-bezier(.2,1.5,.4,1) both}.celebrate-content>p:not(.celebrate-kicker){font:15px/1.8 var(--sans);color:#eddaea;max-width:405px;margin:0 auto}.celebrate-buttons{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:26px}.celebrate-link{font:10px var(--mono);color:#e9c7dc}.celebrate-signoff{display:block;margin-top:39px;font:italic 18px var(--serif);color:var(--pink)}.celebrate-stars{position:absolute;inset:8% 0 auto;text-align:center;color:#ffd98a;letter-spacing:1.2em;font-size:20px;opacity:.75;animation:float 4s ease-in-out infinite}.burst-layer{position:absolute;inset:0;pointer-events:none}.heart-burst{position:absolute;font-size:var(--size);color:var(--color);animation:burst 1.45s ease-out forwards;filter:drop-shadow(0 0 10px #ff9abc88)}@keyframes burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}12%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.4) rotate(var(--r))}}@keyframes celebratePop{from{opacity:0;transform:scale(.65) rotate(-4deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(max-width:760px){.topline{height:55px;padding:0 19px}.topline-right{font-size:8px}.hero{min-height:auto;grid-template-columns:1fr;text-align:center;padding:75px 23px 95px;gap:48px}.hero-copy{margin:auto}.hero-intro{margin:0 auto}.hero-window{width:min(82%,340px)}.hero-pixel{min-height:230px}.hero-bottom{left:20px;right:20px;bottom:20px;font-size:8px}.hero:before{width:90vw;right:5%;top:45%}.section-pad{padding:88px 24px}.collage{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(130px,36vw,200px);gap:16px}.words-grid{grid-template-columns:1fr;gap:42px}.words-heading{position:static}.tiny-cat{margin-top:22px}.quote-list{margin-top:31px}.proposal{min-height:90svh;padding-left:19px;padding-right:19px}.proposal-cat-wrap span{right:-71px}.proposal-float.float-heart{left:3%;top:13%}.proposal-float.float-star{right:4%;bottom:9%}}
@media(max-width:420px){.topline-right{display:none}.hero h2{font-size:56px}.hero-window{width:86%}.gate-form{gap:7px}.gate-form input{width:58%}.gate-form .pixel-button{padding:10px 12px}.gate-art{height:123px}.gate-cat{right:calc(50% - 100px)}.collage-note{gap:9px;font-size:8px}.tape-sticker{padding:6px 8px}.proposal-cat-wrap span{right:-54px;font-size:8px}.proposal-inner{padding:27px 15px}.proposal-inner .section-mark{font-size:9px}.choice-area{gap:12px}.yes-button{padding:14px 15px}.no-button{padding:11px 14px}.proposal-foot{display:block;margin-top:9px}}
@media(max-width:420px){.gate{padding-inline:0}.gate-window{width:calc(100vw - 36px);max-width:calc(100vw - 36px);flex:0 0 calc(100vw - 36px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
.photo-tile img{position:absolute;inset:8px 8px 26px;width:calc(100% - 16px);height:calc(100% - 34px);opacity:0;transform:scale(1.04);transition:opacity .35s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.photo-tile.has-photo img{opacity:1;transform:scale(1)}.photo-placeholder{display:none}.photo-tile.empty .photo-placeholder{display:flex}
@media(max-width:760px){.topline-nav{display:none}.topline{height:55px}.beginning{grid-template-columns:1fr;gap:37px}.beginning-intro{max-width:560px}.month-thread{padding-left:26px}.thread-note{grid-template-columns:29px 1fr 27px;gap:9px;padding:20px 2px 20px 0}.thread-note h3{font-size:21px}.little-list{grid-template-columns:1fr;max-width:520px;gap:20px}.little-note,.little-note:nth-child(2),.little-note:nth-child(3){min-height:0;margin:0;padding:24px 22px;transform:none}.little-note p{max-width:390px}.reading-progress{height:3px}}
.confetti-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
/* The two keepsake photographs have distinct, real scrapbook frames. */
.portrait-pair{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,#30223d,#191522 65%)}
.portrait-pair:before{content:"♡";position:absolute;right:9%;top:15%;font:clamp(90px,18vw,220px)/1 var(--serif);color:#ff91b509;transform:rotate(13deg);pointer-events:none}
.portrait-duo{position:relative;z-index:1;max-width:860px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(25px,6vw,75px);align-items:center}
.portrait-frame{position:relative;margin:0;padding:11px 11px 0;background:#f5e9e5;color:#3b2b40;box-shadow:7px 9px 0 #100d19,0 17px 35px #0a071144;transform:rotate(-3deg);transition:transform .4s cubic-bezier(.2,.8,.2,1);max-width:350px;width:100%;justify-self:center}
.portrait-frame.portrait-me{transform:rotate(3.2deg);background:#e9e4f0;margin-top:35px}
.portrait-frame:hover{transform:translateY(-7px) rotate(0) scale(1.025);z-index:3}
.portrait-frame img{position:relative;z-index:1;width:100%;aspect-ratio:4/5;object-fit:cover;background:#332740;opacity:0;transition:opacity .35s}
.portrait-frame.has-photo img{opacity:1}
.portrait-badge{position:absolute;top:-14px;right:-15px;z-index:2;padding:8px 10px;background:var(--butter);color:#322337;font:9px var(--mono);transform:rotate(7deg);box-shadow:2px 3px 0 #171322}
.portrait-me .portrait-badge{left:-17px;right:auto;background:#d7c6f0;transform:rotate(-6deg)}
.portrait-frame figcaption{min-height:72px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:4px}
.portrait-frame figcaption strong{font:italic 19px var(--serif)}
.portrait-frame figcaption span{font:9px var(--mono);color:#6c5b70}
.portrait-pair .section-deck{max-width:530px}
footer.closing-note{text-align:center;padding:62px 20px 70px;background:radial-gradient(ellipse at 50% 0,#30223d,#15111f 70%);border-top:1px solid #ffffff12}
footer.closing-note p{font:italic clamp(24px,4vw,32px)/1.2 var(--serif);color:#f4e8ec;margin:9px 0 17px}
footer.closing-note .footer-small{font:9px var(--mono);color:#b4a4bd;letter-spacing:.04em}
.closing-spark{color:var(--butter);font-size:21px;animation:orbit 4s ease-in-out infinite;display:inline-block}
@media(max-width:560px){.portrait-duo{gap:17px;align-items:start}.portrait-frame{padding:8px 8px 0;box-shadow:4px 6px 0 #100d19}.portrait-frame.portrait-me{margin-top:25px}.portrait-badge{font-size:8px;padding:7px 8px;right:-7px}.portrait-me .portrait-badge{left:-7px}.portrait-frame figcaption{min-height:70px}.portrait-frame figcaption strong{font-size:15px}.portrait-frame figcaption span{font-size:7px}}
