:root{--paper:#f5f0e7;--ink:#292a27;--muted:#716d64;--line:#d6cfc1;--red:#ab3e30;--olive:#52684f;--accent:var(--red);font-family:"Segoe UI","Microsoft YaHei",sans-serif;color-scheme:light;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{cursor:pointer}img{max-width:100%;display:block}figure,p,h1,h2,h3{margin:0}.wrap{width:min(1280px,calc(100% - 96px));margin-inline:auto}.skip{position:absolute;left:20px;top:-90px;background:var(--ink);color:white;padding:12px;z-index:30}.skip:focus{top:10px}.handwritten{font-family:"STKaiti","KaiTi","楷体",serif;font-weight:400}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;color:var(--muted)}.topbar{height:108px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;gap:12px;font-size:15px;letter-spacing:1px;font-weight:650}.wordmark small{display:block;font-size:8px;letter-spacing:2.2px;margin-top:5px;color:var(--muted);font-weight:500}.cat-mark{font-family:"KaiTi",serif;display:grid;place-items:center;width:40px;height:40px;border:1.5px solid var(--ink);border-radius:50% 50% 46% 46%;font-size:25px;transform:rotate(-9deg)}.topbar nav{display:flex;align-items:center;gap:32px;font-size:12px}.topbar nav a:hover{color:var(--accent)}sup{font-size:8px;margin-left:3px}.topbar .home-link{padding:10px 15px;border:1px solid var(--line);border-radius:40px}.home-link span{padding-left:14px}
.hero{min-height:735px;position:relative;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:5%;padding-block:70px 100px}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:9px;vertical-align:1px}.hero h1{font-size:clamp(55px,6.1vw,87px);line-height:1.22;letter-spacing:-4px;font-weight:750;margin-top:29px}.circled{display:inline-block;position:relative;isolation:isolate;white-space:nowrap}.circled:after{content:"";position:absolute;inset:9% -4% 0;border:2px solid var(--accent);border-radius:50%;transform:rotate(-5deg);z-index:-1}.question{color:var(--accent)}.intro{font-size:14px;line-height:1.9;color:#625e57;margin-top:30px}.side-switch{display:inline-flex;margin-top:29px;gap:4px;padding:4px;background:#e9e2d6;border:1px solid #d7cebf;border-radius:8px}.side-switch button{border:0;background:transparent;color:#655e55;border-radius:5px;padding:11px 16px;font-size:12px;transition:background .2s,color .2s}.side-switch button[aria-pressed=true]{background:var(--ink);color:var(--paper);box-shadow:0 2px 5px #39322620}.side-note{font-size:11px;color:var(--accent);line-height:1.8;margin-top:13px;min-height:20px}.text-link{display:inline-flex;gap:40px;align-items:center;font-size:11px;font-weight:650;border-bottom:1px solid var(--ink);padding:0 0 7px;margin-top:27px}.text-link span{font-size:20px}.hero-art{position:relative;padding:30px 0 100px 30px;isolation:isolate}.hero-art:before{content:"";position:absolute;width:87%;aspect-ratio:1;border-radius:50%;background:#dfddcf;left:0;top:24px;z-index:-1;opacity:.6}.hero-margin{display:block;text-align:right;margin:0 20px 21px 0;font-size:21px;transform:rotate(5deg);color:var(--muted)}.hero-photo{padding:13px 13px 17px;background:#fffcf5;box-shadow:0 14px 34px #4740331b;transform:rotate(5deg);width:89%;position:relative}.hero-photo>img{width:100%;height:clamp(240px,25vw,345px);object-fit:cover}.hero-photo figcaption{display:flex;justify-content:space-between;gap:10px;margin-top:15px;font-size:9px;color:#71675c;letter-spacing:.5px}.hero-photo figcaption>span:first-child{font-weight:700}.tape{position:absolute;z-index:2;left:40%;top:-14px;width:86px;height:30px;background:#d3bf9194;transform:rotate(-9deg);clip-path:polygon(2% 0,99% 3%,96% 100%,0 93%)}.small-photo{position:absolute;width:44%;left:-18px;bottom:30px;padding:9px 9px 12px;background:#fffcf5;transform:rotate(-10deg);box-shadow:0 8px 23px #47403321}.small-photo img{width:100%;height:auto}.small-photo figcaption{font-size:16px;text-align:center;margin-top:11px;color:#625c51}.photo-stamp{position:absolute;right:-5px;bottom:50px;display:grid;place-content:center;text-align:center;color:var(--accent);border:2px solid var(--accent);width:111px;height:111px;border-radius:50%;font-family:"KaiTi",serif;font-size:26px;transform:rotate(12deg)}.photo-stamp small{font:9px "Microsoft YaHei",sans-serif;letter-spacing:3px;margin-top:7px}.hero-bottom{position:absolute;bottom:21px;left:0;right:0;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:15px;font-size:9px;letter-spacing:1.5px;color:var(--muted)}
.identity-section{padding:95px 0;background:#ece6db;border-block:1px solid var(--line);background-image:linear-gradient(#d6cfc138 1px,transparent 1px),linear-gradient(90deg,#d6cfc138 1px,transparent 1px);background-size:30px 30px}.identity-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:12%;align-items:center}.section-heading h2{font-size:62px;letter-spacing:-2px;line-height:1.16;margin:20px 0}.section-heading h2 .handwritten{font-size:67px;color:var(--red)}.section-heading>p:last-child{font-size:12px;color:var(--muted);line-height:1.9}.name-records{position:relative;display:grid;gap:15px;padding:12px 0;min-width:0}
.name-record{position:relative;min-width:0;background:#fffcf6;border:1px solid #ddd3c1;box-shadow:0 7px 15px #453d2f08;padding:20px;transform:rotate(-2deg)}
.name-record.alternative{transform:rotate(2deg);margin-left:24px}
.record-heading{display:flex;gap:16px;align-items:center}
.record-index{font-size:12px;border:1px solid var(--line);width:29px;height:29px;border-radius:50%;display:grid;place-items:center;flex:none;align-self:flex-start}
.name-record small{font-size:9px;color:var(--muted);letter-spacing:1.5px}
.name-record h3{font-size:clamp(24px,2.7vw,36px);font-weight:650;letter-spacing:-1px;margin-top:8px;white-space:nowrap}
.red-underline,.green-underline{position:relative;color:var(--red)}.green-underline{color:var(--olive)}.red-underline:after,.green-underline:after{content:"";position:absolute;left:0;right:-2px;bottom:-6px;border-bottom:2px solid currentColor;transform:rotate(-4deg)}
.profile-shot{position:relative;display:block;aspect-ratio:3/1;overflow:hidden;border:1px solid #e6dfd3;margin-top:22px;background:#fff;cursor:zoom-in}
.profile-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;transition:filter .2s}
.profile-shot-bad img{object-position:center 72%}
.profile-shot:hover img{filter:brightness(1.06)}
.record-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.record-footer>a{font-size:9px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:3px}
.record-comment{font-size:18px;color:var(--red);transform:rotate(-4deg)}.alternative .record-comment{color:var(--olive)}
.name-arrow{justify-self:center;font-size:18px;color:#7b715f;transform:rotate(-6deg)}

.observations{padding-block:100px}.section-row{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:40px}.section-row h2{font-size:35px;font-weight:650;letter-spacing:-1px;margin-top:16px;line-height:1.4}.side-annotation{font-size:24px;color:var(--muted);transform:rotate(5deg);white-space:nowrap} .story-jumps{display:flex;gap:9px;flex:none;font-size:10px}.story-jumps a{padding:10px 15px;border:1px solid var(--line);border-radius:30px}.story-jumps a:first-child{color:var(--red)}.story-jumps a:last-child{color:var(--olive)}.story-jumps a:hover{background:#e9e2d6}
.observation-chapter{display:grid;grid-template-columns:.75fr 1.25fr;gap:6%;align-items:start;padding-block:38px 54px;border-top:1px solid var(--line);--story-accent:var(--red);scroll-margin-top:24px}
.observation-chapter.story-good{--story-accent:var(--olive);padding-top:55px;padding-bottom:0}
.story-copy{position:sticky;top:45px;min-width:0;padding-top:20px}.story-label{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:10px;line-height:1.8}.story-label>span{display:grid;place-items:center;border:1px solid currentColor;width:29px;height:29px;border-radius:50%;color:var(--story-accent);flex:none}
.story-copy h3{font-size:clamp(24px,2.8vw,40px);line-height:1.65;font-weight:650;letter-spacing:-1px;margin-top:23px;white-space:nowrap}.story-lead{display:block;font-size:clamp(13px,1.3vw,17px);font-weight:400;color:var(--muted);letter-spacing:.5px;margin-bottom:10px}.story-copy em{color:var(--story-accent);font-style:normal;border-bottom:2px solid currentColor;padding-bottom:5px}
.story-margin{color:var(--story-accent);font-size:21px;line-height:1.7;margin-top:24px;transform:rotate(-3deg);transform-origin:left center}.story-count{display:block;color:var(--muted);font-size:9px;letter-spacing:1px;margin-top:32px}
.story-gallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;padding:18px;background:#ece2d9;border:1px solid #ded3c7;border-radius:3px;min-width:0}.story-good .story-gallery{background:#e3e8dd;border-color:#d2d9ca}
.story-photo{display:block;grid-column:span 2;min-width:0;background:#fffcf5;padding:9px;box-shadow:0 4px 9px #453d2f0a;transition:transform .2s,box-shadow .2s;cursor:zoom-in}.story-photo:nth-child(-n+2){grid-column:span 3}.story-photo:nth-child(3n+1){transform:rotate(-1deg)}.story-photo:nth-child(3n+2){transform:rotate(1deg)}.story-photo:hover{transform:translateY(-4px);box-shadow:0 8px 18px #453d2f20}.story-image{aspect-ratio:4/3;overflow:hidden;background:#e5e0d7}.story-image img{width:100%;height:100%;object-fit:cover}.story-photo[data-photo="bite-02"] img{object-position:50% 40%}.story-photo[data-photo="together-02"] img{object-position:50% 83%}.story-photo[data-photo="sleep-01"] img{object-position:50% 65%}.story-photo figcaption{display:flex;justify-content:space-between;gap:6px;align-items:baseline;padding:12px 2px 4px;font-family:"STKaiti","KaiTi","楷体",serif;font-size:15px;line-height:1.45}.story-photo figcaption>span:last-child{font:12px "Segoe UI",sans-serif;color:#8a7f6e;flex:none}
.expressions-section{padding-block:90px 80px;background:#eae6de;border-block:1px solid var(--line)}.section-description{font-size:12px;color:var(--muted);line-height:1.8;margin-top:15px}.gallery-count{font-size:10px;display:flex;gap:12px;align-items:center;color:var(--muted);white-space:nowrap}.gallery-count b{font-size:41px;font-weight:450;color:#777163;line-height:1}.expression-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.expression-card{position:relative;display:block;min-width:0;padding:13px;background:#fffcf7;box-shadow:0 4px 12px #3b34240c;transition:transform .25s,box-shadow .25s}.expression-card:nth-child(4n+1){transform:rotate(-1.7deg)}.expression-card:nth-child(4n+3){transform:rotate(1.7deg)}.expression-card:hover{transform:translateY(-5px) rotate(0);box-shadow:0 12px 28px #3b34241b}.card-number{font-size:8px;letter-spacing:2px;color:#8e877b;display:block;margin:0 0 10px}.expression-image{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#eee9df;overflow:hidden}.expression-image img{width:100%;height:100%;object-fit:contain}.expression-caption{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:16px 2px 5px;font-family:"KaiTi",serif;font-size:20px}.expression-caption>span{font:17px "Segoe UI",sans-serif;color:#8a7f6e}.gallery-footnote{display:flex;gap:10px;align-items:center;margin-top:34px;font-size:11px;color:var(--muted)}.gallery-footnote>span{font-size:22px;font-weight:300}
.love-section{padding-block:110px;background:#eeded2}.love-layout{display:grid;grid-template-columns:1fr 1.05fr;gap:13%;align-items:center}.love-photo{position:relative;background:#fffaf2;padding:14px 14px 20px;max-width:420px;transform:rotate(-4deg);box-shadow:0 14px 30px #78584418;margin-left:30px}.love-photo img{width:100%;height:auto}.love-photo figcaption{text-align:center;font-size:24px;color:#7b5144;margin-top:19px}.love-copy>.eyebrow{color:#826d5e}.love-preface{font-size:14px;line-height:2.05;color:#776051;margin-top:30px}.love-copy h2{font-size:clamp(43px,5.3vw,72px);line-height:1.4;font-weight:650;letter-spacing:-2px;margin-top:24px}.love-copy h2>span{color:var(--red)}.love-signature{display:block;font-size:24px;color:#876c59;margin-top:23px;transform:rotate(-4deg);padding-left:47%}.footer{display:flex;justify-content:space-between;gap:20px;padding-block:30px;font-size:10px;letter-spacing:.5px;color:var(--muted)}.footer a:hover{color:var(--red)}
#photo-dialog{width:fit-content;max-width:calc(100vw - 40px);max-height:92dvh;border:0;border-radius:8px;background:var(--paper);color:var(--ink);padding:18px;box-shadow:0 20px 100px #0005}#photo-dialog::backdrop{background:#171716de;backdrop-filter:blur(7px)}.lightbox-top,.lightbox-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;font-size:12px}.lightbox-top{margin-bottom:14px}.lightbox-top button{width:35px;height:35px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:24px;line-height:1}.lightbox-top p{font-family:"KaiTi",serif;font-size:21px}.lightbox-bottom{margin-top:18px;font-size:10px}.lightbox-bottom>span{color:var(--muted);letter-spacing:1px}.lightbox-bottom a{border-bottom:1px solid var(--ink);padding-bottom:3px}#lightbox-image{max-width:min(700px,calc(100vw - 76px));max-height:69dvh;object-fit:contain;width:auto;height:auto;margin:auto}html[data-side=good]{--accent:var(--olive)}html[data-side=good] .photo-stamp{font-size:21px}html[data-side=good] .hero-art:before{background:#d4ddcc}
@media(min-width:1500px){.hero{min-height:790px}.hero h1{font-size:94px}.hero-art{padding-top:42px}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.topbar nav{gap:19px}.hero{gap:3%;min-height:690px}.hero h1{font-size:65px;letter-spacing:-3px}.hero-art{padding-left:15px}.hero-photo{width:98%}.hero-photo>img{height:280px}.photo-stamp{width:92px;height:92px;right:-8px;font-size:23px}.hero-margin{font-size:17px}.small-photo{width:49%;left:-8px;bottom:36px}.identity-layout{gap:8%;grid-template-columns:.7fr 1.3fr}.name-record{padding:18px}.name-record h3{font-size:30px}.observation-chapter{gap:4%;grid-template-columns:.85fr 1.15fr}.story-gallery{gap:10px;padding:12px}.story-photo{padding:7px}.story-photo figcaption{font-size:13px}.expression-grid{gap:18px}.expression-caption{font-size:17px}.love-layout{gap:8%}.love-photo{margin-left:0}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.topbar{height:82px}.wordmark{font-size:13px;gap:9px}.cat-mark{width:32px;height:32px;font-size:21px}.wordmark small{font-size:7px;letter-spacing:1.5px}.topbar nav>a:not(.home-link){display:none}.topbar .home-link{font-size:10px;padding:9px 12px}.home-link span{padding-left:4px}.hero{grid-template-columns:1fr;gap:20px;padding-block:45px 80px;min-height:0}.hero h1{font-size:clamp(46px,10vw,76px);margin-top:24px}.intro{font-size:13px;margin-top:24px}.side-switch{margin-top:23px}.side-switch button{font-size:12px;padding:11px 15px}.side-note{font-size:10px}.hero-art{width:min(430px,100%);margin:12px auto 0;padding:20px 18px 100px 40px}.hero-photo{width:93%}.hero-photo>img{height:290px}.hero-margin{margin-bottom:20px;font-size:21px}.small-photo{width:43%;left:5px;bottom:31px}.photo-stamp{right:8px;bottom:30px}.hero-bottom{font-size:8px;letter-spacing:.6px;bottom:18px}.identity-section{padding-block:65px}.identity-layout{grid-template-columns:1fr;gap:20px}.section-heading h2{font-size:clamp(34px,10.5vw,47px);line-height:1.35;display:inline-block;margin-block:15px;white-space:nowrap}.section-heading h2 br{display:none}.section-heading h2 .handwritten{font-size:clamp(38px,11.5vw,53px)}.section-heading>p:last-child{font-size:11px}.name-records{width:min(500px,100%);margin:auto;gap:15px}.name-record{padding:18px}.record-heading{gap:12px}.name-record h3{font-size:clamp(22px,6.5vw,32px)}.profile-shot{aspect-ratio:2.6/1}.name-record.alternative{margin-left:14px}.record-comment{font-size:16px}.name-arrow{font-size:16px}.observations{padding-block:65px}.section-row{gap:18px;margin-bottom:30px}.section-row h2{font-size:28px;margin-top:14px}.side-annotation{display:none}.observations-intro{flex-direction:column;align-items:flex-start;gap:20px}.observations-intro h2{font-size:26px}.observation-chapter{grid-template-columns:1fr;gap:26px;padding-block:30px 40px}.observation-chapter.story-good{padding-top:35px}.story-copy{position:static;padding-top:0}.story-copy h3{font-size:clamp(28px,7.5vw,40px);margin-top:19px}.story-lead{font-size:14px}.story-margin{font-size:20px;margin-top:18px}.story-count{margin-top:20px}.story-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:13px}.story-photo,.story-photo:nth-child(-n+2){grid-column:span 1;padding:8px}.story-photo:first-child,.story-photo:last-child:nth-child(even){grid-column:span 2}.story-photo figcaption{font-size:15px;padding-top:10px}.expressions-section{padding-block:65px 55px}.expression-grid{grid-template-columns:repeat(2,1fr);gap:20px 15px}.expression-card{padding:10px}.expression-caption{font-size:18px;padding-top:13px}.gallery-count{font-size:9px;gap:7px;flex-direction:column;align-items:flex-end}.gallery-count b{font-size:35px}.section-description{font-size:11px}.gallery-footnote{font-size:10px;margin-top:25px}.love-section{padding-block:75px}.love-layout{grid-template-columns:1fr;gap:58px}.love-photo{width:min(350px,86%);margin:auto}.love-copy{padding-inline:6px}.love-preface{font-size:13px;margin-top:25px}.love-copy h2{font-size:55px;line-height:1.35;margin-top:19px}.love-signature{font-size:22px;padding-left:60%}.footer{font-size:9px;gap:12px;flex-wrap:wrap;line-height:1.8}.footer>span{order:3;width:100%;text-align:center;padding-top:8px;color:#8b8375}#photo-dialog{padding:13px;max-width:calc(100vw - 22px)}#lightbox-image{max-width:calc(100vw - 48px);max-height:68dvh}.lightbox-top p{font-size:19px}}
@media(max-width:360px){.wrap{width:calc(100% - 32px)}.hero h1{font-size:43px}.side-switch button{padding:10px 11px;font-size:11px}.hero-photo>img{height:245px}.small-photo figcaption{font-size:13px}.hero-photo figcaption{font-size:8px}.hero-margin{font-size:18px}.expression-caption{font-size:16px}.love-copy h2{font-size:48px}.section-row h2{font-size:25px}.record-index{width:23px;height:23px;flex:none}.name-record{padding-inline:14px}.record-heading{gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
