/* Figma update: extend the memoir while retaining the original motion layers. */
@font-face{font-family:'Instrument Serif';src:url('assets/fonts/instrument-serif-italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
.design-quote{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:142.657px;line-height:.98;font-weight:400}
.school,.gratitude{flex-basis:3880px}
.photo-strip{top:193px}
.school-lead,.school-copy{top:620.676px}
.crop-top{object-position:50% 0%}
.photo-fill{object-fit:fill;object-position:bottom}
.university header,.covenant header,.career header,.marriage header,.forty header{top:193px;width:587px}
.university-layout{position:absolute;left:172px;right:0;top:462px;height:558px;display:flex;justify-content:space-between;align-items:center}
.university .prose,.covenant .prose,.career .prose{width:390.914px;line-height:1.2}
.university-intro{height:100%;display:flex;flex-direction:column;justify-content:space-between}
.university-quote{width:500px;flex:none;margin-top:-126px}
.university-discovery{flex:none}
.memories{flex-basis:3271px}
.memory-window{position:absolute;left:471.352px;top:193px;width:528.297px;height:825.351px;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 88%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 88%,transparent)}
.memory-column{display:flex;flex-direction:column;gap:58px;will-change:transform}
.memory-photo{display:block;width:528.297px;height:383.676px;flex:none;object-fit:cover}
.covenant{flex-basis:2153px}
.covenant-layout{position:absolute;left:172px;top:414px;right:0;height:558px;display:flex;gap:10px}
.covenant-opening{width:528.297px;flex:none;display:flex;flex-direction:column;justify-content:space-between}
.covenant-opening .photo{width:528.297px;height:383.676px}
.covenant-columns{flex:1;display:flex;justify-content:flex-end;align-items:flex-start;gap:59px;padding:174px 217px 0 0}
.covenant-columns .prose{flex:none}
.covenant-columns p+p,.career-reflection p+p,.marriage-first p+p,.forty-copy p+p{margin-top:28.8px}
.career{flex-basis:4846.609px}
.career-layout{position:absolute;left:168px;top:414px;height:558px;display:flex;align-items:center;gap:246px}
.career-opening{height:100%;display:flex;flex-direction:column;justify-content:space-between;flex:none}
.career-photos{display:flex;gap:47px;flex:none}
.career-photos .photo{width:528.297px;height:383.676px;flex:none}
.career-reflection{flex:none}
.meeting{flex-basis:2153px}
.meeting-quote{position:absolute;left:642.5px;top:595.5px;white-space:nowrap}
.wedding{flex-basis:3351px;display:flex}
.wedding .photo{width:1117px;height:1117px;flex:none}
.marriage{flex-basis:2153px}
.marriage .prose{position:absolute;width:541.532px;line-height:1.2}
.marriage-first{left:172px;top:462px}
.marriage-distance{left:947.234px;top:722px}
.marriage-distance p+p{margin-top:29px}
.marriage-proposal{left:1611.468px;top:912px}
.forty header{width:508px}
.forty-photo{position:absolute;left:172px;top:414px;width:544.761px;height:386.924px}
.forty-copy{position:absolute;left:744.734px;top:840.924px;width:541.532px;line-height:1.2}
.portrait-art{position:absolute;left:170.625px;top:0;width:1406.75px;height:1156.31px}
.portrait-photo{position:absolute;left:.03%;top:.05%;width:99.94%;height:99.93%;max-width:none}
.portrait-drawing{position:absolute;left:86.7px;top:16.66px;max-width:none}
.signature{flex-basis:var(--panel)}



/* Footer is commented out in index.html; reclaim its space until restored. */
body:not(:has(footer)) #viewport{bottom:0}
.portrait-brush{position:absolute;left:86.7px;top:16.66px;width:1220.86px;height:1139.65px;pointer-events:none}
.portrait-art.brush-ready .portrait-drawing{visibility:hidden}
.portrait-art{outline-offset:-4px;user-select:none}
.portrait-art:focus-visible{outline:2px solid #f05a24}
.word-motion-word{display:inline-block;will-change:transform,opacity}
.mobile-notice{position:fixed;inset:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;padding:48px 24px 64px;border:0;background:#fff;color:#080808;overflow:auto;overscroll-behavior:contain}
.mobile-notice::backdrop{background:#fff}
body:has(.mobile-notice[open]){overflow:hidden}
.mobile-notice-inner{min-height:100%;max-width:420px;margin:auto;display:flex;flex-direction:column;align-items:center;text-align:center}
.mobile-portrait{position:relative;width:100%;aspect-ratio:1.12;margin-bottom:28px;flex:none}
.mobile-portrait-logo{position:absolute;left:14%;top:0;width:77%;height:auto}
.mobile-portrait-model{position:absolute;left:23%;bottom:0;width:54%;height:62%;display:block}
.mobile-portrait-shadow{position:absolute;left:28%;bottom:1%;width:44%;height:3%;border-radius:50%;background:#000;opacity:.12;filter:blur(5px)}
.mobile-notice h2{font:italic clamp(42px,12vw,58px)/.98 'Instrument Serif',Georgia,serif;letter-spacing:-.02em;margin-bottom:24px}
.mobile-notice-inner>p:not(.mobile-notice-brand){font-size:16px;line-height:1.5;max-width:32ch;color:#555}
.mobile-notice-book{display:flex;align-items:center;justify-content:center;width:100%;min-height:60px;margin-top:40px;padding:16px 12px;background:#080808;color:#fff;text-decoration:none;text-transform:uppercase;text-align:center;font:clamp(12px,3.6vw,16px)/1.4 monospace}
.mobile-notice-book:focus-visible{outline:2px solid #f05a24;outline-offset:4px}
.mobile-links{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;margin-top:28px;font:16px/1.4 monospace;text-transform:uppercase}
.mobile-links a,.mobile-links span{display:flex;align-items:center;justify-content:center;min-height:44px;color:#080808;text-decoration:none}
.mobile-links a:hover{text-decoration:underline;text-underline-offset:5px}
.music-toggle{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:8;display:flex;align-items:center;gap:11px;min-height:44px;padding:0 16px;border:1px solid rgba(128,128,128,.22);border-radius:24px;background:rgba(255,255,255,.92);color:#111;backdrop-filter:blur(12px);font:11px monospace;letter-spacing:.02em;transition:background .2s}
.music-toggle[hidden]{display:none}
.music-toggle:hover{background:#fff}
.music-bars{height:16px;display:flex;align-items:center;gap:3px}
.music-bars i{display:block;width:2px;height:4px;background:#f05a24;border-radius:2px}
.music-toggle[data-playing="true"] .music-bars i{animation:music-level .9s ease-in-out infinite alternate}
.music-bars i:nth-child(2){animation-delay:-.3s!important}
.music-bars i:nth-child(3){animation-delay:-.6s!important}
.music-bars i:nth-child(4){animation-delay:-.15s!important}
.music-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes music-level{from{height:4px}to{height:16px}}
@media(prefers-reduced-motion:reduce){.music-toggle[data-playing="true"] .music-bars i{animation:none;height:12px}.music-toggle{transition:none}}
@media(max-width:600px){.music-toggle{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}}
@media(max-height:550px){.mobile-notice{padding-top:24px}.mobile-portrait{max-width:300px}.mobile-notice h2{font-size:42px}}
footer{gap:24px}
#chapters{min-width:0;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
#chapters::-webkit-scrollbar{display:none}
#chapters button{flex:none}
#restart{flex:none}
@media(max-width:900px){footer{gap:14px}#hint{display:none}#chapters{gap:18px}}
@media(max-width:600px){
 footer{gap:10px}#chapters{gap:18px}#restart{min-width:36px}
 .university header,.covenant header,.career header,.marriage header,.forty header{left:60px;top:140px}
 .university .prose,.covenant .prose,.career .prose,.marriage .prose{font-size:30px;line-height:1.25}
 .university-layout{left:60px;right:60px;top:425px;height:625px;gap:90px}
 .university{flex-basis:1900px}
 .memory-window,.memory-photo{width:min(528.297px,calc(var(--panel) - 120px))}
 .university-discovery{width:460px!important}
 .covenant{flex-basis:2400px}
 .covenant-layout{left:60px}
 .covenant-columns{padding:140px 100px 0 100px;gap:70px}
 .covenant-columns .prose{width:500px}
 .career-layout{top:390px;height:660px}
 .career-reflection{width:440px!important}
 .marriage{flex-basis:2300px}
 .marriage-first{left:60px;top:420px}
 .marriage-distance{left:840px;top:610px}
 .marriage-proposal{left:1600px;top:820px}
 .forty{flex-basis:var(--panel)}
 .forty-photo{left:60px;top:350px;width:500px;height:355.135px}
 .forty-copy{left:60px;top:745px;width:calc(var(--panel) - 120px);font-size:28px;line-height:1.2}
 .forty-copy p+p{margin-top:24px}
}

.ending-logo{position:absolute;left:calc(50% - 337.738px);top:116.21px;width:675.476px;height:491.334px;visibility:hidden;transform-origin:50% 65%}
.ending-logo img,.ending-logo svg{display:block;width:100%;height:100%}
.ending-links{position:absolute;left:24px;right:44px;top:998px;display:flex;justify-content:space-between;align-items:center;gap:24px;font:500 16px/1 monospace;letter-spacing:.48px;text-transform:uppercase}
.ending-links>*{visibility:hidden;white-space:nowrap}
.ending-links a{color:inherit;text-decoration:none;padding:14px 0;text-underline-offset:5px}
.ending-links a:hover{text-decoration:underline}
.ending-links a:focus-visible{outline:2px solid #f05a24;outline-offset:6px}
.ending-links span{color:#666}
@media(max-width:700px){.ending-links{flex-wrap:wrap;gap:24px;right:24px}.ending-logo{width:calc(var(--panel) - 80px);height:auto;left:40px;top:160px}}