/* 首页阅读与新手入口：独立作用域，避免影响工作台和仪表。 */
body.home-page { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-size: 18px; line-height: 1.7; }
.home-demo-dialog { width: min(720px, calc(100vw - 32px)); box-sizing: border-box; max-height: 85vh; overflow: auto; padding: 28px; border: 1px solid #655081; border-radius: 18px; background: #17141f; color: #eee; }
.home-demo-dialog::backdrop { background: #000b; }
.home-demo-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.home-demo-heading h2 { font-size: 24px; margin: 0; }
.home-demo-heading button { font-size: 28px; width: 44px; height: 44px; background: transparent; color: #fff; border: 0; cursor: pointer; }
.home-demo-dialog p { font-size: 17px; line-height: 1.8; color: #c6c1ce; }
.home-demo-dialog .prompt-box { margin: 24px 0; font-size: 19px; }
.home-demo-dialog .chip-menu { position: static; min-width: 0; }
.home-page .home-nav-links a, .home-page .home-drawer a { font-size: 16px; }
.home-page .ux-home-brief label, .home-page .ux-home-brief textarea { font-size: 18px; }
.home-page .ux-home-brief textarea { min-height: 150px; }
.home-page .ux-home-brief textarea::placeholder { color: #a6a6b3; opacity: 1; }
.home-page .ux-home-brief p, .home-page .ux-home-examples summary,
.home-page .hero-secondary, .home-page .workflow-card p, .home-page .feature-card p,
.home-page .domain-card p, .home-page .subtitle, .home-page .faq-section p,
.home-page .vision-section p { font-size: 17px; line-height: 1.8; }
.home-page .hero-tags, .home-page .hero-stat span, .home-page .tag,
.home-page .workflow-card .num, .home-page .loop-node small, .home-page .footer { font-size: 15px; color: #b4b4c2; }
.home-page .btn-flux-cta { font-size: 19px; }
.home-page .home-nav-links .home-demo-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 12px; background: #c8ff38; color: #172000; font-weight: 700; box-shadow: 0 0 18px #c8ff3826; }
.home-page .home-demo-link svg { flex-shrink: 0; }
.home-page .home-nav-links .home-demo-link:hover { background: #dbff80; color: #172000; }
.home-page .home-demo-link:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
@media (max-width: 1100px) { .home-page .home-nav-links .hide-sm { display: none; } }
@media (max-width: 760px) {
  .home-page .home-nav { padding-inline: 12px; gap: 8px; }
  .home-page .home-nav-links { gap: 8px; }
  .home-page .home-nav-links > a:not(.home-demo-link) { display: none; }
  .home-page .home-brand { font-size: 16px; }
  .home-page .home-nav-links .home-demo-link { padding-inline: 10px; }
}
@media (max-width: 480px) {
  .home-page .home-brand { font-size: 0; gap: 0; }
  .home-page .home-brand .brand-logo { width: 30px; height: 30px; }
}
/* 首用体验：高级功能按需展开，窄屏保持所有内容可达。 */
.flash-gate { display: none; }
.flash-gate.is-visible { display: flex; align-items: center; gap: 16px; }
.flash-gate > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.loop-toolbar button, .loop-toolbar select { font-size: 14px; min-height: 36px; }
.loop-row, .loop-setpoint { font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; }
#editor-flash-confirm { flex-shrink: 0; min-width: 72px; min-height: 40px; border: 0; border-radius: 8px; background: #c8ff38; color: #172000; font: inherit; font-weight: 700; cursor: pointer; }
#editor-flash-confirm:disabled { opacity: .5; cursor: wait; }
#editor-flash-confirm:focus-visible { outline: 2px solid white; outline-offset: 3px; }
.workbench-guide { display: flex; align-items: center; flex-shrink: 0; gap: 16px; padding: 14px 18px; border-bottom: 1px solid var(--flux-border); background: var(--flux-surface); }
.workbench-guide h2 { font-size: 14px; margin: 0 0 6px; color: var(--text-primary, #eee); }
.workbench-guide p { margin: 0; font-size: 13px; line-height: 1.6; color: var(--text-secondary); overflow-wrap: anywhere; }
.workbench-guide button { flex-shrink: 0; padding: 9px 12px; border: 1px solid var(--flux-border); border-radius: 8px; color: var(--flux-green); background: transparent; cursor: pointer; }
.workbench-guide button[hidden] { display: none; }
.ux-materials { margin: 16px 0; border-block: 1px solid var(--flux-border); }
.ux-materials summary { padding: 12px 0; cursor: pointer; font-size: 14px; color: var(--text-secondary); }
.ux-materials summary:focus-visible { outline: 2px solid var(--flux-green); outline-offset: 3px; }
.ux-materials .field-row { flex-wrap: wrap; }
.ux-materials .field-row label { width: 100%; font-size: 13px; margin-bottom: 6px; }
.env-side-steps[hidden], .env-side-log[hidden] { display: none !important; }
@media (max-width: 600px) { .workbench-guide { flex-direction: column; align-items: stretch; gap: 10px; } }
.ux-home-brief { max-width: 760px; margin: 24px auto 12px; text-align: left; }
.ux-home-brief label { display: block; font-size: 15px; margin-bottom: 10px; }
.ux-home-brief textarea { box-sizing: border-box; width: 100%; resize: vertical; min-height: 130px; padding: 16px; font: inherit; line-height: 1.7; color: var(--text-primary, #eee); background: var(--flux-surface, #141418); border: 1px solid var(--flux-border, #444); border-radius: 14px; }
.ux-home-brief p, .ux-tools-body p { color: var(--text-secondary); font-size: 13px; line-height: 1.7; margin: 10px 0; }
.ux-home-examples { max-width: 760px; margin: 12px auto; text-align: left; }
.ux-home-examples .prompt-box { margin-top: 16px; }
.ux-home-examples summary, .ux-hardware-options summary, .ux-run-details summary, .ux-tools summary { cursor: pointer; padding: 10px 0; font-size: 13px; color: var(--text-secondary); }
.ux-hardware-options { border-block: 1px solid var(--flux-border); margin-top: 16px; padding-block: 6px; }
.ux-hardware-options label { display: block; margin-top: 12px; }
.ux-hardware-options input, .ux-hardware-options select { box-sizing: border-box; width: 100%; }
.ux-run-details summary { font-weight: 600; }
body.local-workbench .editor-topbar { height: auto; min-height: 64px; padding: 12px 16px; flex-wrap: wrap; }
body.local-workbench .editor-title-wrap { min-width: 180px; }
body.local-workbench .editor-topbar-actions { flex-wrap: wrap; gap: 8px; }
body.local-workbench .editor-device-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; max-width: 100%; }
body.local-workbench .editor-device-tools select { max-width: min(260px, 100%); }
.ux-tools { position: relative; }
.ux-tools > summary { border: 1px solid var(--flux-border); border-radius: 8px; padding: 8px 12px; }
.ux-tools-body { position: absolute; z-index: 350; top: 100%; right: 0; width: min(360px, calc(100vw - 40px)); box-sizing: border-box; max-height: 65vh; overflow: auto; padding: 16px; background: var(--flux-surface, #141418); border: 1px solid var(--flux-border); border-radius: 10px; box-shadow: 0 16px 48px #0009; display: flex; flex-wrap: wrap; gap: 10px; }
.ux-tools-body p, .ux-tools-body select { width: 100%; max-width: 100%; }
body.local-workbench .editor-content-tabs { flex-wrap: wrap; flex-shrink: 0; }
body.local-workbench .editor-side-right { font-size: 13px; }
body.local-workbench .local-health .links a[href='/health'] { display: none; }
:is(.ux-tools, .ux-run-details, .ux-hardware-options, .ux-home-examples) summary:focus-visible,
.ux-home-brief textarea:focus-visible { outline: 2px solid var(--flux-green, #c8ff4a); outline-offset: 3px; }
@media (max-width: 1200px) {
  body.local-workbench .editor-layout { grid-template-columns: 260px 8px minmax(320px, 1fr); }
  body.local-workbench .editor-side-right { grid-column: 1 / -1; max-height: 240px; }
  body.local-workbench .editor-splitter[data-split='right'] { display: none; }
  body.local-workbench .editor-layout { overflow-y: auto; grid-template-rows: minmax(420px, 1fr) auto; }
}
@media (max-width: 960px) {
  body.local-workbench .editor-layout { display: flex; flex-direction: column; overflow-y: auto; }
  body.local-workbench .editor-splitter { display: none; }
  body.local-workbench .editor-main { order: 0; overflow: visible; flex: none; min-height: 480px; }
  body.local-workbench .editor-side-left { order: 1; }
  body.local-workbench .editor-side-right { order: 2; display: block; max-height: none; }
  body.local-workbench .editor-side { overflow: visible; flex: none; }
  body.local-workbench .editor-ai-panel { min-height: 240px; }
  body.local-workbench .local-health .chip { display: none; }
  body.local-workbench .editor-topbar-actions { width: 100%; }
  body.local-workbench .ux-tools-body { position: fixed; top: var(--tools-top, 240px); left: 16px; right: 16px; width: auto; max-height: var(--tools-height, 45vh); }
  body.local-workbench .editor-followup-row { flex-wrap: wrap; }
  body.local-workbench .editor-followup-row input { min-width: 0; width: 100%; }
}
@media (max-width: 520px) {
  body.local-workbench .local-health { padding-inline: 10px; }
  body.local-workbench .local-health .brand { font-size: 11px; }
  body.local-workbench .local-health .links { gap: 8px; }
  body.local-workbench .editor-topbar { padding: 8px; gap: 8px; }
  body.local-workbench .editor-title-wrap p { line-height: 1.5; }
  body.local-workbench .editor-content-tabs { gap: 4px; padding: 8px; }
  body.local-workbench .editor-content-tab { padding: 8px; }
  .ux-home-brief { margin-inline: 12px; }
}
/* 工作台统一消息输入区；旧需求字段继续保存项目上下文。 */
body.local-workbench .editor-prompt-card { display: none; }
.composer-agents { display: flex; flex-wrap: wrap; gap: 6px; }
.composer-agents button { border: 1px solid var(--flux-border); background: transparent; color: inherit; border-radius: 18px; padding: 7px 12px; cursor: pointer; }
.composer-agents button[aria-pressed="true"] { background: var(--flux-purple-bright, #7955db); color: white; border-color: transparent; }
#composer-role-hint, .composer-shortcut { margin: 0; color: var(--flux-muted, #a2a6b5); font-size: 12px; }
#editor-followup-input { flex: 1; min-width: 0; resize: vertical; max-height: 220px; padding: 12px; border: 1px solid var(--flux-border); border-radius: 10px; background: var(--flux-card); color: inherit; font: inherit; line-height: 1.6; }
#editor-followup-input:focus-visible { outline: 2px solid var(--flux-purple-bright, #7955db); outline-offset: 2px; }
#unified-composer.drag-over { outline: 2px dashed var(--flux-purple-bright, #7955db); outline-offset: -4px; }
#composer-attachments { display: flex; flex-wrap: wrap; gap: 8px; max-height: 150px; overflow: auto; }
.composer-attachment { display: flex; align-items: center; gap: 8px; max-width: 100%; border: 1px solid var(--flux-border); border-radius: 8px; padding: 8px; font-size: 12px; }
.composer-attachment span { overflow-wrap: anywhere; white-space: pre-wrap; }
.composer-attachment img { width: 44px; height: 44px; object-fit: contain; }
.composer-attachment button { background: transparent; color: inherit; border: 0; cursor: pointer; }
@media (max-width: 640px) { #unified-composer { padding: 12px; } #editor-followup-input { flex-basis: 100%; } }
body.studio-layout .editor-layout { display: grid; grid-template-columns: minmax(320px, 30%) minmax(230px, 22%) minmax(300px, 1fr); grid-template-rows: minmax(0, 1fr); overflow: hidden; }
.studio-chat, .studio-files { min-width: 0; min-height: 0; border-right: 1px solid var(--flux-border); background: var(--flux-surface); }
.studio-chat { display: flex; flex-direction: column; overflow: hidden; }
.studio-files { overflow: auto; padding: 0 12px 16px; }
.studio-layout h2 { font-size: 14px; margin: 0; padding: 14px 16px; border-bottom: 1px solid var(--flux-border); }
.studio-history { flex: 1; min-height: 100px; overflow: auto; padding: 12px; }
.studio-note, #studio-sync { color: #a6a6b1; font-size: 12px; line-height: 1.6; }
.studio-storage { padding: 14px 4px; font-size: 12px; border-bottom: 1px solid var(--flux-border); }
.studio-storage label { display: block; margin: 10px 0 6px; }
#studio-local-workspace { display: flex; gap: 4px; flex-wrap: wrap; }
#studio-local-workspace select { width: 100%; max-width: 100%; }
.studio-files details { margin: 12px 0; }
.studio-files summary { cursor: pointer; font-size: 13px; font-weight: 600; padding: 8px 0; }
.studio-document { width: 100%; text-align: left; padding: 9px 12px; background: transparent; color: inherit; border: 0; border-radius: 6px; cursor: pointer; font-size: 12px; }
.studio-document:hover, .studio-document:focus-visible { background: #292431; }
#studio-events { padding: 0 0 0 18px; margin: 0; }
#studio-events li { padding: 8px 0; border-bottom: 1px solid var(--flux-border); font-size: 13px; overflow-wrap: anywhere; }
#studio-events time { color: #96919e; font-size: 11px; }
#studio-events p { margin: 5px 0; white-space: pre-wrap; }
.studio-chat #unified-composer { padding: 12px; max-height: 55%; overflow: auto; }
.studio-chat .editor-followup-row { flex-wrap: wrap; }
.studio-chat #editor-followup-input { flex-basis: 100%; }
.studio-chat .composer-agents button { font-size: 12px; padding: 6px 9px; }
.studio-chat .workbench-guide { order: -1; padding: 12px; }
body.studio-layout .editor-main { min-height: 0; overflow: hidden; }
body.studio-layout .editor-ai-panel { min-height: 0; }
.studio-mobile-tabs { display: none; }
.studio-layout .editor-code-view { white-space: pre; overflow: auto; tab-size: 4; }
.studio-layout .editor-ai-body pre { white-space: pre; overflow: auto; tab-size: 4; max-width: 100%; }
.studio-table { max-width: 100%; overflow-x: auto; margin: 12px 0; }
.studio-table table { border-collapse: collapse; width: 100%; font-size: 13px; }
.studio-table th, .studio-table td { border: 1px solid var(--flux-border); padding: 8px 10px; text-align: left; vertical-align: top; }
.studio-table th { background: var(--flux-surface); }
@media (max-width: 1050px) {
  .studio-mobile-tabs { display: flex; gap: 6px; padding: 8px 12px; border-bottom: 1px solid var(--flux-border); }
  .studio-mobile-tabs button { flex: 1; padding: 8px; color: inherit; background: transparent; border: 1px solid var(--flux-border); border-radius: 6px; }
  .studio-mobile-tabs button[aria-pressed="true"] { background: #60339d; }
  body.studio-layout .editor-layout { display: flex; flex-direction: column; }
  body.studio-layout .editor-layout > * { display: none; }
  body.studio-layout .editor-layout[data-view="0"] > .studio-chat { display: flex; flex: 1; }
  body.studio-layout .editor-layout[data-view="1"] > .studio-files { display: block; flex: 1; }
  body.studio-layout .editor-layout[data-view="2"] > .editor-main { display: flex; flex: 1; }
}
.studio-layout .editor-tree-item { width: 100%; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.studio-comparison { margin: 12px 0; }
.studio-comparison summary { cursor: pointer; }
.studio-compare-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.studio-compare-grid pre { overflow: auto; max-height: 400px; font-size: 12px; }
.studio-layout .editor-content-tabs { display: none; }
body.studio-layout .editor-layout { grid-template-columns: var(--studio-columns, minmax(240px, .30fr) 8px minmax(190px, .22fr) 8px minmax(280px, .48fr)); }
.studio-resizer { cursor: col-resize; touch-action: none; background: var(--flux-surface); position: relative; }
.studio-resizer::after { content: ''; position: absolute; top: 0; bottom: 0; left: 3px; width: 2px; background: var(--flux-border); }
.studio-resizer:hover::after, .studio-resizer:focus-visible::after { background: #ae79ff; }
.studio-resizer:focus-visible { outline: 2px solid #ae79ff; outline-offset: -2px; }
body.studio-resizing, body.studio-resizing * { cursor: col-resize !important; user-select: none !important; }
body.studio-resizing iframe { pointer-events: none; }
@media (max-width: 1050px) { body.studio-layout .studio-resizer { display: none; } }
/* 小窗口优先显示输入区，历史记录仍可在上方独立滚动。 */
@media (max-width: 1050px) and (max-height: 750px) {
  .studio-chat > h2 { padding: 8px 12px; }
  .studio-history { min-height: 32px; padding: 6px 12px; }
  .studio-chat #unified-composer { flex-shrink: 0; max-height: none; gap: 6px; padding: 8px 12px; }
  .studio-chat #composer-role-hint, .studio-chat .fw-file-caption { display: none; }
  .studio-chat .fw-file { margin: 0; }
  .studio-chat .fw-file-row { min-height: 30px; }
  .studio-chat .fw-file-btn { width: 28px; height: 28px; }
  .studio-chat .editor-followup-row { flex-wrap: nowrap; }
  .studio-chat #editor-followup-btn { align-self: flex-end; }
  .studio-chat #editor-followup-input { min-height: 60px; height: 60px; max-height: 100px; }
  .studio-chat .composer-shortcut { font-size: 11px; }
}
#new-brief { width: 100%; box-sizing: border-box; resize: vertical; min-height: 110px; padding: 12px; border: 1px solid var(--flux-border); border-radius: 8px; background: var(--flux-card); color: inherit; font: inherit; line-height: 1.6; }
/* 统一消息发送 / 停止入口，运行时保持可点击。 */
body.local-workbench .editor-followup-row {
  display: grid; grid-template-columns: minmax(0, 1fr) 44px;
  gap: 10px; align-items: end;
}
body.local-workbench #editor-followup-input {
  width: 100%; min-width: 0; box-sizing: border-box; resize: vertical;
}
body.local-workbench #editor-followup-btn {
  width: 44px; height: 44px; min-width: 44px; padding: 0;
  border-radius: 50%; background: #c8ff38; color: #172000;
  border: 1px solid #c8ff38; font-size: 25px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  align-self: flex-end; cursor: pointer;
}
body.local-workbench #editor-followup-btn[data-mode="stop"] {
  font-size: 17px; background: #ffad42; border-color: #ffad42; color: #261500;
}
body.local-workbench #editor-followup-btn:focus-visible { outline: 2px solid #c8ff38; outline-offset: 3px; }
body.local-workbench #editor-followup-btn:disabled { opacity: .5; cursor: wait; }
body.local-workbench.pipeline-locked .editor-followup-row {
  opacity: 1 !important; filter: none !important;
}
body.local-workbench.pipeline-locked #editor-followup-btn {
  opacity: 1 !important; filter: none !important;
  pointer-events: auto !important; cursor: pointer !important;
}
body.local-workbench.pipeline-locked #editor-followup-btn:disabled {
  opacity: .5 !important; cursor: wait !important;
}
/* 阅读优先：正文 16px，辅助信息 14px，代码使用等宽字体。 */
body.local-workbench { font-family: "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif; font-size: 16px; }
body.local-workbench :is(.editor-ai-body, .editor-code-view, #editor-followup-input, #studio-events li, #fw-think-body) {
  font-size: 16px; line-height: 1.7;
}
body.local-workbench :is(.editor-code-view, .editor-ai-body pre, .build-log) {
  font-family: Consolas, "Cascadia Code", "Microsoft YaHei", monospace; font-size: 15px; line-height: 1.65;
}
body.local-workbench :is(.studio-note, .studio-storage, .studio-document, .studio-files summary, .editor-tree-item, #composer-role-hint, .composer-shortcut, .composer-agents button, #fw-think-phase, #fw-think-elapsed, #fw-think-chars) {
  font-size: 14px; line-height: 1.6;
}
body.local-workbench .composer-demo { color: #c8ff38; font-size: 15px; line-height: 1.7; text-underline-offset: 3px; }

/* 各页面右上角提供最新版安装包下载。 */
.home-nav a.assistant-download, .local-health .links a.assistant-download {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; padding: 6px 12px; border: 1px solid #c8ff38;
  border-radius: 9px; color: #c8ff38; font-size: 15px; font-weight: 600;
  white-space: nowrap; text-decoration: none;
}
.home-nav a.assistant-download:hover, .local-health .links a.assistant-download:hover {
  background: #c8ff38; color: #172000;
}
.home-page .home-nav-links > a.assistant-download { display: inline-flex; }
@media (max-width: 600px) {
  .home-page .home-nav { flex-wrap: wrap; gap: 8px; }
  .home-page .home-nav-links { margin-left: auto; }
}
