/* 特報判對 · 雙區卡（共用元件）
   色票與字級全部走 tq-theme.css，帶後備值，頁面漏掛 theme 也不會壞。 */

.vd-card {
  position: relative;
  margin-top: 12px;
  padding: 16px 18px;
  overflow: hidden;
  border: 1px solid var(--tq-line, rgba(214, 180, 96, .43));
  border-radius: 16px;
  background:
    radial-gradient(circle at 82% 14%, rgba(235, 202, 122, .13), transparent 26%),
    linear-gradient(145deg, rgba(20, 38, 48, .88), rgba(3, 10, 15, .93));
}
.vd-card::after {
  content: "";
  position: absolute;
  inset: 6px;
  pointer-events: none;
  border: 1px solid rgba(215, 183, 107, .13);
  border-radius: 11px;
}

.vd-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.vd-head small {
  display: block;
  color: var(--tq-gold, #e5c36e);
  opacity: .78;
  font-size: var(--tq-fs-label, 11px);
  letter-spacing: .22em;
}
.vd-head h3 {
  margin: 3px 0 0;
  color: var(--tq-gold-2, #fff0b3);
  font-size: var(--tq-fs-title, 26px);
  font-weight: 600;
  letter-spacing: .07em;
}
.vd-asof {
  font-size: var(--tq-fs-note, 13px);
  color: var(--tq-muted, #b8b7ad);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.vd-duo {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(228px, 1fr));
  gap: 12px;
}
.vd-zone {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(214, 180, 96, .16);
  border-radius: 12px;
}
.vd-zone.is-bull {
  border-color: rgba(114, 223, 185, .32);
  background: linear-gradient(160deg, rgba(114, 223, 185, .07), transparent 72%);
}
.vd-zone.is-bear {
  border-color: rgba(239, 115, 105, .3);
  background: linear-gradient(160deg, rgba(239, 115, 105, .07), transparent 72%);
}
.vd-zone-h {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.vd-zone-h b {
  font-size: var(--tq-fs-body, 15px);
  letter-spacing: .05em;
}
.vd-zone.is-bull .vd-zone-h b { color: var(--tq-good, #72dfb9); }
.vd-zone.is-bear .vd-zone-h b { color: var(--tq-bad, #ef7369); }
.vd-zone-h span {
  font-size: var(--tq-fs-label, 11px);
  color: var(--tq-muted, #b8b7ad);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.vd-rows { display: flex; flex-direction: column; }
.vd-row {
  display: grid;
  /* min-width:0 讓長代號能縮，不會把整列撐出格子 */
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: baseline;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(214, 180, 96, .08);
}
.vd-row:last-child { border-bottom: 0; }
.vd-s {
  min-width: 0;
  /* 允許折行而非截斷:幣種代號短不會折,板塊名稱(例「DeSci 去中心科學」)
     在手機上會被 ellipsis 切掉,折成兩行比切掉好。 */
  overflow-wrap: anywhere;
  line-height: 1.45;
  font-size: var(--tq-fs-body, 15px);
  color: var(--tq-text, #f4ecd7);
  letter-spacing: .03em;
}
.vd-y {
  font-size: var(--tq-fs-note, 13px);
  color: var(--tq-muted, #b8b7ad);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.vd-y.positive { color: var(--tq-good, #72dfb9); }
.vd-y.negative { color: var(--tq-bad, #ef7369); }
.vd-w {
  font-size: var(--tq-fs-value, 17px);
  color: var(--tq-text, #f4ecd7);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.vd-w em {
  margin-left: 6px;
  font-style: normal;
  font-size: var(--tq-fs-label, 11px);
  color: var(--tq-muted, #b8b7ad);
}

.vd-empty {
  padding: 16px 2px;
  color: var(--tq-muted, #b8b7ad);
  font-size: var(--tq-fs-note, 13px);
  line-height: 1.75;
}
.vd-empty small {
  display: block;
  margin-top: 5px;
  opacity: .72;
  font-size: var(--tq-fs-label, 11px);
}
.vd-note {
  margin: 12px 0 0;
  color: var(--tq-muted, #b8b7ad);
  opacity: .82;
  font-size: var(--tq-fs-label, 11px);
  line-height: 1.7;
}
.vd-fail {
  margin: 0;
  padding: 14px 2px;
  color: var(--tq-muted, #b8b7ad);
  font-size: var(--tq-fs-note, 13px);
}

/* [2026-09-23] 沒有建議的那一側:列出參考勝率時,先用這行講清楚它不是建議。 */
.vd-hint {
  margin: 6px 0 2px;
  padding: 7px 9px;
  border: 1px dashed rgba(190, 161, 93, .34);
  border-radius: 9px;
  color: #a89f8d;
  font-size: 11.5px;
  line-height: 1.6;
}
.vd-zone.is-bear .vd-hint { border-color: rgba(214, 122, 116, .34); }

/* [2026-09-23] 今日傾向:雙區之上的一行結論 */
.vd-today{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  margin:2px 0 9px;padding:8px 12px;border-radius:11px;
  border:1px solid rgba(190,161,93,.26);background:rgba(255,255,255,.02);
}
.vd-today small{color:#8f8a76;font-size:11px;letter-spacing:.2em}
.vd-today b{font-size:18px;font-family:"Noto Serif TC",serif}
.vd-today span{color:#a89f8d;font-size:12px}
.vd-today.is-bull{border-color:rgba(122,200,150,.4)}
.vd-today.is-bull b{color:#8ed6a8}
.vd-today.is-bear{border-color:rgba(214,122,116,.4)}
.vd-today.is-bear b{color:#e0958f}
.vd-today.is-flat b{color:#c9c0aa}

/* [2026-09-23] 上批結算:判多/判空之後對不對 */
.vd-settled{margin-top:11px;padding:10px 12px;border-radius:11px;
  border:1px solid rgba(190,161,93,.24);background:rgba(255,255,255,.02)}
.vd-settled-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vd-settled-h small{color:#8f8a76;font-size:11px;letter-spacing:.2em}
.vd-settled-h b{color:#efd58d;font-size:13.5px}
.vd-settled-h span{color:#8f8a76;font-size:11.5px}
.vd-settled-r{display:flex;gap:9px;flex-wrap:wrap;margin-top:8px}
.vd-sc{flex:1;min-width:118px;padding:7px 10px;border-radius:9px;
  border:1px solid rgba(190,161,93,.2);background:rgba(0,0,0,.18)}
.vd-sc i{font-style:normal;display:block;color:#a89f8d;font-size:11.5px}
.vd-sc b{font-size:16px;color:#e7e3d5}
.vd-sc em{font-style:normal;margin-left:7px;font-size:12.5px;color:#c9c0aa}
.vd-sc.bull{border-color:rgba(122,200,150,.34)}
.vd-sc.bear{border-color:rgba(214,122,116,.34)}
.vd-sc.total.good em{color:#8ed6a8}
.vd-sc.total.bad em{color:#e0958f}
.vd-settled-n{display:block;margin-top:8px;color:#8f8a76;font-size:11px;line-height:1.6}
@media(max-width:560px){.vd-sc{min-width:0}}

/* [2026-09-23] 上批結算的逐筆列:哪一檔、判什麼、實際多少、對不對 */
.vd-si-list{display:grid;gap:5px;margin-top:9px}
.vd-si{
  display:grid;grid-template-columns:minmax(58px,1fr) 46px minmax(84px,1fr) 44px;
  align-items:center;gap:8px;padding:6px 9px;border-radius:8px;
  border:1px solid rgba(190,161,93,.16);background:rgba(0,0,0,.2);font-size:12.5px;
}
.vd-si.miss{border-color:rgba(214,122,116,.42);background:rgba(214,122,116,.07)}
.vd-si-c{color:#e7e3d5;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vd-si-t{font-size:11px;padding:2px 6px;border-radius:999px;text-align:center;
  border:1px solid rgba(190,161,93,.28);color:#a89f8d}
.vd-si-t.bull{border-color:rgba(122,200,150,.44);color:#8ed6a8}
.vd-si-t.bear{border-color:rgba(214,122,116,.44);color:#e0958f}
.vd-si-a{color:#c9c0aa;font-size:12px;text-align:right}
.vd-si-a.positive{color:#8ed6a8}
.vd-si-a.negative{color:#e0958f}
.vd-si-r{text-align:right;font-size:12px;color:#8ed6a8}
.vd-si.miss .vd-si-r{color:#e0958f}
@media(max-width:420px){
  .vd-si{grid-template-columns:1fr 44px 1fr 40px;gap:5px;font-size:11.5px;padding:5px 7px}
  .vd-si-a{font-size:11px}
}

/* [2026-09-23] 基準說明:判多判空是跟這個比,不是跟五成比 */
.vd-base{margin:9px 0 0;padding:7px 10px;border-radius:9px;
  border:1px dashed rgba(190,161,93,.3);color:#a89f8d;font-size:11.5px;line-height:1.65}

/* [2026-09-23] 場景圖上方的一行速覽條(照觀星台 #dailyPulse 的語彙) ─────
   ⚠ 上方要讓出多少空間**不寫在這裡**:五卷頁那些 fixed 列的位置會隨寬度變
     (實測 508px 時 .volume-nav 是釘在畫面**下緣**,不是上緣),寫死一定錯。
     由 five-volumes.js 的 syncStripInset() 執行期量測後設 padding-top。
   ⚠ 版面契約:**一行高**。不要改成 flex-wrap / 直向堆疊 —— 上一版堆成 242px,
     師兄退回過。溢出一律走橫向捲動。 */
.verdict-strip{
  margin:0 0 12px;border:1px solid rgba(190,161,93,.3);border-radius:12px;
  background:linear-gradient(145deg,rgba(16,24,34,.96),rgba(8,13,20,.96));
  position:relative;
  /* 三欄:標題固定 / 資料捲動 / 入口固定 */
  display:flex;align-items:center;gap:7px;padding:0 12px;
  min-height:44px;font-size:12.5px;line-height:1.5;
}
.verdict-strip[hidden]{display:none}
/* 五卷頁:貼在 .scene-heading 下緣,當成同一張卡的下半段。
   對齊值刻意跟 five-volumes.css 的 .scene-heading 一致(560/92%、96%、左金線),
   ⚠ 那邊改寬度這裡要跟著改,不然會露出一階。 */
#verdictStrip{
  width:min(560px,92%);margin:0 0 6px;
  border:0;border-left:3px solid var(--gold,#bea15d);
  border-radius:0 0 16px 0;
  background:linear-gradient(100deg,rgba(5,17,24,.92),rgba(5,17,24,.55));
}
/* 天機殿:貼在五卷入口面板 .judgment-archives 下緣,當成它的下半段。
   邊框色與底色刻意照抄 daily-brief.css 的 .judgment-archives ——
   ⚠ 那邊改配色這裡要跟著改,否則接縫會露出來。 */
[data-verdict-strip]{
  margin:0 0 12px;
  border:1px solid rgba(216,180,90,.25);
  border-top:0;              /* 共用上面那塊面板的下邊框,不要畫成兩條 */
  border-radius:0;
  background:linear-gradient(90deg,rgba(28,20,8,.45),rgba(3,13,18,.78));
}

/* 漸層退到入口按鈕左側:暗示中間那段還能滑(右緣現在是固定的按鈕) */
.vs-go::before{
  content:"";position:absolute;left:-18px;top:0;bottom:0;width:18px;
  background:linear-gradient(90deg,rgba(10,15,23,0),rgba(10,15,23,.92));pointer-events:none;
}
.vs-glance{
  display:flex;align-items:center;gap:7px;white-space:nowrap;
  /* ⚠ min-width:0 不可省:flex row 的子項預設 min-width:auto,不會縮到產生捲動 */
  flex:1;min-width:0;
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
}
.vs-glance::-webkit-scrollbar{display:none}
.vs-glance{scrollbar-width:none}
.vs-t{color:#efd58d;font-size:13px;flex:none}
.vs-ico{margin-right:4px}
.vs-t-min{display:none}
.vs-go-min{display:none}
.vs-dot{color:#5c5849;flex:none;padding:0 1px}
.vs-sl{color:#5c5849;flex:none}
.vs-n{flex:none;font-weight:600}
.vs-n.bull{color:#7ad0a0} .vs-n.bear{color:#e0958f}
.vs-sym{flex:none;display:inline-flex;align-items:baseline;gap:4px}
.vs-sym b{font-size:13px;color:#e7e3d5}
.vs-sym i{font-style:normal;font-size:11.5px}
.vs-sym.bull i{color:#7ad0a0} .vs-sym.bear i{color:#e0958f}
.vs-sep{color:#5c5849;flex:none}
.vs-base{color:#8f8a76;font-size:11px;flex:none}
.vs-none{color:#8f8a76;flex:none}
.vs-st{flex:none;display:inline-flex;align-items:baseline;gap:4px}
.vs-st i{font-style:normal;color:#8f8a76;font-size:11px}
.vs-st b{color:#e7e3d5;font-size:13px}
.vs-st em{font-style:normal;font-size:11.5px}
.vs-st.good em{color:#7ad0a0} .vs-st.bad em{color:#e0958f}
/* 末端的可點入口:照觀星台是金色虛底線的文字鈕,但這裡要能用手指點,
   所以撐到 44px 高(整條的 min-height 就是它撐出來的)。 */
.vs-go{
  flex:none;position:relative;padding:0 2px;min-height:44px;background:none;border:0;
  color:#efd58d;font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap;
  text-decoration:underline dotted rgba(190,161,93,.5);text-underline-offset:3px;
}
@media(max-width:760px){
  #verdictStrip{width:96%}   /* 跟 .scene-heading 的 520px 斷點一致 */
  .vs-glance{padding:0 11px;gap:6px}
}

/* [2026-09-23] ≤430px:把重複資訊讓出來,好讓「量大三檔」的三檔全進第一屏。
   實測 375px 可視內容寬只有 332px,不收的話只看得到 1.5 檔 —— 而那三檔正是師兄要的。
   ⚠ 收的都是別處已經寫著的:卷名在頁首大標/段標,「三檔」後面就列著。 */
@media(max-width:430px){
  .verdict-strip{gap:6px;padding:0 9px}
  .vs-glance{gap:5px}
  .vs-sym{gap:2px}
  .vs-ico{display:none}             /* 旁邊就是「判對」,圖示純裝飾 */
  /* 實測帳:353px 可視、第三檔右緣 340、「看明細 →」61px —— 直接黏會蓋掉第三檔。
     縮標題、縮按鈕、收頓號,三項一起才把帳做平。 */
  /* 左欄縮成單行「判對」。(9/24 拿掉「量大」標籤後不必再疊兩行) */
  .vs-t{font-size:11px;letter-spacing:.02em}
  .vs-t-full{display:none}
  .vs-t-min{display:inline}
  .vs-go-full{display:none}
  .vs-go-min{display:inline}
  .vs-sep{display:none}             /* 三檔各有顏色與多↑/空↓,靠 gap 分得開,頓號純裝飾 */
  .vs-go::before{width:14px;left:-14px}
}

/* [2026-09-24] 停更超過門檻的判讀已在後端濾掉。這裡只交代「濾了幾檔」——
   濾掉可以,無聲濾掉不行。 */
.vd-hidden{
  margin:9px 0 0;padding:7px 10px;border-radius:9px;
  border:1px dashed rgba(224,192,122,.3);color:#c2b18a;font-size:11.5px;line-height:1.65;
}
