/* ==========================================================================
   優勢韌力探索 · 企業報告
   視覺系統：handbook/設計規範/練息場視覺系統.md（對外正式版）
   動效原則：afu-brain/skills/apple-design（WWDC Designing Fluid Interfaces）
   ========================================================================== */

:root {
  /* 品牌主色 */
  --color-black: #032639;
  --color-blue: #004D89;
  --color-gray-blue: #6694B8;

  --blue-900: #003864;
  --blue-700: #004D89;
  --blue-500: #6694B8;
  --blue-300: #B2CADC;
  --blue-200: #CCDCE8;
  --blue-100: #E5EDF3;

  --neutral-900: #274555;
  --neutral-700: #4B6472;
  --neutral-500: #6F838E;
  --neutral-300: #93A2AA;
  --neutral-200: #B7C1C6;
  --neutral-100: #DBE0E3;

  --accent-teal: #23CDA0;
  --accent-green: #42C01E;
  --accent-orange: #FF9925;
  --accent-yellow: #FFDC2D;
  --accent-peach: #F9B497;
  --accent-purple: #A29CF1;

  --bg-blue: #CCE0F7;
  --bg-mint: #D3F5EC;
  --bg-green: #F3FBE8;
  --bg-peach: #FFEBD3;
  --bg-yellow: #FFFBEA;
  --bg-pink: #FEF0EA;
  --bg-lavender: #E6E5FB;

  --font-heading: "jf-jinxuan", "金萱", "Songti TC", "Noto Serif TC", serif;
  --font-body: "Helvetica Neue", Helvetica, "PingFang TC", "Microsoft JhengHei", sans-serif;

  --radius: 16px;
  --radius-lg: 24px;
  --radius-sm: 10px;

  --shadow-sm: 0 1px 3px rgba(3, 38, 57, .06), 0 6px 18px rgba(3, 38, 57, .05);
  --shadow-md: 0 2px 6px rgba(3, 38, 57, .07), 0 14px 40px rgba(3, 38, 57, .08);
  --shadow-lg: 0 8px 24px rgba(3, 38, 57, .10), 0 40px 80px rgba(3, 38, 57, .14);

  /* 動效：預設臨界阻尼（無回彈）；只有帶動量的互動才給 bounce */
  --spring: cubic-bezier(.32, .72, 0, 1);
  --spring-bounce: cubic-bezier(.34, 1.4, .3, 1);
  --dur: .38s;
  --dur-fast: .22s;

  --page-max: 1180px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 100%;
  line-height: 1.65;
  color: var(--neutral-900);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  letter-spacing: .01em;
}

h1, h2, h3, h4 {
  font-family: var(--font-heading);
  color: var(--color-blue);
  margin: 0;
  font-weight: 600;
}

/* 字級光學：大字負字距＋緊行距；小字微正字距 */
h1 { font-size: clamp(1.9rem, 4.2vw, 2.9rem); line-height: 1.12; letter-spacing: -.022em; }
h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.2;  letter-spacing: -.016em; }
h3 { font-size: clamp(1.1rem, 1.9vw, 1.35rem); line-height: 1.35; letter-spacing: -.01em; }

button { font: inherit; color: inherit; }

/* ── 有機流動色塊背景 ─────────────────────────────────────────── */
.blobs { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.blob {
  position: absolute; border-radius: 50%; filter: blur(60px); opacity: .5;
  will-change: transform;
}
.blob-1 { width: 46vw; height: 46vw; left: -14vw; top: -16vw; background: var(--bg-blue);    animation: drift1 34s ease-in-out infinite; }
.blob-2 { width: 38vw; height: 38vw; right: -12vw; top: 22vh;  background: var(--bg-mint);    animation: drift2 42s ease-in-out infinite; }
.blob-3 { width: 30vw; height: 30vw; left: 32vw;  bottom: -14vw; background: var(--bg-peach); animation: drift3 50s ease-in-out infinite; }

@keyframes drift1 { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(4vw, 5vh, 0) scale(1.08); } }
@keyframes drift2 { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(-5vw, -4vh, 0) scale(1.1); } }
@keyframes drift3 { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(3vw, -6vh, 0) scale(.94); } }

/* ── 密碼門 ──────────────────────────────────────────────────── */
.gate {
  position: fixed; inset: 0; z-index: 100;
  display: grid; place-items: center; padding: 24px;
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(28px) saturate(180%);
  -webkit-backdrop-filter: blur(28px) saturate(180%);
}
.gate.is-out {
  opacity: 0; transform: scale(1.04);
  transition: opacity .5s var(--spring), transform .5s var(--spring), backdrop-filter .5s var(--spring);
  backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px);
  pointer-events: none;
}
.gate-card {
  width: min(440px, 100%);
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 44px 38px 34px;
  text-align: center;
}
.gate-logo { height: 46px; width: auto; display: block; margin: 0 auto 24px; }
.gate h1 { font-size: 1.5rem; letter-spacing: -.012em; }
.gate .sub { color: var(--neutral-500); font-size: .875rem; margin: 8px 0 26px; }
.gate-field { position: relative; }
.gate input {
  width: 100%; padding: 15px 16px; font-size: 1.05rem; letter-spacing: .28em;
  text-align: center; font-family: var(--font-body);
  border: 1.5px solid var(--neutral-100); border-radius: var(--radius-sm);
  background: var(--blue-100); color: var(--color-black);
  transition: border-color var(--dur-fast) ease, background var(--dur-fast) ease, box-shadow var(--dur-fast) ease;
  outline: none;
}
.gate input:focus { border-color: var(--blue-500); background: #fff; box-shadow: 0 0 0 4px rgba(102,148,184,.16); }
.gate-err {
  color: #D2564E; font-size: .8rem; height: 20px; margin-top: 10px;
  opacity: 0; transition: opacity .2s ease;
}
.gate-err.show { opacity: 1; }
.shake { animation: shake .38s ease; }
@keyframes shake { 0%,100%{transform:translateX(0)} 18%{transform:translateX(-9px)} 38%{transform:translateX(8px)} 60%{transform:translateX(-5px)} 82%{transform:translateX(3px)} }

.btn {
  border: 0; cursor: pointer; border-radius: 999px;
  padding: 13px 26px; font-weight: 600; font-size: .95rem;
  background: var(--color-blue); color: #fff;
  transition: transform .1s ease-out, box-shadow var(--dur-fast) var(--spring), background var(--dur-fast) ease;
  box-shadow: 0 4px 14px rgba(0,77,137,.24);
}
.btn:hover { box-shadow: 0 8px 22px rgba(0,77,137,.3); }
.btn:active { transform: scale(.965); }      /* 反饋落在 pointer-down */
.btn-full { width: 100%; margin-top: 18px; }
.btn-ghost {
  background: #fff; color: var(--color-blue);
  border: 1.5px solid var(--blue-200); box-shadow: none;
}
.btn-ghost:hover { background: var(--blue-100); box-shadow: none; }

/* ── 應用外殼 ────────────────────────────────────────────────── */
.app { position: relative; z-index: 1; opacity: 0; }
.app.ready { opacity: 1; transition: opacity .6s ease .1s; }

/* ── 刊頭 masthead：正式報告的封面式標題區 ──────────────────── */
.masthead { position: relative; }
.mh-in { max-width: var(--page-max); margin: 0 auto; padding: 26px 24px 0; }

.mh-top { display: flex; align-items: flex-start; gap: 20px; }
.logo { height: 46px; width: auto; display: block; margin-right: auto; }

.mh-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.acct {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1.5px solid var(--neutral-100); background: rgba(255,255,255,.8);
  border-radius: 999px; padding: 5px 15px 5px 5px; cursor: pointer;
  transition: transform .1s ease-out, border-color var(--dur-fast) ease, box-shadow var(--dur-fast) ease;
}
.acct:hover { border-color: var(--blue-300); box-shadow: var(--shadow-sm); }
.acct:active { transform: scale(.975); }
.acct .ava {
  width: 30px; height: 30px; border-radius: 50%; flex: none;
  background: linear-gradient(140deg, var(--blue-700), var(--accent-teal));
  color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .02em;
  display: grid; place-items: center;
}
.acct .who { display: grid; text-align: left; line-height: 1.3; }
.acct .who b { font-size: .8rem; color: var(--neutral-900); font-weight: 600; }
.acct .who i { font-size: .68rem; color: var(--neutral-500); font-style: normal; letter-spacing: .03em; }
.acct .dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent-orange); flex: none;
}
.icon-btn {
  width: 38px; height: 38px; flex: none; display: grid; place-items: center;
  border: 1.5px solid var(--neutral-100); background: rgba(255,255,255,.8);
  border-radius: 50%; color: var(--neutral-500); cursor: pointer;
  transition: transform .3s var(--spring), border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
.icon-btn:hover { color: var(--color-blue); border-color: var(--blue-300); transform: rotate(38deg); }
.icon-btn:active { transform: rotate(38deg) scale(.94); }

.mh-title { padding: 24px 0 22px; }
.mh-title .eyebrow {
  font-size: .7rem; letter-spacing: .2em; color: var(--neutral-500);
  text-transform: uppercase; margin: 0 0 12px;
}
.mh-title h1 {
  font-size: clamp(2.1rem, 4.6vw, 3.15rem); line-height: 1.1; letter-spacing: -.028em;
  margin: 0; max-width: none;
}
.mh-sub {
  margin: 14px 0 0; font-size: .84rem; color: var(--neutral-500);
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
}
.mh-sub .sep { color: var(--neutral-200); }
.trust-link {
  border: 0; background: none; padding: 0; cursor: pointer;
  font-size: .84rem; color: var(--neutral-700);
  text-decoration: underline; text-decoration-style: dotted;
  text-underline-offset: 4px; text-decoration-color: var(--blue-300);
  transition: color var(--dur-fast) ease, text-decoration-color var(--dur-fast) ease;
}
.trust-link:hover { color: var(--color-blue); text-decoration-color: var(--color-blue); }

/* 黏頂導覽列 */
.navbar {
  position: sticky; top: 0; z-index: 40;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(22px) saturate(180%);
  -webkit-backdrop-filter: blur(22px) saturate(180%);
}
.nav-in {
  max-width: var(--page-max); margin: 0 auto; padding: 0 24px;
  display: flex; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap;
}

/* 篩選器 */
.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; padding-bottom: 11px; }
.sel {
  position: relative;
  display: inline-flex; align-items: center; gap: 7px;
  background: #fff; border: 1.5px solid var(--neutral-100);
  border-radius: 999px; padding: 7px 14px 7px 15px;
  font-size: .82rem; color: var(--neutral-700); cursor: pointer;
  transition: transform .1s ease-out, border-color var(--dur-fast) ease, box-shadow var(--dur-fast) ease;
}
.sel:hover { border-color: var(--blue-300); box-shadow: var(--shadow-sm); }
.sel:active { transform: scale(.975); }
.sel b { color: var(--color-blue); font-weight: 600; }
.sel::after {
  content: ""; width: 7px; height: 7px; flex: none;
  border-right: 1.5px solid var(--neutral-300); border-bottom: 1.5px solid var(--neutral-300);
  transform: rotate(45deg) translate(-2px, -2px);
}
#btnPrint::after { display: none; }
.sel-menu {
  position: absolute; top: calc(100% + 8px); left: 0; min-width: 200px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-radius: var(--radius); box-shadow: var(--shadow-md);
  padding: 7px; z-index: 60;
  transform-origin: top left;                     /* 錨定觸發元件 */
  opacity: 0; transform: scale(.94) translateY(-6px); pointer-events: none;
  transition: opacity .2s var(--spring), transform .28s var(--spring), filter .28s var(--spring);
  filter: blur(4px);
}
.sel-menu.open { opacity: 1; transform: none; pointer-events: auto; filter: blur(0); }
.sel-menu button {
  display: block; width: 100%; text-align: left; border: 0; background: none;
  padding: 9px 13px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: .85rem; color: var(--neutral-700);
  transition: background var(--dur-fast) ease;
}
.sel-menu button:hover { background: var(--blue-100); }
.sel-menu button[aria-selected="true"] { background: var(--blue-100); color: var(--color-blue); font-weight: 600; }

/* 分頁列 */
.tabs {
  display: flex; gap: 2px; position: relative; overflow-x: auto;
  scrollbar-width: none;
}
.tabs::-webkit-scrollbar { display: none; }
.tab {
  position: relative; border: 0; background: none; cursor: pointer;
  padding: 13px 14px 15px; font-size: .92rem; white-space: nowrap;
  color: var(--neutral-500); font-weight: 500;
  display: inline-flex; align-items: center;
  transition: color var(--dur-fast) ease, transform .1s ease-out;
}
.tab:hover { color: var(--neutral-900); }
.tab:active { transform: scale(.97); }
.tab.on { color: var(--color-blue); font-weight: 600; }
.tab .pill {
  margin-left: 7px; font-size: .66rem; letter-spacing: .02em;
  background: var(--bg-mint); color: #0E8E6E;
  border-radius: 999px; padding: 2px 7px; font-weight: 600;
}
.tab-ink {
  position: absolute; bottom: 0; height: 3px; border-radius: 3px 3px 0 0;
  background: var(--color-blue);
  transition: transform var(--dur) var(--spring), width var(--dur) var(--spring);
}
.topbar-edge { height: 1px; background: linear-gradient(90deg, transparent, var(--neutral-100) 20%, var(--neutral-100) 80%, transparent); }

/* ── 頁面內容 ────────────────────────────────────────────────── */
.wrap { max-width: var(--page-max); margin: 0 auto; padding: 0 24px 140px; }

.panel { display: none; }
.panel.on { display: block; animation: panelIn .42s var(--spring) both; }
@keyframes panelIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* 目前篩選條件（永遠讓人知道自己在看什麼） */
.fnote {
  margin: 20px 0 -6px; padding: 11px 18px; border-radius: var(--radius-sm);
  background: var(--blue-100); font-size: .78rem; color: var(--neutral-700);
  transition: background .5s var(--spring);
}
.fnote b { color: var(--color-blue); }
.fnote .demo { color: var(--neutral-500); }
.fnote.flash { background: var(--bg-mint); }

/* 每頁最上方：一句結論 + 燈號（老闆只看這行） */
.verdict {
  margin: 30px 0 26px; padding: 26px 30px;
  border-radius: var(--radius-lg); background: #fff;
  box-shadow: var(--shadow-md);
  border-left: 5px solid var(--blue-500);
  display: flex; gap: 22px; align-items: flex-start; flex-wrap: wrap;
}
.verdict[data-light="green"]  { border-left-color: var(--accent-green); }
.verdict[data-light="amber"]  { border-left-color: var(--accent-orange); }
.verdict[data-light="red"]    { border-left-color: #E0685E; }
.verdict-body { flex: 1 1 380px; }
.verdict .eyebrow { font-size: .7rem; letter-spacing: .16em; color: var(--neutral-500); text-transform: uppercase; margin-bottom: 9px; }
.verdict h2 { margin-bottom: 10px; }
.verdict p { margin: 0; color: var(--neutral-700); font-size: .93rem; }
.light {
  flex: none; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 15px; border-radius: 999px; font-size: .8rem; font-weight: 600;
}
.light i { width: 9px; height: 9px; border-radius: 50%; display: block; }
.light.green { background: var(--bg-green); color: #2C7C13; } .light.green i { background: var(--accent-green); }
.light.amber { background: var(--bg-peach); color: #A75F09; } .light.amber i { background: var(--accent-orange); }
.light.red   { background: var(--bg-pink);  color: #B0463C; } .light.red i   { background: #E0685E; }

/* KPI 卡列 */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 14px; margin-bottom: 30px; }
.kpi {
  background: #fff; border-radius: var(--radius); padding: 20px 22px;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur) var(--spring), box-shadow var(--dur) var(--spring);
}
.kpi:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.kpi .lbl { font-size: .76rem; color: var(--neutral-500); letter-spacing: .03em; }
.kpi .val { font-family: var(--font-heading); font-size: 2rem; line-height: 1.15; letter-spacing: -.028em; color: var(--color-blue); margin: 6px 0 2px; }
.kpi .val small { font-size: .9rem; letter-spacing: 0; color: var(--neutral-500); margin-left: 3px; }
.kpi .note { font-size: .74rem; color: var(--neutral-500); }
.kpi .note b { color: var(--accent-green); }
.kpi .note b.warn { color: var(--accent-orange); }

/* 內容區塊：分析 → 洞察 → 行動 */
.block {
  background: #fff; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); margin-bottom: 24px; overflow: hidden;
}
.block-head { padding: 26px 30px 4px; }
.block-head .eyebrow { font-size: .7rem; letter-spacing: .16em; color: var(--neutral-500); text-transform: uppercase; margin-bottom: 8px; }
.block-head h3 { margin-bottom: 6px; }        /* 結論式標題：一句完整的話 */
.block-head .desc { font-size: .85rem; color: var(--neutral-500); margin: 0; }
.block-chart { padding: 20px 30px 26px; }

/* 洞察｜行動：兩欄一律齊頂（align-items:start），不做上下置中 */
.ia {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  align-items: stretch; border-top: 1px solid var(--neutral-100);
}
.ia > div {
  padding: 24px 30px 26px;
  display: flex; flex-direction: column; justify-content: flex-start;
}
.ia-insight { background: var(--bg-yellow); }
.ia-action  { background: var(--bg-mint); border-left: 1px solid rgba(255,255,255,.7); }
.ia-action .add-btn { margin-top: auto; align-self: flex-start; }
.ia h4 {
  font-family: var(--font-body); font-size: .72rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--neutral-500); margin-bottom: 11px;
  display: flex; align-items: center; gap: 8px;
}
.ia h4::before { content: ""; width: 16px; height: 1.5px; background: currentColor; opacity: .5; }
.ia p { margin: 0 0 12px; font-size: .9rem; color: var(--neutral-900); line-height: 1.72; }
.ia p:last-of-type { margin-bottom: 0; }
.ia strong { color: var(--color-blue); }

.tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 13px; }
.tag {
  font-size: .7rem; font-weight: 600; letter-spacing: .05em;
  padding: 3px 10px; border-radius: 999px;
  background: rgba(255,255,255,.72); color: var(--neutral-700);
}
.tag[data-r="選"] { color: #1F7A9C; } .tag[data-r="訓"] { color: #A75F09; }
.tag[data-r="用"] { color: #2C7C13; } .tag[data-r="留"] { color: #7A5AC4; }

.act-list { list-style: none; padding: 0; margin: 0 0 16px; }
.act-list li {
  display: flex; gap: 11px; align-items: flex-start;
  font-size: .89rem; padding: 7px 0; color: var(--neutral-900);
}
.act-list li::before {
  content: ""; flex: none; width: 6px; height: 6px; margin-top: .55em;
  border-radius: 50%; background: var(--accent-teal);
}
.act-meta { font-size: .74rem; color: var(--neutral-500); display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.act-meta span::before { content: ""; }

.add-btn {
  border: 1.5px solid rgba(0,77,137,.2); background: rgba(255,255,255,.7);
  color: var(--color-blue); border-radius: 999px; padding: 8px 17px;
  font-size: .82rem; font-weight: 600; cursor: pointer;
  display: inline-flex; align-items: center; gap: 7px;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease;
}
.add-btn:hover { background: #fff; border-color: var(--blue-500); }
.add-btn:active { transform: scale(.96); }
.add-btn.added { background: var(--color-blue); color: #fff; border-color: var(--color-blue); }
.add-btn .ck { width: 13px; height: 13px; position: relative; }
.add-btn .ck::before, .add-btn .ck::after {
  content: ""; position: absolute; background: currentColor; border-radius: 1px;
  transition: transform .3s var(--spring), opacity .2s ease;
}
.add-btn .ck::before { width: 13px; height: 1.6px; top: 5.7px; left: 0; }
.add-btn .ck::after  { width: 1.6px; height: 13px; left: 5.7px; top: 0; }
.add-btn.added .ck::before { transform: rotate(-45deg) scaleX(.62) translate(2px, 2px); }
.add-btn.added .ck::after  { transform: rotate(-45deg) scaleY(.42) translate(-1px, 3px); }

/* ── 圖表（純 CSS / SVG，無外部程式庫）──────────────────────── */
.bars { display: grid; gap: 13px; }
.bar-row { display: grid; grid-template-columns: 108px 1fr 62px; gap: 14px; align-items: center; font-size: .85rem; }
.bar-row .name { color: var(--neutral-700); text-align: right; letter-spacing: .01em; }
.bar-track { display: block; position: relative; height: 26px; background: var(--blue-100); border-radius: 8px; }
.bar-fill {
  display: block; height: 100%; border-radius: 8px; width: 0;
  background: linear-gradient(90deg, var(--blue-500), var(--blue-700));
  transition: width .85s var(--spring);
}
.bar-fill.teal   { background: linear-gradient(90deg, #6FE0C1, var(--accent-teal)); }
.bar-fill.orange { background: linear-gradient(90deg, #FFC073, var(--accent-orange)); }
.bar-fill.purple { background: linear-gradient(90deg, #C4C0F7, var(--accent-purple)); }
.bar-row .num { font-weight: 600; color: var(--color-blue); font-variant-numeric: tabular-nums; }
.bar-row .num small { color: var(--neutral-500); font-weight: 400; }

.norm-line {
  position: absolute; top: -6px; bottom: -6px; width: 0;
  border-left: 1.5px dashed var(--neutral-300);
}
.norm-key { font-size: .75rem; color: var(--neutral-500); margin-top: 14px; display: flex; align-items: center; gap: 8px; }
.norm-key i { width: 22px; border-top: 1.5px dashed var(--neutral-300); display: block; }

/* 堆疊條 */
.stack { display: flex; height: 42px; border-radius: 12px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(3,38,57,.04); }
.stack > div {
  display: grid; place-items: center; color: #fff; font-size: .8rem; font-weight: 600;
  width: 0; transition: width .9s var(--spring);
  white-space: nowrap; overflow: hidden;
}
.stack-key { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 15px; font-size: .78rem; color: var(--neutral-700); }
.stack-key span { display: inline-flex; align-items: center; gap: 7px; }
.stack-key i { width: 10px; height: 10px; border-radius: 3px; }

/* 分類群組（三大類優勢） */
.cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.cat { border-radius: var(--radius); padding: 20px 22px; }
.cat h5 { margin: 0 0 4px; font-family: var(--font-heading); font-size: 1.02rem; letter-spacing: -.01em; }
.cat .cat-sub { font-size: .72rem; letter-spacing: .06em; opacity: .7; margin-bottom: 14px; }
.cat .item { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0; font-size: .87rem; }
.cat .item b { font-variant-numeric: tabular-nums; }
.cat.intellect { background: var(--bg-blue); color: #14456F; }
.cat.heart     { background: var(--bg-pink); color: #9C4B39; }
.cat.resilience{ background: var(--bg-lavender); color: #574BA8; }

/* 相關矩陣 */
.matrix { width: 100%; border-collapse: collapse; font-size: .82rem; }
.matrix th, .matrix td { padding: 11px 8px; text-align: center; }
.matrix thead th { font-weight: 500; color: var(--neutral-500); font-size: .76rem; border-bottom: 1.5px solid var(--neutral-100); line-height: 1.3; }
.matrix tbody th { text-align: left; font-weight: 600; color: var(--neutral-900); white-space: nowrap; padding-right: 16px; }
.matrix td { font-variant-numeric: tabular-nums; border-radius: 7px; color: var(--neutral-700); }
.matrix td.hi { background: var(--bg-mint); color: #0E8E6E; font-weight: 700; }
.matrix td.mid { background: var(--bg-yellow); color: #9A7508; font-weight: 600; }
.matrix td.neg { background: var(--bg-pink); color: #B0463C; font-weight: 600; }
.table-note { font-size: .74rem; color: var(--neutral-500); margin-top: 14px; line-height: 1.7; }

/* 雷達圖 */
.radar-wrap { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(200px, 260px); gap: 26px; align-items: center; }
.radar-legend { display: grid; gap: 10px; }
.radar-legend button {
  display: flex; align-items: center; gap: 10px; width: 100%;
  border: 0; background: none; padding: 8px 11px; border-radius: var(--radius-sm);
  cursor: pointer; font-size: .85rem; color: var(--neutral-700); text-align: left;
  transition: background var(--dur-fast) ease, opacity var(--dur-fast) ease, transform .1s ease-out;
}
.radar-legend button:hover { background: var(--blue-100); }
.radar-legend button:active { transform: scale(.98); }
.radar-legend button.off { opacity: .34; }
.radar-legend i { width: 11px; height: 11px; border-radius: 50%; flex: none; }
.radar-legend b { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--color-blue); }
svg .rpoly { transition: opacity .3s var(--spring), transform .45s var(--spring); transform-origin: center; }
svg .rpoly.off { opacity: 0 !important; transform: scale(.9); }

/* 差異條（正負） */
.diverge { display: grid; gap: 11px; }
.dv-row { display: grid; grid-template-columns: 118px 1fr 58px; gap: 14px; align-items: center; font-size: .85rem; }
.dv-track { position: relative; height: 24px; background: var(--blue-100); border-radius: 7px; }
.dv-track::before { content: ""; position: absolute; left: 50%; top: -4px; bottom: -4px; width: 1.5px; background: var(--neutral-200); }
.dv-fill { display: block; position: absolute; top: 0; bottom: 0; width: 0; border-radius: 6px; transition: width .8s var(--spring); }
.dv-fill.pos { left: 50%; background: linear-gradient(90deg, #6FE0C1, var(--accent-teal)); }
.dv-fill.neg { right: 50%; background: linear-gradient(270deg, #F7A9A2, #E0685E); }
.dv-row .num { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; }
.dv-row .num.pos { color: #0E8E6E; } .dv-row .num.neg { color: #B0463C; }

/* 年度趨勢 */
.trend-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }
.trend-card { border-radius: var(--radius); padding: 22px; background: var(--blue-100); }
.trend-card .t-lbl { font-size: .8rem; color: var(--neutral-700); margin-bottom: 12px; }
.trend-nums { display: flex; align-items: baseline; gap: 12px; }
.trend-nums .y1 { font-size: 1.15rem; color: var(--neutral-500); font-variant-numeric: tabular-nums; }
.trend-nums .arrow { color: var(--neutral-300); }
.trend-nums .y2 { font-family: var(--font-heading); font-size: 2rem; letter-spacing: -.028em; color: var(--color-blue); font-variant-numeric: tabular-nums; }
.trend-delta { display: inline-flex; align-items: center; gap: 5px; font-size: .78rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; margin-top: 10px; }
.trend-delta.up { background: var(--bg-green); color: #2C7C13; }
.trend-delta.down { background: var(--bg-pink); color: #B0463C; }
.trend-delta.flat { background: #fff; color: var(--neutral-500); }
.trend-years { font-size: .7rem; color: var(--neutral-500); margin-top: 8px; }

.warnbox {
  background: var(--bg-peach); border-radius: var(--radius);
  padding: 18px 22px; font-size: .84rem; color: #7A4708; line-height: 1.72;
  margin-bottom: 22px;
}
.warnbox b { color: #A75F09; }

/* 樣本不足遮罩 */
.masked { position: relative; }
.masked-veil {
  position: absolute; inset: 0; border-radius: var(--radius);
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px);
  display: grid; place-items: center; text-align: center; padding: 24px;
  font-size: .86rem; color: var(--neutral-700); z-index: 5;
}

/* ── AI 探索 ─────────────────────────────────────────────────── */
.ai-wrap { display: grid; grid-template-columns: 252px minmax(0, 1fr); gap: 20px; align-items: start; }
/* 左欄置頂固定；右邊對話區自己有固定高度與捲軸（輸入區永遠不蓋到對話） */
.ai-side {
  position: sticky; top: 82px; align-self: start;
  background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
  padding: 16px 14px 18px; display: flex; flex-direction: column; gap: 6px;
  max-height: calc(100vh - 106px);
}
.ai-new {
  display: flex; align-items: center; gap: 9px; width: 100%;
  border: 1.5px dashed var(--blue-200); background: none; color: var(--color-blue);
  border-radius: var(--radius-sm); padding: 11px 13px; cursor: pointer;
  font-size: .85rem; font-weight: 600; margin-bottom: 8px;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease;
}
.ai-new:hover { background: var(--blue-100); border-color: var(--blue-300); }
.ai-new:active { transform: scale(.98); }
.ai-side-lbl {
  font-size: .68rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--neutral-300); padding: 6px 13px 4px;
}
.ai-convs { display: grid; align-content: start; gap: 2px; flex: 1 1 auto; min-height: 90px; overflow: auto; scrollbar-width: thin; }
.conv {
  border: 0; background: none; text-align: left; width: 100%; cursor: pointer;
  border-radius: var(--radius-sm); padding: 10px 13px;
  transition: background var(--dur-fast) ease, transform .1s ease-out;
}
.conv:hover { background: var(--blue-100); }
.conv:active { transform: scale(.985); }
.conv.on { background: var(--blue-100); }
.conv .ct {
  display: block; font-size: .82rem; color: var(--neutral-900); line-height: 1.45;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.conv.on .ct { color: var(--color-blue); font-weight: 600; }
.conv .cd { display: block; font-size: .68rem; color: var(--neutral-300); margin-top: 3px; }
.ai-side-note {
  font-size: .68rem; color: var(--neutral-500); line-height: 1.7;
  border-top: 1px solid var(--neutral-100); padding: 12px 13px 0; margin: 10px 0 0;
  flex: none;
}
.ai-side-note a { color: var(--color-blue); }
.conv-in { display: flex; align-items: center; gap: 2px; }
.conv-in > .conv { flex: 1 1 auto; min-width: 0; width: auto; }
.conv-in .rm {
  border: 0; background: none; color: var(--neutral-300); cursor: pointer;
  font-size: .8rem; line-height: 1; padding: 6px 7px; border-radius: 7px; flex: none;
  opacity: 0; transition: opacity var(--dur-fast) ease, background var(--dur-fast) ease, color var(--dur-fast) ease;
}
.conv-in:hover .rm, .conv-in .rm:focus-visible { opacity: 1; }
.conv-in .rm:hover { background: var(--bg-pink); color: #B0463C; }

/* 對話區：固定高度 + 自己的捲軸，輸入區釘在下緣、不覆蓋訊息 */
.ai-shell {
  display: flex; flex-direction: column; gap: 13px; min-width: 0;
  height: calc(100vh - 132px); min-height: 460px;
}
.ai-shell > .conv-head, .ai-shell > .chips, .ai-shell > .composer { flex: none; }
.conv-head {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  padding-bottom: 4px;
}
.conv-head h3 { font-size: 1.1rem; }
.conv-head .cd { font-size: .74rem; color: var(--neutral-500); }
.chips { display: flex; gap: 9px; flex-wrap: wrap; margin-bottom: 4px; }
.chip {
  border: 1.5px solid var(--blue-200); background: #fff; color: var(--neutral-700);
  border-radius: 999px; padding: 9px 16px; font-size: .84rem; cursor: pointer;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
.chip:hover { background: var(--blue-100); border-color: var(--blue-300); color: var(--color-blue); }
.chip:active { transform: scale(.96); }

.thread {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  display: grid; align-content: start; gap: 16px;
  padding: 4px 14px 8px 4px; scrollbar-width: thin;
  background: linear-gradient(var(--blue-100), var(--blue-100)) 0 0 / 100% 1px no-repeat;
}
.thread::-webkit-scrollbar { width: 9px; }
.thread::-webkit-scrollbar-thumb { background: var(--neutral-200); border-radius: 9px; border: 3px solid transparent; background-clip: content-box; }
.thread::-webkit-scrollbar-thumb:hover { background: var(--neutral-300); background-clip: content-box; }
.msg { display: flex; gap: 13px; align-items: flex-start; animation: msgIn .42s var(--spring) both; }
@keyframes msgIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.msg .av { width: 32px; height: 32px; border-radius: 11px; flex: none; display: grid; place-items: center; font-size: .7rem; font-weight: 700; }
.msg.me { flex-direction: row-reverse; }
.msg.me .av { background: var(--blue-100); color: var(--color-blue); }
.msg.ai .av { background: linear-gradient(140deg, var(--blue-700), var(--accent-teal)); color: #fff; }
.bubble { border-radius: var(--radius); padding: 15px 19px; font-size: .9rem; max-width: 100%; }
.msg.me .bubble { background: var(--color-blue); color: #fff; border-bottom-right-radius: 6px; }
.msg.ai .bubble { background: #fff; box-shadow: var(--shadow-sm); border-bottom-left-radius: 6px; flex: 1; }
.bubble p { margin: 0 0 10px; line-height: 1.72; }
.bubble p:last-child { margin-bottom: 0; }
.bubble .mini-chart { margin: 16px 0 12px; }
.bubble .src { font-size: .72rem; color: var(--neutral-500); border-top: 1px solid var(--neutral-100); padding-top: 10px; margin-top: 14px; }

.typing { display: inline-flex; gap: 5px; padding: 4px 0; }
.typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--blue-300); animation: blink 1.3s infinite; }
.typing i:nth-child(2) { animation-delay: .18s; } .typing i:nth-child(3) { animation-delay: .36s; }
@keyframes blink { 0%,60%,100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

.composer {
  display: flex; gap: 10px; align-items: center;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-radius: 999px; padding: 8px 8px 8px 22px;
  box-shadow: var(--shadow-md);
}
.composer input {
  flex: 1; border: 0; background: none; outline: none; font-size: .92rem;
  font-family: var(--font-body); color: var(--color-black); padding: 10px 0;
}
.composer input::placeholder { color: var(--neutral-300); }
.composer .btn { padding: 11px 22px; }

.ai-guard {
  font-size: .76rem; color: var(--neutral-500); line-height: 1.75;
  background: var(--blue-100); border-radius: var(--radius); padding: 16px 20px;
}
.ai-guard b { color: var(--color-blue); }
.ai-guard .two { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px 26px; margin-top: 8px; }

/* 每則 AI 回答下方的三個出口：存個人筆記 / 發布成企業洞察 / 下載圖 */
.ans-acts {
  display: flex; gap: 7px; flex-wrap: wrap;
  border-top: 1px solid var(--neutral-100); margin-top: 13px; padding-top: 11px;
}
.ans-acts button {
  border: 1.5px solid var(--blue-200); background: #fff; color: var(--neutral-700);
  border-radius: 999px; padding: 6px 13px; font-size: .74rem; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
.ans-acts button:hover { background: var(--blue-100); border-color: var(--blue-300); color: var(--color-blue); }
.ans-acts button:active { transform: scale(.95); }
.ans-acts button.done { background: var(--bg-mint); border-color: var(--accent-teal); color: #0E8E6E; }
.ans-acts button.pub { border-color: var(--blue-300); color: var(--color-blue); font-weight: 600; }
.ans-acts button.pub.done { background: var(--bg-green); border-color: var(--accent-green); color: #2C7C13; }

/* ── 換頁（帳號 / API 文件 / 後台皆為整頁，不用彈窗）────────── */
.view { display: none; }
.view.on { display: block; animation: panelIn .4s var(--spring) both; }

.doc-btn {
  border: 1.5px solid var(--blue-200); background: #fff; color: var(--color-blue);
  border-radius: 999px; padding: 9px 14px; font-size: .78rem; font-weight: 600;
  cursor: pointer; letter-spacing: .02em; white-space: nowrap;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease;
}
.doc-btn:hover { background: var(--blue-100); border-color: var(--blue-300); }
.doc-btn:active { transform: scale(.96); }

/* 子頁共用刊頭：永遠有一顆「回報告」，而且三個工具互相到得了 */
.vhead {
  position: sticky; top: 0; z-index: 40;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--neutral-100);
}
.vhead-in {
  max-width: var(--page-max); margin: 0 auto; padding: 13px 24px;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.back-btn {
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  border: 1.5px solid var(--blue-200); background: #fff; color: var(--color-blue);
  border-radius: 999px; padding: 9px 17px 9px 14px; font-size: .82rem; font-weight: 600;
  cursor: pointer;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease, box-shadow var(--dur-fast) ease;
}
.back-btn:hover { background: var(--blue-100); border-color: var(--blue-300); box-shadow: var(--shadow-sm); }
.back-btn:active { transform: scale(.97); }
.back-btn .ar { font-size: 1rem; line-height: 1; }
.vhead .vh-t { display: grid; line-height: 1.35; margin-right: auto; }
.vhead .vh-t b { font-size: .9rem; color: var(--neutral-900); font-weight: 600; }
.vhead .vh-t i { font-size: .72rem; color: var(--neutral-500); font-style: normal; }
.vhead .vh-logo { height: 30px; width: auto; display: block; flex: none; opacity: .9; }
.vhead .mh-tools { flex: none; }

.vpage { max-width: var(--page-max); margin: 0 auto; padding: 30px 24px 120px; }
.vpage > h2 { font-size: 1.55rem; letter-spacing: -.02em; margin-bottom: 6px; }
.vpage > .lede { color: var(--neutral-500); font-size: .9rem; line-height: 1.8; margin: 0 0 26px; max-width: 46em; }
.vsec { margin-bottom: 30px; }
.vsec > h3 {
  font-size: 1.06rem; margin-bottom: 4px;
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
}
.vsec > h3 .cnt {
  font-size: .72rem; font-weight: 600; color: var(--color-blue);
  background: var(--blue-100); border-radius: 999px; padding: 3px 10px;
}
.vsec > .sd { font-size: .82rem; color: var(--neutral-500); margin: 0 0 14px; }
.vcard { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 22px 26px; }
.vempty { color: var(--neutral-300); font-size: .85rem; text-align: center; padding: 34px 0; }

/* 保存位置徽章：個人 vs 企業，一眼看得出東西存在誰名下 */
.own {
  font-size: .68rem; font-weight: 700; letter-spacing: .04em;
  border-radius: 999px; padding: 3px 10px; white-space: nowrap;
}
.own.me  { background: var(--bg-lavender); color: #574BA8; }
.own.org { background: var(--bg-mint); color: #0E8E6E; }

/* 子頁裡的行內小字與已保存的答案內容 */
.vpage p.dim, .vpage .dim { color: var(--neutral-500); font-size: .8rem; line-height: 1.8; }
.note-item .ai-a { font-size: .85rem; line-height: 1.85; color: var(--neutral-700); }
.note-item .ai-a p { margin: 0 0 8px; }
.note-item .ai-a b { color: var(--color-blue); }
.note-item .ai-a .src { font-size: .72rem; color: var(--neutral-300); margin-top: 6px; }
.note-item .mini-chart { margin: 6px 0 2px; }
.note-item .acct-card { padding: 0; }

/* AI 筆記（個人）與 企業洞察庫（貴司） */
.note-list { display: grid; gap: 10px; }
.note-item {
  background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-sm);
  padding: 17px 20px; display: grid; gap: 7px;
}
.note-item .nt-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.note-item .nt-q { font-size: .9rem; font-weight: 600; color: var(--neutral-900); flex: 1; min-width: 200px; }
.note-item .nt-cond {
  font-size: .72rem; color: var(--neutral-500);
  display: flex; gap: 12px; flex-wrap: wrap;
}
.note-item .nt-cond b { color: var(--neutral-700); font-weight: 600; }
.note-item .nt-acts { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 3px; }
.note-item .nt-acts button {
  border: 1.5px solid var(--neutral-100); background: #fff; color: var(--neutral-700);
  border-radius: 999px; padding: 5px 12px; font-size: .73rem; cursor: pointer;
  transition: transform .1s ease-out, background var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
.note-item .nt-acts button:hover { background: var(--blue-100); border-color: var(--blue-300); color: var(--color-blue); }
.note-item .nt-acts button:active { transform: scale(.95); }
.note-item .nt-acts button.danger:hover { background: var(--bg-pink); border-color: #E0685E; color: #B0463C; }
.note-item .nt-chart { margin-top: 4px; }
.note-item.org { border-left: 3px solid var(--accent-teal); }

/* 隱私模型說明：這一版的產品主張，寫在使用者看得到的地方 */
.priv { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; }
.priv-card { border-radius: var(--radius); padding: 19px 21px; }
.priv-card.a { background: var(--bg-lavender); color: #574BA8; }
.priv-card.b { background: var(--bg-mint); color: #0E7A60; }
.priv-card.c { background: var(--bg-blue); color: #14456F; }
.priv-card h5 { margin: 0 0 7px; font-family: var(--font-heading); font-size: .98rem; letter-spacing: -.01em; }
.priv-card p { margin: 0; font-size: .8rem; line-height: 1.75; }
.priv-card .kk { display: block; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; opacity: .65; margin-bottom: 6px; }

/* ── 後台整頁 ────────────────────────────────────────────────── */
.adm-banner {
  background: var(--bg-peach); border-radius: var(--radius); padding: 16px 20px;
  font-size: .8rem; color: var(--neutral-700); line-height: 1.8; margin-bottom: 22px;
}
.adm-banner b { color: #A75F09; }
.adm-page-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--neutral-100); flex-wrap: wrap; margin-bottom: 24px; }

/* ── 文件閱讀器（給工程師的規格，站內直接看）─────────────────── */
.doc-wrap { display: grid; grid-template-columns: 210px minmax(0, 1fr) 304px; gap: 22px; align-items: start; }
@media (max-width: 1280px) { .doc-wrap { grid-template-columns: 190px minmax(0, 1fr) 272px; gap: 16px; } }
@media (max-width: 1080px) { .doc-wrap { grid-template-columns: minmax(0, 1fr); } .doc-nav { position: static; } }
.doc-nav { position: sticky; top: 76px; display: grid; gap: 3px; }
.doc-nav .dn-lbl {
  font-size: .68rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--neutral-300); padding: 4px 12px 6px;
}
.doc-nav button {
  border: 0; background: none; text-align: left; width: 100%; cursor: pointer;
  border-radius: var(--radius-sm); padding: 10px 12px; font-size: .84rem; color: var(--neutral-700);
  transition: background var(--dur-fast) ease, transform .1s ease-out;
}
.doc-nav button:hover { background: var(--blue-100); }
.doc-nav button:active { transform: scale(.985); }
.doc-nav button.on { background: var(--blue-100); color: var(--color-blue); font-weight: 600; }
.doc-nav .dn-toc { border-top: 1px solid var(--neutral-100); margin-top: 10px; padding-top: 8px; max-height: 46vh; overflow: auto; scrollbar-width: thin; }
.doc-nav .dn-toc button { font-size: .78rem; padding: 6px 12px; color: var(--neutral-500); }
.doc-body { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 34px 42px 46px; min-width: 0; }
.doc-tools { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.doc-tools .sel::after { display: none; }

/* ── 會前共筆留言（像 Figma：選字就能留言，右欄看討論串）──────── */
.doc-body ::selection { background: #FFF0B8; }

/* 標題旁的留言數小圓點 */
.cpin {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px; margin-left: 8px;
  vertical-align: middle; border: 0; cursor: pointer;
  border-radius: 10px 10px 10px 3px;
  background: var(--accent-yellow); color: #7A5A00;
  font-size: .7rem; font-weight: 700; line-height: 1;
  transition: transform .12s ease-out, box-shadow var(--dur-fast) ease;
}
.cpin:hover { box-shadow: 0 3px 10px rgba(3,38,57,.16); }
.cpin:active { transform: scale(.9); }
.cpin.done { background: var(--neutral-100); color: var(--neutral-500); }

/* 選取文字後浮出來的「留言」鈕 */
.sel-cmt {
  position: absolute; z-index: 60; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 5px;
  border: 0; cursor: pointer; padding: 7px 13px; border-radius: 999px;
  background: var(--color-blue); color: #fff; font-size: .78rem; font-weight: 600;
  box-shadow: 0 6px 18px rgba(3,38,57,.24);
  animation: selPop var(--dur-fast) cubic-bezier(.22,1,.36,1) both;
}
.sel-cmt[hidden] { display: none; }        /* class 的 display 會蓋掉瀏覽器的 [hidden]，要自己補一條 */
.sel-cmt .sc-i { font-size: .82rem; }
.sel-cmt:active { transform: translateX(-50%) scale(.94); }
@keyframes selPop { from { opacity: 0; transform: translateX(-50%) translateY(4px) scale(.94); } }
@media (prefers-reduced-motion: reduce) { .sel-cmt { animation: none; } }

/* 右欄 */
.cmt-rail { position: sticky; top: 76px; max-height: calc(100vh - 96px); overflow: auto; scrollbar-width: thin; display: grid; gap: 10px; align-content: start; padding-right: 2px; }
@media (max-width: 1080px) { .cmt-rail { position: static; max-height: none; } }
.cr-head { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 16px 16px 14px; display: grid; gap: 9px; }
.cr-title { display: flex; align-items: baseline; gap: 8px; font-size: .95rem; font-weight: 600; color: var(--neutral-900); }
.cr-title .cr-n { font-size: .72rem; font-weight: 500; color: var(--neutral-500); }
.cr-sub { font-size: .74rem; line-height: 1.7; color: var(--neutral-500); }
.cr-sub b { color: var(--neutral-700); }
.cr-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cr-seg { display: inline-flex; background: var(--blue-100); border-radius: 999px; padding: 2px; }
.cr-seg button { border: 0; background: none; cursor: pointer; border-radius: 999px; padding: 5px 11px; font-size: .74rem; color: var(--neutral-500); transition: background var(--dur-fast) ease, color var(--dur-fast) ease; }
.cr-seg button.on { background: #fff; color: var(--color-blue); font-weight: 600; box-shadow: 0 1px 3px rgba(3,38,57,.1); }
.cr-me { border: 1px solid var(--neutral-100); background: none; cursor: pointer; border-radius: 999px; padding: 5px 11px; font-size: .74rem; color: var(--neutral-700); max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-me:hover { border-color: var(--blue-300); color: var(--color-blue); }
.cr-new { width: 100%; border: 1px dashed var(--neutral-100); background: none; cursor: pointer; border-radius: var(--radius-sm); padding: 9px; font-size: .78rem; color: var(--neutral-500); transition: background var(--dur-fast) ease, color var(--dur-fast) ease, transform .1s ease-out; }
.cr-new:hover { background: var(--blue-100); color: var(--color-blue); border-color: var(--blue-200); }
.cr-new:active { transform: scale(.985); }
.cr-empty { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 26px 18px; text-align: center; font-size: .78rem; line-height: 1.8; color: var(--neutral-500); }
.cr-err { background: #FFF6E8; border-radius: var(--radius-sm); padding: 12px 14px; font-size: .74rem; line-height: 1.7; color: #8A5A0B; }
.cr-err b { display: block; margin-bottom: 2px; }
.cr-err code { background: rgba(0,0,0,.06); padding: 1px 5px; border-radius: 4px; }

/* 討論串卡片 */
.cmt-card { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 14px 15px 10px; display: grid; gap: 9px; }
.cmt-card.done { opacity: .62; }
.cmt-card.composing { box-shadow: 0 0 0 2px var(--accent-yellow), var(--shadow-sm); }
.cmt-card.flash { animation: cmtFlash 1.1s ease-out; }
@keyframes cmtFlash { 0%, 40% { box-shadow: 0 0 0 2px var(--accent-yellow), var(--shadow-sm); } 100% { box-shadow: var(--shadow-sm); } }
@media (prefers-reduced-motion: reduce) { .cmt-card.flash { animation: none; } }
.cc-quote { border-left: 3px solid var(--blue-200); padding: 1px 0 1px 9px; font-size: .74rem; line-height: 1.65; color: var(--neutral-500); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cc-sect { font-size: .72rem; color: var(--color-blue); font-weight: 600; }
.cc-sect.dimmed { color: var(--neutral-300); font-weight: 500; }
.cc-msg { display: flex; gap: 8px; align-items: flex-start; }
.cc-msg.re { padding-left: 14px; border-left: 1px solid var(--neutral-100); margin-left: 11px; }
.cc-av { flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: var(--blue-100); color: var(--color-blue); font-size: .7rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.cc-msg.re .cc-av { width: 20px; height: 20px; font-size: .64rem; }
.cc-in { min-width: 0; flex: 1; }
.cc-meta { display: flex; align-items: baseline; gap: 6px; }
.cc-meta b { font-size: .78rem; color: var(--neutral-900); font-weight: 600; }
.cc-meta i { font-style: normal; font-size: .68rem; color: var(--neutral-300); }
.cc-x { margin-left: auto; border: 0; background: none; cursor: pointer; font-size: .68rem; color: var(--neutral-300); opacity: 0; transition: opacity var(--dur-fast) ease; }
.cc-msg:hover .cc-x { opacity: 1; }
.cc-x:hover { color: #C7522A; }
.cc-body { font-size: .8rem; line-height: 1.72; color: var(--neutral-700); margin-top: 2px; overflow-wrap: anywhere; }
.cc-form { display: grid; gap: 7px; }
.cc-form textarea, .cc-name {
  width: 100%; border: 1px solid var(--neutral-100); border-radius: var(--radius-sm);
  padding: 9px 11px; font: inherit; font-size: .8rem; line-height: 1.65; color: var(--neutral-900);
  background: #fff; resize: vertical; transition: border-color var(--dur-fast) ease;
}
.cc-form textarea:focus, .cc-name:focus { outline: none; border-color: var(--blue-300); }
.cc-acts { display: flex; gap: 7px; }
.btn-sm { padding: 7px 14px; font-size: .76rem; border-radius: 999px; }
.cc-foot { display: flex; align-items: center; gap: 4px; border-top: 1px solid var(--neutral-100); padding-top: 6px; margin-top: 1px; }
.cc-foot button { border: 0; background: none; cursor: pointer; border-radius: var(--radius-sm); padding: 5px 8px; font-size: .72rem; color: var(--neutral-500); transition: background var(--dur-fast) ease, color var(--dur-fast) ease; }
.cc-foot button:hover { background: var(--blue-100); color: var(--color-blue); }
.cc-by { margin-left: auto; font-size: .68rem; color: var(--accent-green); }

/* 右上角「API 文件」按鈕上的未解決數 */
.db-n { display: inline-flex; align-items: center; justify-content: center; min-width: 17px; height: 17px; padding: 0 5px; margin-left: 5px; border-radius: 999px; background: var(--accent-orange); color: #fff; font-size: .64rem; font-weight: 700; line-height: 1; vertical-align: middle; }

@media print { .cmt-rail, .cpin, .sel-cmt { display: none !important; } .doc-wrap { grid-template-columns: 1fr; } }

.md { font-size: .88rem; line-height: 1.85; color: var(--neutral-900); }
.md h1 { font-size: 1.5rem; letter-spacing: -.02em; margin: 0 0 6px; }
.md h2 { font-size: 1.14rem; margin: 34px 0 10px; padding-top: 22px; border-top: 1px solid var(--neutral-100); color: var(--color-blue); }
.md h2:first-of-type { border-top: 0; padding-top: 0; }
.md h3 { font-size: 1rem; margin: 24px 0 8px; }
.md h4 { font-size: .9rem; margin: 18px 0 6px; color: var(--neutral-700); }
.md p { margin: 0 0 12px; }
.md ul, .md ol { margin: 0 0 14px; padding-left: 22px; }
.md li { margin-bottom: 5px; }
.md strong { color: var(--color-blue); }
.md hr { border: 0; border-top: 1px solid var(--neutral-100); margin: 26px 0; }
.md blockquote {
  margin: 0 0 14px; padding: 14px 20px; background: var(--bg-yellow);
  border-radius: var(--radius-sm); border-left: 3px solid var(--accent-orange);
}
.md blockquote p:last-child { margin-bottom: 0; }
.md code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .82em;
  background: var(--blue-100); border-radius: 5px; padding: 2px 6px; color: var(--color-blue);
}
.md pre {
  background: var(--neutral-900, #16242E); color: #E6EEF3; border-radius: var(--radius);
  padding: 18px 20px; overflow-x: auto; margin: 0 0 16px; font-size: .78rem; line-height: 1.65;
}
.md pre code { background: none; color: inherit; padding: 0; font-size: 1em; }
.md .tbl-scroll { overflow-x: auto; margin: 0 0 16px; }
.md table { border-collapse: collapse; font-size: .82rem; width: 100%; min-width: 460px; }
.md th, .md td { padding: 10px 13px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--neutral-100); }
.md thead th { color: var(--neutral-500); font-weight: 500; font-size: .76rem; border-bottom: 1.5px solid var(--neutral-200); white-space: nowrap; }
.md tbody tr:hover { background: var(--blue-100); }
.md a { color: var(--color-blue); }

/* ── 行動籃 ──────────────────────────────────────────────────── */
.basket {
  position: fixed; right: 26px; bottom: 26px; z-index: 55;
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--color-blue); color: #fff;
  border: 0; border-radius: 999px; padding: 14px 24px;
  font-size: .9rem; font-weight: 600; cursor: pointer;
  box-shadow: 0 10px 34px rgba(0,77,137,.32);
  transition: transform .34s var(--spring-bounce), opacity .3s ease, box-shadow var(--dur-fast) ease;
}
.basket:active { transform: scale(.95); }
.basket.hide { opacity: 0; transform: translateY(20px) scale(.9); pointer-events: none; }
.basket .n {
  background: rgba(255,255,255,.22); border-radius: 999px;
  min-width: 24px; height: 24px; display: grid; place-items: center;
  font-size: .8rem; font-variant-numeric: tabular-nums;
}
.basket.bump { animation: bump .42s var(--spring-bounce); }
@keyframes bump { 0%{transform:scale(1)} 40%{transform:scale(1.09)} 100%{transform:scale(1)} }

.scrim {
  position: fixed; inset: 0; z-index: 70; background: rgba(3,38,57,.32);
  opacity: 0; pointer-events: none; transition: opacity .35s var(--spring);
  backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
}
.scrim.open { opacity: 1; pointer-events: auto; }
.sheet {
  position: fixed; z-index: 71; right: 0; top: 0; bottom: 0;
  width: min(460px, 100%); background: #fff;
  box-shadow: -20px 0 70px rgba(3,38,57,.2);
  transform: translateX(100%);
  transition: transform .48s var(--spring);
  display: flex; flex-direction: column;
}
.sheet.open { transform: none; }
.sheet-head { padding: 26px 28px 18px; border-bottom: 1px solid var(--neutral-100); }
.sheet-head h3 { margin-bottom: 4px; }
.sheet-head p { margin: 0; font-size: .8rem; color: var(--neutral-500); }
.sheet-body { flex: 1; overflow: auto; padding: 20px 28px; }
.sheet-foot { padding: 18px 28px 26px; border-top: 1px solid var(--neutral-100); display: flex; gap: 10px; }
.sheet-foot .btn { flex: 1; }
.b-item {
  background: var(--blue-100); border-radius: var(--radius); padding: 16px 18px; margin-bottom: 11px;
  animation: msgIn .34s var(--spring) both;
}
.b-item .b-tag { font-size: .68rem; font-weight: 700; letter-spacing: .08em; color: var(--color-blue); }
.b-item .b-txt { font-size: .87rem; margin: 6px 0 8px; }
.b-item .b-meta { font-size: .73rem; color: var(--neutral-500); }
.b-item .rm {
  border: 0; background: none; color: var(--neutral-500); cursor: pointer;
  font-size: .75rem; padding: 2px 0; text-decoration: underline; margin-top: 8px;
}
.b-empty { text-align: center; color: var(--neutral-300); font-size: .87rem; padding: 60px 0; }

/* 行動 → 練息場方案（把清單接回業務） */
.b-svc {
  margin-top: 11px; padding-top: 11px; border-top: 1px dashed var(--blue-200);
  font-size: .76rem; color: var(--neutral-700); line-height: 1.7;
}
.b-svc b { color: var(--color-blue); }
.b-svc .svc-tag {
  display: inline-block; background: #fff; border-radius: 999px;
  padding: 2px 9px; font-size: .7rem; font-weight: 600; color: var(--color-blue);
  margin: 5px 5px 0 0;
}
.sheet-foot { flex-direction: column; gap: 9px; }
.sheet-foot .row { display: flex; gap: 9px; width: 100%; }
.sheet-foot .row .btn { flex: 1; }
.sheet-sum {
  background: var(--bg-mint); border-radius: var(--radius); padding: 13px 16px;
  font-size: .78rem; color: var(--neutral-700); line-height: 1.7; width: 100%;
}
.sheet-sum b { color: var(--color-blue); }

/* ── 通用彈窗 ────────────────────────────────────────────────── */
.modal { position: fixed; inset: 0; z-index: 90; pointer-events: none; }
.modal.open { pointer-events: auto; }
.modal-scrim {
  position: absolute; inset: 0; background: rgba(3,38,57,.34);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  opacity: 0; transition: opacity .34s var(--spring);
}
.modal.open .modal-scrim { opacity: 1; }
.modal-card {
  position: absolute; left: 50%; top: 50%;
  width: min(680px, calc(100vw - 32px)); max-height: min(84vh, 900px); overflow: auto;
  background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  transform: translate(-50%, -46%) scale(.94); opacity: 0;
  transition: opacity .26s var(--spring), transform .38s var(--spring);
}
.modal.open .modal-card { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.modal-card.wide { width: min(1000px, calc(100vw - 32px)); }
.m-head {
  padding: 26px 30px 18px; border-bottom: 1px solid var(--neutral-100);
  display: flex; align-items: flex-start; gap: 16px;
  position: sticky; top: 0; background: rgba(255,255,255,.94);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); z-index: 2;
}
.m-head .eyebrow { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--neutral-500); margin-bottom: 7px; }
.m-head h3 { margin: 0; }
.m-head p { margin: 6px 0 0; font-size: .8rem; color: var(--neutral-500); }
.m-head .grow { flex: 1; }
.m-x {
  width: 34px; height: 34px; flex: none; border: 0; border-radius: 50%;
  background: var(--blue-100); color: var(--neutral-700); cursor: pointer;
  font-size: 1.1rem; line-height: 1; display: grid; place-items: center;
  transition: transform .1s ease-out, background var(--dur-fast) ease;
}
.m-x:hover { background: var(--blue-200); }
.m-x:active { transform: scale(.92); }
.m-body { padding: 24px 30px 30px; }
.m-body h4 {
  font-family: var(--font-body); font-size: .72rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--neutral-500); margin: 26px 0 12px;
}
.m-body h4:first-child { margin-top: 0; }
.m-body p { margin: 0 0 12px; font-size: .88rem; line-height: 1.75; color: var(--neutral-900); }
.m-body p.dim { color: var(--neutral-500); font-size: .8rem; }
.m-foot { padding: 0 30px 28px; display: flex; gap: 10px; flex-wrap: wrap; }

/* 信任證據 */
.ev { display: grid; gap: 11px; }
.ev-item {
  background: var(--blue-100); border-radius: var(--radius); padding: 16px 19px;
  display: grid; grid-template-columns: 30px 1fr; gap: 14px; align-items: start;
}
.ev-item .no {
  width: 26px; height: 26px; border-radius: 50%; background: var(--color-blue); color: #fff;
  display: grid; place-items: center; font-size: .74rem; font-weight: 700;
}
.ev-item .t { font-size: .89rem; font-weight: 600; color: var(--color-blue); margin-bottom: 5px; }
.ev-item .d { font-size: .82rem; color: var(--neutral-700); line-height: 1.72; }
.ev-item .d b { color: var(--color-black); }

/* 帳號面板 */
.acct-card {
  display: flex; align-items: center; gap: 15px;
  background: var(--blue-100); border-radius: var(--radius); padding: 18px 20px; margin-bottom: 20px;
}
.acct-card .big {
  width: 52px; height: 52px; border-radius: 50%; flex: none;
  background: linear-gradient(140deg, var(--blue-700), var(--accent-teal));
  color: #fff; display: grid; place-items: center; font-weight: 700;
}
.acct-card .n { font-size: 1rem; font-weight: 600; color: var(--color-black); }
.acct-card .r { font-size: .78rem; color: var(--neutral-500); margin-top: 3px; }
.acct-rows { display: grid; gap: 2px; }
.acct-row {
  display: flex; align-items: center; gap: 13px; width: 100%; text-align: left;
  border: 0; background: none; cursor: pointer; padding: 13px 14px;
  border-radius: var(--radius-sm); transition: background var(--dur-fast) ease;
}
.acct-row:hover { background: var(--blue-100); }
.acct-row .ico { width: 30px; height: 30px; border-radius: 9px; background: var(--bg-mint); display: grid; place-items: center; font-size: .8rem; flex: none; }
.acct-row .tx b { display: block; font-size: .87rem; color: var(--neutral-900); font-weight: 600; }
.acct-row .tx span { font-size: .74rem; color: var(--neutral-500); }
.acct-row .cnt { margin-left: auto; font-size: .78rem; color: var(--color-blue); font-weight: 600; }

/* 後台管理 */
.adm-tabs { display: flex; gap: 4px; padding: 0 30px; border-bottom: 1px solid var(--neutral-100); flex-wrap: wrap; }
.adm-tab {
  border: 0; background: none; cursor: pointer; padding: 12px 13px 13px;
  font-size: .85rem; color: var(--neutral-500); border-bottom: 2.5px solid transparent;
  margin-bottom: -1px; transition: color var(--dur-fast) ease, border-color var(--dur-fast) ease;
}
.adm-tab:hover { color: var(--neutral-900); }
.adm-tab.on { color: var(--color-blue); font-weight: 600; border-bottom-color: var(--color-blue); }
.adm-pane { display: none; }
.adm-pane.on { display: block; animation: panelIn .34s var(--spring) both; }
.adm-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 11px; margin-bottom: 22px; }
.adm-kpi { background: var(--blue-100); border-radius: var(--radius); padding: 15px 17px; }
.adm-kpi .l { font-size: .72rem; color: var(--neutral-500); }
.adm-kpi .v { font-family: var(--font-heading); font-size: 1.55rem; letter-spacing: -.026em; color: var(--color-blue); line-height: 1.2; margin-top: 4px; }
.adm-kpi .v small { font-size: .78rem; color: var(--neutral-500); margin-left: 3px; }
.adm-kpi .s { font-size: .7rem; color: var(--neutral-500); margin-top: 2px; }
.adm-kpi.warn { background: var(--bg-peach); }
.adm-kpi.warn .v { color: #A75F09; }

.adm-list { display: grid; gap: 8px; }
.adm-row {
  display: grid; grid-template-columns: 26px 1fr auto; gap: 13px; align-items: center;
  background: #fff; border: 1.5px solid var(--neutral-100); border-radius: var(--radius-sm);
  padding: 12px 16px; font-size: .85rem;
}
.adm-row .rk { font-size: .74rem; color: var(--neutral-300); font-weight: 700; }
.adm-row .nm { color: var(--neutral-900); }
.adm-row .nm small { display: block; color: var(--neutral-500); font-size: .73rem; margin-top: 2px; }
.adm-row .vv { font-variant-numeric: tabular-nums; color: var(--color-blue); font-weight: 600; }
.adm-note {
  background: var(--bg-yellow); border-radius: var(--radius); padding: 15px 18px;
  font-size: .78rem; color: #7A5A08; line-height: 1.75; margin-top: 18px;
}
.adm-note b { color: #A75F09; }
.adm-manage { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 11px; }
.adm-card { background: #fff; border: 1.5px solid var(--neutral-100); border-radius: var(--radius); padding: 17px 19px; }
.adm-card h5 { margin: 0 0 6px; font-family: var(--font-heading); font-size: .95rem; color: var(--color-blue); }
.adm-card ul { margin: 0; padding-left: 17px; font-size: .78rem; color: var(--neutral-700); line-height: 1.8; }

/* 頁尾 */
.foot { border-top: 1px solid var(--neutral-100); margin-top: 40px; padding-top: 26px; font-size: .76rem; color: var(--neutral-500); line-height: 1.85; }
.foot b { color: var(--neutral-700); }

/* ── 進場：滾到才畫 ──────────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(16px); }
.reveal.in { opacity: 1; transform: none; transition: opacity .55s var(--spring), transform .55s var(--spring); }

/* ── 響應式 ──────────────────────────────────────────────────── */
@media (max-width: 860px) {
  .ia { grid-template-columns: 1fr; }
  .ia-action { border-left: 0; border-top: 1px solid rgba(255,255,255,.7); }
  .radar-wrap { grid-template-columns: 1fr; }
  .verdict { padding: 22px; }
  .block-head, .block-chart, .ia > div { padding-left: 20px; padding-right: 20px; }
  .bar-row { grid-template-columns: 82px 1fr 54px; gap: 10px; font-size: .8rem; }
  .dv-row { grid-template-columns: 92px 1fr 50px; }
  .wrap, .mh-in, .nav-in { padding-left: 16px; padding-right: 16px; }
  .basket { right: 16px; bottom: 16px; }
  .mh-title { padding: 18px 0 16px; }
  .acct .who { display: none; }
  .acct { padding: 5px; }
  .ai-wrap { grid-template-columns: 1fr; }
  .ai-side { position: static; max-height: none; }
  .ai-convs { max-height: 190px; flex: none; }
  .ai-shell { height: auto; min-height: 0; }
  .thread { max-height: 58vh; padding-right: 6px; }
  .filters { margin-left: 0; }
  .m-head, .m-body, .adm-tabs { padding-left: 20px; padding-right: 20px; }
  .m-foot { padding-left: 20px; padding-right: 20px; }
  .vhead-in, .vpage { padding-left: 16px; padding-right: 16px; }
  .vhead .vh-t, .vhead .vh-logo { display: none; }
  .vcard { padding: 20px; }
  .doc-wrap { grid-template-columns: 1fr; }
  .doc-nav { position: static; }
  .doc-nav .dn-toc { max-height: 150px; }
  .doc-body { padding: 24px 20px 32px; }
}

/* ── 無障礙：三個獨立訊號 ────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
  .sheet { transition: opacity .2s ease; }
}
@media (prefers-reduced-transparency: reduce) {
  .navbar, .composer, .gate, .sel-menu, .m-head, .vhead { background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .masked-veil { background: #fff; backdrop-filter: none; }
  .modal-scrim { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(3,38,57,.5); }
}
@media (prefers-contrast: more) {
  .block, .kpi, .verdict { border: 1.5px solid var(--neutral-300); }
  .ia p, .bubble p { color: var(--color-black); }
}

@media print {
  .navbar, .basket, .composer, .chips, .blobs, .add-btn, .ans-acts,
  .mh-tools, .ai-side, .modal, .scrim, .sheet, .trust-link,
  .vhead, .doc-btn, .doc-nav, .doc-tools { display: none !important; }
  .panel { display: block !important; page-break-after: always; }
  .ai-shell { height: auto !important; }
  .thread { overflow: visible !important; max-height: none !important; }
  .doc-body { box-shadow: none; padding: 0; }
  .block { box-shadow: none; border: 1px solid var(--neutral-200); }
  .masthead { border-bottom: 1.5px solid var(--neutral-200); padding-bottom: 10px; }
  .ai-wrap { grid-template-columns: 1fr; }
}