*{box-sizing:border-box}:root{--bg:#fffaf7;--bg-soft:#fdf3ec;--surface:#ffffffe0;--surface-strong:#fff;--border:#eedfd4;--border-strong:#e6d3c5;--text:#2f2723;--text-soft:#6f645d;--text-faint:#958980;--accent:#6b4f43;--accent-soft:#f5e9e0;--accent-rose:#f7e3e7;--shadow:0 16px 40px #4c322214;--radius-xl:28px;--radius-lg:22px;--radius-md:18px;--container:1120px}html,body{margin:0;padding:0}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(circle at top,#fff0e8e6,#0000 30%),linear-gradient(#fffaf7 0%,#fff7f2 40%,#fffaf7 100%);font-family:Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}img{max-width:100%;display:block}.site-shell{flex-direction:column;min-height:100vh;display:flex}main{flex:1}.layout-header{z-index:20;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffaf7c7;border-bottom:1px solid #eedfd4b3;position:sticky;top:0}.layout-header-inner,.layout-footer-inner,.container{width:min(var(--container),calc(100% - 28px));margin:0 auto}.layout-header-inner{justify-content:space-between;align-items:center;gap:16px;min-height:70px;display:flex}.layout-brand{letter-spacing:-.02em;font-size:24px;font-weight:700}.layout-nav{color:var(--text-soft);flex-wrap:wrap;gap:16px;font-size:14px;display:flex}.layout-nav a:hover{color:var(--text)}.layout-footer{border-top:1px solid var(--border);color:var(--text-faint);background:#fffaf7eb;padding:28px 0 40px;font-size:14px}.page-section{padding:44px 0}.section-title{letter-spacing:-.03em;margin:0 0 10px;font-size:30px;line-height:1.16}.section-description{color:var(--text-soft);margin:0;font-size:15px;line-height:1.75}.section-header{margin-bottom:22px}.hero-card,.info-card,.memory-card,.detail-card,.shared-card,.timeline-card,.archive-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hero-card{background:radial-gradient(circle at 100% 0,#f9e1e6e6,#0000 28%),radial-gradient(circle at 0 100%,#faebdff2,#0000 24%),linear-gradient(135deg,#fffdfb 0%,#fdf2ea 100%);padding:28px 22px;position:relative;overflow:hidden}.hero-card:after{content:"";filter:blur(8px);background:#ffffff52;border-radius:999px;width:140px;height:140px;position:absolute;top:-40px;right:-40px}.hero-eyebrow{color:var(--accent);background:#fffc;border-radius:999px;align-items:center;margin-bottom:14px;padding:8px 12px;font-size:12px;font-weight:700;display:inline-flex}.hero-title{letter-spacing:-.05em;max-width:7ch;margin:0 0 14px;font-size:40px;line-height:1.02}.hero-description{max-width:640px;color:var(--text-soft);margin:0;font-size:16px;line-height:1.8}.hero-actions{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.info-card{padding:24px 20px}.info-card p{color:var(--text-soft);margin:0;line-height:1.9}.button{border:1px solid var(--border-strong);min-height:42px;color:var(--text);cursor:pointer;background:#fff;border-radius:999px;justify-content:center;align-items:center;padding:10px 16px;transition:transform .18s,box-shadow .18s,background .18s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button.primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 10px 24px #5b43372e}.button.soft{background:var(--accent-soft);border-color:#0000}.tag,.type-badge{border-radius:999px;align-items:center;padding:6px 10px;font-size:12px;font-weight:700;display:inline-flex}.tag{color:#78675b;background:#f8efe9}.type-badge{color:#805d4c;background:#f5e4d8}.memory-grid{grid-template-columns:1fr;gap:16px;display:grid}.memory-card{transition:transform .18s,box-shadow .18s,border-color .18s;overflow:hidden}.memory-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}.memory-card-thumb{aspect-ratio:16/10;border-bottom:1px solid var(--border);background:linear-gradient(135deg,#fff6f0 0%,#f6e8df 100%);align-items:flex-end;padding:14px;display:flex}.memory-card-thumb-inner{width:100%;color:var(--text-soft);background:#ffffffb8;border-radius:18px;padding:14px;font-size:14px}.memory-card-content{padding:18px 16px}.memory-card-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.memory-card-date{color:var(--text-faint);font-size:13px}.memory-card-title{letter-spacing:-.02em;margin:12px 0 8px;font-size:21px;line-height:1.3}.memory-card-preview{color:var(--text-soft);margin:0;font-size:15px;line-height:1.75}.tag-list,.action-row,.meta-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.empty-text{color:var(--text-faint)}.archive-hero{background:radial-gradient(circle at 100% 0,#f9e1e699,#0000 30%),linear-gradient(135deg,#fffdfb 0%,#fef3ec 100%);margin-bottom:22px;padding:24px 20px}.archive-toolbar{gap:14px;margin-bottom:24px;display:grid}.archive-toolbar-top,.archive-toolbar-bottom{flex-wrap:wrap;gap:10px;display:flex}.input,.select{border:1px solid var(--border-strong);min-height:42px;color:var(--text);background:#ffffffeb;border-radius:999px;padding:10px 14px}.input{flex:1;min-width:220px}.back-link{color:var(--text-soft);margin-bottom:18px;display:inline-flex}.detail-header{margin-bottom:20px}.detail-title{letter-spacing:-.03em;margin:10px 0;font-size:32px;line-height:1.14}.detail-date{color:var(--text-faint);font-size:14px}.detail-card{padding:22px 18px}.letter-paper{background:linear-gradient(#ffffffbf,#ffffffbf),repeating-linear-gradient(#fffdfa 0 31px,#f3e9df 32px);border:1px solid #efdfd2;border-radius:24px;padding:24px 18px;box-shadow:inset 0 1px #ffffffb3,0 12px 28px #503a2a0f}.letter-paper.romantic{background:linear-gradient(#fffafce0,#fff6f9eb),repeating-linear-gradient(#fff8fb 0 31px,#f2e2e8 32px)}.letter-paper.soft{background:linear-gradient(#fffcf8e6,#fff8f2f2),repeating-linear-gradient(#fffdf9 0 31px,#f1e6dc 32px)}.letter-paper.note{background:linear-gradient(#fffdf7e6,#fffaf1f2),repeating-linear-gradient(#fffefb 0 31px,#f0e6d6 32px)}.letter-body{white-space:pre-wrap;color:#453732;font-size:16px;line-height:2.05}.chat-list{flex-direction:column;gap:12px;display:flex}.chat-row{display:flex}.chat-row.me{justify-content:flex-end}.chat-row.her{justify-content:flex-start}.chat-bubble{white-space:pre-wrap;border-radius:18px;max-width:84%;padding:12px 14px;font-size:15px;line-height:1.75}.chat-row.me .chat-bubble{background:#f7dbdb}.chat-row.her .chat-bubble{background:#f8efe8}.photo-grid{grid-template-columns:1fr;gap:14px;display:grid}.photo-frame{border:1px solid var(--border);background:#faf6f2;border-radius:20px;overflow:hidden}.photo-placeholder{aspect-ratio:4/3;color:var(--text-faint);text-align:center;place-items:center;padding:20px;font-size:14px;display:grid}.timeline-list{gap:18px;display:grid;position:relative}.timeline-list:before{content:"";background:#e8d8cc;width:2px;position:absolute;top:8px;bottom:8px;left:13px}.timeline-item-row{padding-left:40px;position:relative}.timeline-item-dot{background:#c89179;border:3px solid #fffaf7;border-radius:999px;width:16px;height:16px;position:absolute;top:10px;left:6px;box-shadow:0 0 0 1px #eadacc}.timeline-card{padding:16px}.moment-blocks{gap:18px;display:grid}.quote-block{color:var(--text-soft);background:#fbf3ed;border-left:4px solid #d8b29d;border-radius:18px;margin:0;padding:20px}.shared-layout{background:radial-gradient(circle at top,#ffefe7e6,#0000 34%),linear-gradient(#fffaf7 0%,#fff3ed 100%);place-items:center;min-height:calc(100vh - 140px);padding:32px 0;display:grid}.shared-card{text-align:center;width:min(720px,100%);padding:28px 20px}.shared-intro{color:var(--text-soft);margin:0 0 8px}.shared-letter-title{letter-spacing:-.03em;margin:0 0 14px;font-size:26px;line-height:1.22}.shared-letter-date{color:var(--text-faint);margin-bottom:22px;font-size:14px}.envelope-scene{aspect-ratio:1.2;filter:drop-shadow(0 18px 30px #6c4d3a24);width:min(280px,78vw);margin:24px auto 22px;position:relative}.envelope-letter{z-index:1;background:linear-gradient(#fffefd 0%,#fff8f2 100%);border:1px solid #eaded3;border-radius:14px;width:62%;height:54%;padding:16px 14px;position:absolute;top:6%;left:50%;transform:translate(-50%)}.envelope-letter-line{background:#efe3d9;border-radius:999px;height:8px;margin-bottom:10px}.envelope-letter-line.short{width:65%}.envelope-body{z-index:3;background:linear-gradient(#f2ddd0 0%,#e6c7b4 100%);border:1px solid #dcb9a2;border-radius:18px;width:100%;height:64%;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.envelope-body:before,.envelope-body:after{content:"";background:#ffffff29;width:50%;height:100%;position:absolute;bottom:0}.envelope-body:before{clip-path:polygon(0 0,100% 55%,100% 100%,0 100%);border-bottom-left-radius:18px;left:0}.envelope-body:after{clip-path:polygon(0 55%,100% 0,100% 100%,0 100%);border-bottom-right-radius:18px;right:0}.envelope-flap{clip-path:polygon(0 0,50% 78%,100% 0,100% 20%,50% 100%,0 20%);z-index:4;background:linear-gradient(#f6e5da 0%,#e9cdbd 100%);border:1px solid #dcb9a2;border-top-left-radius:18px;border-top-right-radius:18px;width:100%;height:48%;position:absolute;bottom:28%;left:50%;transform:translate(-50%)}.envelope-seal{z-index:5;background:linear-gradient(#d8a9a9 0%,#c98f8f 100%);border-radius:999px;width:22px;height:22px;position:absolute;bottom:24%;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #784d4d29}.shared-open-hint{color:var(--text-soft);margin:0 0 18px}@media (min-width:768px){.layout-header-inner,.layout-footer-inner,.container{width:min(var(--container),calc(100% - 48px))}.page-section{padding:64px 0}.section-title{font-size:38px}.hero-card{padding:48px 42px}.hero-title{font-size:64px}.hero-description{font-size:18px}.info-card{padding:32px 28px}.memory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.detail-title{font-size:42px}.detail-card{padding:28px 24px}.letter-paper{padding:34px 30px}.shared-card{padding:34px 28px}.shared-letter-title{font-size:38px}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1100px){.memory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:767px){.layout-header-inner{flex-direction:column;align-items:flex-start;padding:14px 0}.layout-nav{gap:12px;font-size:13px}.chat-bubble{max-width:90%}}@keyframes fadeUpIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.shared-fade-in{animation:.7s both fadeUpIn}.shared-delay-1{animation-delay:80ms}.shared-delay-2{animation-delay:.16s}.envelope-scene{transition:transform .2s}.shared-card:hover .envelope-scene{transform:translateY(-2px)}