*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;overflow-x:hidden}body{color:#000;word-wrap:break-word;overflow-wrap:break-word;background-color:#fef5f5;max-width:1400px;margin:0 auto;padding:16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6;overflow-x:hidden}@media (min-width:768px){body{padding:40px 60px}}.header{margin-bottom:24px}@media (min-width:768px){.header{margin-bottom:40px}}.nav{flex-wrap:wrap;gap:12px;margin-bottom:24px;padding-left:0;display:flex}@media (min-width:768px){.nav{gap:25px;margin-bottom:50px}}.nav-link{color:#000;touch-action:manipulation;padding:4px 0;font-size:14px;font-weight:400;text-decoration:none}@media (min-width:768px){.nav-link{font-size:16px}}.nav-link:hover{text-decoration:underline}.header-content{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:24px;display:flex}@media (min-width:768px){.header-content{flex-direction:row;justify-content:space-between;gap:60px;margin-bottom:40px}}.main-title{letter-spacing:-.01em;flex-shrink:0;margin:0;font-family:Times New Roman,serif;font-size:32px;font-weight:400;line-height:1.2}@media (min-width:480px){.main-title{font-size:40px}}@media (min-width:768px){.main-title{font-size:64px}}.header-text{flex:1;max-width:100%;margin-top:0}@media (min-width:768px){.header-text{max-width:550px;margin-top:10px}}.header-paragraph{margin-bottom:10px;font-size:14px;line-height:1.5}@media (min-width:768px){.header-paragraph{margin-bottom:12px;font-size:16px}}.header-paragraph:last-child{margin-bottom:0}.divider{border:none;border-top:1px solid #000;width:100%;margin:24px 0}@media (min-width:768px){.divider{margin:40px 0}}.letter-section{margin-bottom:24px}@media (min-width:768px){.letter-section{margin-bottom:40px}}.letter-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:16px;display:flex}@media (min-width:768px){.letter-header{flex-direction:row;gap:50px;margin-bottom:25px}}.letter-to{flex-shrink:0;width:auto;font-family:Times New Roman,serif;font-size:18px}@media (min-width:480px){.letter-to{font-size:20px}}@media (min-width:768px){.letter-to{width:140px;font-size:24px}}.letter-content{word-wrap:break-word;overflow-wrap:break-word;flex:1;width:100%;font-size:14px;line-height:1.6}@media (min-width:768px){.letter-content{font-size:16px;line-height:1.5}}.letter-content p{margin-bottom:10px}@media (min-width:768px){.letter-content p{margin-bottom:12px}}.letter-content p:last-child{margin-bottom:0}.letter-footer{flex-direction:column;align-items:flex-start;gap:16px;width:100%;margin-top:16px;padding-left:0;display:flex}@media (min-width:768px){.letter-footer{flex-direction:row;justify-content:space-between;align-items:center;gap:30px;width:auto;margin-top:25px;padding-left:190px}}.signature{flex:1;width:100%;font-size:14px;font-style:italic}@media (min-width:768px){.signature{width:auto;font-size:16px}}.signature-input{color:#000;background:0 0;border:none;border-bottom:1px solid #0000;outline:none;flex:1;width:100%;min-height:44px;padding:0;font-family:inherit;font-size:14px;font-style:italic;transition:border-bottom .2s}@media (min-width:768px){.signature-input{width:auto;min-height:auto;font-size:16px}}.signature-input:focus{border-bottom:1px solid #000}.signature-input::placeholder{color:#666;font-style:italic}.share-btn,.write-btn,.send-btn{color:#fff;cursor:pointer;white-space:nowrap;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#000;border:none;min-width:100%;min-height:44px;padding:12px 20px;font-family:inherit;font-size:14px}@media (min-width:480px){.share-btn,.write-btn,.send-btn{min-width:140px}}@media (min-width:768px){.share-btn,.write-btn,.send-btn{min-width:120px;min-height:auto;padding:10px 24px;font-size:16px}}.share-btn:hover,.write-btn:hover,.send-btn:hover{opacity:.9}.share-btn:disabled,.send-btn:disabled{opacity:.6;cursor:not-allowed}.about-section{text-align:center;margin-bottom:24px;padding:24px 0}@media (min-width:768px){.about-section{margin-bottom:40px;padding:50px 0}}.about-title{letter-spacing:-.01em;margin-bottom:20px;font-family:Times New Roman,serif;font-size:28px;font-weight:400}@media (min-width:480px){.about-title{font-size:36px}}@media (min-width:768px){.about-title{margin-bottom:40px;font-size:48px}}.about-text{text-align:left;max-width:100%;margin:0 auto 24px;font-size:14px;line-height:1.6}@media (min-width:768px){.about-text{max-width:900px;margin-bottom:40px;font-size:16px}}.about-text p{margin-bottom:12px}@media (min-width:768px){.about-text p{margin-bottom:18px}}.about-text p:last-child{margin-bottom:0}.about-buttons{flex-direction:column;align-items:stretch;gap:12px;margin-top:24px;display:flex}@media (min-width:480px){.about-buttons{flex-direction:row;justify-content:center;align-items:center}}@media (min-width:768px){.about-buttons{gap:20px;margin-top:40px}}.archive-section{text-align:center;margin-bottom:24px;padding:24px 0}@media (min-width:768px){.archive-section{margin-bottom:40px;padding:50px 0}}.archive-title{letter-spacing:-.01em;margin-bottom:20px;font-family:Times New Roman,serif;font-size:28px;font-weight:400}@media (min-width:480px){.archive-title{font-size:36px}}@media (min-width:768px){.archive-title{margin-bottom:40px;font-size:48px}}.archive-content{text-align:left;max-width:100%;margin:0 auto 24px;font-size:14px;line-height:1.6}@media (min-width:768px){.archive-content{max-width:900px;margin-bottom:40px;font-size:16px}}.archive-content p{margin-bottom:12px}@media (min-width:768px){.archive-content p{margin-bottom:18px}}.archive-content p:last-child{margin-bottom:0}.letter-input{color:#000;resize:vertical;appearance:none;background-color:#fef5f5;border:1px solid #000;width:100%;min-height:150px;padding:12px;font-family:inherit;font-size:16px;line-height:1.6}@media (min-width:768px){.letter-input{min-height:120px;line-height:1.5}}.letter-input::placeholder{color:#666}.footer{flex-direction:column;align-items:flex-start;gap:20px;margin-top:32px;padding-top:24px;display:flex}@media (min-width:768px){.footer{flex-direction:row;justify-content:space-between;gap:60px;margin-top:50px;padding-top:40px}}.footer-left{flex:1;width:100%}@media (min-width:768px){.footer-left{width:auto}}.footer-title{letter-spacing:-.01em;margin-bottom:16px;font-family:Times New Roman,serif;font-size:28px;font-weight:400}@media (min-width:480px){.footer-title{font-size:36px}}@media (min-width:768px){.footer-title{margin-bottom:30px;font-size:48px}}.copyright{margin-top:16px;font-size:12px}@media (min-width:768px){.copyright{margin-top:30px;font-size:14px}}.modal{z-index:1000;justify-content:center;align-items:center;width:100%;height:100%;padding:16px;display:none;position:fixed;top:0;left:0}.modal.active{display:flex}.modal-overlay{cursor:pointer;z-index:1000;background-color:#00000080;width:100%;height:100%;position:absolute;top:0;left:0}.modal-content{z-index:1001;background-color:#fef5f5;border:1px solid #000;width:100%;max-width:100%;max-height:90vh;padding:20px;position:relative;overflow-y:auto;box-shadow:0 4px 20px #0000004d}@media (min-width:480px){.modal-content{width:90%;max-width:500px;padding:24px}}@media (min-width:768px){.modal-content{padding:30px}}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}@media (min-width:768px){.modal-header{margin-bottom:20px}}.modal-title{margin:0;font-family:Times New Roman,serif;font-size:20px;font-weight:400}@media (min-width:768px){.modal-title{font-size:24px}}.modal-close{cursor:pointer;color:#000;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:8px;font-size:28px;line-height:1;display:flex}@media (min-width:768px){.modal-close{width:32px;min-width:auto;height:32px;min-height:auto;padding:0;font-size:32px}}.modal-close:hover{opacity:.7}.modal-body{margin-top:16px}@media (min-width:768px){.modal-body{margin-top:20px}}.modal-label{margin-bottom:10px;font-size:14px;line-height:1.5}@media (min-width:768px){.modal-label{margin-bottom:12px;font-size:16px}}.modal-input-group{flex-direction:column;gap:10px;margin-bottom:12px;display:flex}@media (min-width:480px){.modal-input-group{flex-direction:row}}.share-link-input{color:#000;word-wrap:break-word;overflow-wrap:break-word;background-color:#fff;border:1px solid #000;flex:1;width:100%;min-height:44px;padding:12px;font-family:inherit;font-size:14px;line-height:1.5}@media (min-width:480px){.share-link-input{width:auto}}.share-link-input:focus{outline-offset:2px;outline:2px solid #000}.copy-link-btn{color:#fff;cursor:pointer;white-space:nowrap;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#000;border:none;min-width:100%;min-height:44px;padding:12px 20px;font-family:inherit;font-size:14px}@media (min-width:480px){.copy-link-btn{min-width:120px}}.copy-link-btn:hover{opacity:.9}.copy-success-message{color:#000;text-align:center;margin-top:8px;font-size:13px}@media (min-width:768px){.copy-success-message{font-size:14px}}.floating-write-btn{color:#fff;cursor:pointer;z-index:9998;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#000;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;text-decoration:none;transition:transform .2s,opacity .2s,box-shadow .2s;display:flex;position:fixed;bottom:80px;right:16px;box-shadow:0 4px 12px #0000004d}@media (min-width:768px){.floating-write-btn{bottom:24px;right:24px}}.scroll-to-top-btn{color:#fff;cursor:pointer;z-index:999;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#000;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;transition:all .3s;display:flex;position:fixed;bottom:150px;right:16px;box-shadow:0 4px 12px #00000026}@media (min-width:768px){.scroll-to-top-btn{bottom:90px;right:24px}}.scroll-to-top-btn:hover{background-color:#1a1a1a;transform:scale(1.1)}.scroll-to-top-btn:active{transform:scale(.95)}.floating-write-btn:hover{opacity:.9;transform:scale(1.1);box-shadow:0 6px 16px #0006}.floating-write-btn:active{transform:scale(.95)}.floating-write-btn svg{width:24px;height:24px}
