/* 睡半夜怎麼三更・作品集 ---------------------------------------- */
:root{
  --paper:#faf7f2; --paper-2:#f3eee5; --card:#fffdf9;
  --ink:#1f1c18; --ink-2:#4a443c; --muted:#847a6d;
  --rule:#e4ddd1; --rule-2:#d5cbba;
  --accent:#8c2f28; --accent-2:#b8483c; --accent-soft:#f3e4e0;
  --shadow:0 1px 2px rgba(60,45,30,.06),0 8px 24px rgba(60,45,30,.06);
  --radius:10px;
  --read-size:1.05rem; --read-lead:2.0;
  --ui:"Noto Sans TC","Microsoft JhengHei","PingFang TC","Hiragino Sans TC",sans-serif;
  --serif:"Noto Serif TC","Source Han Serif TC","Songti TC","PMingLiU","MingLiU",Georgia,serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#15130f; --paper-2:#1c1915; --card:#1b1814;
    --ink:#e9e3d8; --ink-2:#c3bbad; --muted:#8d8478;
    --rule:#2e2921; --rule-2:#3d372d;
    --accent:#d98b78; --accent-2:#e8a893; --accent-soft:#2a201c;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  --paper:#15130f; --paper-2:#1c1915; --card:#1b1814;
  --ink:#e9e3d8; --ink-2:#c3bbad; --muted:#8d8478;
  --rule:#2e2921; --rule-2:#3d372d;
  --accent:#d98b78; --accent-2:#e8a893; --accent-soft:#2a201c;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--ui);
  -webkit-font-smoothing:antialiased;line-height:1.7}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
img{max-width:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}

/* ---- header ---- */
.top{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--rule)}
.top-in{display:flex;align-items:center;gap:18px;height:56px}
.brand{font-family:var(--serif);font-weight:700;font-size:1.05rem;color:var(--ink);letter-spacing:.04em;white-space:nowrap}
.brand:hover{text-decoration:none;color:var(--accent)}
.brand .dot{color:var(--accent)}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center;flex-wrap:wrap}
.nav a{padding:6px 11px;border-radius:7px;color:var(--ink-2);font-size:.88rem}
.nav a:hover{background:var(--paper-2);text-decoration:none;color:var(--ink)}
.nav a.on{color:var(--accent);background:var(--accent-soft)}
.iconbtn{border:1px solid var(--rule);background:var(--card);color:var(--ink-2);
  height:32px;min-width:32px;padding:0 8px;border-radius:8px;cursor:pointer;font-size:.85rem;
  display:inline-grid;place-items:center;font-family:inherit}
.iconbtn:hover{border-color:var(--rule-2);color:var(--ink)}

/* ---- hero ---- */
.hero{padding:56px 0 34px;border-bottom:1px solid var(--rule)}
.hero h1{font-family:var(--serif);font-size:clamp(1.9rem,4.4vw,2.9rem);line-height:1.25;margin:0 0 14px;letter-spacing:.02em}
.hero p{color:var(--ink-2);max-width:46em;margin:0 0 18px;font-size:1.02rem}
.stats{display:flex;gap:26px;flex-wrap:wrap;margin-top:22px}
.stat b{display:block;font-family:var(--serif);font-size:1.6rem;color:var(--accent);line-height:1.2}
.stat span{font-size:.8rem;color:var(--muted);letter-spacing:.06em}

/* ---- toolbar ---- */
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:22px 0 6px}
.search{flex:1;min-width:220px;position:relative}
.search input{width:100%;padding:9px 13px;border:1px solid var(--rule-2);border-radius:9px;
  background:var(--card);color:var(--ink);font:inherit;font-size:.92rem}
.search input:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent}
.chips{display:flex;gap:7px;flex-wrap:wrap;padding:12px 0 4px}
.chip{border:1px solid var(--rule-2);background:var(--card);color:var(--ink-2);
  padding:5px 11px;border-radius:999px;font-size:.82rem;cursor:pointer;font-family:inherit;white-space:nowrap}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.chip.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---- 書櫃 ---- */
.shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;padding:24px 0 60px}
.bk{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .16s ease,box-shadow .16s ease,border-color .16s}
.bk:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--rule-2)}
.bk a{color:inherit;display:flex;flex-direction:column;height:100%}
.bk a:hover{text-decoration:none}
.cover{aspect-ratio:3/4.2;position:relative;display:grid;place-items:center;overflow:hidden}
.cover .t{writing-mode:vertical-rl;font-family:var(--serif);font-weight:700;color:#fff;
  font-size:1.2rem;letter-spacing:.16em;text-shadow:0 1px 12px rgba(0,0,0,.4);
  max-height:80%;overflow:hidden;padding:10px 0}
.cover .yr{position:absolute;left:10px;bottom:9px;font-size:.68rem;color:rgba(255,255,255,.8);letter-spacing:.14em}
.cover .rec{position:absolute;right:8px;top:8px;background:rgba(255,255,255,.93);color:#8c2f28;
  font-size:.66rem;padding:3px 7px;border-radius:5px;font-weight:700;letter-spacing:.08em}
.bk-b{padding:13px 14px 15px;display:flex;flex-direction:column;gap:7px;flex:1}
.bk-t{font-family:var(--serif);font-weight:700;font-size:1rem;line-height:1.45;color:var(--ink)}
.bk:hover .bk-t{color:var(--accent)}
.bk-m{font-size:.75rem;color:var(--muted);letter-spacing:.04em}
.bk-d{font-size:.82rem;color:var(--ink-2);line-height:1.65;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:auto;padding-top:6px}
.tag{font-size:.68rem;color:var(--muted);background:var(--paper-2);padding:3px 7px;border-radius:4px;white-space:nowrap}

/* ---- 作品頁 ---- */
.bookhead{display:grid;grid-template-columns:200px 1fr;gap:32px;padding:34px 0 30px;align-items:start}
@media(max-width:640px){.bookhead{grid-template-columns:1fr;gap:20px}.bookhead .cover{max-width:170px}}
.bookhead .cover{border-radius:8px;box-shadow:var(--shadow)}
.bookhead h1{font-family:var(--serif);font-size:clamp(1.5rem,3.6vw,2.15rem);margin:0 0 12px;line-height:1.3}
.meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:.84rem;margin-bottom:14px}
.meta i{font-style:normal;color:var(--rule-2)}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 4px}
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 17px;border-radius:9px;font-size:.9rem;
  border:1px solid var(--rule-2);background:var(--card);color:var(--ink);cursor:pointer;font-family:inherit}
.btn:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.pri:hover{background:var(--accent-2);border-color:var(--accent-2);color:#fff}
section.blk{padding:30px 0;border-top:1px solid var(--rule)}
section.blk > h2{font-family:var(--serif);font-size:1.15rem;margin:0 0 16px;letter-spacing:.05em;
  display:flex;align-items:center;gap:10px}
section.blk > h2::before{content:"";width:3px;height:1em;background:var(--accent);border-radius:2px}
.synopsis{font-family:var(--serif);line-height:1.95;color:var(--ink-2);font-size:.98rem}
.synopsis p{margin:0 0 1em;text-indent:2em}
.spoiler{border:1px solid var(--rule-2);border-radius:9px;background:var(--paper-2);padding:0 16px;margin-bottom:16px}
.spoiler summary{cursor:pointer;padding:12px 0;font-size:.88rem;color:var(--ink-2);list-style:none}
.spoiler summary::-webkit-details-marker{display:none}
.spoiler summary::before{content:"\25B8  ";color:var(--accent)}
.spoiler[open] summary::before{content:"\25BE  "}
.spoiler[open]{padding-bottom:14px}
.toc{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px}
.toc a{padding:8px 11px;border-radius:6px;color:var(--ink-2);font-size:.87rem;
  display:flex;gap:9px;overflow:hidden;white-space:nowrap}
.toc a:hover{background:var(--paper-2);color:var(--accent);text-decoration:none}
.toc a .n{color:var(--muted);font-size:.76rem;min-width:2.6em;font-variant-numeric:tabular-nums}
.toc a .x{overflow:hidden;text-overflow:ellipsis}

/* ---- 閱讀頁 ---- */
.readbar{position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:1px solid var(--rule)}
.readbar-in{display:flex;align-items:center;gap:12px;height:52px}
.readbar .bt{font-size:.85rem;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:var(--serif)}
.readbar .sp{margin-left:auto;display:flex;gap:6px;align-items:center}
article.chapter{max-width:38em;margin:0 auto;padding:46px 20px 30px}
article.chapter h1{font-family:var(--serif);font-size:1.5rem;line-height:1.5;margin:0 0 6px;text-align:center;letter-spacing:.04em}
article.chapter .sub{text-align:center;color:var(--muted);font-size:.78rem;letter-spacing:.1em;margin-bottom:40px}
article.chapter .sub::after{content:"";display:block;width:44px;height:1px;background:var(--rule-2);margin:20px auto 0}
.body{font-family:var(--serif);font-size:var(--read-size);line-height:var(--read-lead);color:var(--ink);
  letter-spacing:.02em;text-align:justify}
.body p{margin:0;text-indent:2em}
.pager{max-width:38em;margin:0 auto;padding:10px 20px 70px;display:flex;gap:12px;align-items:stretch}
.pager a,.pager span{flex:1;padding:15px 16px;border:1px solid var(--rule);border-radius:10px;
  background:var(--card);font-size:.88rem;color:var(--ink-2);display:flex;flex-direction:column;gap:4px;min-width:0}
.pager a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.pager span{opacity:.35}
.pager .lb{font-size:.7rem;color:var(--muted);letter-spacing:.1em}
.pager .tt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--serif)}
.pager .r{text-align:right}
.prog{position:fixed;left:0;top:0;height:2px;background:var(--accent);z-index:60;width:0}

/* ---- 評論 ---- */
.prose{font-family:var(--serif);font-size:1.0rem;line-height:1.95;color:var(--ink)}
.prose h1{font-size:1.7rem;line-height:1.4;margin:0 0 8px;letter-spacing:.02em}
.prose h2{font-size:1.28rem;margin:2.2em 0 .8em;padding-bottom:.35em;border-bottom:1px solid var(--rule);letter-spacing:.03em}
.prose h3{font-size:1.08rem;margin:1.9em 0 .6em;color:var(--ink)}
.prose h4{font-size:.98rem;margin:1.5em 0 .5em;color:var(--ink-2)}
.prose p{margin:0 0 1.15em}
.prose ul,.prose ol{padding-left:1.6em;margin:0 0 1.15em}
.prose li{margin:.35em 0}
.prose blockquote{margin:1.2em 0;padding:.5em 1em .5em 1.1em;border-left:3px solid var(--accent);
  color:var(--ink-2);background:var(--paper-2);border-radius:0 6px 6px 0}
.prose blockquote p:last-child{margin-bottom:0}
.prose hr{border:0;border-top:1px solid var(--rule);margin:2.2em 0}
.prose code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.86em;background:var(--paper-2);
  padding:.15em .4em;border-radius:4px;color:var(--accent)}
.prose pre{background:var(--paper-2);padding:14px 16px;border-radius:8px;overflow-x:auto;border:1px solid var(--rule)}
.prose pre code{background:none;padding:0;color:var(--ink)}
.prose strong{font-weight:700;color:var(--ink)}
.tablewrap{overflow-x:auto;margin:0 0 1.4em;border:1px solid var(--rule);border-radius:8px}
.prose table{border-collapse:collapse;width:100%;font-family:var(--ui);font-size:.85rem;line-height:1.6}
.prose th,.prose td{padding:8px 12px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.prose th{background:var(--paper-2);font-weight:600;white-space:nowrap;color:var(--ink)}
.prose tr:last-child td{border-bottom:0}
.rvlist{display:grid;gap:14px;padding:20px 0 60px}
.rv{border:1px solid var(--rule);border-radius:var(--radius);padding:18px 20px;background:var(--card);
  display:block;color:inherit;transition:border-color .16s,transform .16s}
.rv:hover{border-color:var(--accent);transform:translateY(-2px);text-decoration:none}
.rv h3{font-family:var(--serif);margin:0 0 7px;font-size:1.06rem;color:var(--ink)}
.rv:hover h3{color:var(--accent)}
.rv .m{font-size:.76rem;color:var(--muted);letter-spacing:.05em;margin-bottom:8px}
.rv .x{font-size:.86rem;color:var(--ink-2);line-height:1.7;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.partnav{display:flex;gap:6px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);margin-bottom:26px}
.partnav a{font-size:.8rem;padding:5px 10px;border:1px solid var(--rule-2);border-radius:6px;color:var(--ink-2)}
.partnav a.on{background:var(--accent);border-color:var(--accent);color:#fff}
.partnav a:hover{text-decoration:none;border-color:var(--accent)}

.note{background:var(--paper-2);border:1px solid var(--rule);border-left:3px solid var(--accent);
  border-radius:0 8px 8px 0;padding:14px 18px;font-size:.86rem;color:var(--ink-2);line-height:1.75;margin:0 0 22px}
.crumb{font-size:.8rem;color:var(--muted);padding:18px 0 0}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--accent)}
footer.foot{border-top:1px solid var(--rule);margin-top:40px;padding:30px 0 50px;color:var(--muted);font-size:.8rem;line-height:1.9}
footer.foot a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
footer.foot a:hover{color:var(--accent)}
.srch-res{border:1px solid var(--rule);border-radius:9px;background:var(--card);margin-top:10px;max-height:440px;overflow-y:auto}
.srch-res a{display:block;padding:11px 15px;border-bottom:1px solid var(--rule);color:var(--ink-2);font-size:.87rem}
.srch-res a:last-child{border-bottom:0}
.srch-res a:hover{background:var(--paper-2);text-decoration:none}
.srch-res mark{background:var(--accent-soft);color:var(--accent);padding:0 2px;border-radius:3px}
.srch-res .w{font-size:.73rem;color:var(--muted);display:block;margin-bottom:3px;letter-spacing:.05em}
.empty{padding:40px 0;text-align:center;color:var(--muted);font-size:.9rem}

[hidden]{display:none!important}

/* ---- 設定集 wiki ---- */
.redlink{color:var(--muted);border-bottom:1px dotted var(--rule-2);cursor:help}
table.infobox{font-family:var(--ui);font-size:.85rem}
table.infobox td:first-child{width:6.5em;white-space:nowrap;color:var(--muted);
  background:var(--paper-2);font-weight:600}
.catchips{display:flex;gap:6px;flex-wrap:wrap;padding:26px 0 4px;border-top:1px solid var(--rule);margin-top:30px}
.catchips .chip{font-size:.76rem;text-decoration:none}
.catchips .chip:hover{text-decoration:none}
a.chip{display:inline-block;line-height:1.5}
.toc a.wk{justify-content:space-between}
.toc a.wk .n{min-width:0;text-align:right;opacity:.7}
#wikiwrap section.blk:first-child{border-top:0}
