/* ASA 課程簡介：只補 ../../public/assets/site.css 沒有的課表元件，顏色／字型／寬度全用它的 token。 */
/* site.css 給標題設 word-break:keep-all，長中文標題在手機寬會整行撐出去；照 public/asa.css 178–179 行同一招覆寫。 */
h1,h2,h3{word-break:normal; overflow-wrap:anywhere}
.track{display:inline-block; font-family:var(--mono); font-size:11px; letter-spacing:.14em; padding:3px 9px; border:1px solid var(--accent); color:var(--accent); border-radius:2px; vertical-align:middle; white-space:nowrap}
.track.boss{background:var(--accent); color:var(--paper)}
.track.joint{border-color:var(--ink); color:var(--ink)}
.band .slogan{color:var(--accent)}

.facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px 28px; margin:0; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.facts div{margin:0}
.facts dt{font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--ink-faint); text-transform:uppercase; margin-bottom:6px}
.facts dd{margin:0; font-size:15.5px; color:var(--ink)}
.facts .wide{grid-column:1/-1}

/* 總覽頁「給審查者的四題」：一題一個 article，標題掃過去就找得到答案 */
.qa{display:grid; gap:44px; max-width:48em}
.qa article{border-top:1px solid var(--line); padding-top:22px}
.qa .eyebrow{margin-bottom:8px}
.qa h3{font-size:clamp(20px,2.2vw,24px); line-height:1.45; margin:0 0 12px}
.qa p{margin:0 0 12px; color:var(--ink)}
.qa ul{margin:0 0 12px; padding-left:1.2em}
.qa li{margin:0 0 10px}
.qa table.plan{margin:6px 0 14px}

table.plan{width:100%; border-collapse:collapse; font-size:15px}
table.plan th{font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--ink-faint); text-align:left; font-weight:500; padding:0 12px 12px 0; border-bottom:1px solid var(--line)}
table.plan td{padding:16px 12px 16px 0; border-bottom:1px solid var(--line-soft); vertical-align:top; color:var(--ink)}
table.plan td.t{font-family:var(--mono); font-size:13px; color:var(--accent); white-space:nowrap; width:8em}
table.plan td.u{font-family:var(--serif); font-size:17px; font-weight:600; width:11em}
table.plan td.d{color:var(--ink-soft)}
table.plan tr.break td{color:var(--ink-faint); font-size:13.5px}
table.plan tfoot td{font-family:var(--mono); font-size:12px; color:var(--ink-faint); border-bottom:0; padding-top:12px}
@media(max-width:700px){
  table.plan thead{display:none}
  table.plan, table.plan tbody, table.plan tfoot, table.plan tr, table.plan td{display:block; width:auto}
  table.plan tr{padding:14px 0; border-bottom:1px solid var(--line-soft)}
  table.plan td{padding:2px 0; border:0}
  table.plan td.u, table.plan td.t{width:auto; padding-top:4px}
}

.takeaways{list-style:none; margin:0; padding:0; counter-reset:t}
.takeaways li{position:relative; padding:14px 0 14px 44px; border-bottom:1px solid var(--line-soft); counter-increment:t; font-size:16px}
.takeaways li::before{content:counter(t,decimal-leading-zero); position:absolute; left:0; top:16px; font-family:var(--mono); font-size:12px; color:var(--accent)}
.outputs{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin:0; padding:0; list-style:none}
.outputs li{padding:18px; border:1px solid var(--line); background:color-mix(in srgb, var(--paper) 70%, #fff)}
.outputs li b{display:block; font-family:var(--serif); font-size:18px; margin-bottom:6px}
.outputs li span{color:var(--ink-soft); font-size:14.5px}
.next{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:26px 0 0; border-top:1px solid var(--line)}
.next a{color:var(--accent); text-decoration:none}
.note{font-size:13.5px; color:var(--ink-faint)}
.prose li{margin:0 0 10px}

@media print{
  nav.top{display:none}
  .band{height:auto; display:block}
  .band-art{display:none}
  .band-copy{padding:40px 0}
  .section{padding:28px 0}
  table.plan tr{break-inside:avoid}
}
