@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Serif+SC:wght@400;500;600;700&display=swap');
.topbar-actions{display:flex;align-items:center;gap:18px}.mobile-profile-button{display:none}.photo-drop #photo-placeholder[hidden]{display:none}@media(max-width:820px){.mobile-profile-button{display:inline-block}}@media(max-width:420px){.topbar-label{display:none}.topbar-actions{margin-left:auto}}
:root{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;color:#3c3b35;background:#f8f5ed;font-size:16px;line-height:1.6;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}h1,h2,p{margin-top:0}h1,h2,.sidebar-heading,.sidebar-bottom p{font-family:'Noto Serif SC','Songti SC',serif}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell{display:grid;grid-template-columns:284px minmax(0,1fr);min-height:100vh}.sidebar{background:#f0ede3;border-right:1px solid #e5e0d4;padding:31px 28px 29px;display:flex;flex-direction:column;min-height:100vh}.brand{font-family:'Noto Serif SC',serif;font-weight:700;font-size:19px;color:#383a30;display:flex;align-items:center;gap:10px;white-space:nowrap}.brand-mark{height:29px;width:29px;border-radius:50%;background:#e9937e;color:white;display:grid;place-items:center;font-size:15px}.sidebar-heading{margin:28px 0 20px;color:#9a968c;font-size:14px}.profile-card{background:#fffdf7;border:1px solid #ebe5d9;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px #65533d09}.profile-art{height:154px;background:#e8e8db;position:relative;overflow:hidden}.sun{position:absolute;top:24px;right:40px;width:54px;height:54px;border-radius:50%;background:#fbf2d5}.hill{position:absolute;border-radius:50% 50% 0 0}.hill-a{width:235px;height:125px;background:#cbd7bd;left:-39px;bottom:-64px;transform:rotate(-7deg)}.hill-b{width:250px;height:135px;background:#aebfa4;right:-99px;bottom:-75px;transform:rotate(9deg)}.tiny-star{position:absolute;left:49px;top:36px;color:#fffaf0;font-size:24px}.profile-copy{padding:18px 18px 10px}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:700;color:#b18170;text-transform:uppercase}.profile-copy h2{font-size:20px;margin:3px 0 4px;line-height:1.45}.profile-copy p{font-size:13px;color:#8f8b82;margin:0}.text-button{border:0;border-top:1px solid #f1ece3;color:#b87862;background:transparent;width:100%;text-align:left;padding:12px 18px 14px;font-size:13px;font-weight:700;display:flex;justify-content:space-between}.text-button:hover,.topbar-link:hover{color:#8f5e4d}.sidebar-bottom{margin-top:auto;padding-top:30px;color:#999388}.sidebar-bottom p{font-size:16px;line-height:2.1;color:#8c8f7c;margin-bottom:24px}.local-note{font-size:11px;line-height:1.5;border-top:1px solid #dfd9cc;padding-top:14px}.local-note span{color:#96a88a}.main-content{padding:0 clamp(28px,5.5vw,92px);max-width:1600px;width:100%;margin:0 auto}.topbar{height:80px;border-bottom:1px solid #e9e3d8;display:flex;align-items:center;justify-content:space-between;gap:15px}.topbar-label{font-size:13px;color:#9c978d}.topbar-label span{padding:0 8px;color:#c9c3b8}.topbar-link{border:0;background:transparent;color:#77796b;font-size:13px;font-weight:600}.intro{padding:55px 0 43px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.intro-kicker{display:flex;align-items:center;gap:9px;letter-spacing:.14em;color:#b27965;font-size:12px;font-weight:700;margin-bottom:17px}.kicker-line{width:24px;border-top:1px solid #d08a73}.intro h1{font-size:clamp(36px,4.2vw,62px);line-height:1.3;font-weight:600;letter-spacing:-.055em;margin:0 0 16px}.intro h1 em{font-style:normal;color:#dc8c74}.intro p{font-size:15px;color:#827e75;margin:0;line-height:1.8}.primary-button{border:0;background:#dc8d76;color:white;border-radius:11px;padding:13px 21px;font-size:14px;font-weight:700;min-height:47px;box-shadow:0 6px 14px #a9655033;white-space:nowrap}.primary-button:hover{background:#c9745d}.button-plus{font-size:20px;line-height:0;vertical-align:-1px;margin-right:6px;font-weight:400}.summary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ece6d9;background:#fffcf5;border-radius:17px;padding:18px 7px;box-shadow:0 8px 30px #74604108}.summary-item{display:flex;align-items:center;gap:15px;padding:7px clamp(12px,2vw,30px)}.summary-item+.summary-item{border-left:1px solid #ece7dc}.summary-icon{width:47px;height:47px;flex:0 0 auto;border-radius:13px;display:grid;place-items:center;font-size:22px}.peach{background:#f8e5d9;color:#d78d75}.sage{background:#e9eddf;color:#899f82}.yellow{background:#f7efd6;color:#b69b56}.summary-item strong{display:block;font-size:25px;line-height:1.1;color:#343831;font-weight:600}.summary-item span:last-child{display:block;font-size:12px;color:#a19a90;margin-top:3px}.memories{padding-top:61px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}.section-heading h2{font-size:29px;font-weight:600;margin:5px 0 0}.month-filters{display:flex;gap:7px;overflow:auto;max-width:60%;padding-bottom:2px}.month-filters button{border:1px solid #e4ded2;border-radius:99px;background:transparent;color:#7c786f;padding:6px 13px;font-size:12px;white-space:nowrap}.month-filters button[aria-pressed="true"]{background:#77886e;border-color:#77886e;color:white}.empty-state{min-height:370px;border:1px dashed #dcd5c7;border-radius:18px;background:#fdfaf3;display:grid;place-items:center;text-align:center;padding:30px}.empty-inner{max-width:360px}.empty-illustration{width:132px;height:132px;border-radius:20px;background:#e8ddd0;margin:0 auto 24px;transform:rotate(-8deg);box-shadow:12px 12px 0 #f5ede0;display:grid;place-items:center;position:relative}.empty-illustration::before{content:'';width:109px;height:90px;background:linear-gradient(160deg,#fbefcc 0 42%,#b6c7a9 43%);border:7px solid #fffaf0;border-bottom-width:23px;box-shadow:0 3px 9px #78675318}.empty-illustration span{position:absolute;top:19px;right:29px;color:#fff9e8;font-size:20px}.empty-state h3{font-family:'Noto Serif SC',serif;font-size:21px;margin:0 0 9px}.empty-state p{color:#999186;font-size:14px;margin:0 0 20px;line-height:1.8}.empty-state button{border:0;background:none;color:#bf7f68;font-weight:700;font-size:14px}.memory-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.memory-card{background:#fffdf7;border:1px solid #e9e3d7;border-radius:14px;overflow:hidden;min-width:0;box-shadow:0 5px 18px #6255450a;transition:transform .2s ease,box-shadow .2s ease}.memory-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #62554518}.memory-photo{aspect-ratio:4/3;background:#e8e5dc;width:100%;display:block;object-fit:cover}.memory-body{padding:16px 17px 18px}.memory-date{color:#a17968;font-size:11px;font-weight:700;letter-spacing:.05em}.memory-body h3{font-family:'Noto Serif SC',serif;font-size:18px;margin:5px 0 7px;line-height:1.45}.memory-note{font-size:13px;color:#77736b;line-height:1.7;margin:0 0 12px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:0}.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid #eee9df;padding-top:12px}.milestone-badge{font-size:11px;color:#a56e58;background:#faeee6;border-radius:50px;padding:4px 8px}.ordinary-badge{font-size:11px;color:#aaa399}.card-actions{display:flex;gap:8px}.card-actions button{border:0;background:transparent;color:#918b80;font-size:12px;padding:2px}.card-actions button:hover{color:#bc715c}.group-heading{font-size:17px;font-weight:600;margin:8px 0 17px;color:#777b69}.group-heading:not(:first-child){margin-top:36px}footer{border-top:1px solid #e9e3d8;margin:70px 0 22px;padding-top:17px;display:flex;justify-content:space-between;color:#aaa398;font-size:12px}footer span{color:#d88c75;font-size:17px}.modal{border:0;padding:0;border-radius:19px;max-height:min(90vh,850px);width:min(620px,calc(100vw - 28px));box-shadow:0 20px 80px #332c2580;background:#fffdf7;color:#3c3b35}.small-modal{width:min(490px,calc(100vw - 28px))}.modal::backdrop{background:#33332896;backdrop-filter:blur(3px)}.modal-card{display:block}.modal-top{padding:24px 27px 19px;border-bottom:1px solid #eee8dd;display:flex;align-items:flex-start;justify-content:space-between}.modal-top h2{font-size:24px;margin:3px 0 0;font-weight:600}.icon-button{border:0;background:#f4f0e8;color:#827a70;border-radius:50%;height:32px;width:32px;font-size:23px;line-height:1}.modal-body{padding:24px 27px;max-height:calc(90vh - 165px);overflow:auto}.field-label{font-weight:700;color:#56564e;font-size:13px;display:block;margin-bottom:8px}.photo-drop{height:180px;width:100%;border:1.5px dashed #d8cdbd;background:#faf7ee;border-radius:12px;display:grid;place-items:center;text-align:center;cursor:pointer;overflow:hidden;margin-bottom:19px}.photo-drop:hover{border-color:#cb8c77}.photo-drop img{height:100%;width:100%;object-fit:cover}.photo-drop img[hidden]{display:none}.photo-drop #photo-placeholder{display:grid;justify-items:center;gap:3px}.photo-drop strong{font-size:14px}.photo-drop small{font-size:12px;color:#a29b90}.camera-icon{font-size:27px;color:#c88873}.field-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:14px}.field{display:block;margin-bottom:17px}.field input,.field textarea{display:block;width:100%;border:1px solid #e4ddd0;background:#fffefa;border-radius:9px;padding:11px 12px;color:#444239;outline:none;font-size:14px}.field input:focus,.field textarea:focus{border-color:#cd927e;box-shadow:0 0 0 3px #eabca533}.field textarea{resize:vertical;min-height:98px}.check-row{display:flex;gap:9px;align-items:center;background:#fcf4ed;padding:11px 13px;border-radius:9px;color:#805f52;font-size:13px;cursor:pointer}.check-row input{accent-color:#d18268}.check-row span:last-child{margin-left:auto}.modal-actions{padding:16px 27px 24px;display:flex;justify-content:flex-end;gap:9px}.secondary-button{border:1px solid #ddd6ca;background:#fffdf7;color:#67645d;border-radius:10px;padding:11px 19px;font-size:14px;min-height:44px}.form-hint,.backup-copy{font-size:13px;color:#868077;line-height:1.8}.backup-copy{margin:0 0 20px}.backup-option{border:1px solid #e9e2d7;border-radius:11px;background:#fffdf8;width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:13px;cursor:pointer;color:#545148;margin-bottom:10px}.backup-option:hover{background:#faf5ec;border-color:#d8b4a3}.backup-option>span:nth-child(2){flex:1}.backup-option strong,.backup-option small{display:block}.backup-option strong{font-size:14px}.backup-option small{color:#989085;font-size:12px}.option-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#f6e5d9;color:#bf795f;font-size:19px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#42483d;color:white;border-radius:9px;padding:11px 17px;font-size:13px;transition:opacity .2s,transform .2s;z-index:100;max-width:min(430px,calc(100vw - 30px));text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}:focus-visible{outline:3px solid #8aab81;outline-offset:3px}@media(max-width:1100px){.memory-list{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-item{gap:9px;padding:7px 12px}.summary-icon{width:40px;height:40px}}@media(max-width:820px){.app-shell{display:block}.sidebar{min-height:auto;padding:16px 20px;border-right:0;border-bottom:1px solid #e5e0d4}.sidebar-heading,.profile-card,.sidebar-bottom{display:none}.main-content{padding:0 20px}.topbar{height:55px}.intro{padding:39px 0 31px}.intro h1{font-size:clamp(34px,7vw,50px)}.summary{padding:14px 5px}.summary-item{flex-direction:column;text-align:center}.summary-item strong{font-size:22px}.memories{padding-top:43px}}@media(max-width:600px){.intro{display:block}.intro p{font-size:14px}.intro .primary-button{margin-top:22px;width:100%}.topbar-label{font-size:12px}.topbar-link{font-size:12px}.summary-item{padding:4px 6px}.summary-icon{height:33px;width:33px;font-size:16px}.summary-item strong{font-size:21px}.summary-item span:last-child{font-size:10px;line-height:1.3}.section-heading{display:block}.month-filters{max-width:100%;margin-top:14px}.memory-list{grid-template-columns:1fr}.field-grid{grid-template-columns:1fr;gap:0}.modal-top{padding:20px}.modal-body{padding:20px}.modal-actions{padding:15px 20px 20px}.profile-mobile{display:block}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
