/* Life Model 页面在 template 样式之上的补充 */
:root { --lm-orange: #e8633a; --lm-teal: #2f7d6d; --lm-blue: #4f6bd8; --lm-ink: #2e2e38; }

/* 中文字体回退（Roobert 无中文字形） */
.lm-zh, .lm-zh .typeset-article, .lm-zh .font-heading {
  font-family: var(--font-roobert), "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}
.lm-zh .typeset-article { --typeset-font-body: var(--font-roobert), "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif; --typeset-font-heading: var(--typeset-font-body); }
.lm-zh h1.font-heading { letter-spacing: -0.02em; }

/* Logo：与 cat-lab 站点一致的文字标 */
.lm-logo { font-size: 22px; font-weight: 600; letter-spacing: -0.03em; color: var(--foreground); line-height: 1; display: inline-flex; align-items: baseline; }
.lm-logo b { font-weight: 600; color: var(--lm-orange); }
.lm-logo i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--lm-orange); margin-left: 3px; }
.lm-switch { font-weight: 500; }

/* 表格：允许换行，避免中文长单元格撑出超宽表 */
.lm-table table { min-width: 0; }
.lm-table thead th { white-space: normal; }
.lm-table td:first-child { color: var(--foreground); }
.lm-caption { text-align: center; font-size: .875em; color: var(--grey-150); font-weight: 500; margin-top: .75em !important; text-wrap: balance; }

/* figure 表面 */
.lm-surface { background: #fff; }
.lm-plain { position: relative; }
figure svg text { font-family: inherit; }

/* 交互组件通用 */
.lm-interactive { padding: 20px 20px 16px; background: #fff; }
.lm-controls { display: flex; align-items: center; gap: 16px; margin: 8px 4px 12px; font-size: 14px; color: var(--grey-200); }
.lm-controls input[type=range] { flex: 1; accent-color: var(--lm-ink); }
.lm-day { min-width: 9.5em; font-variant-numeric: tabular-nums; font-weight: 500; color: var(--foreground); }
.lm-readout { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lm-chip { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2px 8px; padding: 10px 12px; border-radius: 10px; background: #f6f6f9; font-size: 14px; }
.lm-chip.is-dev { background: #fdf0ea; }
.lm-dot { width: 10px; height: 10px; border-radius: 50%; }
.lm-chip-label { color: var(--grey-200); }
.lm-chip-z { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--foreground); }
.lm-chip-verdict { grid-column: 2 / 4; font-size: 13px; color: var(--grey-150); }
.lm-chip.is-dev .lm-chip-verdict { color: var(--lm-orange); font-weight: 600; }
@media (max-width: 640px) { .lm-readout { grid-template-columns: 1fr; } }

/* Agent Loop */
.lm-steps { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.lm-step-btn { padding: 8px 14px; font-size: 14px; font-weight: 500; background: #f3f3f7; color: var(--grey-200); cursor: pointer; border: 0; }
.lm-step-btn[aria-pressed=true] { background: var(--lm-ink); color: #fff; }
.lm-loop-head { display: flex; flex-direction: column; gap: 4px; }
.lm-loop-act { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--grey-150); }
.lm-zh .lm-loop-act { text-transform: none; letter-spacing: .02em; }
.lm-loop-find { font-size: 19px; font-weight: 600; color: var(--foreground); line-height: 1.4; }
.lm-experts { display: flex; gap: 6px; margin: 10px 0 14px; min-height: 26px; }
.lm-tok { font: 12px ui-monospace, Menlo, monospace; padding: 4px 10px; border-radius: 999px; color: var(--lm-blue); background: rgba(79,107,216,.1); }
.lm-tracks { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.lm-track { padding: 12px 14px; border-radius: 10px; background: #f6f6f9; font-size: 15px; line-height: 1.5; color: var(--foreground); }
.lm-track-h { font-size: 12px; color: var(--grey-150); margin-bottom: 4px; font-weight: 500; }
@media (max-width: 640px) { .lm-tracks { grid-template-columns: 1fr; } }
.lm-conf { display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 14px; color: var(--grey-200); }
.lm-bar { position: relative; flex: 1; height: 8px; border-radius: 99px; background: #ececf2; }
.lm-bar > div { height: 100%; border-radius: 99px; background: var(--lm-orange); }
.lm-bar > i { position: absolute; top: -4px; width: 2px; height: 16px; background: var(--lm-ink); }
.lm-conf b { font-variant-numeric: tabular-nums; color: var(--foreground); }
.lm-out { margin-top: 12px; padding: 12px 14px; border-radius: 10px; border: 1px dashed var(--lm-orange); color: var(--foreground); font-size: 15px; }
.lm-note { margin-top: 12px; font-size: 12px; color: var(--grey-100); text-align: right; }

/* Gates */
.lm-gates { display: flex; align-items: stretch; gap: 10px; }
.lm-gate { flex: 1; padding: 16px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.lm-gate-id { font-size: 13px; font-weight: 600; color: var(--lm-orange); }
.lm-gate-name { font-size: 18px; font-weight: 600; color: var(--foreground); margin: 4px 0; }
.lm-gate-q { font-size: 14px; color: var(--grey-200); line-height: 1.45; }
.lm-gate-arrow { align-self: center; color: var(--grey-100); font-size: 20px; }
@media (max-width: 640px) { .lm-gates { flex-direction: column; } .lm-gate-arrow { transform: rotate(90deg); } }

/* 猫恢复动力学模拟实验：原生内嵌（catlab.js），仿 Atlas 的 thumbnail strip + Input / Output */
.lm-cap-hint { color: var(--grey-100); font-weight: 400; }
.lm-catlab { margin-top: 18px; font-size: 14px; color: var(--foreground); }
.cl-eyebrow { font: 11px ui-monospace, Menlo, monospace; letter-spacing: .08em; color: var(--lm-orange); margin-bottom: 12px; }
.cl-controls { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 16px; }
.cl-controls label { display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--grey-150); }
.cl-seg { display: inline-flex; padding: 3px; border-radius: 10px; background: #ededf3; gap: 2px; }
.cl-seg button { border: 0; background: transparent; padding: 6px 12px; border-radius: 8px; font-size: 13px; color: var(--grey-200); cursor: pointer; white-space: nowrap; }
.cl-seg button[aria-pressed=true] { background: #fff; color: var(--foreground); font-weight: 500; box-shadow: 0 1px 2px rgba(0,0,0,.08); }

.cl-strip { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 14px; scrollbar-width: thin; scrollbar-color: #c9c9d6 transparent; }
.cl-strip::-webkit-scrollbar { height: 6px; }
.cl-strip::-webkit-scrollbar-thumb { background: #c9c9d6; border-radius: 99px; }
.cl-thumb { flex: 0 0 136px; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: #fff; cursor: pointer; opacity: .55; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); transition: opacity .15s; text-align: left; }
.cl-thumb:hover { opacity: .85; }
.cl-thumb[aria-selected=true] { opacity: 1; box-shadow: 0 0 0 2px var(--foreground); }
.cl-thumb svg { display: block; width: 100%; height: auto; background: #fafafc; }
.cl-thumb span { display: block; padding: 5px 8px 6px; font-size: 11px; color: var(--grey-200); font-variant-numeric: tabular-nums; }

.cl-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 20px; margin-top: 6px; }
@media (max-width: 760px) { .cl-grid { grid-template-columns: 1fr; } }
.cl-label { font-size: 14px; font-weight: 600; color: var(--lm-blue); margin-bottom: 8px; }
.cl-label-out { color: var(--lm-orange); }
.cl-card { position: relative; height: calc(100% - 30px); padding: 14px 16px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.cl-out { outline: none; cursor: crosshair; }
.cl-out:focus-visible { box-shadow: inset 0 0 0 2px var(--foreground); }
.cl-mono { font: 11px ui-monospace, Menlo, monospace; letter-spacing: .06em; color: var(--grey-150); }
.cl-name { font-size: 22px; font-weight: 600; margin-top: 2px; }
.cl-in-note { margin: 8px 0 4px; font-size: 12px; color: var(--grey-150); }
.cl-svg { display: block; width: 100%; height: auto; }
.cl-svg text { font-size: var(--cl-fs, 12px); fill: var(--grey-100); font-family: inherit; }
.cl-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.cl-stats-out { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cl-stats div { padding: 8px 10px; border-radius: 8px; background: #f6f6f9; display: flex; flex-direction: column; gap: 2px; }
.cl-stats span { font-size: 11px; color: var(--grey-150); }
.cl-stats strong { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.cl-stats em { font-style: normal; }
.cl-ind { color: var(--lm-orange); }
.cl-act { color: var(--lm-teal); }
.cl-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--grey-200); margin-bottom: 4px; }
.cl-legend i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: 6px; vertical-align: middle; }

/* 悬停揭示：未揭示时隐藏实际曲线与实际恢复时间 */
.cl-actual, .cl-actual-legend { opacity: 0; transition: opacity .25s; }
.is-revealed .cl-actual, .is-revealed .cl-actual-legend { opacity: 1; }
.cl-when-shown { display: none; }
.is-revealed .cl-when-shown { display: inline; }
.is-revealed .cl-when-hidden { display: none; }
.cl-when-hidden { color: var(--grey-100); font-size: 14px; font-weight: 500; }
.cl-plot { position: relative; }
.cl-pill { position: absolute; left: 50%; bottom: 34px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 10px; background: rgba(255,255,255,.94); box-shadow: 0 1px 3px rgba(0,0,0,.12), inset 0 0 0 1px rgba(0,0,0,.08); font-size: 14px; font-weight: 600; pointer-events: none; white-space: nowrap; }
.cl-pill svg { width: 16px; height: 16px; }
.is-revealed .cl-pill { background: var(--lm-teal); color: #fff; }

.cl-eval { margin-top: 24px; }
.cl-eval-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; font-size: 13px; color: var(--grey-150); }
.cl-run { border: 0; border-radius: 999px; padding: 10px 18px; background: var(--foreground); color: #fff; font-size: 14px; font-weight: 500; cursor: pointer; }
.cl-run:disabled { opacity: .6; cursor: progress; }
.cl-empty { padding: 16px; border-radius: 10px; background: #f6f6f9; color: var(--grey-150); font-size: 13px; }
.cl-table { overflow-x: auto; border-radius: 10px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); background: #fff; }
.cl-table table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.cl-table th { text-align: left; font-weight: 500; font-size: 12px; color: var(--grey-150); padding: 10px 12px; }
.cl-table td { padding: 10px 12px; border-top: 1px solid #ececf2; vertical-align: top; }
.cl-table tr.is-best td:first-child { font-weight: 600; }
.cl-bar { height: 3px; border-radius: 2px; margin-top: 5px; }
.cl-note { margin-top: 10px; font-size: 13px; line-height: 1.6; color: var(--grey-200); }
.cl-subtle { color: var(--grey-100); }
.cl-protocol { margin-top: 16px; font-size: 13px; color: var(--grey-200); }
.cl-protocol summary { cursor: pointer; font-weight: 500; color: var(--foreground); }
.cl-protocol h4 { margin: 14px 0 4px; font-size: 13px; color: var(--foreground); }
.cl-protocol p { margin: 0 0 8px; line-height: 1.6; }

/* 场景卡片 */
.lm-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.lm-card { padding: 18px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.lm-card.is-near { box-shadow: inset 0 0 0 1.5px var(--lm-orange); }
.lm-card-tag { display: inline-block; font-size: 12px; padding: 2px 10px; border-radius: 99px; background: #f1f1f5; color: var(--grey-200); }
.lm-card.is-near .lm-card-tag { background: #fdf0ea; color: var(--lm-orange); font-weight: 600; }
.lm-card-title { font-size: 17px; font-weight: 600; color: var(--foreground); margin: 10px 0 6px; line-height: 1.35; }
.lm-card-desc { font-size: 14px; color: var(--grey-200); line-height: 1.5; }

/* Read More 卡片 */
.lm-rm-card { background: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
.lm-rm-card:hover { background: #f4f4f8; }

/* 引用复制 */
.lm-copy.is-copied { color: var(--lm-teal); }

/* 页脚 */
.lm-footer { background: #1f2a26; min-height: 30rem; }
.lm-footer-h2 { font-size: clamp(2.5rem, 1rem + 6vw, 6rem); }
.lm-zh .lm-footer-h2 { font-size: clamp(2rem, 1rem + 4vw, 4.25rem); letter-spacing: 0; }
.lm-footer-btn { background: var(--lm-orange) !important; color: #fff !important; }

/* ===================== 首页 / About（仿 worldlabs.ai 首页） ===================== */
.lm-home-hero { min-height: 480px; }
.lm-zh .lm-home-hero h1, .lm-zh .lm-statement { letter-spacing: -0.02em; }
.lm-statement { text-wrap: balance; }

/* 能力列表：点击展开，右侧切换插图 */
.lm-feat-wrap { display: flex; gap: 32px; align-items: center; max-width: 80rem; margin: 0 auto; width: 100%; }
.lm-feat-left { flex: 0 0 min(100%, 500px); display: flex; flex-direction: column; }
.lm-feat-right { flex: 1; min-width: 0; }
.lm-feat { cursor: pointer; color: var(--grey-100); transition: color .15s, background-color .15s; border-bottom: 1px solid rgba(148,148,168,.2); outline: none; }
.lm-feat:first-child { border-top: 0; }
.lm-feat:hover, .lm-feat:focus-visible { color: var(--foreground); background: rgba(148,148,168,.05); }
.lm-feat.is-active { color: var(--foreground); }
.lm-feat.is-active .lm-feat-name::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--lm-orange); margin: 0 12px 4px 0; vertical-align: middle; }
.lm-feat-body { display: grid; grid-template-rows: 0fr; overflow: hidden; transition: grid-template-rows .4s ease; }
.lm-feat-body > * { min-height: 0; }
.lm-feat.is-active .lm-feat-body { grid-template-rows: 1fr; margin-top: 8px; }
.lm-feat-body { grid-template-rows: 0fr; }
.lm-feat-body p, .lm-feat-mobile { overflow: hidden; }
.lm-feat:not(.is-active) .lm-feat-mobile, .lm-feat:not(.is-active) .lm-feat-body p { display: none; }
.lm-feat-mobile { margin-top: 8px; border-radius: 12px; overflow: hidden; background: #fff; }
.lm-feat-mobile svg { display: block; width: 100%; height: auto; }
.lm-feat-stage { position: relative; aspect-ratio: 16 / 10; border-radius: 16px; background: #fff; overflow: hidden; }
.lm-feat-panel { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .35s; }
.lm-feat-panel.is-active { opacity: 1; }
.lm-feat-panel svg { width: 100%; height: 100%; }
@media (max-width: 1023px) { .lm-feat-wrap { flex-direction: column; } .lm-feat-left { flex-basis: auto; width: 100%; } }

/* 深色研究卡片 */
.lm-dark-card { background: #1a1d1c; box-shadow: inset 0 0 10px rgba(255,255,255,.1); }
.lm-dark-art { position: absolute; inset: 0; filter: brightness(.8); transition: filter .5s; }
.lm-dark-card:hover .lm-dark-art { filter: brightness(1); }
.lm-dark-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.75) 100%); pointer-events: none; }
.lm-dark-card > .relative { z-index: 2; }

/* 文章卡片缩略图 */
.lm-post-art { margin-top: auto; aspect-ratio: 16 / 9; overflow: hidden; border-top: 1px solid rgba(0,0,0,.05); }
.lm-post-art svg { display: block; width: 100%; height: 100%; transition: transform 1s; }
.lm-rm-card:hover .lm-post-art svg { transform: scale(1.02); }