/* library.css — 會員圖書館（登入 + 書本 PDF + 有聲書播放器）
   沿用站內色系：金／灰／黑／白（var(--gold) 等），與 site.css 變數一致。 */

/* ── 登入卡 ── */
.liblogin{max-width:860px;margin:0 auto;display:flex;gap:34px;align-items:flex-start;
  padding:34px 32px;border:1px solid var(--line);
  border-radius:16px;background:var(--panel);box-shadow:var(--shadow)}
.libcover{flex:0 0 210px;line-height:0}
.libcover img{width:100%;display:block;border-radius:10px;border:1px solid var(--line);
  box-shadow:0 18px 44px rgba(0,0,0,.28)}
.liblogin-body{flex:1;min-width:0}
.liblogin .lock{display:inline-flex;align-items:center;gap:8px;font-size:0.75rem;
  letter-spacing:.12em;color:var(--gold-lt);margin-bottom:16px}
.liblogin h2{margin:0 0 8px;font-size:1.25rem}
.liblogin p.sub{margin:0 0 22px;color:var(--muted);font-size:0.84375rem;line-height:1.6}
.libfield{margin-bottom:14px}
.libfield label{display:block;font-size:0.78125rem;color:var(--muted);margin-bottom:6px}
.libfield label .req{color:var(--gold-lt)}
.libfield input{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel2);color:var(--ink);font-size:0.9375rem}
.libfield input:focus{outline:2px solid var(--gold-lt);outline-offset:-1px;border-color:var(--gold)}
.libhp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.libmsg{min-height:20px;margin:10px 0 4px;font-size:0.8125rem;color:var(--gold-lt);line-height:1.5}
.libmsg.err{color:#e06c5a}
.libnote{margin-top:16px;padding-top:14px;border-top:1px solid var(--line2);font-size:0.78125rem;color:var(--muted);line-height:1.7}
.libnote a{color:var(--gold-lt)}

/* ── 圖書館主視圖 ── */
/* 由主選單的「登入」跳 #lib-login 時，避免錨點落在 sticky 頂欄（68px）之下（站內 .hubsec 同做法） */
#lib-login{scroll-margin-top:90px}

.libpanel{display:none}
.libpanel.on{display:block}
.libhead{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-bottom:8px}
.libwho{font-size:0.84375rem;color:var(--muted)}
.libwho b{color:var(--gold-lt)}

.libgrid{display:grid;grid-template-columns:1fr;gap:22px;padding:10px 0 60px}

/* ── 書本區 ── */
.bookcard{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:26px;
  display:flex;gap:22px;flex-wrap:wrap}
.bookcard .bc-cover{flex:0 0 auto;width:150px;border-radius:8px;overflow:hidden;border:1px solid var(--line2);line-height:0}
.bookcard .bc-cover img{width:100%;display:block}
.bookcard .bc-body{flex:1;min-width:260px}
.bookcard h2{margin:0 0 6px;font-size:1.25rem}
.bookcard .bc-meta{font-size:0.78125rem;color:var(--muted);margin:0 0 14px;line-height:1.6}
.bookcard .bc-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}

/* ── 書卡：關於本書／作者簡介／出版資料 ── */
.bc-info{margin-top:4px;padding-top:20px;border-top:1px solid var(--line2)}
.bc-block{padding:0 0 20px;margin-bottom:20px;border-bottom:1px solid var(--line2)}
.bc-block:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.bc-block h3{margin:0 0 10px;font-size:0.875rem;letter-spacing:.06em;color:var(--gold-lt)}
.bc-block h4{margin:18px 0 8px;font-size:0.8125rem;color:var(--ink)}
.bc-block p{margin:0 0 12px;font-size:0.84375rem;color:var(--ink2);line-height:1.85}
.bc-block p:last-child{margin-bottom:0}
.bc-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.bc-points li{position:relative;padding-left:16px;font-size:0.8125rem;color:var(--ink2);line-height:1.75}
.bc-points li::before{content:"";position:absolute;left:0;top:.65em;width:5px;height:5px;
  border-radius:50%;background:var(--gold)}
.bc-facts{margin:0;display:flex;flex-direction:column;gap:10px}
.bc-facts>div{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.bc-facts dt{flex:0 0 84px;font-size:0.75rem;color:var(--muted)}
.bc-facts dd{flex:1;min-width:200px;margin:0;font-size:0.8125rem;color:var(--ink2);line-height:1.7}
.bc-author-name{display:flex;flex-direction:column;gap:4px;margin-bottom:10px!important}
.bc-author-name b{font-size:0.9375rem;color:var(--ink)}
.bc-author-name span{font-size:0.75rem;color:var(--gold-lt)}
.bc-author-books{font-size:0.78125rem!important;color:var(--muted)!important;
  padding-top:10px;border-top:1px solid var(--line2)}
/* 閱讀器：置於書卡／有聲書兩欄之下，橫跨整個內容寬度，
   並盡量貼近視窗高度，讓 A4 整頁可完整顯示、減少內部捲動。 */
.pdfwrap{margin-top:16px;border:1px solid var(--line2);border-radius:12px;overflow:hidden;background:var(--bg2)}
.pdfwrap iframe{width:100%;height:calc(100vh - 120px);min-height:900px;border:0;display:block}

/* ── 有聲書區 ── */
.audiopanel{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:26px}
.audiopanel h2{margin:0 0 6px;font-size:1.25rem}
.audiopanel .au-lead{margin:0 0 18px;color:var(--muted);font-size:0.84375rem;line-height:1.6}
.player{position:sticky;top:0;z-index:5;padding:14px;border:1px solid var(--line);
  border-radius:12px;background:var(--panel2);box-shadow:var(--shadow);margin-bottom:20px}
.player .now{font-size:0.8125rem;color:var(--muted);margin-bottom:8px;line-height:1.5}
.player .now b{color:var(--gold-lt)}
.player audio{width:100%;display:block}

.audiopart{margin-bottom:8px;border:1px solid var(--line2);border-radius:12px;overflow:hidden;background:var(--panel)}
.audiopart>button{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:15px 18px;background:transparent;border:0;color:var(--ink);
  font-family:inherit;font-size:0.9375rem;font-weight:600;cursor:pointer}
.audiopart>button:hover{background:rgba(217,180,81,.08)}
.audiopart>button .cnt{font-size:0.75rem;color:var(--muted);font-weight:400}
.audiopart>button .cr{flex:0 0 auto;transition:transform .2s}
.audiopart.open>button .cr{transform:rotate(180deg)}
.audiopart .tracks{display:none;border-top:1px solid var(--line2)}
.audiopart.open .tracks{display:block}
.audiopart .track{display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  padding:12px 18px;background:transparent;border:0;color:var(--ink2);cursor:pointer;
  font-family:inherit;font-size:0.84375rem;line-height:1.5}
.audiopart .track:hover{background:rgba(217,180,81,.1);color:var(--ink)}
.audiopart .track .play{flex:0 0 auto;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;font-size:0.75rem;color:var(--gold-lt)}
.audiopart .track.on{color:var(--ink)}
.audiopart .track.on .play{background:linear-gradient(140deg,var(--gold-lt),var(--gold));color:#141108;border-color:transparent}
.audiopart .track .dur{flex:0 0 auto;font-size:0.75rem;color:var(--muted)}

@media (min-width:900px){
  .libgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .bookcard{flex-direction:column}
}

@media (max-width:640px){
  .liblogin{flex-direction:column;gap:22px;padding:26px 22px}
  .libcover{flex:0 0 auto;max-width:150px;margin:0 auto}
}

/* ── AI Agent Skill 精選（會員登入後顯示）── */
.skillsec{margin-top:34px;padding-top:30px;border-top:1px solid var(--line2)}
.skill-head{max-width:820px}
.skill-head h2{margin:0 0 10px;font-size:1.5rem}
.skill-lead{margin:0 0 20px;color:var(--muted);font-size:0.875rem;line-height:1.75}
.skill-dlbox{display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  padding:16px 18px;border:1px solid var(--line2);border-radius:12px;background:var(--bg2)}
.skill-dlmeta{font-size:0.78125rem;color:var(--muted);line-height:1.65;min-width:220px;flex:1}
.skill-dlmeta .dim{color:var(--muted);opacity:.8}

.skillgroup{margin-top:34px}
.skillgroup h3{margin:0 0 6px;font-size:1.0625rem;color:var(--gold-lt)}
.skillgroup .sg-lead{margin:0 0 16px;color:var(--muted);font-size:0.8125rem;line-height:1.7;max-width:760px}

.skillgrid{display:grid;grid-template-columns:1fr;gap:16px}
.skillcard{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:20px 20px 16px;
  display:flex;flex-direction:column;gap:10px}
.skillcard .sc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.skillcard h4{margin:0;font-size:0.96875rem;line-height:1.4}
.skillcard .sc-badge{flex:0 0 auto;font-size:0.6875rem;color:var(--gold-lt);
  border:1px solid var(--line);border-radius:999px;padding:3px 9px;white-space:nowrap}
.skillcard .sc-what{margin:0;font-size:0.84375rem;color:var(--ink2);line-height:1.7}
.skillcard .sc-workh{margin:4px 0 0;font-size:0.75rem;letter-spacing:.06em;color:var(--muted)}
.skillcard .sc-work{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.skillcard .sc-work li{position:relative;padding-left:15px;font-size:0.8125rem;color:var(--ink2);line-height:1.65}
.skillcard .sc-work li::before{content:"";position:absolute;left:0;top:.62em;
  width:5px;height:5px;border-radius:50%;background:var(--gold)}
.skillcard .sc-foot{margin:6px 0 0;padding-top:11px;border-top:1px solid var(--line2);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:0.71875rem;color:var(--muted)}
.skillcard .sc-repo{font-family:var(--font-mono,ui-monospace,monospace);color:var(--ink2)}
.skillcard .sc-lic{flex:1;min-width:90px}
.skillcard .sc-link{color:var(--gold-lt);text-decoration:none;white-space:nowrap}
.skillcard .sc-link:hover{text-decoration:underline}
.skill-note{margin:26px 0 0;font-size:0.75rem;color:var(--muted);line-height:1.7}

@media (min-width:900px){
  .skillgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .skillcard .sc-top{flex-direction:column;gap:6px}
}

/* ── 每日精選 AI Agent Skill（未登入＝說明區；登入後＝今日精選）── */
.is-hidden{display:none!important}

.dailysec{border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:var(--shadow)}
#lib-teaser{max-width:860px;margin:30px auto 0;padding:30px 32px}
#lib-daily{max-width:none;margin:0 0 26px;padding:26px 28px}
.dailysec h2{margin:10px 0 12px;font-size:1.375rem;line-height:1.35}
.dailysec .eyebrow{margin-bottom:0}
.daily-lead{margin:0 0 18px;color:var(--muted);font-size:0.875rem;line-height:1.85}

.daily-benefits{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:10px}
.daily-benefits li{position:relative;padding-left:26px;font-size:0.875rem;color:var(--ink2);line-height:1.7}
.daily-benefits li::before{content:"";position:absolute;left:6px;top:.55em;width:7px;height:7px;
  border-radius:50%;background:linear-gradient(140deg,var(--gold-lt),var(--gold))}

.daily-lock{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;margin-bottom:18px;
  border:1px dashed var(--line);border-radius:12px;background:var(--bg2)}
.daily-lock .dl-icon{flex:0 0 auto;font-size:1.125rem;line-height:1.4}
.daily-lock .dl-h{margin:0 0 4px;font-size:0.875rem;font-weight:500;color:var(--gold-lt)}
.daily-lock .dl-p{margin:0;font-size:0.78125rem;color:var(--muted);line-height:1.7}

.daily-today{border-color:var(--gold);border-width:1px;
  background:linear-gradient(180deg,rgba(217,180,81,.07),transparent 42%),var(--panel)}
.daily-today h2{font-size:1.5rem}
.daily-src{margin:0 0 14px;font-size:0.75rem;color:var(--muted);
  display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.daily-src #daily-repo{font-family:var(--font-mono,ui-monospace,monospace);color:var(--ink2)}
.daily-stars{flex:0 0 auto;font-size:0.6875rem;color:var(--gold-lt);
  border:1px solid var(--line);border-radius:999px;padding:3px 9px}
.daily-what{margin:0 0 16px;font-size:0.9375rem;color:var(--ink2);line-height:1.8}
.daily-workh{margin:0 0 8px;font-size:0.75rem;letter-spacing:.06em;color:var(--muted)}
.daily-work{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:9px}
.daily-work li{position:relative;padding-left:16px;font-size:0.84375rem;color:var(--ink2);line-height:1.75}
.daily-work li::before{content:"";position:absolute;left:0;top:.65em;width:5px;height:5px;
  border-radius:50%;background:var(--gold)}
.daily-foot{margin:0 0 4px;font-size:0.78125rem}
.daily-foot a{color:var(--gold-lt);text-decoration:none}
.daily-foot a:hover{text-decoration:underline}
.daily-more{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line2);font-size:0.78125rem}
.daily-more a{color:var(--muted);text-decoration:none}
.daily-more a:hover{color:var(--gold-lt)}

@media (max-width:640px){
  .dailysec{margin-top:22px;padding:24px 22px}
  .dailysec h2{font-size:1.1875rem}
}


