/* ==================== */
/*    內在誠實手札樣式 —— 真·手寫信版    */
/* ==================== */

/* 強制 body 背景色 + 細緻紙紋背景 */
body.letter-page,
body.type-letter,
.notice-letter-page {
    background-color: #fcf8f0 ;  /* 稍暖的米白色 */
    font-family: 'iansui';
    line-height: 1.7 ;
    letter-spacing: 0.02em ;
    -webkit-font-smoothing: antialiased ;
    -moz-osx-font-smoothing: grayscale ;
}

/* 主容器 - 像一張攤開的信紙 */
.letter-page {
    max-width: 640px ;  /* 稍窄，更像信紙 */
    margin: 0 auto ;
    padding: 2.5rem 1.5rem 3rem ;
    background: #fffef8 ;  /* 非常淡的象牙白 */
    min-height: 100vh ;
    position: relative ;
}

/* 信紙邊緣 - 像真正信紙的自然磨損 */
.letter-page::before {
    content: '' ;
    position: absolute ;
    top: 12px ;
    left: 12px ;
    right: 12px ;
    bottom: 12px ;
    border: 1px solid #aa968226 ;
    border-radius: 2px ;
    pointer-events: none ;
    box-shadow: 0 0 0 1px #ffffffcc inset ;
}

/* 信紙內容區 - 像真的用鋼筆寫上去的 */
.letter-page .content-section {
    background: transparent ;  /* 不要白色背景，直接寫在信紙上 */
    padding: 2.5rem 2rem ;
    margin-bottom: 0 ;
    position: relative ;
    z-index: 1 ;
}

/* 信紙上的輕微紋理 - 像手工紙的纖維 */
.letter-page::after {
    content: '' ;
    position: absolute ;
    top: 0 ;
    left: 0 ;
    right: 0 ;
    bottom: 0 ;
    background-image: 
        radial-gradient(circle at 20% 30%, #8c6a4f03 1px, transparent 1px),
        radial-gradient(circle at 60% 70%, #8c6a4f03 1px, transparent 1px) ;
    background-size: 50px 50px, 60px 60px ;
    pointer-events: none ;
    z-index: 0 ;
}

/* 標題 - 像用簽字筆寫的標題 */
.letter-page h1 {
    font-family: 'iansui';  /* 改用更樸素的字體 */
    font-size: 2.2rem ;  /* 稍小，更真實 */
    text-align: center ;
    margin: 0 0 3rem 0 ;
    color: #2c2416 ;  /* 深褐色，像乾掉的墨水 */
    letter-spacing: 0.08em ;
    font-weight: 700 ;
    padding-bottom: 1.5rem ;
    border-bottom: 1px solid #8c6a4f4d ;
    position: relative ;
}

/* 小標題 - 像用筆加重寫的 */
.letter-page h2 {
    font-size: 1.4rem ;
    color: #3e3226 ;
    margin: 2.8rem 0 1.2rem 0 ;
    padding-bottom: 0.6rem ;
    border-bottom: 1px solid rgba(140, 106, 79, 0.2) ;
    font-weight: 600 ;
    letter-spacing: 0.04em ;
    font-family: 'iansui';
}

/* 段落文字 - 最重要的部分，要像手寫 */
.letter-page p {
    font-size: 1.1rem ;
    line-height: 1.85 ;  /* 行距稍寬，更像手寫 */
    color: #3a3226 ;  /* 深褐色墨水 */
    text-align: justify ;
    margin-bottom: 1.8rem ;
    font-family: 'iansui';
    letter-spacing: 0.03em ;
    text-shadow: 0 0 0.3px rgba(58, 50, 38, 0.15) ;
    position: relative ;
}

/* 引言區塊 - 像用鉛筆在旁邊做的筆記 */
.letter-page blockquote {
    border-left: 2px solid rgba(140, 106, 79, 0.4) ;
    padding-left: 1.8rem ;
    margin: 2rem 0 2rem 1rem ;
    color: #5a4a3a ;
    font-style: normal ;  /* 不要斜體，更像手寫 */
    background: transparent ;
    padding: 1.2rem 0 1.2rem 1.8rem ;
    border-radius: 0 ;
    font-family: 'iansui';
    position: relative ;
    line-height: 1.8 ;
    letter-spacing: 0.02em ;
}

/* 引言前面的小標記 - 像手繪的引號 */
.letter-page blockquote::before {
    content: '"' ;
    position: absolute ;
    left: 0.5rem ;
    top: 0.8rem ;
    font-size: 2rem ;
    color: rgba(140, 106, 79, 0.4) ;
    font-family: 'Georgia';
    line-height: 1 ;
}

/* 強調文字 - 像用筆稍微用力寫的 */
.letter-page strong {
    color: #5a4121 ;  /* 深褐色 */
    text-shadow: 
        0.3px 0 0 currentColor,
        -0.3px 0 0 currentColor,
        0 0.3px 0 currentColor,
        0 -0.3px 0 currentColor ;
}

/* 斜體 - 像用筆稍微傾斜寫的 */
.letter-page em {
    color: #6b5542 ;
    font-style: italic ;
    /* 輕微的斜體陰影，更像手寫傾斜 */
    text-shadow: 0.2px 0.2px 0 rgba(107, 85, 66, 0.1) ;
}

/* 列表 - 像手寫的條列式筆記 */
.letter-page ul,
.letter-page ol {
    margin: 1.5rem 0 2rem 2rem ;
    padding-left: 0 ;
}

.letter-page li {
    font-size: 1.1rem ;
    line-height: 1.8 ;
    color: #3a3226 ;
    margin-bottom: 0.8rem ;
    font-family: 'iansui';
    position: relative ;
    padding-left: 0.5rem ;
}

/* 無序列表的項目符號 - 像手繪的小點 */
.letter-page ul li::before {
    content: "•" ;
    position: absolute ;
    left: -1.2rem ;
    color: #8c6a4f ;
    font-size: 1.2rem ;
    top: 0.1rem ;
}

/* 有序列表的數字 - 像手寫的數字 */
.letter-page ol {
    counter-reset: list-counter ;
}

.letter-page ol li::before {
    content: counter(list-counter) "." ;
    counter-increment: list-counter ;
    position: absolute ;
    left: -1.8rem ;
    color: #8c6a4f ;
    font-weight: 600 ;
    font-size: 0.95rem ;
    font-family: 'Noto Sans TC', sans-serif ;
    top: 0.1rem ;
}

/* 跋（Postscript） - 像信末補充的筆記 */
.letter-page .postscript {
    margin-top: 3.5rem ;
    padding-top: 2.5rem ;
    border-top: 1px solid rgba(140, 106, 79, 0.25) ;
    position: relative ;
    font-size: 1.05rem ;
    line-height: 1.8 ;
    color: #5a4a3a ;
}

/* 跋前面的 P.S. 標記 - 像手寫的註記 */
.letter-page .postscript::before {
    content: "— 跋 —" ;
    position: absolute ;
    top: -0.9rem ;
    left: 50% ;
    transform: translateX(-50%) ;
    font-size: 0.9rem ;
    color: #8c6a4f ;
    background: #fffef8 ;
    padding: 0 1rem ;
    letter-spacing: 0.1em ;
    font-weight: 600 ;
    font-family: 'iansui';
}

.letter-page .postscript h3 {
    font-size: 1.4rem ;
    color: #3e3226 ;
    margin: 0 0 1.5rem 0 ;
    font-weight: 600 ;
    letter-spacing: 0.05em ;
    font-family: 'iansui';
    text-align: center ;
    padding-top: 0.5rem ;
}

.letter-page .postscript p {
    font-size: 1.05rem ;
    line-height: 1.85 ;
    text-align: justify ;
    color: #5a4a3a ;
    margin-bottom: 1.5rem ;
    letter-spacing: 0.03em ;
}

/* 手繪分隔線 - 像用筆輕輕畫的 */
.hand-drawn-divider {
    height: 24px ;
    position: relative ;
    margin: 3.5rem auto ;
    width: 90% ;
    max-width: 400px ;
}

.hand-drawn-divider::before {
    content: "" ;
    position: absolute ;
    top: 50% ;
    left: 0 ;
    right: 0 ;
    height: 1px ;  /* 非常細的線 */
    background: linear-gradient(
        to right,
        transparent 0%,
        #8c6a4f33 20%,
        #8c6a4f66 50%,
        #8c6a4f33 80%,
        transparent 100%
    ) ;
    transform: translateY(-50%) ;
    /* 輕微的毛邊效果 */
    filter: blur(0.3px) ;
}

/* 返回按鈕容器 - 放在信紙下方 */
.goback-bottom-container {
    max-width: 640px ;
    margin: 0 auto ;
    padding: 0 1.5rem 2rem ;
    text-align: center ;
}

.goback-placeholder {
    display: inline-block ;
    padding: 0.8rem 1.8rem ;
    background: #8c6a4f14 ;
    color: #8c6a4f ;
    border: 1px solid #8c6a4f33 ;
    border-radius: 20px ;
    font-size: 0.95rem ;
    font-family: 'iansui';
    letter-spacing: 0.05em ;
    cursor: pointer ;
    transition: all 0.3s ease ;
}

.goback-placeholder:hover {
    background: #8c6a4f1f ;
    border-color: #8c6a4f66 ;
    transform: translateY(-1px) ;
    box-shadow: 0 2px 6px #0000000d ;
}