
    :root{
      --paper:#f6efe6;
      --ink:#1b1b1b;
      --accent:#8b3b2f;
      --muted:#6b6b6b;
      --cardBg:rgba(255,255,255,0.85);
      --boxShadow:0 6px 18px rgba(0,0,0,0.15);
      --maxWidth:1100px;
    }

    html,body{
      height:100%;
      margin:0;
      font-family:-apple-system,"PingFang TC","Microsoft JhengHei","新細明體","PMingLiU","Noto Serif TC",serif;
      color:var(--ink);
      background:url('bk8.jpg') center/cover no-repeat fixed;
      background-color:var(--paper);
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
    }

    .pageWrap{
      max-width:var(--maxWidth);
      margin:40px auto;
      background:linear-gradient(180deg,rgba(255,255,255,0.9),rgba(255,250,244,0.85));
      border-radius:12px;
      box-shadow:var(--boxShadow);
      overflow:hidden;
      padding:22px;
      backdrop-filter:blur(2px);
    }

    .siteBrand{
			 text-align:center;
			  font-size:22px;
			  font-weight:700;
			  color:var(--accent);
			  margin:12px 0;
			  font-family: "標楷體", "Noto Serif TC", serif;
    }

    .header{
      display:flex;
      gap:16px;
      align-items:center;
      border-bottom:2px solid rgba(0,0,0,0.06);
      padding-bottom:14px;
    }
    .coverThumb{
      width:120px;
      height:160px;
      flex:0 0 120px;
      object-fit:cover;
      border-radius:6px;
      box-shadow:0 4px 10px rgba(0,0,0,0.12);
      border:4px solid rgba(139,59,47,0.06);
    }
    .meta{flex:1;}
    .title{
      font-family:"標楷體","Noto Serif TC",serif;
      font-size:28px;
      color:var(--accent);
      margin:0 0 6px 0;
      letter-spacing:1px;
    }
    .subMeta{margin:0;color:var(--muted);}

    .topActions{
      display:flex;
      gap:10px;
      align-items:center;
    }
    .btn{
      background:var(--accent);
      color:#fff;
      padding:8px 12px;
      border-radius:8px;
      text-decoration:none;
      font-weight:600;
      box-shadow:0 3px 8px rgba(139,59,47,0.18);
    }
    .btn.secondary{
      background:transparent;
      color:var(--accent);
      border:1px solid rgba(139,59,47,0.12);
      box-shadow:none;
      font-weight:700;
    }

    .intro{margin:18px 0;color:#3b3b3b;line-height:1.7;}

    .chapterGrid{
      display:grid;
      grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
      gap:10px;
      margin-top:18px;
    }
    .chapterCard{
      background:var(--cardBg);
      border-radius:8px;
      padding:10px;
      text-align:center;
      box-shadow:0 2px 8px rgba(0,0,0,0.06);
      border:1px solid rgba(0,0,0,0.04);
    }
    .chapterCard a{
      display:block;
      text-decoration:none;
      color:var(--ink);
      font-weight:600;
      padding:6px 2px;
    }
    .chapterCard small{
      display:block;
      color:var(--muted);
      margin-top:4px;
      font-size:13px;
    }

    .footerNote{
      margin-top:22px;
      border-top:1px dashed rgba(0,0,0,0.06);
      padding-top:12px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }
    .copyright{color:#006600;font-weight:600;}

    @media(max-width:520px){
      .header{flex-direction:column;align-items:flex-start;gap:10px}
      .coverThumb{width:88px;height:118px}
      .title{font-size:22px}
      .siteBrand{font-size:26px;}
 /* ... 其他 CSS 保持不變 ... */

  .backBtn{
    background:var(--accent);
    color:#fff;
    padding:6px 14px;
    border-radius:6px;
    text-decoration:none;
    font-weight:600;
    box-shadow:0 3px 8px rgba(139,59,47,0.18);
    transition:background 0.2s ease;
  }
  .backBtn:hover{
    background:#a14537;
  }
 
 