/* 模拟图按容器等比缩放，展示真实功能关系，不冒充生产截图。 */
.product-demo { min-width: 0; container-type: inline-size; position: relative; }
.product-demo figcaption { color: var(--muted); text-align: right; font-size: 11px; line-height: 1.7; margin-top: 16px; }
.chengshu-demo { padding: 0; }
.sis-demo { color: var(--cos-ink); }
.demo-top { display: flex; align-items: center; justify-content: space-between; height: 8cqw; padding: 0 2.8cqw; background: var(--white); border: 1px solid var(--mock-line); border-bottom: 0; border-radius: 7px 7px 0 0; color: var(--mock-muted); font-size: 1.5cqw; }
.demo-top strong { display: flex; gap: 1cqw; align-items: center; font-size: 2.7cqw; color: var(--mock-ink); }
.book-icon { font-size: 3.4cqw; }
.demo-avatar { display: flex; align-items: center; justify-content: center; border-radius: 50%; width: 3.8cqw; height: 3.8cqw; color: var(--white); background: var(--navy); }
.editor-demo { display: grid; grid-template-columns: minmax(0, 27fr) minmax(0, 73fr); grid-template-rows: minmax(0, 1fr); height: 65cqw; background: var(--surface); border: 1px solid var(--mock-line); border-radius: 0 0 7px 7px; box-shadow: 0 25px 55px -18px var(--shadow); overflow: clip; }
.demo-sidebar { position: relative; display: flex; flex-direction: column; padding: 2cqw 1.2cqw; background: var(--mock-bg); border-right: 1px solid var(--mock-line); font-size: 1.5cqw; color: var(--mock-muted); }
.demo-tabs { font-size: 1.35cqw; display: flex; gap: 1cqw; justify-content: center; padding: .9cqw 0 2.5cqw; border-bottom: 1px solid var(--mock-line); }
.demo-tabs b { color: var(--mock-ink); font-weight: 600; }
.sidebar-caption { display: block; font-size: 1.35cqw; color: var(--mock-muted); margin: 2.8cqw 1cqw 1.5cqw; }
.sidebar-item { padding: 1.3cqw .8cqw; white-space: nowrap; font-size: 1.45cqw; }
.sidebar-item.active { background: var(--surface); color: var(--mock-ink); border-radius: 3px; font-weight: 600; }
.sidebar-sub { padding: 1cqw 1cqw 1cqw 3cqw; font-size: 1.3cqw; }
.sidebar-bottom { position: absolute; bottom: 2.3cqw; left: 2.3cqw; display: flex; align-items: center; gap: 1cqw; font-size: 1.25cqw; }
.sidebar-bottom i { background: var(--green); width: .65cqw; height: .65cqw; border-radius: 50%; }
.demo-editor { min-width: 0; min-height: 0; position: relative; }
.editor-toolbar { display: flex; align-items: center; gap: 2.5cqw; padding: 0 2cqw; height: 5.7cqw; background: var(--white); color: var(--mock-muted); font-size: 1.4cqw; border-bottom: 1px solid var(--mock-line); }
.export-badge { margin-left: auto; padding: .7cqw 1cqw; border: 1px solid var(--mock-line); color: var(--mock-ink); border-radius: 3px; font-size: 1.2cqw; }
.demo-paper { margin: 3cqw 4cqw; padding: 4cqw 4.5cqw 5cqw; background: var(--white); min-height: 60cqw; box-shadow: 0 2px 10px var(--line); color: var(--mock-ink); }
.paper-chapter { display: block; text-align: center; font-size: 2.2cqw; font-weight: 650; margin-bottom: 3cqw; }
.demo-paper h5 { font-size: 1.8cqw; margin-bottom: 1.5cqw; }
.demo-paper p { font-size: 1.3cqw; line-height: 2.1; margin-bottom: 1.5cqw; text-align: justify; }
.demo-paper h6 { font-size: 1.45cqw; margin: 1.7cqw 0 1.2cqw; }
.demo-table { margin-bottom: 1.6cqw; border: 1px solid var(--mock-line); font-size: 1.2cqw; }
.demo-table > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-bottom: 1px solid var(--mock-line); }
.demo-table > div:last-child { border-bottom: 0; }
.demo-table span, .demo-table b { padding: 1cqw .6cqw; text-align: center; font-weight: 400; }
.demo-table b { background: var(--mock-bg); font-weight: 550; }
.demo-table > div > :first-child { border-right: 1px solid var(--mock-line); }
.change-note { position: absolute; display: flex; align-items: center; gap: 1.6cqw; right: 2cqw; bottom: 2.8cqw; width: 65cqw; max-width: calc(100% - 4cqw); padding: 2.2cqw 2.6cqw; background: var(--white); border: 1px solid var(--mock-line); box-shadow: 0 10px 35px var(--shadow); border-radius: 6px; }
.change-icon { background: var(--surface); color: var(--accent); font-size: 3cqw; padding: 1cqw; border-radius: 5px; }
.change-note b { display: block; font-size: 1.6cqw; font-weight: 550; }
.change-note small { display: block; font-size: 1.25cqw; color: var(--mock-muted); margin-top: .7cqw; }
.coscape-app { display: grid; grid-template-columns: minmax(0, 26fr) minmax(0, 74fr); background: var(--cos-bg); border: 1px solid var(--cos-line); color: var(--cos-ink); height: 79cqw; border-radius: 7px; overflow: clip; box-shadow: 0 22px 55px -18px var(--shadow); }
.coscape-sidebar { display: flex; position: relative; flex-direction: column; background: var(--night); padding: 2.8cqw 1.6cqw; gap: 1.3cqw; font-size: 1.4cqw; color: var(--cos-muted); }
.coscape-sidebar > strong { display: flex; align-items: center; gap: .6cqw; margin-bottom: 2cqw; color: var(--cos-ink); font-size: 1.8cqw; }
.coscape-sidebar strong small { font-size: 1.1cqw; font-weight: 400; }
.coscape-glyph { font-size: 2.5cqw; margin-right: .3cqw; }
.new-conversation { color: var(--cos-ink); padding: 1.5cqw 1cqw; background: var(--cos-surface); border: 1px solid var(--cos-line); border-radius: 4px; margin-bottom: 1.3cqw; }
.coscape-nav { padding: 1cqw; font-size: 1.3cqw; }
.coscape-sidebar .sidebar-caption { color: var(--cos-muted); margin: 2cqw 1cqw 1cqw; font-size: 1.2cqw; }
.coscape-current { background: var(--cos-surface); color: var(--cos-ink); padding: 1.4cqw 1cqw; border-radius: 4px; }
.coscape-user { position: absolute; bottom: 2.3cqw; left: 2cqw; display: flex; align-items: center; gap: 1cqw; font-size: 1.2cqw; }
.coscape-user > span { background: var(--cos-surface); padding: .7cqw 1cqw; border-radius: 50%; }
.coscape-workspace { min-width: 0; position: relative; }
.coscape-toolbar { display: flex; align-items: center; justify-content: space-between; height: 6.5cqw; padding: 0 2.7cqw; border-bottom: 1px solid var(--cos-line); font-size: 1.3cqw; }
.coscape-toolbar span:last-child { color: var(--cos-muted); font-size: 1.1cqw; }
.coscape-conversation { padding: 3cqw 4.4cqw; }
.demo-message { width: max-content; max-width: 100%; margin-left: auto; padding: 1.6cqw 2cqw; background: var(--cos-surface); border-radius: 6px; line-height: 1.8; font-size: 1.4cqw; }
.assistant-mark { display: flex; align-items: center; gap: 1cqw; margin: 3cqw 0 1.5cqw; font-size: 1.35cqw; font-weight: 550; }
.assistant-mark > span { font-size: 2.2cqw; }
.demo-response { font-size: 1.4cqw; color: var(--cos-muted); line-height: 1.85; }
.agent-run { margin-top: 2.5cqw; padding: 1.9cqw; border: 1px solid var(--cos-line); border-radius: 5px; }
.agent-run-title { display: flex; justify-content: space-between; margin-bottom: 1.4cqw; font-size: 1.35cqw; }
.agent-run-title span:last-child { font-size: 1.15cqw; color: var(--cos-muted); }
.agent-run > div:not(:first-child) { display: flex; align-items: center; gap: 1.4cqw; padding: 1.3cqw 0; font-size: 1.4cqw; }
.run-check { font-style: normal; border: 1px solid var(--cos-line); border-radius: 50%; width: 2.3cqw; height: 2.3cqw; display: grid; place-items: center; font-size: 1.1cqw; color: var(--blue-light); }
.agent-run small { display: block; font-size: 1.1cqw; color: var(--cos-muted); margin-top: .6cqw; }
.run-status { color: var(--cos-muted); margin-left: auto; font-size: 1.1cqw; }
.result-file { display: flex; gap: 1.8cqw; align-items: center; padding: 1.6cqw 2cqw; background: var(--cos-surface); margin-top: 1.8cqw; border: 1px solid var(--cos-line); border-radius: 5px; }
.result-file > span:first-child { font-size: 3cqw; color: var(--blue-light); }
.result-file b { display: block; font-weight: 500; font-size: 1.3cqw; }
.result-file small { display: block; font-size: 1.1cqw; margin-top: .6cqw; color: var(--cos-muted); }
.result-file > span:last-child { margin-left: auto; font-size: 1.8cqw; }
.coscape-input { position: absolute; bottom: 2.2cqw; left: 3cqw; right: 3cqw; padding: 1.5cqw 2cqw; border: 1px solid var(--cos-line); border-radius: 5px; font-size: 1.3cqw; color: var(--cos-muted); display: flex; justify-content: space-between; align-items: center; }
.coscape-input span { color: var(--cos-ink); background: var(--cos-surface); border-radius: 50%; width: 2.8cqw; height: 2.8cqw; display: grid; place-items: center; }
.sis-app { border: 1px solid var(--cos-line); border-radius: 7px; background: var(--night); box-shadow: 0 25px 55px -18px var(--shadow); overflow: clip; }
.sis-toolbar { height: 7.5cqw; display: flex; align-items: center; gap: 3cqw; padding: 0 2.5cqw; border-bottom: 1px solid var(--cos-line); }
.sis-toolbar b { display: flex; gap: .8cqw; align-items: center; font-size: 2cqw; }
.sis-toolbar b span { color: var(--blue-light); font-size: 2.6cqw; }
.sis-toolbar > span { font-size: 1.2cqw; color: var(--cos-muted); margin-left: auto; }
.sis-toolbar i { font-size: 1.1cqw; font-style: normal; border: 1px solid var(--cos-line); padding: .6cqw .9cqw; border-radius: 3px; }
.sis-app-body { padding: 3.5cqw 3cqw 3cqw; }
.sis-app-heading { display: flex; align-items: center; justify-content: space-between; }
.sis-app-heading small { color: var(--cos-muted); font-size: 1.2cqw; }
.sis-app-heading h5 { margin-top: 1.1cqw; font-size: 2.7cqw; font-weight: 500; }
.sis-app-heading > span { font-size: 1.25cqw; border: 1px solid var(--cos-line); padding: 1.2cqw; border-radius: 3px; }
.sis-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5cqw; margin-top: 3cqw; }
.sis-summary > div { padding: 2cqw; background: var(--navy); border: 1px solid var(--cos-line); border-radius: 4px; }
.sis-summary small { display: block; font-size: 1.1cqw; color: var(--cos-muted); margin-bottom: 1cqw; }
.sis-summary b { font-size: 1.8cqw; font-weight: 500; }
.sis-results { margin-top: 2cqw; display: grid; grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); gap: 2cqw; }
.sis-metrics, .sis-trace { border: 1px solid var(--cos-line); border-radius: 4px; min-width: 0; }
.sis-metrics > div { display: flex; align-items: center; justify-content: space-between; gap: 1cqw; padding: 2cqw 1.5cqw; font-size: 1.3cqw; border-bottom: 1px solid var(--cos-line); }
.sis-metrics > div:first-child { color: var(--cos-muted); font-size: 1.1cqw; }
.sis-metrics b { font-size: 1.4cqw; font-weight: 500; white-space: nowrap; }
.sis-metrics small { color: var(--cos-muted); font-size: 1.1cqw; font-weight: 400; }
.sis-metrics .selected-metric { border-bottom: 0; color: var(--blue-light); font-size: 1.15cqw; }
.sis-trace { padding: 1.7cqw; }
.sis-trace > span { font-size: 1.3cqw; }
.trace-values { display: flex; align-items: center; justify-content: space-between; margin: 1.7cqw 0 1cqw; }
.trace-values b { font-size: 3cqw; font-weight: 500; }
.trace-values small { font-size: 1.3cqw; color: var(--cos-muted); }
.trace-values > span { font-size: 1cqw; color: var(--cos-muted); }
.trace-chart { height: 18cqw; }
.trace-chart svg { width: 100%; height: 100%; display: block; overflow: visible; }
.trace-legend { display: flex; align-items: center; gap: .7cqw; font-size: .95cqw; color: var(--cos-muted); margin-top: 1.5cqw; }
.trace-legend i { display: inline-block; width: .7cqw; height: .7cqw; background: var(--blue-light); border-radius: 50%; }
.trace-legend > span { margin-left: auto; }