:root{--bg:#171b18;--ink:#e9e4d9;--gold:#c2a673;--muted:#a7aaa0;--line:#41483d;--paper:#eae4d6}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,sans-serif;-webkit-font-smoothing:antialiased}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:9;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.23' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}h1:focus,h2:focus{outline:none}[hidden]{display:none!important}h1,h2,h3,p,figure{margin-top:0}header,main,footer{max-width:1500px;margin:auto}header{height:96px;padding:0 6vw;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}#home{font:italic 35px Georgia;display:flex;gap:20px;align-items:center;border:0;background:none;padding:0}#home span{font:9px Arial;letter-spacing:2.5px}#music-toggle{display:flex;gap:15px;align-items:center;text-align:left;background:none;border:0;font-size:10px;letter-spacing:1px}#music-toggle small{display:block;color:var(--muted);font-size:8px;letter-spacing:1.6px;margin-top:5px}.bars{color:var(--gold)}.cover{position:relative;min-height:750px;display:grid;grid-template-columns:1.05fr 1fr;padding:90px 6vw 105px;gap:30px;align-items:center}.eyebrow{font-size:9px;line-height:1.8;letter-spacing:2px;color:var(--gold);font-weight:normal;margin-bottom:30px}h1,h2{font:normal 86px/1.04 Georgia;letter-spacing:-3.6px;margin-bottom:30px}em{color:var(--gold);font-weight:normal}h2{font-size:60px}h3{font:normal 25px Georgia}.lead,.prose{font:17px/1.85 Georgia;color:#bbc0b3}.start-row{display:flex;gap:25px;align-items:center;margin-top:35px}.start-row p{font-size:10px;line-height:1.8;color:var(--muted);margin:0}.solid{padding:16px 23px;border:1px solid var(--gold);background:var(--gold);color:#1b2019;font-size:12px;line-height:1.5}.solid:hover{background:#dec392}.micro{font:10px/1.8 Arial;color:var(--muted);margin-top:17px}.collage{height:535px;position:relative}.main-photo{position:absolute;right:5%;top:0;width:73%;height:480px;transform:rotate(2deg);background:#d7cfbc;padding:9px 9px 30px;margin:0;box-shadow:0 30px 60px #0005}.main-photo img{height:100%;width:100%;object-fit:cover;object-position:50% 35%}.main-photo figcaption{font-size:7px;letter-spacing:1.7px;color:#3c3f34;line-height:29px}.small-photo{position:absolute;left:-5%;bottom:2%;width:51%;transform:rotate(-8deg);padding:8px 8px 20px;background:#e5ddce;margin:0;box-shadow:0 15px 40px #0006}.small-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}.small-photo figcaption{font:italic 15px Georgia;color:#454733;text-align:center;padding-top:8px}.gold-art{position:absolute;right:-2%;top:-24px;width:65%;height:96%;background:url('assets/the-kiss.jpg') center/cover;transform:rotate(6deg);opacity:.6}.folio{position:absolute;right:4%;bottom:-18px;font:22px Georgia;color:var(--gold);text-align:right}.folio small{display:block;font:7px Arial;letter-spacing:2px;margin-top:8px}.cover-footer{position:absolute;bottom:25px;left:6vw;right:6vw;display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:var(--muted);border-top:1px solid var(--line);padding-top:22px}#journey{padding:0 6vw}#nav{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;padding:25px 0 20px}#nav button{background:none;border:0;text-align:left;font-size:10px;color:var(--muted);padding:6px 0;letter-spacing:1px}#nav button.active{color:var(--gold)}#nav button:disabled{opacity:.4}#nav span{margin-right:10px;font-size:9px}.track{height:1px;background:var(--line)}#progress{height:1px;background:var(--gold);transition:width .4s}#journey .scene{padding:30px 0 70px}.chapter{display:flex;justify-content:space-between;align-items:center;margin:5px 0 30px}.chapter .eyebrow{margin:0}.chapter>span{font:italic 30px Georgia;color:#797e6b}.art-layout{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:center}.art-layout>div:first-child{max-width:430px}.instruction{display:flex;gap:20px;margin:35px 0 20px;border-top:1px solid var(--line);padding-top:25px}.instruction>span{font:italic 25px Georgia;color:var(--gold)}.instruction h3{font-size:17px;margin-bottom:10px}.instruction p{font-size:12px;line-height:1.8;color:var(--muted)}.tools{display:flex;gap:25px;flex-wrap:wrap}.line{background:none;border:0;border-bottom:1px solid #8d977066;color:var(--gold);padding:9px 0;font-size:11px;text-align:left;line-height:1.5}.status{font:italic 14px/1.6 Georgia;color:var(--muted);margin-top:21px;min-height:23px}.painting{max-width:440px;width:100%;justify-self:center}.frame{padding:10px;border:8px ridge #99804c;background:#302b1e;box-shadow:0 20px 50px #0004}#puzzle{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;aspect-ratio:540/770}.tile{min-width:0;border:0;padding:0;background-image:url('assets/the-kiss.jpg');background-size:300% 300%;transition:transform .2s}.tile.selected{outline:3px solid #fff0ba;outline-offset:-3px;transform:scale(.93)}.tile.hint{box-shadow:inset 0 0 0 4px #f4e6be}.tile:hover{filter:brightness(1.1)}#puzzle.solved{gap:0}.museum{display:flex;justify-content:space-between;gap:10px;padding:20px 4px;font-size:8px;line-height:1.7;letter-spacing:1px;color:var(--muted)}.museum b{font:italic 19px Georgia;color:var(--ink);display:block;margin-top:5px}.museum>span:last-child{text-align:right}.reward{margin-top:30px;border-top:1px solid var(--gold);padding:23px 0}.reward .eyebrow{margin-bottom:14px;font-size:8px}.reward>p:not(.eyebrow){font:19px/1.6 Georgia}.pair-heading{display:flex;justify-content:space-between;align-items:end;gap:30px}.pair-heading .prose{margin:0}.counter{display:flex;gap:12px;align-items:center;padding-bottom:10px}.counter strong{font:68px Georgia;color:var(--gold)}.counter span{font-size:8px;line-height:2;letter-spacing:1px;color:var(--muted)}.toolbar{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:13px;margin-top:35px}.toolbar>span{font-size:8px;letter-spacing:1.5px;color:var(--muted)}#cards{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;margin-top:20px}.card{padding:0;position:relative;border:1px solid #515a47;background:#262e24;aspect-ratio:4/4.4;overflow:hidden;transition:transform .2s}.card:hover{transform:translateY(-3px)}.card:after{content:attr(data-number);position:absolute;inset:8px;border:1px solid #66744a5c;display:grid;place-items:center;background:radial-gradient(ellipse,#626d4040,transparent 65%);font:italic 27px Georgia;color:#a5af7d}.card img{width:100%;height:100%;object-fit:cover;opacity:0}.card.open:after,.card.matched:after,.card.peek:after{display:none}.card.open img,.card.matched img,.card.peek img{opacity:1}.card.matched{border-color:var(--gold)}.card.matched:before{content:'✓';position:absolute;bottom:6px;right:6px;z-index:1;background:#1a211be0;border-radius:50%;width:20px;height:20px;font:12px/20px Arial;color:var(--gold)}.dates-heading{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:center}.dates-heading>div>p:last-child{font-size:12px;line-height:1.8;color:var(--muted)}.axis{display:flex;justify-content:space-between;border-bottom:1px solid #a38c5c;padding:13px 0;margin:20px 0 25px;font-size:8px;letter-spacing:2px;color:var(--gold)}#date-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.date-card{background:var(--paper);border:0;padding:10px 10px 20px;transform:rotate(-2deg);color:#303329}.date-card:nth-child(2){transform:rotate(2deg)}.date-card img{width:100%;height:410px;object-fit:contain;background:#d7d1c4;display:block}.date-card span{display:block;font-size:10px;letter-spacing:1.5px;margin-top:17px}.date-card.selected{outline:3px solid var(--gold);outline-offset:5px;transform:translateY(-8px)}.date-controls{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:30px}.letter-intro{display:grid;grid-template-columns:1fr .65fr;gap:12vw;align-items:center;padding:15px 0 60px}.letter-intro h2{font-size:74px}.letter-intro figure{margin:0;transform:rotate(3deg)}.letter-intro img{width:100%;height:350px;object-fit:cover;object-position:center 25%;padding:9px;background:var(--paper)}.letter-intro figcaption{font:italic 13px Georgia;color:var(--muted);text-align:center;margin-top:15px}.letter-body{display:grid;grid-template-columns:1fr 3fr;gap:40px;border-top:1px solid var(--line);padding-top:55px;max-width:960px}.letter-body article{max-width:660px}.letter-body p{font:19px/1.9 Georgia;color:#c7cbbf;margin-bottom:28px}.letter-body .first{font-size:24px;line-height:1.65;color:var(--ink)}.letter-body .signature{font-style:italic;color:var(--gold);font-size:34px;margin-top:45px}.song-strip{border-block:1px solid var(--line);display:flex;gap:25px;align-items:center;padding:30px 0;margin:50px 0 65px}.song-strip .eyebrow{margin-bottom:10px}.song-strip h3{margin:0}.song-strip em{font-size:18px}.song-strip button{margin-left:auto}.record{flex-shrink:0;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,#111 0 3px,#b19c6a 4px 16px,transparent 17px),repeating-radial-gradient(circle,#0c0e0c 0 2px,#33382c 3px,#10150f 4px 5px)}.archive-heading{display:flex;justify-content:space-between;align-items:end;gap:25px}.archive-heading .eyebrow{margin-bottom:10px}.archive-heading h3{font-size:32px;margin:0}.archive-heading>p{font:13px Georgia;color:var(--muted)}#archive{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:30px}.archive-photo{border:0;padding:0;background:none;text-align:left}.archive-photo img{width:100%;height:220px;object-fit:cover}.archive-photo span{display:block;font-size:8px;letter-spacing:1px;color:var(--muted);margin:10px 0 20px}.ending{border-top:1px solid var(--line);margin-top:40px;padding-top:30px;display:flex;justify-content:space-between;align-items:center;gap:20px}.ending p{font:italic 20px Georgia;margin:0}footer{padding:25px 6vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:var(--muted)}#music-panel{position:fixed;right:25px;top:85px;width:370px;z-index:30;background:var(--paper);color:#292e25;padding:22px;box-shadow:0 18px 90px #0007;border:1px solid #bda77a}.panel-head{display:flex;justify-content:space-between;align-items:center}.panel-head .eyebrow{color:#796035;margin:0;font-size:8px}.panel-head button{border:0;background:none;font:26px Georgia}.music-panel .prose,#music-panel .prose{color:#4b513f;font-style:italic;margin:17px 0}#load-song{width:100%;text-align:left;background:#242c21;color:var(--paper);font:17px Georgia;border:0;padding:20px}#load-song small{display:block;font:9px/1.6 Arial;color:#b7bdad;margin-top:8px}#player iframe{height:175px;width:100%;border:0;border-radius:8px}#music-panel .micro,#music-panel a,#stop-song{color:#67522d}dialog{background:var(--paper);border:0;color:#2b3027;padding:0;max-width:950px;width:calc(100% - 50px);max-height:90svh;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#080e09d9;backdrop-filter:blur(9px)}.close{position:absolute;top:12px;right:12px;z-index:2;border:0;background:#eae4d6ef;color:#293126;width:37px;height:37px;font:29px Georgia}.memory-layout{display:grid;grid-template-columns:1.2fr 1fr}.memory-image{background:#11180f;display:flex;align-items:center;justify-content:center;padding:16px;min-height:440px}.memory-image img{width:100%;max-height:75svh;object-fit:contain}.memory-copy{padding:60px 35px 35px;align-self:center}.memory-copy .eyebrow{color:#7b6338;margin-bottom:20px}.memory-copy h3{font-size:37px;line-height:1.1;letter-spacing:-1px;margin-bottom:20px}.memory-copy>p:not(.eyebrow){font:17px/1.8 Georgia;color:#5a6151}.memory-copy .solid{margin-top:20px}#art-dialog{width:auto;padding:15px;max-width:90vw}#art-dialog img{max-width:100%;height:75svh;object-fit:contain;display:block}#art-dialog p{margin:12px 0 0;font:9px Arial;letter-spacing:1.5px}#reset-dialog{padding:35px;max-width:480px}.scene{animation:enter .5s ease}@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:950px){h1{font-size:64px}.collage{height:440px}.main-photo{height:385px}.cover{min-height:660px;padding-top:65px}.art-layout{gap:5vw}#date-cards{gap:20px}.date-card img{height:320px}.letter-intro h2{font-size:55px}}
@media(max-width:650px){header{height:78px;padding:0 22px}#home{font-size:30px;gap:12px}#home span{font-size:7px;letter-spacing:1.5px}#music-toggle{gap:9px;font-size:8px}#music-toggle small{font-size:6px}.cover{display:flex;flex-direction:column;align-items:stretch;padding:45px 25px 95px;gap:20px}.eyebrow{font-size:7px;letter-spacing:1.5px}h1{font-size:63px;letter-spacing:-3px;margin-bottom:22px}.lead{font-size:15px;line-height:1.7}.start-row{gap:18px;margin-top:27px}.start-row p{font-size:9px}.solid{font-size:11px;padding:15px 19px}.collage{height:430px;margin-top:20px;max-width:400px;width:100%;align-self:center}.main-photo{width:74%;height:355px}.small-photo{width:54%;left:0;bottom:6%}.folio{bottom:-2px;font-size:18px}.folio small{font-size:6px}.cover-footer{left:25px;right:25px;font-size:6px;letter-spacing:1.4px}.cover-footer span:last-child{display:none}#journey{padding:0 22px}#nav{gap:7px;padding:20px 0 18px}#nav button{font-size:8px;letter-spacing:0;line-height:1.5}#nav span{display:block;font-size:8px;margin:0 0 5px}.chapter{margin-bottom:25px}.chapter>span{font-size:25px}#journey .scene{padding:23px 0 45px}.art-layout{display:flex;flex-direction:column;gap:30px;align-items:stretch}.art-layout>div:first-child{max-width:none}h2{font-size:46px;letter-spacing:-2px;margin-bottom:20px}.prose{font-size:16px}.instruction{margin-top:25px}.painting{max-width:360px;align-self:center}.frame{border-width:6px;padding:7px}.tools{gap:23px}.line{font-size:10px}.pair-heading{gap:10px;align-items:center}.pair-heading h2{font-size:37px;letter-spacing:-1.8px}.pair-heading .prose{font-size:13px}.counter{gap:5px}.counter strong{font-size:38px}.counter span{font-size:6px;letter-spacing:.4px}#cards{grid-template-columns:repeat(4,1fr);gap:8px}.card{aspect-ratio:3/4}.card:after{inset:5px;font-size:20px}.toolbar{margin-top:25px;gap:15px}.toolbar>span{font-size:6px;letter-spacing:1px}.dates-heading{display:block}.axis{margin-top:10px}#date-cards{gap:9px}.date-card{padding:5px 5px 11px}.date-card img{height:220px}.date-card span{font-size:7px;letter-spacing:.5px;margin-top:10px}.date-controls{align-items:start;gap:15px}.date-controls .status{margin:0;font-size:12px}.date-controls .solid{flex-shrink:0;font-size:10px;padding:13px}.letter-intro{gap:25px;grid-template-columns:1fr .7fr;padding-bottom:35px}.letter-intro h2{font-size:40px;letter-spacing:-2px}.letter-intro .prose{font-size:14px}.letter-intro img{height:215px;padding:6px}.letter-intro figcaption{font-size:10px;line-height:1.5}.letter-body{display:block;padding-top:30px}.letter-body>.eyebrow{display:block;margin-bottom:25px}.letter-body p{font-size:17px;line-height:1.85}.letter-body .first{font-size:21px}.letter-body .signature{font-size:29px}.song-strip{gap:15px;flex-wrap:wrap;margin:35px 0 40px;padding:23px 0}.record{width:48px;height:48px}.song-strip h3{font-size:20px}.song-strip em{display:block;margin-top:5px;font-size:14px}.song-strip button{margin-left:0}.archive-heading{display:block}.archive-heading h3{font-size:29px}.archive-heading>p{margin:15px 0 0;font-size:12px}#archive{grid-template-columns:repeat(2,1fr);gap:13px}.archive-photo img{height:220px}.archive-photo span{font-size:7px}.ending{display:block}.ending p{font-size:18px;margin-bottom:20px}footer{padding:23px;font-size:7px}#music-panel{top:74px;right:12px;width:calc(100% - 24px);max-width:370px;padding:20px}dialog{width:calc(100% - 26px);max-height:91svh}.memory-layout{display:block}.memory-image{min-height:0;padding:10px}.memory-image img{height:42svh;max-height:none}.memory-copy{padding:23px}.memory-copy .eyebrow{margin-bottom:10px}.memory-copy h3{font-size:28px;margin-bottom:13px}.memory-copy>p:not(.eyebrow){font-size:15px;line-height:1.6}.memory-copy .solid{margin-top:5px}#art-dialog img{height:70svh}.reward>p:not(.eyebrow){font-size:17px}}
@media(max-width:370px){h1{font-size:55px}.collage{height:380px}.main-photo{height:320px}.pair-heading h2{font-size:33px}.date-card img{height:185px}.letter-intro{grid-template-columns:1fr}.letter-intro figure{max-width:230px;justify-self:end}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}