/* Real photographed materials. All copy and image slots remain live HTML. */
:root{--material-paper:url('assets/paper-torn-v4.webp');--material-frame:url('assets/polaroid-v4.webp');--material-album:url('assets/album-clean-v4.webp');--material-envelope:url('assets/envelope-v4.webp')}
.paper{background:none;isolation:isolate;filter:drop-shadow(1px 4px 3px rgb(0 0 0 / 17%))}
.paper::before{content:'';position:absolute;inset:-10px;z-index:-1;pointer-events:none;background-color:var(--paper-tint,#fff);background-image:var(--material-paper);background-repeat:no-repeat;background-size:100% 100%;background-blend-mode:multiply;mask-image:var(--material-paper);mask-repeat:no-repeat;mask-size:100% 100%}
.bio-paper{--paper-tint:#bbcee9;padding:48px 42px 125px;background:none}
.id-card{--paper-tint:#faf9f3;background:none;padding:30px 27px}
.ticket-memory{--paper-tint:#d4e0bd;background:none}
.education-memory{--paper-tint:#fff;background:none}
.travel-memory{--paper-tint:#f1d1dc;background:none}
.proof-note{--paper-tint:#fff;background:none}
.work-label{--paper-tint:#f1d1dc;background:none;padding:18px 23px}
.education{position:relative;--paper-tint:#bbcee9;background:none;padding:32px}
.brand-initial{position:relative;isolation:isolate;background:none}
.brand-initial::before{content:'';position:absolute;inset:0;background-image:var(--material-paper);background-size:100% 100%;background-repeat:no-repeat;z-index:-1}
.scrapbook{padding:62px 60px 56px;background-color:transparent;background-image:var(--material-album);background-repeat:no-repeat;background-size:100% 100%;border-radius:0;filter:drop-shadow(0 10px 12px rgb(0 0 0 / 22%));gap:45px}
.scrapbook:after{display:none}
.scrapbook-left{min-height:590px}
.bio-paper h2{font-size:clamp(42px,4.5vw,65px)}
.binder{border:0;border-radius:0;background:none;width:80px;height:100px;top:-65px;left:58%;z-index:6;transform:rotate(-8deg);background-image:url('assets/clip-v4.webp');background-repeat:no-repeat;background-size:contain;background-position:center}
.binder:after{display:none}
.polaroid{background:none;padding:0;aspect-ratio:3/4;isolation:isolate;filter:drop-shadow(1px 7px 5px rgb(0 0 0 / 20%))}
.polaroid::before{content:'';position:absolute;inset:0;background-image:var(--material-frame);background-size:100% 100%;background-repeat:no-repeat;z-index:2;pointer-events:none}
.polaroid>.photo-slot{position:absolute;left:12.7%;top:12.4%;width:77%;height:63.9%;z-index:1;background-image:none}
.polaroid figcaption{position:absolute;top:80%;left:12%;width:77%;z-index:3;padding:0;font-size:20px;line-height:1.15;text-align:center}
.memory-photo{width:235px;top:275px;left:-20px}
.memory-photo figcaption{font-size:18px}
.ticket-memory{top:275px;right:-5px;padding:23px}
.education-memory{top:475px;right:0;padding:25px}
.travel-memory{bottom:-30px;left:6px}
.personal-photo{max-width:420px;width:95%;transform:rotate(-7deg)}
.personal-photo figcaption{font-size:24px}
.contact-collage{width:430px;height:405px;max-width:100%;transform:none}
.contact-envelope{position:absolute;top:95px;left:0;width:95%;height:73%;background:none;clip-path:none;filter:drop-shadow(2px 7px 5px rgb(0 0 0 / 18%));transform:rotate(-12deg);background-image:var(--material-envelope);background-repeat:no-repeat;background-size:100% 100%}
.contact-envelope.paper::before,.contact-envelope:after{display:none}
.contact-collage .polaroid{width:235px;left:145px;top:0;transform:rotate(8deg)}
.contact-collage .tape{display:none}
.contact-collage .polaroid figcaption{font-size:22px}
dialog{background-color:transparent;background-image:var(--material-paper);background-size:100% 100%;background-repeat:no-repeat;padding:50px;color:var(--ink)}
@media(max-width:1000px){.scrapbook{padding:47px 37px 48px;gap:30px}.scrapbook-left{min-height:650px}.bio-paper{padding:35px 27px 130px}.bio-paper h2{font-size:43px}.id-card{padding:25px 20px}.id-card .label{margin-bottom:14px}.id-body{grid-template-columns:65px 1fr;gap:12px}.id-body p{font-size:11px}.id-signature{font-size:17px}.memory-photo{width:180px;top:275px;left:-10px}.memory-photo figcaption{font-size:16px}.ticket-memory{width:140px;top:320px;right:-2px;padding:18px}.education-memory{width:170px;top:500px;padding:22px}.travel-memory{bottom:-20px;left:-5px;padding:17px}.binder{width:65px;height:85px;top:-55px}.personal-photo figcaption{font-size:20px}.contact-collage{width:330px;height:350px}.contact-collage .polaroid{width:205px;left:95px}.contact-collage .polaroid figcaption{font-size:18px}.contact-envelope{top:105px}}
@media(max-width:700px){.scrapbook{padding:28px 22px 30px;gap:40px;background-image:var(--material-paper);filter:drop-shadow(0 7px 5px rgb(0 0 0 / 20%))}.scrapbook-left{height:540px;min-height:540px}.id-card{top:12px;left:0;width:94%;padding:22px 18px}.id-card .label{font-size:10px}.id-body{grid-template-columns:72px 1fr;gap:12px}.id-body h3{font-size:30px}.id-body p{font-size:10px}.id-photo{height:115px}.binder{width:60px;height:74px;top:-28px;left:61%}.memory-photo{width:170px;top:235px;left:-5px}.memory-photo figcaption{font-size:15px;top:79.5%}.ticket-memory{top:280px;right:-5px;width:130px;padding:18px}.ticket-memory strong{font-size:42px}.education-memory{top:430px;right:-5px;width:153px;padding:18px}.education-memory p{font-size:26px}.travel-memory{bottom:0;left:0;width:155px;padding:16px}.travel-memory p{font-size:25px}.travel-memory span{font-size:10px}.bio-paper{padding:33px 24px 115px}.bio-paper h2{font-size:44px}.bio-paper p{font-size:15px}.proof-note{bottom:-30px;right:0}.personal-photo{width:88%;max-width:320px}.personal-photo figcaption{font-size:20px}.education{padding:27px;margin-top:35px}.work-label{padding:14px 18px}.contact-collage{width:330px;height:345px;margin-top:15px;left:0;margin-bottom:0;transform:none}.contact-collage .polaroid{width:195px;left:110px;top:0}.contact-envelope{top:85px;left:0;width:95%;height:73%}.contact-collage .polaroid figcaption{font-size:18px}dialog{padding:45px 32px}.paper::before{inset:-7px}}
@media(max-width:370px){.scrapbook{padding:26px 18px;gap:35px}.scrapbook-left{height:550px;min-height:550px}.id-card{width:96%;padding:20px 15px}.id-body{grid-template-columns:60px 1fr;gap:10px}.id-body h3{font-size:27px}.id-body p{font-size:9px}.id-signature{font-size:16px}.memory-photo{width:145px;top:245px}.memory-photo figcaption{font-size:13px}.ticket-memory{width:107px;top:290px;padding:15px}.ticket-memory strong{font-size:36px}.education-memory{width:137px;top:430px;padding:18px}.travel-memory{width:130px;padding:14px}.travel-memory p{font-size:22px}.bio-paper{padding:30px 20px 110px}.bio-paper h2{font-size:37px}.contact-collage{width:280px;height:300px}.contact-collage .polaroid{width:175px;left:90px}.personal-photo figcaption{font-size:18px}}

/* Nine-slice paper edges preserve the fibers on both long notes and tall sheets. */
.paper::before{background:none;mask-image:none;border:0 solid transparent;border-image-source:var(--material-paper);border-image-slice:120 fill;border-image-width:18px;border-image-outset:0;border-image-repeat:stretch;filter:var(--paper-filter,none)}
.bio-paper,.education{--paper-filter:sepia(.5) saturate(1.25) hue-rotate(164deg)}
.ticket-memory{--paper-filter:sepia(.45) saturate(1.15) hue-rotate(39deg)}
.travel-memory,.work-label{--paper-filter:sepia(.55) saturate(1.2) hue-rotate(300deg)}
@media(max-width:1000px){.proof-note{right:15px}.scrapbook{padding-top:52px}}
@media(max-width:700px){.proof-note{right:5px}.scrapbook{padding-top:28px}.paper::before{border-image-width:15px}}