/* S2 首頁主動提示樣式。沿用 studio.css 的變數，深淺主題共用同一組分工。 */

/* ---- 今天先做這三件 ---- */
.studio-priority-list {list-style:none; margin:0; padding:0; display:grid; gap:14px;}
.studio-priority-card {
  background:var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:18px 20px; position:relative; overflow:hidden;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.studio-priority-card::before {
  content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--accent);
}
.studio-priority-card.level-high::before {background:var(--studio-solid);}
.studio-priority-card.level-watch::before {background:var(--studio-hot);}
.studio-priority-card:hover {border-color:var(--accent); box-shadow:var(--studio-shadow);}

.priority-head {display:flex; align-items:flex-start; gap:14px;}
.priority-rank {
  flex:0 0 auto; width:28px; height:28px; border-radius:9px;
  display:grid; place-items:center; font-weight:700; font-size:.88rem;
  background:var(--accent-soft); color:var(--accent);
}
.priority-main {flex:1 1 auto; min-width:0;}
.priority-name {display:flex; align-items:center; gap:9px; flex-wrap:wrap;}
.priority-name strong {font-size:1.04rem; letter-spacing:.01em;}
.priority-level {
  font-size:.72rem; font-weight:700; padding:2px 9px; border-radius:99px;
  background:var(--soft); color:var(--muted);
}
.level-high .priority-level {background:var(--coral-soft); color:var(--studio-solid);}
.level-watch .priority-level {background:var(--gold-soft); color:var(--warning);}
.priority-headline {margin:5px 0 0; color:var(--ink); line-height:1.6;}
.priority-metric {flex:0 0 auto; text-align:right;}
.priority-metric strong {display:block; font-size:1rem; white-space:nowrap;}
.priority-metric small {display:block; color:var(--muted); font-size:.76rem; margin-top:2px;}

.priority-action {
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin-top:14px; padding-top:13px; border-top:1px dashed var(--line);
}
.priority-action-text {flex:1 1 auto; min-width:0;}
.priority-action-text strong {display:block; font-size:.95rem;}
.priority-action-text small {display:block; color:var(--muted); font-size:.8rem; margin-top:2px;}
.priority-action .text-button {flex:0 0 auto; display:inline-flex; align-items:center; gap:4px;}

.priority-detail {margin-top:15px; display:grid; gap:14px;}
.priority-block h4 {
  margin:0 0 7px; font-size:.74rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:var(--muted);
}
.priority-why, .priority-evidence {list-style:none; margin:0; padding:0; display:grid; gap:7px;}
.priority-why li, .priority-evidence li {
  display:flex; gap:10px; align-items:baseline; font-size:.92rem; line-height:1.6;
}
.priority-why li span, .priority-evidence li span {
  flex:0 0 auto; min-width:52px; font-size:.74rem; font-weight:700;
  padding:2px 8px; border-radius:6px; text-align:center;
  background:var(--soft); color:var(--muted);
}
.priority-evidence li.tone-risk span {background:var(--coral-soft); color:var(--studio-solid);}
.priority-evidence li.tone-warn span {background:var(--gold-soft); color:var(--warning);}
.priority-evidence li.tone-watch span {background:var(--gold-soft); color:var(--warning);}
.priority-evidence li.tone-ok span {background:var(--mint-soft); color:var(--series-purple);}
.priority-evidence li.tone-info span {background:var(--accent-soft); color:var(--accent);}

.priority-judgement, .priority-suggestion {margin:0; line-height:1.68; font-size:.93rem;}
.priority-judgement {
  padding:11px 14px; border-radius:11px; background:var(--soft); color:var(--ink);
}
.priority-suggestion {color:var(--muted);}
.priority-followup {
  justify-self:start; display:inline-flex; align-items:center; gap:5px;
  border:1px solid var(--line); background:transparent; color:var(--accent);
  border-radius:10px; padding:8px 14px; font-size:.88rem; cursor:pointer;
  font-family:inherit; transition:background .16s ease, border-color .16s ease;
}
.priority-followup:hover {background:var(--accent-soft); border-color:var(--accent);}

/* ---- 其他提醒 ---- */
/* 同上：summary 有 20px，展開後的清單要對齊，不然展開就貼邊。 */
.studio-reminder-list {display:grid; gap:11px; padding:0 20px 20px;}
.studio-reminder {
  background:var(--soft); border-radius:13px; padding:14px 16px;
  border-left:3px solid var(--line);
}
.studio-reminder.tone-ok {border-left-color:var(--series-purple);}
.studio-reminder.tone-warn {border-left-color:var(--warning);}
.studio-reminder.tone-watch {border-left-color:var(--studio-hot);}
.studio-reminder.tone-info {border-left-color:var(--accent);}
.reminder-head {display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:6px;}
.reminder-group {
  font-size:.7rem; font-weight:700; letter-spacing:.05em; padding:2px 8px;
  border-radius:99px; background:var(--paper); color:var(--muted);
}
.reminder-head strong {font-size:.92rem;}
/* 這則是誰算出來的。SERP 提供規則計算，跨系統關聯與語意判斷在 AI-Brain 這側。 */
.reminder-engine {
  font-size:.68rem; font-weight:600; letter-spacing:.02em; padding:2px 8px;
  border-radius:99px; border:1px solid var(--line); color:var(--muted); white-space:nowrap;
}
.reminder-engine.by-serp {border-color:var(--series-sky); color:var(--series-sky);}
.reminder-engine.by-ai-brain {border-color:var(--accent); color:var(--accent);}

/* 原稿與買方風險是兩張獨立的卡片。styles.css 把這一欄的內距歸零後兩者之間沒有任何間隔，
   兩個框會黏成一塊，和「建議下一步」原本那個問題是同一類。 */
.order-original {display:grid; gap:14px; align-content:start;}

/* 異常簽認：系統已判定是合理大單，但金額超出額度，所以把責任交回給人。
   沒簽不能建單，所以用警示色；簽完轉成中性，讓待辦一眼看得出剩幾項。 */
.order-signoff {display:grid; gap:10px; margin:14px 0 0;}
.order-signoff article {
  border:1px solid var(--warning); border-radius:11px; padding:13px 15px;
  background:var(--paper); transition:border-color .15s ease, background .15s ease;
}
.order-signoff article.signed {border-color:var(--line); background:var(--soft);}
.order-signoff label {display:grid; grid-template-columns:20px minmax(0,1fr); gap:11px; align-items:start; cursor:pointer;}
.order-signoff input {margin:2px 0 0; accent-color:var(--warning); width:16px; height:16px;}
.order-signoff strong {display:block; font-size:.9rem; line-height:1.6;}
.order-signoff small {display:block; margin-top:5px; font-size:.79rem; line-height:1.65; color:var(--muted);}
.order-signoff article.signed strong {color:var(--muted);}

/* 下單前檢查：三道規則的結果放前面，最後一句才是合併判斷。 */
.order-preflight {
  margin:0 0 14px; padding:15px 17px; border-radius:13px;
  border:1px solid var(--line); border-left:3px solid var(--series-sky); background:var(--paper);
}
.order-preflight.is-warning {border-left-color:var(--warning);}
.preflight-head {display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:7px;}
.preflight-head strong {font-size:.92rem;}
.preflight-result {font-size:.74rem; font-weight:600; padding:2px 9px; border-radius:99px; background:var(--soft); color:var(--muted);}
.order-preflight.is-warning .preflight-result {color:var(--warning);}
.preflight-summary {margin:0; font-size:.86rem; line-height:1.65; color:var(--muted);}
.preflight-checks {list-style:none; margin:11px 0 0; padding:0; display:grid; gap:8px;}
.preflight-checks li {display:grid; grid-template-columns:18px 88px minmax(0,1fr); gap:9px; align-items:baseline; font-size:.84rem; line-height:1.6;}
.preflight-checks .check-mark {font-weight:700; text-align:center;}
.preflight-checks .check-label {font-weight:600;}
.preflight-checks .check-text {color:var(--muted);}
.preflight-checks .check-pass .check-mark {color:var(--series-purple);}
.preflight-checks .check-warn .check-mark {color:var(--warning);}
.preflight-checks .check-fail .check-mark {color:var(--studio-solid);}
.preflight-advice {margin:11px 0 0; padding-top:10px; border-top:1px solid var(--line); font-size:.86rem; line-height:1.7;}

/* 完整版講稿：分項說法之後的整合稿，業務可以整段複製貼進信件。常駐不收合——
   要用的時候就是要用，多一次點擊反而礙事。 */
.full-script {margin:14px 0 0; padding:17px 19px; border:1px solid var(--line); border-radius:13px; background:var(--paper);}
.full-script-head {display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px;}
.full-script-head strong {display:block; font-size:.92rem;}
.full-script-head span {display:block; margin-top:3px; font-size:.76rem; color:var(--muted);}
.full-script-subject {margin:0 0 10px; font-size:.86rem; font-weight:600;}
.full-script-body {font-size:.87rem; line-height:1.95; white-space:pre-line;}
.full-script small {display:block; margin-top:12px; padding-top:10px; border-top:1px solid var(--line); font-size:.72rem; color:var(--muted);}

/* 建議下一步的講稿：預設收合，展開才看得到。內容是生成的，所以在末尾標一句提醒。 */
.action-script {margin:10px 0 0; border:1px solid var(--line); border-radius:9px; background:var(--paper);}
.action-script summary {display:flex; align-items:center; gap:6px; padding:8px 11px; cursor:pointer; font-size:.8rem; color:var(--accent); list-style:none;}
.action-script summary::-webkit-details-marker {display:none;}
.action-script p {margin:0 11px 8px; font-size:.85rem; line-height:1.75; white-space:pre-line;}
.action-script > p:first-of-type {margin-top:2px;}
.action-script small {display:block; padding:0 11px 10px; font-size:.72rem; color:var(--muted);}
.reminder-note {margin-left:auto; font-size:.76rem; color:var(--muted);}
.reminder-title {margin:0 0 5px; font-size:.95rem; line-height:1.55; font-weight:600;}
.reminder-detail {margin:0; font-size:.88rem; line-height:1.65; color:var(--muted);}
.reminder-samples {
  list-style:none; margin:9px 0 0; padding:9px 0 0; display:grid; gap:5px;
  border-top:1px dashed var(--line);
}
.reminder-samples li {
  font-size:.82rem; line-height:1.55; color:var(--muted);
  padding-left:14px; position:relative;
}
.reminder-samples li::before {
  content:""; position:absolute; left:2px; top:.62em; width:4px; height:4px;
  border-radius:50%; background:var(--muted); opacity:.6;
}

/* ---- 效期將至的批次 ---- */
/* 容器本身沒有內距、只有標題那列有 20px，所以內容要自己補齊左右下，否則直接貼著邊框。 */
.studio-expiry-body {display:grid; gap:12px; padding:0 20px 20px;}
.expiry-summary {margin:0; font-size:.9rem; line-height:1.6; color:var(--muted);}
.studio-expiry-list {list-style:none; margin:0; padding:0; display:grid; gap:10px;}
.studio-expiry-list > li {
  background:var(--soft); border-radius:13px; padding:13px 15px;
  border-left:3px solid var(--line);
}
.studio-expiry-list > li.level-urgent {border-left-color:var(--studio-solid);}
.studio-expiry-list > li.level-soon {border-left-color:var(--studio-hot);}
.studio-expiry-list > li.level-cleared {border-left-color:var(--series-purple); opacity:.78;}
.expiry-row {display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;}
.expiry-product {flex:1 1 180px; min-width:0;}
.expiry-product strong {display:block; font-size:.95rem;}
.expiry-product small {display:block; font-size:.76rem; color:var(--muted); margin-top:2px;}
.expiry-qty {flex:0 0 auto; text-align:right;}
.expiry-qty strong {display:block; font-size:.92rem; white-space:nowrap;}
.expiry-qty small {display:block; font-size:.74rem; color:var(--muted);}
.expiry-days {
  flex:0 0 auto; font-size:.8rem; font-weight:700; padding:3px 10px;
  border-radius:99px; background:var(--paper); color:var(--muted); white-space:nowrap;
}
.level-urgent .expiry-days {background:var(--coral-soft); color:var(--studio-solid);}
.level-soon .expiry-days {background:var(--gold-soft); color:var(--warning);}
.expiry-match {
  margin:10px 0 0; padding-top:9px; border-top:1px dashed var(--line);
  font-size:.87rem; line-height:1.6; display:flex; gap:9px; align-items:baseline;
}
.expiry-match span {
  flex:0 0 auto; font-size:.76rem; font-weight:700; padding:2px 9px;
  border-radius:6px; background:var(--accent-soft); color:var(--accent);
}
.expiry-note {margin:4px 0 0; font-size:.8rem; color:var(--muted); line-height:1.55;}

/* ---- 窄螢幕 ---- */
@media (max-width:640px) {
  .studio-priority-card {padding:15px 16px;}
  .priority-head {flex-wrap:wrap;}
  .priority-metric {text-align:left; width:100%; padding-left:42px;}
  .priority-metric strong {display:inline; margin-right:7px;}
  .priority-metric small {display:inline;}
  .priority-why li, .priority-evidence li {flex-direction:column; gap:3px;}
  .priority-why li span, .priority-evidence li span {align-self:flex-start; min-width:0;}
  .priority-action {align-items:flex-start;}
  .priority-action .text-button {margin-left:0;}
  .expiry-row {gap:8px;}
  .expiry-qty {text-align:left;}
  .reminder-note {margin-left:0; width:100%;}
}
@media (max-width:360px) {
  .studio-priority-card {padding:14px;}
  .priority-metric {padding-left:0;}
  .priority-followup {width:100%; justify-content:space-between;}
}

/* ---- 表格：提示列與自訂順序 ----
   只有資料帶 rowHints／draggable 的表格才會用到，S1 的表格不受影響。 */
.result-table tbody tr.row-alert td {background:var(--coral-soft);}
.result-table tbody tr.row-warn td {background:var(--gold-soft);}
.result-table tbody tr.row-ok td {background:var(--mint-soft);}
.result-table tbody tr.row-info td {background:var(--accent-soft);}

/* 提示同時給文字，不只靠顏色 */
.row-hint {
  display:inline-block; margin-left:8px; padding:1px 8px; border-radius:99px;
  font-size:.7rem; font-weight:700; white-space:nowrap;
  background:var(--paper); color:var(--muted);
}
.row-alert .row-hint {color:var(--studio-solid);}
.row-warn .row-hint {color:var(--warning);}
.row-ok .row-hint {color:var(--series-purple);}
.row-info .row-hint {color:var(--accent);}

/* 拖移把手獨立一欄，避免跟選取文字、點開明細打架 */
.result-table th.row-handle-head {width:34px; white-space:nowrap; padding-right:0;}
.handle-head-label {
  font-size:0; /* 標題欄只留空間，不佔字寬 */
}
.handle-head-label::after {content:"↕"; font-size:.78rem; color:var(--muted);}
.result-table td.row-handle {
  width:34px; white-space:nowrap; cursor:grab; user-select:none;
  color:var(--muted); vertical-align:middle; padding-right:0;
}
.result-table tbody tr[draggable="true"]:active td.row-handle {cursor:grabbing;}
.handle-grip {display:block; text-align:center; font-size:.9rem; line-height:1; opacity:.5;}
.handle-nudge {display:flex; justify-content:center; gap:1px; margin-top:2px;}
.handle-nudge button {
  border:none; background:none; color:var(--muted); cursor:pointer;
  font-size:.6rem; line-height:1; padding:1px 2px; font-family:inherit;
}
.handle-nudge button:hover:not(:disabled) {color:var(--accent);}
.handle-nudge button:disabled {opacity:.3; cursor:default;}

/* 放下位置的插入指示 */
.result-table tbody tr.row-dragover td {
  box-shadow:inset 0 2px 0 var(--accent);
}

.table-order-note {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin:0 0 10px; padding:8px 13px; border-radius:10px;
  background:var(--accent-soft); color:var(--accent);
  font-size:.83rem; font-weight:600;
}
.table-order-note .text-button {margin-left:auto;}

@media (max-width:640px) {
  .result-table th.row-handle-head, .result-table td.row-handle {width:40px;}
  .handle-nudge {display:none;}
  .row-hint {margin-left:0; margin-top:3px; display:block; width:fit-content;}
}

/* ---- 非訂單文件的分析 ----
   辨識完不該只回一句「不能建單」，要看得出這是什麼文件、講了什麼、要做什麼。 */
.doc-analysis {margin:14px 0 4px; display:grid; gap:18px;}
.doc-overview {
  margin:0; padding:13px 16px; border-radius:11px;
  background:var(--soft); line-height:1.75; font-size:.93rem;
}
.doc-highlights {display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px;}
.doc-highlights > div {
  border:1px solid var(--line); border-radius:10px; padding:11px 13px; background:var(--paper);
}
.doc-highlights span {
  display:inline-block; font-size:.72rem; font-weight:700; padding:2px 8px;
  border-radius:99px; background:var(--accent-soft); color:var(--accent); margin-bottom:6px;
}
.doc-highlights p {margin:0; font-size:.85rem; line-height:1.65; color:var(--muted);}

.doc-analysis h3 {
  font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); margin:0 0 9px;
}
.doc-decisions {margin:0; padding-left:20px; display:grid; gap:11px;}
.doc-decisions li strong {font-size:.94rem;}
.doc-decisions li p {margin:3px 0 0; font-size:.86rem; line-height:1.65; color:var(--muted);}
.doc-decisions li span {
  display:inline-block; margin-top:5px; font-size:.74rem; font-weight:700;
  padding:2px 9px; border-radius:99px; background:var(--soft); color:var(--muted);
}
.doc-actions {list-style:none; margin:0; padding:0; display:grid; gap:8px;}
.doc-actions li {
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  border:1px solid var(--line); border-left:3px solid var(--studio-hot);
  border-radius:10px; padding:10px 14px; background:var(--paper);
}
.doc-actions strong {display:block; font-size:.9rem;}
.doc-actions small {display:block; font-size:.76rem; color:var(--muted); margin-top:2px;}
.doc-action-meta {margin-left:auto; text-align:right; white-space:nowrap;}
.doc-action-meta span {display:block; font-size:.82rem; font-weight:600;}
.doc-action-meta em {display:block; font-size:.75rem; color:var(--warning); font-style:normal;}
.doc-mentions {display:flex; flex-wrap:wrap; gap:6px;}
.doc-mentions span {
  font-size:.78rem; padding:3px 10px; border-radius:99px;
  background:var(--soft); color:var(--muted);
}
@media (max-width:640px) {
  .doc-action-meta {margin-left:0; text-align:left;}
  .doc-actions li {flex-direction:column; align-items:flex-start; gap:6px;}
}

/* ---- 表格欄位對齊 ----
   styles.css 的 `th, td { text-align: right }` 讓單號、客戶、日期都貼在右邊。
   整欄都是數字才靠右，其餘一律靠左。 */
/* 表格是滿版的，而全域的 th/td 只有 10px 左右內距，首尾欄的內容幾乎貼著表格邊；
   表頭那整條灰底又是直角，於是在圓角卡片裡看起來直接頂到邊——上下的文字都有 20 幾 px
   留白，那一塊就特別突兀。首尾欄加大留白，表頭列收圓角。
   這是 .result-table 的共用規則，對話、GenBI、Dashboard、覆核與訂單明細會一起改到。 */
.result-table th:first-child, .result-table td:first-child {padding-left:16px;}
.result-table th:last-child, .result-table td:last-child {padding-right:16px;}
/* 拖移把手是固定寬度的窄欄，不跟著加寬 */
.result-table th.row-handle-head, .result-table td.row-handle {padding-left:8px;}
.result-table thead th:first-child {border-radius:8px 0 0 8px;}
.result-table thead th:last-child {border-radius:0 8px 8px 0;}
/* 範例原稿是刻意模擬紙本單據，不套上面那組圓角與留白（加了就不像紙本），
   但首尾欄原本只有 6px，貼著紙張邊太緊，放寬一些就好。 */
.paper-order td:first-child, .paper-order th:first-child {padding-left:12px;}
.paper-order td:last-child, .paper-order th:last-child {padding-right:12px;}

/* 表格區塊當附屬內容用時，styles.css 把左右內距歸零（訂單明細 `padding:16px 0 0`、
   GenBI 證據 `padding:17px 0 0`），於是標題、表格與註腳全部貼齊區塊邊界，
   表頭那條灰底看起來撐到底。這跟「表格卡片離外層卡片多遠」是兩件事——
   問題在區塊內部沒有留白。補上左右內距，內容與邊線之間才有呼吸空間。 */
.order-result .result-table {padding:16px 18px 0;}
.report-evidence .result-table {padding:17px 18px 0;}

.result-table th:not(.num), .result-table td:not(.num) {text-align:left;}
.result-table th.num, .result-table td.num {text-align:right;}
.result-table td.row-handle {text-align:center;}

/* ---- 覆核視窗：固定表頭與頁尾 ----
   sticky 的 top／bottom 是相對「捲動容器的 padding box」量的。容器只要有上下內距，
   表頭上方與頁尾下方就各留一道縫，內容捲過去會從縫裡露出來——展開新聞來源時最明顯。
   ⚠️ 選擇器必須是 .q-dialog .upgraded-order，才蓋得過 styles.css:863 的
   `.q-dialog .upgraded-order {padding:26px}`。2026-09-21 之前只寫 .upgraded-order，
   特異性較低，那條修正從來沒生效過。
   容器上下不留內距，表頭與頁尾各自用負 margin 撐滿並自己補回間距。 */
.q-dialog .upgraded-order {padding:0 26px;}
.q-dialog .upgraded-order > .dialog-header {
  margin:0 -26px; padding:22px 26px 14px;
  position:sticky; top:0; z-index:4; background:var(--paper);
  border-bottom:1px solid var(--line);
}
.q-dialog .upgraded-order > .order-dialog-footer {margin:20px -26px 0; padding:17px 26px;}
.q-dialog .upgraded-order > .order-stepper {margin-top:16px;}
@media (max-width:900px){
  .q-dialog .upgraded-order {padding:0 22px;}
  .q-dialog .upgraded-order > .dialog-header {margin:0 -22px; padding:18px 22px 12px;}
  .q-dialog .upgraded-order > .order-dialog-footer {margin:18px -22px 0; padding:15px 22px;}
}
@media (max-width:650px){
  .q-dialog .upgraded-order {padding:0 18px;}
  .q-dialog .upgraded-order > .dialog-header {margin:0 -18px; padding:16px 18px 11px;}
  .q-dialog .upgraded-order > .order-dialog-footer {margin:16px -18px 0; padding:14px 18px;}
}

/* ---- 知識庫：類型篩選與切片瀏覽 ---- */
.knowledge-filters {display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.knowledge-types {display:flex; gap:5px; flex-wrap:wrap;}
.knowledge-types button {
  border:1px solid var(--line); background:var(--paper); color:var(--muted);
  border-radius:99px; padding:5px 13px; font-size:.79rem; cursor:pointer;
  font-family:inherit; white-space:nowrap; transition:all .15s ease;
}
.knowledge-types button:hover {color:var(--ink); border-color:var(--accent);}
.knowledge-types button.on {background:var(--accent); color:var(--button-ink); border-color:var(--accent); font-weight:700;}

/* 左清單、右內容（對齊 adam 版的瀏覽方式） */
.knowledge-browser {
  display:grid; grid-template-columns:minmax(280px, 360px) 1fr; gap:16px; align-items:start;
}
.knowledge-viewer {
  background:var(--paper); border:1px solid var(--line); border-radius:14px;
  padding:18px 20px; min-height:320px; position:sticky; top:12px;
}
.viewer-empty {
  display:grid; place-items:center; text-align:center; gap:8px;
  min-height:280px; color:var(--muted);
}
.viewer-empty h3 {font-size:1rem; color:var(--ink);}
.viewer-empty p {font-size:.86rem; max-width:34ch; line-height:1.7;}
.knowledge-viewer .doc-slices {margin-top:0; padding-top:0; border-top:0;}

.knowledge-row {display:block; cursor:pointer;}
.knowledge-row-main {display:flex; align-items:center; gap:14px;}
.knowledge-row.open {border-color:var(--accent); background:var(--accent-soft);}

@media (max-width:1100px) {
  .knowledge-browser {grid-template-columns:1fr;}
  .knowledge-viewer {position:static; min-height:0;}
}
.document-title {display:inline-flex; align-items:center; gap:4px;}
.knowledge-row.open .document-title svg {transform:rotate(90deg);}
.document-title svg {transition:transform .18s ease;}

.doc-slices {margin-top:14px; padding-top:13px; border-top:1px dashed var(--line);}
.doc-slices-head {
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin-bottom:11px; font-size:.79rem; color:var(--muted);
}
.boundary-toggle {
  margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  cursor:pointer; user-select:none; white-space:nowrap;
}
.boundary-toggle input {accent-color:var(--accent); cursor:pointer;}

.doc-slice {padding:4px 0;}
.doc-slice.bounded {
  border:1px dashed var(--line); border-radius:10px;
  padding:11px 14px; margin-bottom:9px; background:var(--soft);
}
.slice-meta {display:flex; align-items:baseline; gap:9px; margin-bottom:7px; flex-wrap:wrap;}
.slice-no {
  flex:0 0 auto; font-size:.7rem; font-weight:700; padding:2px 8px;
  border-radius:99px; background:var(--accent-soft); color:var(--accent);
}
.slice-heading {font-size:.76rem; color:var(--muted);}
.slice-text {
  margin:0; font-size:.9rem; line-height:1.78; color:var(--ink);
  white-space:pre-wrap; /* 切片內容自己有換行 */
}
.doc-slice:not(.bounded) .slice-text {padding:6px 0;}

@media (max-width:640px) {
  .knowledge-row-main {flex-wrap:wrap;}
  .boundary-toggle {margin-left:0; width:100%;}
  .doc-slice.bounded {padding:10px 12px;}
}

/* 匯入對話框：讀到內容時顯示實際切片，讀不到才退回既有片段 */
.import-filename .text-button {margin-left:auto;}
.import-preview.has-slices {border-left:3px solid var(--series-purple);}
.import-slice {
  margin-top:9px; padding:9px 12px; border-radius:9px;
  background:var(--paper); border:1px dashed var(--line);
}
.import-slice strong {display:block; font-size:.78rem; color:var(--accent); margin-bottom:4px;}
.import-slice p {margin:0; font-size:.85rem; line-height:1.65; color:var(--muted); white-space:pre-wrap;}

/* ---- 待處理與錯誤是兩種狀態 ----
   橘色＝這裡還要你處理（一進畫面就有），紅色＝送出失敗（真的漏了才出現）。
   紅色留給「你做錯了」，兩者分開使用者才不會麻痺。 */
.order-line.needs-pick {
  border-left:3px solid var(--warning); padding-left:13px;
}
.order-line.is-invalid {
  border:1.5px solid var(--studio-solid); border-radius:12px;
  padding:13px 15px; background:color-mix(in srgb, var(--studio-solid) 7%, transparent);
}
.order-line.is-invalid .item-match {border-left-color:var(--studio-solid);}
.order-line.is-invalid .item-match-lead strong {color:var(--studio-solid);}
.order-line.is-invalid::before {
  content:"尚未選擇對應品項"; display:block; margin-bottom:9px;
  font-size:.8rem; font-weight:700; color:var(--studio-solid);
}
.item-match-lead strong {color:var(--warning);}

/* ---- 建單：品項對應 ----
   只有 item 帶 candidates 時才出現，其餘品項行為不變。 */
.item-match {
  margin:10px 0 14px; padding:13px 15px; border-radius:11px;
  background:var(--soft); border-left:3px solid var(--warning);
}
.item-match.is-hit {border-left-color:var(--series-purple);}
.item-match-asked {margin:0 0 9px; font-size:.88rem; color:var(--muted); line-height:1.6;}
.item-match-asked strong {color:var(--ink);}

.item-match-hit {display:flex; align-items:flex-start; gap:9px; color:var(--series-purple);}
.item-match-hit strong {display:block; font-size:.95rem; color:var(--ink);}
.item-match-hit small {display:block; margin-top:2px; font-size:.79rem; color:var(--muted); line-height:1.55;}

.item-match-lead {margin:0 0 8px; font-size:.83rem; font-weight:600; color:var(--ink);}
/* 整張卡片就是選項，不再露出圓形選鈕——要選的是「哪一個品項」，不是「勾一個欄位」。
   input 只做視覺隱藏，鍵盤與螢幕閱讀器仍照 radio 的方式運作。 */
.item-candidate {
  position:relative; display:block; padding:11px 38px 11px 13px; margin-bottom:8px;
  border:1px solid var(--line); border-radius:10px; background:var(--paper);
  cursor:pointer; transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.item-candidate:hover {border-color:var(--accent);}
.item-candidate.picked {
  border-color:var(--accent); border-width:2px; padding:10px 37px 10px 12px;
  background:var(--accent-soft); box-shadow:0 1px 6px var(--chart-shadow);
}
.item-candidate.picked::after {
  content:'✓'; position:absolute; top:50%; right:13px; transform:translateY(-50%);
  color:var(--accent); font-size:1.05rem; font-weight:700; line-height:1;
}
/* 用 [type=radio] 把特異性提到跟 styles.css 的 .order-form input:not([type=checkbox]) 同級，
   否則會被那條的 width:100%／display:block 蓋掉。 */
.item-candidate input[type=radio] {position:absolute; opacity:0; width:1px; height:1px; padding:0; margin:0; border:0; pointer-events:none;}
.item-candidate input:focus-visible + span {outline:2px solid var(--accent); outline-offset:3px; border-radius:4px;}
.item-candidate.picked strong {color:var(--accent);}
.item-candidate strong {display:block; font-size:.92rem;}
.item-candidate small {display:block; margin-top:2px; font-size:.79rem; color:var(--muted); line-height:1.55;}
.item-match-note {margin:8px 0 0; font-size:.78rem; color:var(--muted); line-height:1.55;}

/* 誤判過濾：有新聞但不是這家公司，跟「查無報導」是兩件事 */
.risk-filtered {
  margin:8px 0 0; padding:9px 13px; border-radius:9px;
  background:var(--mint-soft); font-size:.85rem; line-height:1.6;
}

@media (max-width:640px) {
  .item-match {padding:11px 12px;}
  .item-candidate {padding:8px 10px;}
}

/* UI 閱讀動線：沿用現有色票，調整版面、操作層級與焦點。 */
.snapshot-date,.answer-scope {font-size:.8rem; color:var(--muted); line-height:1.6; margin:8px 0 0;}
.priority-actions {display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.priority-dialog .q-dialog__inner {padding:0;}
.priority-reader {width:560px; max-width:100vw!important; height:100dvh; max-height:100dvh!important; display:flex; flex-direction:column; background:var(--paper); color:var(--ink);}
.priority-reader .dialog-header {padding:24px; flex-shrink:0; border-bottom:1px solid var(--line);}
.priority-reader-body {padding:24px; overflow-y:auto; flex:1; min-height:0;}
.priority-reader-body h3 {font-size:1.2rem; line-height:1.6; margin:0 0 22px;}
.priority-reader .priority-detail {gap:24px;}
.priority-reader footer {padding:16px 24px; border-top:1px solid var(--line); display:flex; gap:12px; align-items:center; flex-wrap:wrap;}
.priority-reader footer>span {font-size:.82rem; flex:1 1 220px; color:var(--muted);}
.priority-reader footer .priority-followup {flex-shrink:0;}

.studio-start .studio-launchpad {max-width:none;}
.studio-launchpad.is-dragging {outline:2px dashed var(--accent); outline-offset:4px;}
.studio-start .studio-document-start {border:0; border-top:1px solid var(--line); border-radius:0; padding:12px 0 0; margin-top:12px; background:transparent; text-align:left;}
.studio-document-start .studio-attachment-entry {display:flex; justify-content:flex-start; align-items:center; gap:12px; margin:0;}
.studio-attachment-entry>span {font-size:.75rem; color:var(--muted);}
.studio-document-start .studio-document-examples {display:flex; justify-content:flex-start; align-items:center; gap:8px 14px; margin-top:10px; flex-wrap:wrap;}
.studio-document-examples>span {font-size:.75rem; color:var(--muted);}
.studio-document-start .studio-document-examples>button {min-height:32px; padding:4px 0; text-align:left;}
.studio-start-grid {margin-bottom:22px;}

.knowledge-browser {grid-template-columns:minmax(270px,340px) minmax(0,1fr);}
.knowledge-browser .knowledge-row {display:grid; grid-template-columns:28px minmax(0,1fr) 14px; align-items:start; gap:10px; padding:18px 14px; width:100%; border:0; border-bottom:1px solid var(--line); text-align:left; background:transparent; color:var(--ink); font:inherit;}
.knowledge-browser .knowledge-row.open {background:var(--accent-soft);}
.knowledge-browser .knowledge-row:hover {background:var(--soft);}
.knowledge-browser .knowledge-row:focus-visible {outline:2px solid var(--accent); outline-offset:-3px;}
.knowledge-row .document-symbol {width:28px; height:30px;}
.knowledge-row .document-title {display:block; font-size:.93rem; line-height:1.6; overflow-wrap:break-word;}
.knowledge-row .document-meta {display:block; font-size:.75rem; line-height:1.7; color:var(--muted); margin-top:3px;}
.knowledge-viewer {top:78px; min-width:0;}
.document-reader-heading {display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px;}
.document-reader-heading h2 {font-size:1.1rem; line-height:1.6; margin:0; flex:1 1 220px; scroll-margin-top:90px;}
.document-reader-heading h2:focus {outline:none;}
.document-reader-heading .document-ask {margin:0; min-height:36px; flex-shrink:0;}
.document-back {display:none;}
.doc-slices-head>span {overflow-wrap:anywhere;}

.summary-reading .answer-layer {margin:16px 0;}
.summary-reading .answer-layer-heading {padding-top:12px; margin-bottom:10px;}
.summary-reading .interactive-chart {padding:16px;}
.summary-reading .echart {height:250px;}
.summary-reading .chart-selection-slot {min-height:0; margin-top:6px;}
.summary-reading .chart-selection-hint {padding:4px 0;}
.summary-reading .action-list {gap:10px;}
.summary-reading .action-list article {padding:12px 14px;}
.answer-scope {margin:0 0 8px;}

.order-review-summary {border:1px solid var(--line); background:var(--soft); padding:14px 16px; border-radius:12px; margin:16px 0;}
.order-review-summary strong {font-size:.95rem;}
.order-review-summary p {font-size:.8rem; color:var(--muted); margin:6px 0;}
.review-jumps {display:flex; flex-wrap:wrap; gap:8px 14px;}
.review-jumps .tool-button {min-height:36px; text-align:left;}
[data-review-target] {scroll-margin-top:100px; scroll-margin-bottom:120px;}
.order-dialog-footer>span {min-width:0; line-height:1.6;}

@media (max-width:1100px) {
  .knowledge-browser {grid-template-columns:minmax(0,1fr);}
  .knowledge-content:not(.is-reading) .knowledge-viewer {display:none;}
  .knowledge-content.is-reading>.dashboard-intro,.knowledge-content.is-reading>.knowledge-upload,.knowledge-content.is-reading>.knowledge-toolbar,.knowledge-content.is-reading>.dashboard-disclaimer,.knowledge-content.is-reading .knowledge-list {display:none;}
  .knowledge-viewer {position:static;}
  .document-back {display:inline-flex; align-items:center; gap:8px; flex-basis:100%; min-height:36px;}
  .document-reader-heading h2 {flex-basis:100%;}
}
@media (max-width:650px) {
  .priority-actions {gap:12px; width:100%; justify-content:flex-end;}
  .priority-reader .dialog-header,.priority-reader-body {padding:20px 16px;}
  .priority-reader footer {padding:14px 16px;}
  .priority-reader .priority-why li,.priority-reader .priority-evidence li {font-size:.87rem;}
  .studio-attachment-entry {flex-wrap:wrap;}
  .studio-attachment-entry>span {flex-basis:100%;}
  .knowledge-viewer {padding:16px 12px;}
  .summary-reading .echart {height:270px;}
  .summary-reading .chart-selection-slot {min-height:0;}
  .order-review-summary {padding:12px;}
  .order-dialog-footer>span {width:100%;}
}