/* 符文戰場繁中觀測站 視覺主題「符文石」：深夜藍＋古銅金。
   這個檔案在每頁最後載入，覆蓋各頁內建樣式，集中管理色彩、字體、圓角與導覽外觀。
   - 頁首與手機底部導覽固定使用深夜藍（兩種模式都一樣），作為網站的識別。
   - 內容區：淺色模式是米白紙色、深色模式是深夜藍。 */

/* ---------- 色票 ---------- */
:root{
  --bg:#f3f1ec; --surface:#ffffff; --sunk:#ebe7de; --line:#dcd5c7;
  --fg:#17202e; --muted:#5f6675; --gold:#8f661c; --gold-soft:#f2e8d3; --scrim:rgba(10,18,30,.5);
  --bad:#b0261e; --bad-soft:#fae3df;
  --display:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --sans:"Noto Sans TC",-apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --shadow:0 -6px 28px rgba(14,26,43,.14); --pop:0 14px 40px rgba(14,26,43,.26);
  --r-lg:14px; --r-md:10px; --r-sm:7px;
  /* 頁首用的深夜藍 */
  --navy:#0f1b2d; --navy-2:#16263d; --navy-3:#1e3250; --navy-line:#2b4263; --navy-fg:#ece7dc; --navy-muted:#a5b0c1; --brass:#cfa65c;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0e1a2b; --surface:#15243a; --sunk:#1c2e48; --line:#2a3f5e;
  --fg:#ece7dc; --muted:#9eaabc; --gold:#cfa65c; --gold-soft:#2e2c25; --scrim:rgba(4,8,14,.66);
  --bad:#ff8f84; --bad-soft:#3b2025;
  --fury:#ec5e52; --calm:#52b874; --mind:#629ee3; --body:#ef984b; --chaos:#ab7fe0; --order:#dcbd42;
  --shadow:0 -6px 28px rgba(0,0,0,.5); --pop:0 14px 40px rgba(0,0,0,.6); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0e1a2b; --surface:#15243a; --sunk:#1c2e48; --line:#2a3f5e;
  --fg:#ece7dc; --muted:#9eaabc; --gold:#cfa65c; --gold-soft:#2e2c25; --scrim:rgba(4,8,14,.66);
  --bad:#ff8f84; --bad-soft:#3b2025;
  --fury:#ec5e52; --calm:#52b874; --mind:#629ee3; --body:#ef984b; --chaos:#ab7fe0; --order:#dcbd42;
  --shadow:0 -6px 28px rgba(0,0,0,.5); --pop:0 14px 40px rgba(0,0,0,.6); color-scheme:dark}

body{font-family:var(--sans);letter-spacing:.01em;-webkit-font-smoothing:antialiased}

/* ---------- 頁首：深夜藍，底下一條古銅金細線 ---------- */
.top,.bottomnav{
  --bg:var(--navy); --surface:var(--navy-2); --sunk:var(--navy-3); --line:var(--navy-line);
  --fg:var(--navy-fg); --muted:var(--navy-muted); --gold:var(--brass); --gold-soft:#33301f;
  color:var(--fg); color-scheme:dark;
}
.top{background:var(--navy)!important;border-bottom:0!important;box-shadow:inset 0 -1px 0 var(--navy-line),0 1px 0 rgba(207,166,92,.55)}
body::before{background:var(--navy)!important}
.brand{color:var(--navy-fg)!important;font-weight:900;letter-spacing:.06em}
.brand small{color:var(--brass)!important;font-family:var(--sans)!important;letter-spacing:.08em!important;font-weight:500}
.pagetitle{color:var(--navy-fg);font-weight:500;opacity:.85}
.top .pagetitle::before{content:"";display:inline-block;width:1px;height:14px;background:var(--navy-line);margin:0 10px 0 2px;vertical-align:-2px}

/* 電腦版分頁：文字＋選中時的金色底線 */
@media (min-width:1024px){
  .top .row1{min-height:64px;padding-block:0!important}
  .tabs{gap:2px!important;align-self:stretch}
  .tabs a{position:relative;height:auto!important;align-self:stretch;border-radius:0!important;background:none!important;padding:0 14px!important;color:var(--navy-muted)!important;font-weight:500!important;font-size:14.5px!important;letter-spacing:.04em}
  .tabs a:hover{color:var(--navy-fg)!important}
  .tabs a[aria-current="page"]{color:var(--navy-fg)!important;font-weight:700!important}
  .tabs a[aria-current="page"]::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--brass)}
}
@media (min-width:1024px) and (max-width:1279px){.tabs a{padding:0 10px!important}.tabs a[aria-current="page"]::after{left:10px;right:10px}}

/* 手機底部導覽 */
.bottomnav{background:var(--navy)!important;border-top:1px solid var(--navy-line)!important}
.bottomnav a{color:var(--navy-muted)!important;font-size:10.5px!important;letter-spacing:.02em}
.bottomnav a[aria-current="page"]{color:var(--navy-fg)!important}
.bottomnav a[aria-current="page"] svg{stroke:var(--brass)!important}
.bottomnav a[aria-current="page"]::before{content:"";position:absolute;top:0;width:28px;height:2px;border-radius:0 0 2px 2px;background:var(--brass)}
.bottomnav a{position:relative}

/* 頁首的搜尋框與按鈕 */
.top .search input{background:var(--navy-3)!important;color:var(--navy-fg)}
.top .search input::placeholder{color:var(--navy-muted)}
.top .search input:focus{background:#22385a!important;border-color:var(--brass)!important}
.top .fbtn{background:var(--navy-2)!important;border-color:var(--navy-line)!important;color:var(--navy-fg)}

/* 深淺色切換按鈕 */
.themebtn{flex:none;width:38px;height:38px;border-radius:var(--r-md);border:1px solid var(--navy-line);background:var(--navy-2);color:var(--navy-fg);display:inline-grid;place-items:center;padding:0;margin-left:auto}
.themebtn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.themebtn:hover{border-color:var(--brass)}
.row1 .search~.themebtn{margin-left:0}

/* ---------- 共用元件：圓角與按鈕統一 ---------- */
.btn{border-radius:var(--r-md)!important}
.btn.primary{background:var(--navy)!important;border-color:var(--navy)!important;color:var(--navy-fg)!important}
:root[data-theme="dark"] .btn.primary{background:var(--gold)!important;border-color:var(--gold)!important;color:#1a1408!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.primary{background:var(--gold)!important;border-color:var(--gold)!important;color:#1a1408!important}}
.pill{border-radius:999px;font-weight:500}
.pill[aria-pressed="true"]{background:var(--gold)!important;border-color:var(--gold)!important;color:#fff!important;font-weight:700}
.top .pill[aria-pressed="true"]{color:#18130a!important}
:root[data-theme="dark"] .pill[aria-pressed="true"]{color:#18130a!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pill[aria-pressed="true"]{color:#18130a!important}}
.chip[aria-pressed="true"]{background:var(--gold)!important;border-color:var(--gold)!important;color:#fff!important}
:root[data-theme="dark"] .chip[aria-pressed="true"]{color:#18130a!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip[aria-pressed="true"]{color:#18130a!important}}
.icobtn{border-radius:var(--r-sm)!important}
.kw{border-radius:4px}
.note,.ann,.lsec,.sec,.card,.doc,.stat{border-radius:var(--r-lg)}

/* 分頁按鈕 */
.pager button{border-radius:var(--r-sm)!important;font-weight:500!important}
.pager button[aria-current="page"]{background:var(--gold)!important;border-color:var(--gold)!important;color:#fff!important;font-weight:700!important}
:root[data-theme="dark"] .pager button[aria-current="page"]{color:#18130a!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pager button[aria-current="page"]{color:#18130a!important}}

/* 標題字體：章節標題用襯線字 */
.intro,.bar{letter-spacing:.01em}
.ann h2,.sec h2,.sec>header h2,.kwhead h2,main h2{font-family:var(--display);letter-spacing:.03em}

/* 頁尾 */
footer.site{border-top:0!important;position:relative;padding-top:26px!important}
footer.site::before{content:"";position:absolute;left:var(--gutter-l,16px);right:var(--gutter-r,16px);top:0;height:1px;background:linear-gradient(90deg,var(--gold),transparent 60%);opacity:.6}

/* 卡圖：細邊框讓整齊的網格更俐落 */
.pic,.art,.gp,.bp{box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.tile:hover .pic{box-shadow:0 0 0 2px var(--gold)}
.tile.sel .pic{box-shadow:0 0 0 3px var(--gold)!important}