/* rex/shared/calc-next-ask.css — compare / life 新版「AI 快速填表」對話列
   整支包在 @media screen；選擇器一律 html[data-calc-next] 開頭；深色走 html[data-rex-theme="dark"]。
   不使用 display:none（新元素的顯示／隱藏靠 hidden 屬性與 JS 增刪節點，所以 .cnask-pv 不設 display）。 */
@media screen {

html[data-calc-next] .cnask {
  --ak-bg:#FFFFFF; --ak-sub:#F6F8FA; --ak-line:#DCE2E8; --ak-line2:#E8ECF0;
  --ak-ink:#0a2334; --ak-ink2:#44566A; --ak-mute:#5F7184;
  --ak-navy:#0a2334; --ak-navy2:#14344b; --ak-gold:#E8A020; --ak-goldtx:#7A4E00; --ak-goldbg:#FFF4D6;
  --ak-ok:#15803d; --ak-okbg:#E3F4E9; --ak-bad:#c0262d; --ak-badbg:#FDECEC;
  --ak-btn:#0a2334; --ak-btntx:#FFFFFF; --ak-btnh:#14344b;
  --ak-focus:rgba(232,160,32,.40);
  box-sizing:border-box; width:100%; margin:0 0 16px; padding:14px 16px 12px;
  background:var(--ak-bg); color:var(--ak-ink);
  border:1px solid var(--ak-line); border-left:3px solid var(--ak-gold); border-radius:10px;
  box-shadow:0 1px 2px rgba(10,35,52,.05);
  font-family:'Noto Sans TC','Microsoft JhengHei',system-ui,sans-serif; font-size:14px; line-height:1.5;
}
html[data-calc-next][data-rex-theme="dark"] .cnask {
  --ak-bg:#0e1c29; --ak-sub:#0b1722; --ak-line:#1d3144; --ak-line2:#2b4359;
  --ak-ink:#E8EEF4; --ak-ink2:#B4C2D0; --ak-mute:#8A9DB0;
  --ak-goldtx:#F2C14E; --ak-goldbg:rgba(232,160,32,.15);
  --ak-ok:#4ade80; --ak-okbg:rgba(74,222,128,.13); --ak-bad:#f87171; --ak-badbg:rgba(248,113,113,.12);
  --ak-btn:#E8A020; --ak-btntx:#0a2334; --ak-btnh:#F2B646;
  --ak-focus:rgba(232,160,32,.38);
  box-shadow:0 1px 2px rgba(0,0,0,.35);
}
html[data-calc-next] .cnask *, html[data-calc-next] .cnask *::before, html[data-calc-next] .cnask *::after { box-sizing:border-box; }

html[data-calc-next] .cnask .cnask-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; margin:0 0 10px; }
html[data-calc-next] .cnask .cnask-title { font-size:15px; font-weight:700; color:var(--ak-ink); letter-spacing:.02em; }
html[data-calc-next] .cnask .cnask-sub { font-size:12px; color:var(--ak-mute); }

html[data-calc-next] .cnask .cnask-row { display:flex; align-items:stretch; gap:8px; }
html[data-calc-next] .cnask .cnask-input {
  flex:1 1 auto; min-width:0; height:44px; margin:0; padding:0 14px;
  background:var(--ak-sub); color:var(--ak-ink); border:1px solid var(--ak-line); border-radius:8px;
  font:inherit; font-size:15px;
}
html[data-calc-next] .cnask .cnask-input::placeholder { color:var(--ak-mute); opacity:1; }
html[data-calc-next] .cnask .cnask-input:focus { outline:none; border-color:var(--ak-gold); box-shadow:0 0 0 3px var(--ak-focus); }

html[data-calc-next] .cnask .cnask-mic, html[data-calc-next] .cnask .cnask-go, html[data-calc-next] .cnask .cnask-btn {
  min-height:44px; margin:0; font-family:inherit; cursor:pointer; border-radius:8px; -webkit-tap-highlight-color:transparent;
}
html[data-calc-next] .cnask .cnask-mic {
  flex:0 0 auto; width:48px; padding:0; font-size:20px; line-height:1;
  background:var(--ak-sub); color:var(--ak-ink); border:1px solid var(--ak-line);
}
html[data-calc-next] .cnask .cnask-mic:hover { border-color:var(--ak-gold); }
html[data-calc-next] .cnask .cnask-mic.is-on { background:var(--ak-badbg); border-color:var(--ak-bad); color:var(--ak-bad); animation:cnask-pulse 1.2s ease-in-out infinite; }
html[data-calc-next] .cnask .cnask-go {
  flex:0 0 auto; min-width:72px; padding:0 18px; font-size:15px; font-weight:700;
  background:var(--ak-btn); color:var(--ak-btntx); border:1px solid var(--ak-btn);
}
html[data-calc-next] .cnask .cnask-go:hover:not(:disabled) { background:var(--ak-btnh); border-color:var(--ak-btnh); }
html[data-calc-next] .cnask .cnask-go:disabled, html[data-calc-next] .cnask .cnask-btn:disabled { opacity:.5; cursor:not-allowed; }
html[data-calc-next] .cnask .cnask-mic:focus-visible, html[data-calc-next] .cnask .cnask-go:focus-visible, html[data-calc-next] .cnask .cnask-btn:focus-visible {
  outline:none; box-shadow:0 0 0 3px var(--ak-focus);
}
@keyframes cnask-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(192,38,45,.35); } 50% { box-shadow:0 0 0 6px rgba(192,38,45,0); } }

html[data-calc-next] .cnask .cnask-status { margin:8px 0 0; font-size:13px; color:var(--ak-ink2); }
html[data-calc-next] .cnask .cnask-status:empty { margin:0; }
html[data-calc-next] .cnask .cnask-status.is-ok { color:var(--ak-ok); }
html[data-calc-next] .cnask .cnask-status.is-warn { color:var(--ak-goldtx); }
html[data-calc-next] .cnask .cnask-status.is-error { color:var(--ak-bad); }
html[data-calc-next] .cnask .cnask-note { margin:6px 0 0; font-size:12px; color:var(--ak-mute); }

/* 預覽卡 */
html[data-calc-next] .cnask .cnask-pv { margin:12px 0 0; padding:12px 14px; background:var(--ak-sub); border:1px solid var(--ak-line); border-radius:8px; }
html[data-calc-next] .cnask .cnask-pv-head { display:flex; align-items:center; gap:8px; margin:0 0 8px; }
html[data-calc-next] .cnask .cnask-pv-title { font-size:13px; font-weight:700; color:var(--ak-ink); }
html[data-calc-next] .cnask .cnask-tag { padding:1px 8px; border-radius:999px; font-size:11px; font-weight:600; border:1px solid var(--ak-line2); color:var(--ak-ink2); background:var(--ak-bg); }
html[data-calc-next] .cnask .cnask-tag.is-ai { color:var(--ak-goldtx); background:var(--ak-goldbg); border-color:var(--ak-gold); }

html[data-calc-next] .cnask .cnask-chips { display:flex; flex-wrap:wrap; gap:6px; }
html[data-calc-next] .cnask .cnask-chip { display:inline-flex; align-items:baseline; gap:6px; padding:4px 10px; background:var(--ak-bg); border:1px solid var(--ak-line); border-radius:999px; max-width:100%; }
html[data-calc-next] .cnask .cnask-chip-k { font-size:11px; color:var(--ak-mute); white-space:nowrap; }
html[data-calc-next] .cnask .cnask-chip-v { font-size:14px; font-weight:600; color:var(--ak-ink); font-variant-numeric:tabular-nums; word-break:break-all; }

html[data-calc-next] .cnask .cnask-empty { font-size:13px; color:var(--ak-bad); }
html[data-calc-next] .cnask .cnask-hint { margin:8px 0 0; font-size:12px; color:var(--ak-ink2); }
html[data-calc-next] .cnask .cnask-unknown { margin:8px 0 0; font-size:12px; color:var(--ak-mute); }

html[data-calc-next] .cnask .cnask-cand-row { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 0; }
html[data-calc-next] .cnask .cnask-cand {
  padding:0 12px; font-size:13px; font-weight:600; text-align:left;
  background:var(--ak-bg); color:var(--ak-ink); border:1px solid var(--ak-line2);
}
html[data-calc-next] .cnask .cnask-cand:hover { border-color:var(--ak-gold); background:var(--ak-goldbg); }

html[data-calc-next] .cnask .cnask-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 0; }
html[data-calc-next] .cnask .cnask-btn { padding:0 16px; font-size:14px; font-weight:600; }
html[data-calc-next] .cnask .cnask-primary { background:var(--ak-bg); color:var(--ak-ink); border:1px solid var(--ak-ink2); }
html[data-calc-next] .cnask .cnask-primary:hover:not(:disabled) { border-color:var(--ak-gold); background:var(--ak-goldbg); }
html[data-calc-next] .cnask .cnask-primary.is-main { background:var(--ak-btn); color:var(--ak-btntx); border-color:var(--ak-btn); }
html[data-calc-next] .cnask .cnask-primary.is-main:hover:not(:disabled) { background:var(--ak-btnh); border-color:var(--ak-btnh); }
html[data-calc-next] .cnask .cnask-ghost { background:transparent; color:var(--ak-ink2); border:1px solid var(--ak-line2); }
html[data-calc-next] .cnask .cnask-ghost:hover:not(:disabled) { color:var(--ak-ink); border-color:var(--ak-ink2); }

/* 手機 */
@media (max-width:430px) {
  html[data-calc-next] .cnask { padding:12px 12px 10px; margin-bottom:12px; }
  html[data-calc-next] .cnask .cnask-input { font-size:16px; padding:0 12px; }
  html[data-calc-next] .cnask .cnask-go { min-width:60px; padding:0 14px; }
  html[data-calc-next] .cnask .cnask-actions .cnask-btn { flex:1 1 calc(50% - 8px); padding:0 10px; }
  html[data-calc-next] .cnask .cnask-actions .cnask-primary.is-main { flex-basis:100%; }
  html[data-calc-next] .cnask .cnask-cand { flex:1 1 100%; }
}

/* ── 2026-10-18 第二批圖：D7 圖示對齊、「怎麼用？」與 D8 說明卡 ── */
html[data-calc-next] .cnask .cnask-head { align-items:center; }
html[data-calc-next] .cnask .cnask-title { display:inline-flex; align-items:center; }
html[data-calc-next] .cnask .cnask-help {
  margin-left:auto; min-height:32px; padding:4px 12px; border-radius:999px; cursor:pointer;
  background:transparent; color:var(--ak-goldtx); border:1px solid var(--ak-line); font:inherit; font-size:12.5px; font-weight:600;
}
html[data-calc-next] .cnask .cnask-help:hover, html[data-calc-next] .cnask .cnask-help[aria-expanded="true"] { background:var(--ak-goldbg); border-color:var(--ak-gold); }
html[data-calc-next] .cnask .cnask-guide {
  margin:0 0 12px; padding:12px 14px; background:var(--ak-sub); border:1px solid var(--ak-line2); border-radius:10px;
}
html[data-calc-next] .cnask .cnask-guide-steps { margin:0 0 8px; padding-left:22px; color:var(--ak-ink2); font-size:13px; line-height:1.7; }
html[data-calc-next] .cnask .cnask-guide-close {
  display:block; margin-left:auto; min-height:36px; padding:4px 16px; border-radius:8px; cursor:pointer;
  background:var(--ak-btn); color:var(--ak-btntx); border:0; font:inherit; font-size:13px; font-weight:700;
}
html[data-calc-next] .cnask .cnask-guide-close:hover { background:var(--ak-btnh); }
@media (max-width:640px) {
  html[data-calc-next] .cnask .cnask-help { margin-left:0; }
}
}