/* 聖經全方位知識工程・研經模組共用樣式 */
:root{
  --bg:#f7f4ee; --card:#ffffff; --ink:#2b2620; --sub:#6b6257; --line:#e4ddd2;
  --accent:#8a5a2b; --accent-soft:#f0e6d8; --male:#2b6cb0; --male-bg:#e3edf7;
  --female:#b83a6c; --female-bg:#f9e6ee; --chip:#efe9df; --hover:#fbf8f2;
  --ot:#7a6a3f; --nt:#3f6a7a; --ok:#3f7a52;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#211d18; --card:#2b2620; --ink:#ece5da; --sub:#a89c8c; --line:#3d372f;
    --accent:#d3a05e; --accent-soft:#3a3227; --male:#7ab3e8; --male-bg:#25344a;
    --female:#e88ab0; --female-bg:#462a38; --chip:#38322a; --hover:#332d26;
    --ot:#cdb87a; --nt:#7ab8cd; --ok:#7acd96; }
}
*{box-sizing:border-box; margin:0; padding:0;}
body{background:var(--bg); color:var(--ink);
  font-family:"Microsoft JhengHei","PingFang TC","Noto Sans TC",sans-serif; line-height:1.65;}
header.site{background:var(--accent-soft); border-bottom:2px solid var(--accent);
  padding:1.1rem 1rem .8rem; text-align:center;}
header.site h1{font-size:1.45rem; letter-spacing:.1em; color:var(--accent);}
header.site .sub{color:var(--sub); font-size:.84rem; margin-top:.25rem;}
.nav{margin-top:.45rem; font-size:.8rem;}
.nav a{color:var(--accent); text-decoration:none; margin:.12rem .18rem; padding:.12rem .5rem;
  border:1px solid var(--accent); border-radius:13px; display:inline-block;}
.nav a.cur{background:var(--accent); color:#fff;}
.controls{position:sticky; top:0; z-index:50; background:var(--bg);
  border-bottom:1px solid var(--line); padding:.6rem .8rem;
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; justify-content:center;}
.controls input[type=search]{flex:1 1 200px; max-width:320px; padding:.45rem .8rem;
  border:1px solid var(--line); border-radius:20px; background:var(--card); color:var(--ink);}
.controls select, .controls input[type=number], .controls button{
  padding:.4rem .55rem; border:1px solid var(--line); border-radius:8px;
  background:var(--card); color:var(--ink); font-size:.9rem;}
.controls button.act{background:var(--accent); color:#fff; border-color:var(--accent); cursor:pointer;}
.jumpbar{display:flex; flex-wrap:wrap; gap:.2rem; justify-content:center;
  padding:.4rem .6rem; border-bottom:1px solid var(--line); font-size:.8rem;}
.jumpbar a{color:var(--accent); text-decoration:none; padding:.1rem .5rem; border-radius:6px;}
.jumpbar a:hover{background:var(--accent-soft);}
main{max-width:900px; margin:0 auto; padding:1rem .8rem 3rem;}
.cat-head{position:sticky; top:52px; z-index:10; background:var(--accent-soft); color:var(--accent);
  border-left:4px solid var(--accent); border-radius:4px;
  padding:.3rem .7rem; margin:1.3rem 0 .8rem; font-weight:bold;}
.cat-head small{font-weight:normal; font-size:.8rem; color:var(--sub);}
.kcard{background:var(--card); border:1px solid var(--line); border-radius:12px;
  padding:.85rem 1rem; margin-bottom:.85rem;}
.kcard h3{font-size:1.08rem; color:var(--accent); margin-bottom:.25rem;}
.kcard h3 .lite{font-weight:normal; font-size:.82rem; color:var(--sub);}
.kcard .sum{font-size:.92rem; text-align:justify;}
.kcard .meta{font-size:.85rem; color:var(--sub); margin-top:.3rem;}
.kcard .meta b{color:var(--ink); font-weight:normal;}
.keybox{margin:.5rem 0; padding:.45rem .8rem; background:var(--accent-soft);
  border-left:3px solid var(--accent); border-radius:0 8px 8px 0; font-size:.9rem;}
.pairline{display:flex; align-items:baseline; gap:.5rem; flex-wrap:wrap;}
.pairline .ot{color:var(--ot); font-weight:bold;}
.pairline .nt{color:var(--nt); font-weight:bold;}
.pairline .arrow{color:var(--accent);}
.chips{margin-top:.45rem; display:flex; flex-wrap:wrap; gap:.3rem; align-items:center;}
.chips .lbl{font-size:.78rem; color:var(--sub);}
.chip{font-size:.78rem; background:var(--chip); color:var(--accent); padding:.08rem .55rem;
  border-radius:11px; cursor:pointer; border:1px solid var(--line);}
.chip:hover{background:var(--accent); color:#fff;}
.tbl{width:100%; border-collapse:collapse; font-size:.88rem; background:var(--card);
  border:1px solid var(--line); border-radius:10px; overflow:hidden;}
.tbl th{background:var(--accent-soft); color:var(--accent); padding:.4rem .6rem; text-align:left;}
.tbl td{padding:.4rem .6rem; border-top:1px solid var(--line); vertical-align:top;}
.tbl tr:hover td{background:var(--hover);}
.tblwrap{overflow-x:auto; margin-bottom:1rem;}
.empty{color:var(--sub); text-align:center; padding:3rem 0;}
.hl{animation:kbhl 2s ease-out;}
@keyframes kbhl{0%{box-shadow:0 0 0 3px var(--accent);}100%{box-shadow:none;}}
/* 人物彈窗 */
.kb-overlay{display:none; position:fixed; inset:0; z-index:100; background:rgba(0,0,0,.55); padding:4vh 3vw;}
.kb-overlay.show{display:flex; align-items:flex-start; justify-content:center;}
.kb-modal{background:var(--card); border-radius:14px; max-width:720px; width:100%;
  max-height:88vh; overflow-y:auto; padding:1.4rem 1.6rem; position:relative;
  box-shadow:0 12px 40px rgba(0,0,0,.35);}
.kb-modal .close{position:absolute; top:.7rem; right:.9rem; border:none; background:none;
  font-size:1.5rem; color:var(--sub); cursor:pointer; line-height:1;}
.kb-modal h2{color:var(--accent); font-size:1.5rem;}
.kb-modal .pron{color:var(--sub); font-size:.85rem; margin:.15rem 0 .5rem;}
.badge{display:inline-block; padding:.05rem .5rem; border-radius:10px; background:var(--chip);
  color:var(--sub); font-size:.8rem; margin-right:.3rem;}
.badge.m{background:var(--male-bg); color:var(--male);}
.badge.f{background:var(--female-bg); color:var(--female);}
.kb-modal h3{font-size:.95rem; color:var(--accent); margin:.9rem 0 .3rem;
  border-left:3px solid var(--accent); padding-left:.5rem;}
.kb-modal .summary, .kb-modal .detail p{font-size:.95rem; text-align:justify;}
.kb-modal .detail p{margin-bottom:.7rem; text-indent:2em;}
.kb-modal .reflist{list-style:none;}
.kb-modal .reflist li{padding:.25rem 0 .25rem .2rem; border-bottom:1px dashed var(--line); font-size:.92rem;}
.famlinks a{color:var(--accent); text-decoration:none; margin-right:.6rem; cursor:pointer;}
.famlinks a:hover{text-decoration:underline;}
.famlinks{font-size:.92rem;}
footer{text-align:center; color:var(--sub); font-size:.78rem;
  padding:1rem .8rem 2rem; border-top:1px solid var(--line);}
