:root {
  --bg: #eef2f5;
  --panel: #ffffff;
  --panel-soft: #f7f9fb;
  --ink: #1f2933;
  --muted: #65717d;
  --line: #dbe3ea;
  --accent: #8a5a34;
  --accent-2: #1f7a75;
  --blue: #2f6f9f;
  --warn: #b75d2a;
  --dark: #17222b;
  --dark-2: #21313c;
  --shadow: 0 14px 34px rgba(27, 39, 51, .10);
}

/* Phone controls keep numeric values and their units on one compact row. */
@media (max-width: 760px),
  (hover: none) and (pointer: coarse) and (orientation: landscape) and (max-height: 600px) {
  .field:not([hidden]):has(> input[type="number"]):has(> .unit) {
    display: grid;
    grid-template-columns: minmax(56px, 210px) max-content;
    grid-template-rows: auto auto;
    align-items: center;
    justify-content: start;
    column-gap: 8px;
  }

  /* Long explanatory suffixes stay inline without squeezing the editable
     number down to a few pixels. These fields use the whole parameter row. */
  .grid > .field:has(> input[data-field="innerDiameter"]),
  .grid > .field:has(> input[data-field="vaporPressureHigh"]),
  .grid > .field:has(> input[data-field="vaporPressureLow"]) {
    grid-column: 1 / -1 !important;
  }

  .field:not([hidden]):has(> input[type="number"]):has(> .unit) > label {
    grid-column: 1 / -1;
  }

  .field:not([hidden]):has(> input[type="number"]):has(> .unit) > input {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    min-width: 0;
    min-height: 42px;
  }

  .field:not([hidden]):has(> input[type="number"]):has(> .unit) > .unit {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    margin-top: 0;
    justify-self: start;
    white-space: nowrap;
  }

  /* The scene entry sizes to its complete label and leaves a free header lane. */
  body.hh-mobile-active .hh-mobile-header {
    grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  }

  body.hh-mobile-active .hh-mobile-header__scene {
    width: fit-content !important;
    max-width: none !important;
    grid-template-columns: max-content max-content !important;
    justify-self: start;
    overflow: visible !important;
  }

  body.hh-mobile-active .hh-mobile-header__eyebrow,
  body.hh-mobile-active .hh-mobile-header__title {
    width: max-content;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  body.hh-mobile-active .hh-mobile-header__status {
    grid-column: 3 !important;
    justify-self: end;
  }
}

#content[data-module-key="zhuHotOptimized"] [data-hot-opt-temperature-method][hidden] {
  display: none !important;
}

#content[data-module-key="zhuHotOptimized"] .hot-opt-scene-summary {
  min-width: 0;
  margin-left: auto;
  line-height: 1.5;
  text-align: right;
  overflow-wrap: anywhere;
}

#content[data-module-key="zhuColdOptimized"] .cold-opt-scene-summary {
  min-width: 0;
  margin-left: auto;
  line-height: 1.5;
  text-align: right;
  overflow-wrap: anywhere;
}

/* 全能保温优化版：桌面端高频参数紧凑展示，低频与目标参数按需展开。 */
.hot-opt-convergence-display {
  display: none;
}

.hot-opt-temperature-drop-toggle {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #e5c6b5;
  border-radius: 9px;
  background: #fff8f3;
  box-sizing: border-box;
}
.hot-opt-temperature-drop-toggle[hidden] { display: none; }
.hot-opt-temperature-drop-toggle label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #7f321f;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}
.hot-opt-temperature-drop-toggle input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--accent);
}
.hot-opt-temperature-drop-toggle p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

@media (min-width: 761px) {
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-scenario > summary {
    justify-content: flex-start;
    gap: 6px;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-scene-summary {
    margin-left: 0;
    text-align: left;
  }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-scenario > .optimized-scenario-selector {
    align-items: center;
    padding: 10px 16px 11px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-scenario-run-field {
    display: grid;
    grid-template-columns: auto minmax(145px, 190px);
    align-items: center;
    column-gap: 10px;
    flex: 0 1 355px;
    padding: 7px 9px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-scenario-run-field label { margin: 0; }
  #content[data-module-key="zhuHotOptimized"] .optimized-scenario-run-field .unit { display: none; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid { gap: 8px; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field {
    grid-column: span 4;
    padding: 8px 9px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field {
    grid-column: span 3;
    padding: 8px 9px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field:has(> input[type="number"]),
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field:has(> input[type="number"]) {
    display: grid;
    grid-template-columns: minmax(90px, 1fr) max-content;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 9px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field:has(> input[type="number"]) > label,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field:has(> input[type="number"]) > label {
    grid-column: 1 / -1;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field:has(> input[type="number"]) > input,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field:has(> input[type="number"]) > input { grid-column: 1; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field:has(> input[type="number"]) > .unit,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field:has(> input[type="number"]) > .unit {
    grid-column: 2;
    margin-top: 0;
    white-space: nowrap;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field label,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field label { margin-bottom: 4px; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-advanced-details,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-goal-details { margin-top: 9px; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-advanced-details > summary,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-goal-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 9px 12px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-advanced-details > summary em {
    color: #708089;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    text-align: right;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-goal-details > summary::after {
    content: "选填";
    flex: 0 0 auto;
    padding: 3px 8px;
    border: 1px solid #d6e0e5;
    border-radius: 999px;
    color: #6c7d86;
    background: #fff;
    font-size: 11px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-goal-details[data-requirement="required"] {
    border-color: #d6a36f;
    background: #fffaf4;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-goal-details[data-requirement="required"] > summary::after {
    content: "当前必填";
    border-color: #d9a36a;
    color: #8f552d;
    background: #fff1df;
  }
  #content[data-module-key="zhuHotOptimized"] .field.is-convergence-required {
    border-color: #d7a46f;
    background: #fffaf3;
  }
  #content[data-module-key="zhuHotOptimized"] .field.is-convergence-required > label::after {
    content: " 必填";
    color: #a45d2b;
    font-size: 11px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-emissivity-presets {
    grid-column: 1 / -1;
    align-items: center;
    margin: 0 12px 12px;
  }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > div:first-child > .section-label,
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > .field:has(#hotOptConvergence) > label,
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > .zhu-opt-generate-note {
    display: none;
  }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > .field:has(#hotOptConvergence) {
    padding: 0;
    border: 0;
    background: transparent;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  #content[data-module-key="zhuHotOptimized"] #hotOptConvergence {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-control {
    position: relative;
    width: 100%;
    min-width: 0;
    min-height: 58px;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-control > #hotOptConvergence {
    position: absolute;
    z-index: 2;
    inset: 0;
    height: 100%;
    opacity: 0;
    cursor: pointer;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display {
    position: absolute;
    z-index: 1;
    inset: 0;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 14px;
    grid-template-rows: auto auto;
    align-content: center;
    column-gap: 10px;
    padding: 8px 13px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--text);
    background: #fff;
    box-sizing: border-box;
    pointer-events: none;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display strong,
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display small {
    grid-column: 1;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display strong {
    grid-row: 1;
    font-size: 15px;
    line-height: 1.35;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display small {
    grid-row: 2;
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-display i {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
  }
  #content[data-module-key="zhuHotOptimized"] .hot-opt-convergence-control:focus-within .hot-opt-convergence-display {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
  }
  #content[data-module-key="zhuHotOptimized"] #hotOptConvergence:disabled + .hot-opt-convergence-display {
    opacity: .58;
    cursor: not-allowed;
  }
}

/* 全能保冷优化版：沿用保温工作台的信息层级，同时保留三约束与冷库专属口径。 */
@media (min-width: 761px) {
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-scenario > summary {
    justify-content: flex-start;
    gap: 6px;
  }
  #content[data-module-key="zhuColdOptimized"] .cold-opt-scene-summary {
    margin-left: 0;
    text-align: left;
  }
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-scenario > .optimized-scenario-selector {
    align-items: center;
    padding: 10px 16px 11px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid { gap: 8px; }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field {
    grid-column: span 4;
    padding: 8px 9px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field {
    grid-column: span 3;
    padding: 8px 9px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field:has(> input[type="number"]),
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field:has(> input[type="number"]) {
    display: grid;
    grid-template-columns: minmax(86px, 1fr) max-content;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 9px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field:has(> input[type="number"]) > label,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field:has(> input[type="number"]) > label {
    grid-column: 1 / -1;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field:has(> input[type="number"]) > input,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field:has(> input[type="number"]) > input { grid-column: 1; }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field:has(> input[type="number"]) > .unit,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field:has(> input[type="number"]) > .unit {
    grid-column: 2;
    margin-top: 0;
    white-space: nowrap;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field label,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field label { margin-bottom: 4px; }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-section { margin-top: 9px; }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-section > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 9px 12px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-goal-details > summary::after {
    content: "选填";
    flex: 0 0 auto;
    padding: 3px 8px;
    border: 1px solid #d6e0e5;
    border-radius: 999px;
    color: #6c7d86;
    background: #fff;
    font-size: 11px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-goal-details[data-requirement="required"] {
    border-color: #84bada;
    background: #f5fbff;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-goal-details[data-requirement="required"] > summary::after {
    content: "当前必填";
    border-color: #79afd0;
    color: #1f628c;
    background: #eaf6fd;
  }
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-action-rail > div:first-child > .section-label,
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-action-rail > .field:has(#coldOptConvergence) > label,
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-action-rail > .zhu-opt-generate-note {
    display: none;
  }
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-action-rail > .field:has(#coldOptConvergence) {
    padding: 0;
    border: 0;
    background: transparent;
  }
}

@media (min-width: 981px) {
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-workbench {
    grid-template-columns: minmax(0, 1fr) minmax(270px, 300px);
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-plan-table .advanced-plan-cell {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-plan-table .advanced-plan-cell span {
    white-space: normal;
    line-height: 1.25;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-plan-table .advanced-row-actions {
    flex-wrap: nowrap;
  }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-plan-table .advanced-row-actions button {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field { grid-column: span 6; }
}

@container workspace (min-width: 981px) and (max-width: 1279px) {
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field { grid-column: span 4; }
}

@container workspace (min-width: 761px) and (max-width: 980px) {
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-workbench { grid-template-columns: 1fr; }
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field,
  #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field { grid-column: span 6; }
}

@media (min-width: 981px) {
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-workbench {
    grid-template-columns: minmax(0, 1fr) minmax(270px, 300px);
  }
}

@media (min-width: 981px) and (max-width: 1279px) {
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 4; }
}

@media (min-width: 761px) and (max-width: 980px) {
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 6; }
}

@container workspace (min-width: 981px) and (max-width: 1279px) {
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 4; }
}

/* Keep the goal and calculate controls beside inputs on laptop-sized workspaces. */
@container workspace (max-width: 980px) {
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail {
    position: relative;
    top: auto;
  }
}

@container workspace (min-width: 640px) and (max-width: 980px) {
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .zhu-opt-workbench {
    grid-template-columns: minmax(0, 1fr) 300px;
  }
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 6; }
}

@container workspace (min-width: 640px) and (width < 720px) {
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .zhu-opt-workbench {
    grid-template-columns: minmax(0, 1fr) 270px;
  }
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 12; }
}

@container workspace (width < 640px) {
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail {
    grid-row: 1;
  }
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-basic-grid > .field,
  body:not(.hh-mobile-active) #content[data-module-key="zhuHotOptimized"] .optimized-hot-detail-grid > .field { grid-column: span 6; }
}

@media (max-width: 760px) {
  #content[data-module-key="zhuHotOptimized"] #hotOptAdvancedDetails {
    display: contents;
  }
  #content[data-module-key="zhuHotOptimized"] #hotOptAdvancedDetails > summary,
  #content[data-module-key="zhuHotOptimized"] #hotOptAdvancedDetails > .note { display: none; }
  #content[data-module-key="zhuHotOptimized"] #hotOptAdvancedDetails:not([open]) > .grid {
    display: grid !important;
  }
}

* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  font-size: 14px;
}
button, input, textarea, select { font: inherit; }
button {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 13px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
button:hover { border-color: #b8c5cf; box-shadow: 0 5px 14px rgba(31,41,51,.08); }
button.primary { background: linear-gradient(180deg, #93603b, var(--accent)); border-color: var(--accent); color: #fff; }
button.primary:hover { box-shadow: 0 8px 18px rgba(138,90,52,.22); }
button.warn { color: var(--warn); }
button:disabled { opacity: .45; cursor: not-allowed; }
input, textarea, select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 8px 10px;
  background: #fff;
  color: var(--ink);
  min-height: 36px;
  outline: none;
  transition: border-color .16s ease, box-shadow .16s ease;
}
input:focus, textarea:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,111,159,.12); }
textarea { min-height: 98px; resize: vertical; }
.hidden { display: none !important; }
.login { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr); }
.login-visual {
  position: relative;
  background: url("./assets/factory-panorama.jpg") center center/cover no-repeat;
  min-height: 100vh;
}
.login-mask { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(13, 24, 32, .68), rgba(13, 24, 32, .28) 54%, rgba(13, 24, 32, .12)); }
.login-copy { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 8vw; color: #fff; }
.login-copy h1 { margin: 0 0 14px; font-size: clamp(34px, 5vw, 62px); letter-spacing: 0; }
.login-copy p { margin: 0 0 34px; font-size: 18px; color: rgba(255,255,255,.86); }
.brand-row { display: flex; align-items: center; gap: 14px; }
.brand-row img { width: 68px; height: 68px; object-fit: contain; border-radius: 8px; background: rgba(255,255,255,.96); padding: 6px; border: 1px solid rgba(255,255,255,.55); }
.brand-row span { display: block; margin-top: 4px; opacity: .76; }
.brand-row.compact img { width: 52px; height: 52px; }
.brand-row.compact strong { color: #fff; line-height: 1.3; }
.login-panel { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 34px; }
.login-card { width: 100%; max-width: 420px; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 28px; box-shadow: var(--shadow); }
.login-card h2 { margin: 0; }
.login-card p { color: var(--muted); margin: 8px 0 18px; }
.account-field { margin-bottom: 10px; }
.login-card button { width: 100%; margin-top: 12px; background: var(--accent); color: #fff; border-color: var(--accent); }
.site-icp { width: 100%; max-width: 420px; text-align: center; font-size: 12px; line-height: 1.5; }
.site-icp a { color: #65717d; text-decoration: none; }
.site-icp a:hover { color: var(--accent-2); text-decoration: underline; }
.password-field { position: relative; }
.password-field input { padding-right: 46px; }
.login-card .password-toggle {
  position: absolute;
  right: 7px;
  top: 50%;
  width: 34px;
  height: 34px;
  min-height: 34px;
  margin: 0;
  padding: 6px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #65717d;
  box-shadow: none;
}
.login-card .password-toggle:hover { background: #eef3f6; color: var(--accent-2); box-shadow: none; border-color: transparent; }
.password-toggle svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.password-toggle .eye-open circle { fill: currentColor; stroke: none; }
.password-toggle .eye-off { display: none; }
.password-toggle.is-visible .eye-open { display: none; }
.password-toggle.is-visible .eye-off { display: block; }
.error { color: #b42318; min-height: 22px; margin-top: 10px; }
.app { width: 100%; min-height: 100vh; display: grid; grid-template-columns: 272px minmax(0, 1fr); }
.sidebar { background: linear-gradient(180deg, var(--dark), #101820); color: #fff; padding: 22px 14px; position: sticky; top: 0; height: 100vh; overflow: auto; }
.side-head { padding: 8px 8px 18px; border-bottom: 1px solid rgba(255,255,255,.12); }
.side-head > span { display: block; color: #9bc7c3; margin-top: 14px; font-size: 12px; letter-spacing: 1.8px; }
.side-head h2 { margin: 8px 0 0; font-size: 18px; }
nav { display: grid; gap: 6px; margin-top: 18px; }
nav button { text-align: left; color: rgba(255,255,255,.82); background: transparent; border: 1px solid transparent; padding: 12px 14px; box-shadow: none; }
nav button:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.08); box-shadow: none; }
nav button.active { background: rgba(31,122,117,.22); color: #fff; border-color: rgba(155,199,195,.24); box-shadow: inset 3px 0 0 #9bc7c3; }
.sidebar .nav-module-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.sidebar .nav-module-label { min-width: 0; }
.nav-module-icon,
.page-tag-icon {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  line-height: 0;
}
.nav-module-icon svg,
.page-tag-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
.nav-module-icon--hot,
.page-tag-icon--hot { color: #ef8269; }
.nav-module-icon--cold,
.page-tag-icon--cold { color: #72bce4; }
.nav-module-icon--hot path,
.page-tag-icon--hot path { fill: currentColor; }
.nav-module-icon--cold path,
.page-tag-icon--cold path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-module-icon--money {
  color: #e0a128;
  border-radius: 50%;
  filter: drop-shadow(0 2px 4px rgba(224, 161, 40, .2));
}
.nav-module-icon--money circle,
.nav-module-icon--money path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-module-icon--familiar {
  width: 16px;
  height: 16px;
  color: #9bc7c3;
  opacity: .82;
}
.nav-module-icon--familiar path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hh-mobile-money-module-icon {
  width: 1.08em;
  height: 1.08em;
  display: inline-grid;
  place-items: center;
  margin-left: .34em;
  color: #d99518;
  line-height: 0;
  vertical-align: -.13em;
}
.hh-mobile-money-module-icon svg { display: block; width: 100%; height: 100%; }
.hh-mobile-money-module-icon circle,
.hh-mobile-money-module-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hh-mobile-familiar-module-icon {
  width: 1em;
  height: 1em;
  display: inline-grid;
  place-items: center;
  margin-left: .32em;
  color: #527773;
  line-height: 0;
  vertical-align: -.12em;
  opacity: .82;
}
.hh-mobile-familiar-module-icon svg { display: block; width: 100%; height: 100%; }
.hh-mobile-familiar-module-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sidebar .nav-module-button--hot.active { box-shadow: inset 3px 0 0 #ef8269; }
.sidebar .nav-module-button--cold.active { box-shadow: inset 3px 0 0 #72bce4; }
.workspace {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  container-name: workspace;
  container-type: inline-size;
}
.topbar { min-height: 70px; padding: 14px 24px; background: rgba(255,255,255,.88); border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 18px; position: sticky; top: 0; z-index: 2; backdrop-filter: blur(10px); }
.topbar h2 { margin: 0; font-size: 22px; }
.topbar p { margin: 5px 0 0; color: var(--muted); }
.tag { border: 1px solid #c8dde8; background: #eef7fb; color: var(--blue); padding: 5px 10px; border-radius: 99px; white-space: nowrap; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.tag .page-tag-icon { width: 16px; height: 16px; }
.content {
  padding: 16px 24px 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  min-width: 0;
  overflow-x: visible;
}
.content > * { width: 100%; max-width: 100%; min-width: 0; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 14px; box-shadow: 0 8px 24px rgba(27,39,51,.05); min-width: 0; max-width: 100%; }
.card h3, .card h4 { margin: 0 0 12px; letter-spacing: 0; }
.card h3 { font-size: 17px; }
.card h4 { font-size: 15px; color: var(--muted); }
.card > h3:first-child { display: flex; align-items: center; gap: 8px; }
.card > h3:first-child::before { content: ""; width: 4px; height: 16px; background: var(--accent-2); border-radius: 99px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.material-actions { justify-content: flex-end; }
.material-layer-title-mobile,
.material-mobile-calculate-area { display: none; }
.scheme-actions { margin-bottom: 16px; justify-content: flex-end; }
.target-temp-field { background: #fff7e8; border-color: #e3b875; }
.target-temp-field label { color: #8a5a34; }
.target-temp-field input { border-color: #d8ad6a; font-weight: 800; color: #8a5a34; }
.scheme-role { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.result-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.result-card-head h3 { margin: 0; display: flex; align-items: center; gap: 8px; }
.result-card-head h3::before { content: ""; width: 4px; height: 16px; background: var(--accent-2); border-radius: 99px; }
.result-actions { margin: 0; justify-content: flex-end; }
.material-subhead { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; }
.material-subhead h4 { margin: 0; }
.material-subhead button { flex: 0 0 auto; }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; }
.compact-grid { gap: 10px; }
.grid > .field { grid-column: span 3; }
.col-3 { grid-column: span 3; }
.col-4 { grid-column: span 4; }
.col-6 { grid-column: span 6; }
.col-8 { grid-column: span 8; }
.col-12 { grid-column: span 12; }
.field { background: var(--panel-soft); border: 1px solid #e2e9ef; border-radius: 8px; padding: 10px; min-width: 0; }
.field label { display: block; color: #4b5965; font-size: 12px; margin-bottom: 6px; font-weight: 600; }
.field .unit { color: var(--muted); font-size: 12px; margin-top: 4px; }
/* Numeric fields keep the unit beside the textbox instead of dropping it
   underneath. Inputs retain a usable width; long suffixes clip locally. */
.field:not([hidden]):has(> input[type="number"]):has(> .unit) {
  display: grid;
  grid-template-columns: minmax(88px, 1fr) max-content;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 8px;
}
.field:not([hidden]):has(> input[type="number"]):has(> .unit) > label {
  grid-column: 1 / -1;
}
.field:not([hidden]):has(> input[type="number"]):has(> .unit) > input {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}
.field:not([hidden]):has(> input[type="number"]):has(> .unit) > .unit {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  max-width: 42vw;
  align-self: center;
  justify-self: start;
  margin-top: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.readonly-field { background: #fbfcfd; border-style: dashed; }
.readonly-value { min-height: 36px; display: flex; align-items: center; color: #17222b; font-size: 18px; font-weight: 800; }
.scenario-head { border: 1px solid #dce6ee; border-radius: 8px; background: linear-gradient(180deg, #fbfdfe, #f3f7fa); padding: 12px; margin-bottom: 10px; }
.scenario-head .section-label { margin: 0 0 6px; color: var(--accent-2); }
.scenario-head h3 { margin: 0; font-size: 19px; color: #17222b; }
.scenario-head p { margin: 6px 0 0; color: var(--muted); line-height: 1.55; }
.scenario-grid > .field { grid-column: span 4; }
.mode-field label { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mode-field select { font-weight: 800; }
.mode-icon { flex: 0 0 auto; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; font-style: normal; font-size: 15px; line-height: 1; }
.thermal-field.is-hot { background: #fff1f0; border-color: #f1b3aa; }
.thermal-field.is-hot label, .thermal-field.is-hot select { color: #a93d32; }
.thermal-field.is-hot select { background: #fff8f7; border-color: #eba69b; }
.thermal-field.is-hot .thermal-icon { background: #ffe0dc; color: #d64032; border: 1px solid #f3aaa0; }
.thermal-field.is-cold { background: #edf7ff; border-color: #acd2ef; }
.thermal-field.is-cold label, .thermal-field.is-cold select { color: #276c9f; }
.thermal-field.is-cold select { background: #f7fbff; border-color: #9ec9e8; }
.thermal-field.is-cold .thermal-icon { background: #dff1ff; color: #2579b8; border: 1px solid #9ec9e8; }
.shape-field { background: #f7fafc; }
.shape-field.is-cylinder { border-color: #b8d1c9; }
.shape-field.is-cylinder label, .shape-field.is-cylinder select { color: #1f7a75; }
.shape-field.is-cylinder select { border-color: #b8d1c9; background: #fbfffd; }
.shape-field.is-plane { border-color: #c5cad7; }
.shape-field.is-plane label, .shape-field.is-plane select { color: #4d5969; }
.shape-field.is-plane select { border-color: #c5cad7; background: #fcfdff; }
.shape-icon { position: relative; background: #fff; border: 1px solid currentColor; color: currentColor; overflow: visible; }
.shape-field.is-cylinder .shape-icon { width: 28px; height: 16px; border-radius: 999px; background: linear-gradient(90deg, rgba(31,122,117,.08), rgba(31,122,117,.2)); }
.shape-field.is-cylinder .shape-icon::before,
.shape-field.is-cylinder .shape-icon::after { content: ""; position: absolute; top: -1px; width: 10px; height: 16px; border: 1px solid currentColor; border-radius: 50%; background: #f4fbf9; }
.shape-field.is-cylinder .shape-icon::before { left: -1px; }
.shape-field.is-cylinder .shape-icon::after { right: -1px; background: #e8f4f1; }
.shape-field.is-plane .shape-icon { width: 22px; height: 20px; border-radius: 3px; transform: skewY(-8deg); background: linear-gradient(135deg, #fff, #e8ecf3); }
.shape-field.is-plane .shape-icon::before { content: ""; position: absolute; top: -5px; left: 4px; width: 20px; height: 18px; border: 1px solid currentColor; border-radius: 3px; background: rgba(232,236,243,.7); z-index: -1; }
.calc-mode-field { background: #fffaf2; border-color: #e5c999; }
.calc-mode-field label, .calc-mode-field select { color: #78522f; }
.calc-mode-field select { background: #fffdf8; border-color: #dec18c; }
.calc-icon { position: relative; background: #fff4dc; border: 1px solid #e1bd7c; }
.calc-icon::before { content: ""; width: 12px; height: 12px; border: 2px solid #9b6b34; border-top-color: transparent; border-radius: 50%; }
.calc-icon::after { content: ""; position: absolute; right: 5px; top: 6px; width: 5px; height: 5px; border-top: 2px solid #9b6b34; border-right: 2px solid #9b6b34; transform: rotate(30deg); }
.scheme-control .section-label { margin-top: 14px; }
.scheme-control .section-label:first-of-type { margin-top: 0; }
.inline-details { margin-top: 14px; border: 1px solid #dce6ee; border-radius: 8px; background: #fbfcfd; padding: 0; }
.inline-details summary { cursor: pointer; padding: 12px 14px; font-weight: 700; color: #3e4b56; }
.inline-details .grid { padding: 0 12px 12px; }
.inline-details .note { margin: 0 12px 12px; }
.readonly { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px dashed #cbd8e2; border-radius: 7px; color: var(--muted); background: #fbfcfd; margin-top: 8px; }
.readonly strong { color: var(--ink); }
.kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.kpi { background: linear-gradient(180deg, #ffffff, #f7fafc); border: 1px solid var(--line); border-radius: 8px; padding: 12px; min-height: 78px; box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
.kpi span { display: block; color: var(--muted); font-size: 13px; }
.kpi strong { display: block; margin-top: 8px; font-size: 20px; word-break: break-word; color: #17222b; }
.kpi:nth-child(1) strong, .kpi:nth-child(2) strong, .kpi:nth-child(3) strong { color: var(--accent-2); }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { border-bottom: 1px solid var(--line); padding: 9px 8px; vertical-align: middle; text-align: left; }
th { color: #52616e; background: #f2f6f9; font-weight: 700; position: sticky; top: 0; z-index: 1; }
tbody tr:hover { background: #fbfdfe; }
td input, td select { min-width: 90px; padding: 6px 8px; }
.material-layer-label {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  font-weight: 800;
  color: var(--accent-2);
  white-space: nowrap;
}
.table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.table-wrap.wide-scroll table { min-width: 1780px; }
.table-wrap::-webkit-scrollbar { height: 10px; width: 10px; }
.table-wrap::-webkit-scrollbar-thumb { background: #bcc9d3; border-radius: 999px; border: 2px solid #eef3f6; }
.table-wrap::-webkit-scrollbar-track { background: #eef3f6; border-radius: 999px; }
.note { color: #52616e; background: #f5f8fa; border: 1px solid #dce6ee; border-radius: 8px; padding: 12px; }
.history pre, .pre { white-space: pre-wrap; background: #13212b; color: #edf7fb; border-radius: 8px; padding: 12px; overflow: auto; max-height: 320px; }
.scheme-history-list { display: grid; gap: 8px; }
.scheme-config-mobile, .scheme-result-cards { display: none; }
.scheme-plan-config-card, .scheme-result-card { border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 12px; }
.scheme-plan-config-head, .scheme-layer-card-head, .scheme-result-card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.scheme-plan-config-head span, .scheme-result-card-head span { color: var(--muted); font-size: 12px; font-weight: 700; }
.scheme-layer-card-list { display: grid; gap: 10px; margin-top: 10px; }
.scheme-layer-card { border: 1px solid #e2e9ef; border-radius: 8px; background: #fbfcfd; padding: 10px; }
.mobile-form-grid, .mobile-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.mobile-form-grid label { display: grid; gap: 5px; color: #4b5965; font-size: 12px; font-weight: 700; }
.scheme-result-cards { gap: 12px; }
.scheme-result-card-head strong { font-size: 17px; }
.scheme-material-line { margin-top: 10px; color: #1f2933; font-weight: 700; line-height: 1.55; }
.mobile-result-grid > div { border: 1px solid #e2e9ef; border-radius: 8px; background: #f7f9fb; padding: 10px; }
.mobile-result-grid span, .mobile-detail-list span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 5px; }
.mobile-result-grid strong { color: var(--accent-2); font-size: 17px; }
.scheme-mobile-more { margin-top: 10px; }
.scheme-mobile-more summary { cursor: pointer; font-weight: 700; color: #3e4b56; }
.mobile-detail-list { display: grid; gap: 8px; margin-top: 10px; }
.mobile-detail-list div { border-top: 1px solid #e6edf2; padding-top: 8px; }
.mobile-detail-list strong { font-weight: 700; line-height: 1.5; word-break: break-word; }
.advanced-plan-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
}
.advanced-plan-table-head,
.advanced-plan-line { display: grid; grid-template-columns: minmax(96px, .58fr) minmax(110px, .7fr) minmax(170px, 1.15fr) minmax(80px, .5fr) minmax(90px, .58fr) minmax(260px, .85fr); gap: 8px; align-items: center; }
.advanced-plan-table-head { padding: 8px 10px; background: #f2f6f9; color: #52616e; font-size: 12px; font-weight: 800; border-bottom: 1px solid #dfe8ef; }
.advanced-plan-list { display: block; }
.advanced-plan-card { border: 0; border-top: 1px solid #e6edf2; border-radius: 0; background: #fff; padding: 0; min-width: 0; overflow: visible; }
.advanced-plan-card:first-child { border-top: 0; }
.advanced-plan-card-enter { opacity: 0; filter: blur(5px); transform: translateY(10px) scale(.995); }
.advanced-plan-card-enter-active { opacity: 1; filter: blur(0); transform: translateY(0) scale(1); transition: opacity 560ms cubic-bezier(.2,.8,.2,1), filter 560ms cubic-bezier(.2,.8,.2,1), transform 640ms cubic-bezier(.2,.8,.2,1); }
.advanced-plan-line { padding: 8px 10px; border-top: 1px solid #edf2f6; }
.advanced-plan-line:first-child { border-top: 0; }
.advanced-plan-line.is-child { background: #fbfcfd; }
.advanced-plan-cell { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.advanced-plan-cell strong { color: #17222b; font-size: 16px; white-space: nowrap; }
.advanced-plan-cell span { color: var(--muted); font-size: 12px; font-weight: 800; white-space: nowrap; }
.advanced-row-actions { display: flex; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.advanced-row-actions button { padding: 6px 10px; min-height: 34px; }
.optimized-cold-line { grid-template-columns: minmax(146px, .72fr) minmax(76px, .32fr) minmax(170px, 1fr) minmax(78px, .38fr) minmax(92px, .46fr) minmax(84px, .42fr) minmax(276px, 1.12fr); }
.optimized-hot-line { grid-template-columns: minmax(210px, 1fr) minmax(82px, .35fr) minmax(165px, 1.05fr) minmax(78px, .45fr) minmax(92px, .55fr) minmax(82px, .45fr) minmax(260px, .85fr); }
.optimized-hot-economic-line { grid-template-columns: minmax(112px, .58fr) minmax(62px, .26fr) minmax(122px, .68fr) minmax(64px, .3fr) minmax(92px, .42fr) minmax(104px, .46fr) minmax(274px, .9fr); }
.optimized-cold-storage-line { grid-template-columns: minmax(148px, .72fr) minmax(74px, .32fr) minmax(158px, .9fr) minmax(74px, .38fr) minmax(88px, .46fr) minmax(82px, .42fr) minmax(80px, .4fr) minmax(276px, 1.12fr); }
@media (min-width: 981px) {
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-economic-line .advanced-plan-cell {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-economic-line .advanced-plan-cell span {
    white-space: normal;
    line-height: 1.25;
  }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-economic-line .advanced-row-actions { flex-wrap: nowrap; }
  #content[data-module-key="zhuHotOptimized"] .optimized-hot-economic-line .advanced-row-actions button {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}
.parameter-label { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.parameter-help {
  position: relative;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #9fb0bb;
  border-radius: 999px;
  color: #60727e;
  background: #f8fbfc;
  font: 800 10px/1 Georgia, serif;
  cursor: help;
  outline: none;
}
.parameter-help:hover,
.parameter-help:focus-visible { color: #fff; border-color: var(--accent-2); background: var(--accent-2); }
.parameter-help::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 80;
  left: 50%;
  bottom: calc(100% + 9px);
  width: max-content;
  max-width: min(300px, 72vw);
  padding: 9px 11px;
  border: 1px solid #c9d8df;
  border-radius: 8px;
  color: #edf6f7;
  background: #263942;
  box-shadow: 0 12px 32px rgba(18, 34, 43, .2);
  font: 500 12px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  white-space: normal;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, 4px);
  transition: opacity .14s ease, transform .14s ease;
}
.parameter-help:hover::after,
.parameter-help:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
#content[data-module-key="zhuHotOptimized"] .parameter-help::after,
#content[data-module-key="zhuColdOptimized"] .parameter-help::after { display: none; }
.optimized-parameter-tooltip {
  position: fixed;
  z-index: 1200;
  box-sizing: border-box;
  width: max-content;
  min-width: min(180px, calc(100vw - 24px));
  max-width: min(300px, calc(100vw - 24px));
  padding: 9px 11px;
  border: 1px solid #c9d8df;
  border-radius: 8px;
  color: #edf6f7;
  background: #263942;
  box-shadow: 0 12px 32px rgba(18, 34, 43, .24);
  font: 500 12px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  white-space: normal;
  overflow-wrap: anywhere;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .14s ease, transform .14s ease;
}
.optimized-parameter-tooltip[hidden] { display: none; }
.optimized-parameter-tooltip.is-visible { opacity: 1; transform: translateY(0); }
.optimized-parameter-tooltip__close { display: none; }
.optimized-parameter-tooltip::after {
  content: "";
  position: absolute;
  left: var(--tooltip-arrow-x, 50%);
  width: 9px;
  height: 9px;
  background: #263942;
  transform: translateX(-50%) rotate(45deg);
}
.optimized-parameter-tooltip[data-placement="above"]::after {
  bottom: -5px;
  border-right: 1px solid #c9d8df;
  border-bottom: 1px solid #c9d8df;
}
.optimized-parameter-tooltip[data-placement="below"]::after {
  top: -5px;
  border-left: 1px solid #c9d8df;
  border-top: 1px solid #c9d8df;
}
.grid-subset { display: contents; }
.optimized-presets { margin: 8px 0 14px; }
.optimized-inline-actions { margin: 8px 0 12px; }
.cold-storage-other-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cold-storage-other-head .note { margin: 0; }
.cold-storage-other-list { display: grid; gap: 9px; margin: 10px 0; }
.cold-storage-other-layer {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) minmax(100px, .7fr) minmax(150px, .9fr) minmax(130px, .75fr) auto;
  gap: 9px;
  align-items: end;
  padding: 10px;
  border: 1px solid #dfe8ed;
  border-radius: 8px;
  background: #fbfcfd;
}
.cold-storage-other-layer > label { display: grid; gap: 5px; color: #4b5965; font-size: 12px; font-weight: 700; }
.cold-storage-other-total { margin-top: 8px; }
.optimized-detail-list { display: grid; gap: 9px; margin-top: 14px; }
.compact-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; }
.zhu-opt-result-table td small { display: block; color: var(--muted); font-size: 11px; line-height: 1.45; }
.optimized-professional-details {
  min-width: 0;
  margin-top: 16px;
  border: 1px solid #d4e1e7;
  border-radius: 10px;
  background: #fbfcfd;
  overflow: hidden;
}
.optimized-professional-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 15px;
  cursor: pointer;
  color: #263c47;
  background: linear-gradient(180deg, #fff, #f3f7f9);
}
.optimized-professional-details > summary > span { display: grid; gap: 3px; min-width: 0; }
.optimized-professional-details > summary strong { font-size: 15px; }
.optimized-professional-details > summary small { color: #687983; font-size: 12px; font-weight: 650; }
.optimized-professional-details > summary em {
  flex: 0 0 auto;
  padding: 4px 8px;
  border: 1px solid #c9ddd9;
  border-radius: 999px;
  color: #2f716c;
  background: #edf7f5;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
.optimized-professional-details[open] > summary { border-bottom: 1px solid #dce6eb; }
.optimized-professional-scroll {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  background: #fff;
}
.optimized-professional-mobile-hint { display: none; }
.optimized-professional-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.optimized-professional-plan-count-1,
.optimized-professional-plan-count-2 { min-width: 900px; }
.optimized-professional-plan-count-3 { min-width: 1050px; }
.optimized-professional-plan-count-4 { min-width: 1330px; }
.optimized-professional-plan-count-5 { min-width: 1610px; }
.optimized-professional-plan-count-6 { min-width: 1890px; }
.optimized-professional-plan-count-7 { min-width: 2170px; }
.optimized-professional-plan-count-8 { min-width: 2450px; }
.optimized-professional-plan-count-9 { min-width: 2730px; }
.optimized-professional-plan-count-10 { min-width: 3010px; }
.optimized-professional-table th,
.optimized-professional-table td {
  padding: 10px 12px;
  border-right: 1px solid #e0e8ec;
  border-bottom: 1px solid #e0e8ec;
  vertical-align: middle;
  text-align: center;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.optimized-professional-cell-note {
  display: block;
  margin-top: 5px;
  color: #667b86;
  font-size: 11px;
  line-height: 1.45;
}
.optimized-professional-layer-list {
  display: grid;
  gap: 7px;
  justify-items: center;
  text-align: center;
}
.optimized-professional-layer-line {
  display: flex;
  justify-content: center;
  gap: 8px;
  align-items: flex-start;
  max-width: 100%;
}
.optimized-professional-layer-line > span {
  color: #6a7d86;
  font-weight: 800;
  white-space: nowrap;
}
.optimized-professional-layer-line > div {
  min-width: 0;
  color: #263c47;
  text-align: center;
  overflow-wrap: anywhere;
}
.optimized-professional-layer-single {
  min-width: 0;
  color: #263c47;
  text-align: center;
  overflow-wrap: anywhere;
}
.optimized-professional-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  color: #fff;
  background: #213b48;
  font-size: 13px;
}
.optimized-professional-table thead th:first-child,
.optimized-professional-table tbody > tr:not(.optimized-professional-group) > th {
  position: sticky;
  left: 0;
  width: 210px;
  min-width: 210px;
  z-index: 2;
}
.optimized-professional-table thead th:first-child { z-index: 4; text-align: left; }
.optimized-professional-table tbody > tr:not(.optimized-professional-group) > th {
  color: #405762;
  background: #f4f8fa;
  text-align: left;
  font-size: 12px;
}
.optimized-professional-table tbody td { color: #2d404a; font-size: 12px; }
.optimized-professional-table .parameter-label { justify-content: flex-start; }
.optimized-professional-table .parameter-help { flex: 0 0 auto; }
.optimized-professional-group th {
  padding: 9px 12px;
  color: #245f5b;
  background: #eaf5f3;
  text-align: left;
}
.optimized-professional-group strong { margin-right: 10px; }
.optimized-professional-group span { color: #60757c; font-size: 11px; font-weight: 650; }
.optimized-professional-note { margin: 0; padding: 10px 14px 12px; color: #687983; font-size: 12px; line-height: 1.65; }
.optimized-table-field { min-width: 0; margin: 0; }
.optimized-table-field > span { display: none; color: var(--muted); font-size: 12px; font-weight: 800; }
.optimized-table-field input, .optimized-table-field select { width: 100%; min-width: 0; }
.optimized-table-field input::placeholder { color: #b75d2a; opacity: .9; }
.optimized-stale-banner { margin: 12px 0 0; padding: 11px 13px; border: 1px solid #efc49e; border-radius: 8px; background: #fff7ed; color: #9a4f21; font-weight: 700; }
.optimized-output-actions button:disabled { opacity: .45; cursor: not-allowed; }
.result-image-settings-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(19, 31, 38, .48);
  backdrop-filter: blur(8px);
}
.result-image-settings-dialog {
  width: min(980px, calc(100vw - 32px));
  max-height: min(86vh, 820px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(204, 217, 224, .9);
  border-radius: 24px;
  background: #f8fbfc;
  box-shadow: 0 28px 90px rgba(15, 35, 45, .28);
}
.result-image-settings-head {
  padding: 24px 28px 18px;
  border-bottom: 1px solid #dfe8ec;
  background: linear-gradient(135deg, #ffffff 0%, #eef7f6 100%);
}
.result-image-settings-head span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #1f7a75;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.result-image-settings-head h3 { margin: 0; color: #17222b; font-size: 24px; }
.result-image-settings-head p { margin: 8px 0 0; color: #65717d; line-height: 1.55; }
.result-image-settings-body {
  display: grid;
  gap: 16px;
  overflow: auto;
  padding: 20px 24px;
}
.result-image-settings-section {
  padding: 16px;
  border: 1px solid #dde8ec;
  border-radius: 18px;
  background: #ffffff;
}
.result-image-settings-section h4 { margin: 0 0 6px; color: #21313a; font-size: 17px; }
.result-image-settings-section p { margin: 0 0 14px; color: #6b7a86; font-size: 13px; line-height: 1.55; }
.result-image-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.result-image-option {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-height: 54px;
  padding: 11px 12px;
  border: 1px solid #dbe6eb;
  border-radius: 14px;
  background: #fbfdfe;
}
.result-image-option input { margin-top: 2px; width: 18px; height: 18px; accent-color: #1f7a75; }
.result-image-option strong {
  display: block;
  color: #1f2933;
  font-size: 14px;
  line-height: 1.35;
}
.result-image-option small {
  display: -webkit-box;
  margin-top: 4px;
  overflow: hidden;
  color: #6b7a86;
  font-size: 12px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.result-image-settings-empty { color: #7a8994; font-size: 14px; }
.result-image-settings-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 24px 22px;
  border-top: 1px solid #dfe8ec;
  background: rgba(255,255,255,.96);
}
.result-image-settings-actions button { min-height: 40px; font-weight: 800; }
.optimized-visuals { margin-top: 14px; }
.optimized-structure-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 14px; margin-top: 14px; }
.optimized-structure-card { min-width: 0; border: 1px solid #dce6eb; border-radius: 10px; background: #fff; padding: 12px; }
.optimized-structure-card h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: #314752; }
.optimized-plan-dot { width: 10px; height: 10px; border-radius: 999px; flex: 0 0 auto; }
.pipe-structure-scale-note { margin: 12px 0 0; padding: 9px 12px; border: 1px solid #d8e7e4; border-radius: 8px; background: #f3f9f8; color: #356762; font-size: 13px; font-weight: 700; }
.pipe-structure-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; min-width: 0; }
.pipe-structure-card-head h4 { min-width: 0; margin-bottom: 0; overflow-wrap: anywhere; }
.pipe-structure-card-head > span { flex: 0 0 auto; padding: 5px 9px; border: 1px solid #c9e3de; border-radius: 999px; background: #edf7f5; color: #1f7a75; font-size: 11px; font-weight: 800; white-space: nowrap; }
.pipe-structure-layout { display: grid; grid-template-columns: minmax(150px, .9fr) minmax(170px, 1.1fr); gap: 14px; align-items: center; max-width: 720px; margin: 10px auto 0; }
.pipe-structure-stage { display: grid; place-items: center; min-width: 0; }
.pipe-structure-diagram { display: block; width: min(100%, 220px); aspect-ratio: 1; overflow: visible; }
.pipe-core-label { font: 700 12px system-ui, sans-serif; }
.pipe-structure-copy { min-width: 0; }
.pipe-structure-metrics { display: grid; gap: 2px; padding-bottom: 8px; border-bottom: 1px solid #e2e9ef; }
.pipe-structure-metrics > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: baseline; padding: 4px 0; }
.pipe-structure-metrics span { color: #65717d; font-size: 12px; }
.pipe-structure-metrics strong { color: #263c47; font-size: 12px; text-align: right; white-space: nowrap; }
.pipe-structure-layers { display: grid; gap: 7px; margin: 9px 0 0; padding: 0; list-style: none; }
.pipe-structure-layers li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: 7px; align-items: start; min-width: 0; }
.pipe-structure-layers i { width: 10px; height: 10px; margin-top: 4px; border: 1px solid rgba(31, 41, 51, .12); border-radius: 3px; }
.pipe-structure-layers span { display: grid; min-width: 0; line-height: 1.35; }
.pipe-structure-layers b { color: #314752; font-size: 12px; }
.pipe-structure-layers em { color: #65717d; font-size: 11px; font-style: normal; overflow-wrap: anywhere; }
.pipe-structure-layers strong { color: #263c47; font-size: 12px; text-align: right; white-space: nowrap; }
.pipe-structure-unavailable { margin: 16px 0 4px; padding: 20px; border: 1px dashed #d6a581; border-radius: 8px; background: #fff7ed; color: #9a4f21; text-align: center; font-weight: 700; }
.optimized-temperature-groups { display: grid; gap: 14px; margin-top: 14px; }
.optimized-temperature-group { border: 1px solid #dce6eb; border-radius: 10px; background: #fff; padding: 12px; }
.optimized-temperature-group h4 { margin: 0 0 8px; color: #314752; }
.optimized-thermal-model-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 14px; }
.optimized-thermal-model-card { min-width: 0; overflow: hidden; border: 1px solid #e1e9ee; border-radius: 10px; background: #fafdff; padding: 10px; }
.optimized-thermal-model-card h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; color: #314752; overflow-wrap: anywhere; }
.optimized-thermal-model-card p { margin: 7px 4px 2px; color: #52616e; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.optimized-thermal-model-svg { display: block; width: 100%; height: auto; }
.thermal-model-layout {
  display: grid;
  grid-template-columns: minmax(150px, .9fr) minmax(170px, 1.1fr);
  gap: 14px;
  align-items: center;
  width: 100%;
  max-width: 720px;
  margin: 8px auto 0;
  min-width: 0;
}
.thermal-model-stage {
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  overflow: visible;
}
.thermal-model-stage .optimized-thermal-model-svg {
  width: min(100%, 220px);
  max-width: 220px;
  aspect-ratio: 1;
  overflow: visible;
}
.thermal-model-node-list {
  display: grid;
  gap: 4px;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
.thermal-model-node {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  min-width: 0;
  min-height: 27px;
  padding: 4px 7px;
  border: 1px solid #dfe8ed;
  border-radius: 8px;
  color: #314752;
  background: #fff;
  font-size: 12px;
  line-height: 1.3;
}
.thermal-model-node-source {
  border-color: #efc6b8;
  background: #fff7f3;
}
.thermal-model-node-ambient {
  margin-top: 4px;
  border-color: #bfd9e8;
  background: #f3f9fd;
}
.thermal-model-node-badge {
  display: inline-grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border: 1px solid #9eafb8;
  border-radius: 999px;
  color: #314752;
  background: #fff;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
.thermal-model-node-source .thermal-model-node-badge {
  border-color: #b64b31;
  color: #fff;
  background: #c64b2f;
}
.thermal-model-node-ambient .thermal-model-node-badge {
  border-color: #2477a8;
  color: #fff;
  background: #2477a8;
}
.thermal-model-node-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: baseline;
  min-width: 0;
}
.thermal-model-node-copy > :first-child {
  min-width: 0;
  overflow-wrap: anywhere;
}
.thermal-model-node-copy > :last-child {
  color: #203945;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}
.thermal-boundary-callout-line {
  fill: none;
  stroke: #617784;
  stroke-width: 1.15;
  vector-effect: non-scaling-stroke;
}
.thermal-boundary-callout-point {
  fill: #fff;
  stroke: #405965;
  stroke-width: 1.3;
  vector-effect: non-scaling-stroke;
}
.thermal-boundary-callout-box {
  fill: rgba(255, 255, 255, .96);
  stroke: #b9cad3;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.thermal-boundary-callout-text {
  fill: #263c47;
  font-size: 8.5px;
  font-weight: 850;
  text-anchor: middle;
  dominant-baseline: central;
  pointer-events: none;
}
.optimized-flat-structure { min-height: 220px; }
.optimized-flat-structure-materials {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 5px 8px;
  margin: -2px 4px 4px;
  color: #52616e;
  font-size: 12px;
  line-height: 1.55;
  text-align: center;
  overflow-wrap: anywhere;
}
.optimized-flat-structure-materials span { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 3px; }
.optimized-flat-structure-materials b { color: #314752; }
.optimized-flat-structure-materials i { color: #87949d; font-style: normal; }
.thermal-wall-line { stroke: #3f4b54; stroke-width: 6; stroke-linecap: round; }
.thermal-wall-hatch { stroke: #65717d; stroke-width: 2; stroke-linecap: round; }
.thermal-direction-arrow { stroke: #52616e; stroke-width: 2; stroke-dasharray: 5 4; }
.thermal-interface-line { stroke: rgba(255, 255, 255, .92); stroke-width: 1.5; }
.thermal-surface-line { stroke: #355d73; stroke-width: 2.2; }
.thermal-core-label { fill: #fff; font-size: 12px; font-weight: 800; }
.thermal-core-value { fill: #fff; font-size: 11px; font-weight: 700; }
.optimized-visual-note { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.optimized-price-warning { color: #b75d2a; font-weight: 800; }
.scheme-history-title-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.scheme-history-title-row h3 { margin: 0; }
.scheme-history-title-row > span { color: var(--muted); font-size: 12px; text-align: right; }
.scheme-history-item { border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 10px 12px; }
.scheme-history-head { display: grid; grid-template-columns: 36px minmax(180px, 1fr) repeat(5, max-content); gap: 7px; align-items: center; }
.scheme-history-head > strong { min-width: 0; overflow-wrap: anywhere; line-height: 1.35; }
.scheme-history-head > button { min-height: 36px; padding: 7px 10px; white-space: nowrap; }
.history-sequence { display: inline-grid; place-items: center; min-width: 30px; min-height: 26px; padding: 3px 6px; border-radius: 999px; color: var(--accent-2); background: #e7f3f1; font-size: 12px; font-weight: 900; }
.history-title-input { font-weight: 700; background: #fff; }
.scheme-history-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 7px; color: var(--muted); font-size: 12px; line-height: 1.5; margin: 7px 0 0 43px; }
.scheme-history-meta > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.history-badge { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 7px; border: 1px solid #d9e3e8; border-radius: 999px; color: #52616e; background: #f5f8fa; font-size: 11px; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.history-badge.is-named { color: #216e69; border-color: #b9dcd6; background: #eaf6f3; }
.history-badge.is-complete { color: #315a77; border-color: #c8dce9; background: #eff7fb; }
.history-badge.is-compact { color: #9a6419; border-color: #ead6ae; background: #fff8e8; }
.history-badge.is-legacy { color: #6a607b; border-color: #d8cee5; background: #f7f2fb; }
.history-pagination { display: grid; grid-template-columns: minmax(150px, 1fr) auto auto; align-items: center; gap: 10px 14px; margin: 10px 0; padding: 9px 10px; border: 1px solid #dce6eb; border-radius: 9px; background: #f7fafb; }
.history-pagination-summary { color: #52616e; font-size: 12px; font-weight: 700; }
.history-pagination-options { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.history-pagination-options label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.history-pagination-options select { width: auto; min-width: 82px; min-height: 34px; padding: 5px 28px 5px 8px; background-color: #fff; }
.history-pagination-nav { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.history-pagination-nav button { min-width: 34px; min-height: 34px; padding: 5px 9px; }
.history-page-numbers { display: inline-flex; align-items: center; gap: 4px; }
.history-page-compact { display: none; color: #52616e; font-size: 12px; font-weight: 800; white-space: nowrap; }
.history-page-number.is-current { color: #fff; border-color: var(--accent); background: var(--accent); }
.history-page-ellipsis { min-width: 16px; color: var(--muted); text-align: center; }
.history-filter-empty { grid-column: 1 / -1; margin: 0; padding: 22px; color: var(--muted); text-align: center; border: 1px dashed #ccd9df; border-radius: 9px; background: #fafcfd; }
.scheme-history details { margin-top: 8px; }
.scheme-history summary { cursor: pointer; font-weight: 700; color: #3e4b56; }
.history-section { margin-top: 12px; }
.history-section h4 { margin-bottom: 8px; color: #3e4b56; }
.history-mini-table table { max-width: 760px; }
.history-mini-table th { width: 220px; position: static; }
.history-table th { position: static; }
.zhu-visual-card { margin-top: 18px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfd; padding: 12px; }
.zhu-visual-card > summary { cursor: pointer; font-weight: 700; color: #314752; }
.zhu-visual-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 12px; }
.zhu-visual-grid h4, .comparison-panel h4 { margin: 0 0 8px; color: #3e4b56; }
.zhu-chart { display: block; width: 100%; min-height: 220px; border: 1px solid #dce6eb; border-radius: 10px; background: #fff; }
.chart-axis { stroke: #9aabb4; stroke-width: 1.5; }
.chart-value { fill: #263c47; font: 600 13px system-ui, sans-serif; }
.chart-label { fill: #5d707b; font: 12px system-ui, sans-serif; }
.comparison-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 12px; }
.comparison-panel { border: 1px solid #dce6eb; border-radius: 10px; padding: 12px; background: #fff; min-width: 0; }
.comparison-bars { display: grid; gap: 9px; }
.comparison-row { display: grid; grid-template-columns: minmax(92px, 1fr) minmax(70px, 1.3fr) auto; gap: 8px; align-items: center; font-size: 12px; }
.comparison-row > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #4c606b; }
.comparison-row > strong { min-width: 72px; text-align: right; color: #263c47; font-size: 12px; }
.comparison-track { height: 10px; background: #edf2f5; border-radius: 999px; overflow: hidden; }
.comparison-track i { display: block; height: 100%; border-radius: inherit; }
.stats-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.stats-timeline { height: 160px; display: grid; grid-template-columns: repeat(14, minmax(28px, 1fr)); gap: 8px; align-items: end; padding: 12px 4px 0; overflow-x: auto; }
.stats-day { height: 145px; display: grid; grid-template-rows: 20px 1fr 18px; justify-items: center; align-items: end; min-width: 30px; }
.stats-day strong { color: #445965; font-size: 11px; }
.stats-day i { width: min(28px, 70%); min-height: 3px; max-height: 110px; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, var(--accent), #d97824); }
.stats-day span { color: var(--muted); font-size: 10px; }
.usage-progress { width: 110px; height: 10px; accent-color: var(--accent); }
.stats-bar { width: 28px; height: 110px; }
.stats-bar rect { fill: var(--accent); }
.summary-row { display: grid; grid-template-columns: minmax(120px, .8fr) minmax(0, 2fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.summary-row:last-child { border-bottom: 0; }
.summary-row span { color: var(--muted); }
.compact-editor { display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; color: var(--muted); }
.compact-editor input { width: 88px; }
.clipboard-fallback { position: fixed; left: -10000px; top: 0; width: 1px; height: 1px; opacity: 0; }
.reference-card > summary { cursor: pointer; font-weight: 800; color: #314752; }
.reference-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 16px 0; }
.reference-grid section { border: 1px solid #dce6eb; background: #fbfcfd; border-radius: 10px; padding: 14px; }
.reference-grid h3 { margin: 0 0 8px; font-size: 15px; }
.reference-grid ul { margin: 0; padding-left: 19px; color: #4d616c; line-height: 1.65; }
.pill { display: inline-block; padding: 4px 8px; border-radius: 999px; background: #edf7f5; color: var(--accent-2); border: 1px solid #c9e3de; }
.pill.bad { background: #fff3ed; color: #b75d2a; border-color: #f0c5ad; }
.pill.warn { background: #fff8e8; color: #93620e; border-color: #ead39a; }
.chat-log { display: grid; gap: 10px; min-height: 260px; }
.message { max-width: 860px; padding: 12px; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
.message.user { justify-self: end; background: #fff8ef; }
.message.assistant { justify-self: start; background: #f8fbfa; }
.report-modal {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 250, 244, .34), transparent 34%),
    rgba(15, 25, 33, .52);
  backdrop-filter: blur(8px) saturate(1.08);
}
.report-dialog {
  width: min(560px, calc(100vw - 32px));
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 22px;
  background: linear-gradient(180deg, #fffaf6 0%, #fff 52%, #fbfdfd 100%);
  box-shadow: 0 34px 92px rgba(12, 25, 34, .34);
}
.report-dialog__header {
  padding: 24px 26px 18px;
  border-bottom: 1px solid rgba(214, 183, 160, .44);
  background:
    linear-gradient(135deg, rgba(255, 244, 235, .95), rgba(245, 252, 249, .94)),
    radial-gradient(circle at 86% 18%, rgba(178, 87, 42, .14), transparent 30%);
}
.report-dialog__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border: 1px solid rgba(156, 98, 56, .18);
  border-radius: 999px;
  background: rgba(255, 255, 255, .68);
  color: #946132;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.report-dialog h3 {
  margin: 12px 0 8px;
  color: #1f2c37;
  font-size: 24px;
  line-height: 1.18;
}
.report-dialog__header p {
  margin: 0;
  color: #64727f;
  font-size: 14px;
  line-height: 1.6;
}
.report-field {
  display: grid;
  gap: 9px;
  padding: 20px 26px 0;
  color: #43515d;
  font-size: 14px;
  font-weight: 800;
}
.report-field input {
  width: 100%;
  min-height: 48px;
  box-sizing: border-box;
  border: 1px solid #ccd8df;
  border-radius: 13px;
  padding: 0 14px;
  color: #1f2c37;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}
.report-field input:focus {
  outline: none;
  border-color: #b65b35;
  box-shadow: 0 0 0 3px rgba(182, 91, 53, .16);
}
.report-template-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 26px 0;
}
.report-template-options label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid #dbe3ea;
  border-radius: 999px;
  background: #f7fafb;
  color: #354753;
  font-size: 13px;
  font-weight: 800;
}
.report-template-options label.is-disabled {
  opacity: .5;
  cursor: not-allowed;
}
.report-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 20px 26px 24px;
}
.report-actions button {
  min-height: 42px;
  border-radius: 12px;
  padding: 0 18px;
  font-weight: 800;
}
.report-message {
  min-height: 22px;
  margin: 14px 26px 0;
  color: #b42318;
  font-size: 14px;
  line-height: 1.55;
}
@media (max-width: 560px) {
  .report-modal { padding: 14px; place-items: center; }
  .report-dialog { width: 100%; border-radius: 20px; }
  .report-dialog__header { padding: 20px 18px 15px; }
  .report-dialog h3 { font-size: 22px; }
  .report-field { padding: 18px 18px 0; }
  .report-message { margin: 12px 18px 0; }
  .report-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding: 18px;
  }
  .report-actions button { width: 100%; padding: 0 12px; }
}
.app-dialog-modal {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(15, 25, 33, .46);
  backdrop-filter: blur(5px);
  animation: app-dialog-backdrop-in 160ms ease-out;
}
.app-dialog-shell {
  width: min(480px, 100%);
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 14px;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.76);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(8, 18, 25, .28);
  animation: app-dialog-shell-in 190ms cubic-bezier(.2,.8,.2,1);
}
.app-dialog-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  font-size: 21px;
  font-weight: 900;
  color: #8a5a34;
  background: #fff2df;
  border: 1px solid #efd0a4;
}
.tone-info .app-dialog-icon { color: var(--blue); background: #eaf5fb; border-color: #bddbea; }
.tone-danger .app-dialog-icon { color: #b42318; background: #fff0ed; border-color: #f0c3bb; }
.app-dialog-copy { min-width: 0; }
.app-dialog-copy h3 { margin: 2px 0 8px; color: #17222b; font-size: 19px; }
.app-dialog-copy p { margin: 0; color: #43525e; line-height: 1.65; }
.app-dialog-input {
  width: 100%;
  min-height: 44px;
  margin-top: 12px;
  padding: 9px 11px;
  border: 1px solid #cbd9e1;
  border-radius: 8px;
  background: #fff;
  color: #17222b;
  font: inherit;
}
.app-dialog-input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,111,151,.14); outline: none; }
.app-dialog-detail {
  margin-top: 11px;
  padding: 10px 12px;
  border: 1px solid #dde7ed;
  border-radius: 8px;
  color: #64717c;
  background: #f7f9fb;
  font-size: 12px;
  line-height: 1.6;
}
.app-dialog-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 4px;
}
.app-dialog-actions button { min-width: 96px; min-height: 40px; font-weight: 700; }
.app-dialog-confirm { box-shadow: 0 7px 18px rgba(138,90,52,.2); }
.app-toast {
  position: fixed;
  z-index: 1400;
  left: 50%;
  bottom: 28px;
  max-width: min(520px, calc(100vw - 28px));
  padding: 11px 16px;
  border: 1px solid #c9e3de;
  border-radius: 999px;
  color: #17645f;
  background: rgba(237,247,245,.98);
  box-shadow: 0 14px 42px rgba(18,34,43,.22);
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, 12px);
  transition: opacity .18s ease, transform .18s ease;
}
.app-toast.tone-error { color: #b42318; border-color: #f0c3bb; background: rgba(255,240,237,.98); }
.app-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
@keyframes app-dialog-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes app-dialog-shell-in { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.section-label { margin: 6px 0 10px; color: var(--muted); font-size: 13px; font-weight: 700; }
.toolbar button.subtle, button.subtle { color: #60717c; border-color: #dfe7eb; background: #f8fafb; box-shadow: none; }
.optimized-flow-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid #dbe6ea;
  border-radius: 10px;
  color: #405661;
  background: linear-gradient(90deg, #f7fbfb, #fffaf4);
  font-size: 13px;
  font-weight: 800;
}
.optimized-flow-strip i { color: #9aaab2; font-style: normal; }
.optimized-anchor { scroll-margin-top: 88px; }
.optimized-price-note { margin: 12px 0 0; color: #41616d; }
.zhu-opt-generate-note { margin: 9px 0 0; color: #61737d; font-size: 12px; line-height: 1.5; }
.optimized-calculation-source {
  min-width: 0;
  display: grid;
  gap: 2px;
  margin-left: auto;
  padding: 7px 10px;
  border: 1px solid #cfe2df;
  border-radius: 9px;
  color: #245f5b;
  background: #edf7f5;
  line-height: 1.3;
}
.optimized-calculation-source span { color: #687a83; font-size: 10px; font-weight: 700; }
.optimized-calculation-source strong { overflow-wrap: anywhere; font-size: 12px; font-weight: 850; }
.optimized-output-actions { position: sticky; top: 84px; z-index: 8; padding: 5px; border-radius: 9px; background: rgba(255,255,255,.94); backdrop-filter: blur(7px); }
.optimized-anchor.is-stale .optimized-status-strip,
.optimized-anchor.is-stale .optimized-result-cards,
.optimized-anchor.is-stale .optimized-full-details,
.optimized-anchor.is-stale .optimized-detail-list,
.optimized-anchor.is-stale .optimized-professional-details,
.optimized-anchor.is-stale .optimized-visuals { opacity: .56; filter: saturate(.7); }
.optimized-result-cards { display: none; }
.optimized-result-card {
  min-width: 0;
  padding: 13px;
  border: 1px solid #dce6eb;
  border-radius: 10px;
  background: #fff;
}
.optimized-result-card header { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.optimized-result-card header > strong { color: #17222b; font-size: 17px; }
.optimized-result-card p { margin: 10px 0 4px; color: #3f535e; line-height: 1.55; }
.optimized-result-card > small { color: var(--muted); font-weight: 700; }
.optimized-result-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.optimized-result-card-grid > div { display: grid; gap: 3px; padding: 9px; border-radius: 8px; background: #f5f8fa; }
.optimized-result-card-grid span { color: #65747d; font-size: 11px; }
.optimized-result-card-grid strong { color: #24343d; font-size: 13px; overflow-wrap: anywhere; }
.optimized-interface-list {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  color: inherit;
  font: inherit;
  line-height: 1.35;
  white-space: normal;
}
.optimized-interface-list > span {
  min-width: 0;
  color: inherit;
  font: inherit;
  overflow-wrap: anywhere;
}
.optimized-interface-list--empty { color: var(--muted); }
.zhu-opt-result-table .optimized-interface-list { min-width: 90px; }
.optimized-card-warning { margin-top: 10px; padding: 8px 10px; border-radius: 7px; color: #9a4f21; background: #fff7ed; font-size: 12px; line-height: 1.5; }
.optimized-full-details { margin-top: 12px; }
.optimized-full-details > summary { cursor: pointer; color: #314752; font-weight: 800; }
.optimized-full-details[open] > summary { margin-bottom: 10px; }
.optimized-mobile-action { display: none; }
.subtle-divider { height: 1px; background: var(--line); margin: 14px 0; }
details.card summary { cursor: pointer; font-weight: 700; color: #3e4b56; }
.zhu-opt-scenario { padding: 0; overflow: hidden; }
.zhu-opt-scenario > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 17px;
  background: linear-gradient(180deg, #ffffff, #f6f9fb);
}
.zhu-opt-scenario > summary span { color: var(--accent-2); font-size: 13px; }
.zhu-opt-scenario[open] > summary { border-bottom: 1px solid var(--line); }
.zhu-opt-scenario > .grid { padding: 14px 16px 16px; }
.zhu-opt-scenario > .optimized-scenario-selector {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 16px 16px;
}
.optimized-desktop-scenario-tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.optimized-scenario-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 13px;
  border-color: #d5e1e5;
  background: #fff;
  color: #314752;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 2px 7px rgba(27, 55, 63, .04);
}
.optimized-scenario-tab:hover {
  border-color: #7bbab2;
  background: #f4faf9;
  color: var(--accent-2);
}
.optimized-scenario-tab.is-active {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  color: #fff;
  box-shadow: 0 7px 16px rgba(26, 124, 114, .18);
}
.optimized-scenario-icon {
  position: relative;
  display: inline-block;
  flex: 0 0 27px;
  width: 27px;
  height: 27px;
  border-radius: 8px;
  background: #e9f4f2;
  color: var(--accent-2);
}
.optimized-scenario-tab.is-active .optimized-scenario-icon {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}
.optimized-scenario-icon::before,
.optimized-scenario-icon::after {
  position: absolute;
  box-sizing: border-box;
  content: "";
}
.optimized-scenario-icon--pipe::before {
  inset: 6px;
  border: 2px solid currentColor;
  border-radius: 50%;
}
.optimized-scenario-icon--pipe::after {
  inset: 11px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
}
.optimized-scenario-icon--flat::before {
  inset: 7px 5px;
  border: 2px solid currentColor;
  border-radius: 3px;
  transform: skewX(-10deg);
}
.optimized-scenario-icon--flat::after {
  top: 12px;
  right: 7px;
  left: 7px;
  border-top: 2px solid currentColor;
  transform: skewX(-10deg);
}
.optimized-scenario-icon--buried::before {
  right: 6px;
  bottom: 5px;
  left: 6px;
  height: 11px;
  border: 2px solid currentColor;
  border-radius: 50%;
}
.optimized-scenario-icon--buried::after {
  top: 7px;
  right: 4px;
  left: 4px;
  border-top: 2px dashed currentColor;
}
.optimized-scenario-icon--storage::before {
  inset: 5px;
  border: 2px solid currentColor;
  border-radius: 3px;
}
.optimized-scenario-icon--storage::after {
  top: 10px;
  right: 8px;
  bottom: 6px;
  left: 12px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
}
.optimized-mobile-scene-field { display: none; }
.optimized-scenario-run-field {
  flex: 0 1 250px;
  min-width: 210px;
  margin-left: auto;
}
.zhu-opt-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 330px);
  gap: 18px;
  align-items: start;
}
.zhu-opt-input-main { min-width: 0; }
.zhu-opt-input-main > .section-label { margin-top: 14px; color: #314752; }
.zhu-opt-input-main > .section-label:first-child { margin-top: 2px; }
.optimized-parameter-group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 2px 0 8px;
  padding: 10px 12px;
  border: 1px solid #d7e7e5;
  border-radius: 10px;
  background: linear-gradient(90deg, #edf8f6, #f9fbfc);
  color: #29464c;
}
.optimized-parameter-group-title strong { font-size: 15px; }
.optimized-parameter-group-title span { color: var(--muted); font-size: 12px; }
.optimized-parameter-group-title--specialty {
  margin-top: 18px;
  border-color: #dce4e8;
  background: linear-gradient(90deg, #f3f6f8, #fbfcfd);
}
.zhu-opt-action-rail {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 7px;
  border: 1px solid #d8e4ea;
  border-radius: 9px;
  padding: 11px;
  background: linear-gradient(180deg, #f9fcfd, #f2f7f8);
  box-shadow: 0 10px 26px rgba(27, 54, 64, .08);
}
.hot-opt-thickness-mode {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  width: 142px;
  padding: 3px;
  border: 1px solid #d5c2b6;
  border-radius: 9px;
  background: #fff8f4;
}
.hot-opt-thickness-mode button {
  min-width: 0;
  min-height: 30px;
  padding: 5px 6px;
  border: 0;
  border-radius: 6px;
  color: #7a5a4d;
  background: transparent;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.hot-opt-thickness-mode button.is-active {
  color: #fff;
  background: var(--hot-primary, #c64b2f);
  box-shadow: 0 2px 7px rgba(159, 52, 36, .18);
}
#content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > div:first-child {
  min-height: 35px;
  padding-right: 148px;
}
.optimized-construction-adoption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0 0 10px;
  padding: 9px 11px;
  border: 1px solid #ead0c2;
  border-radius: 8px;
  color: #724331;
  background: #fff8f4;
  font-size: 12px;
  line-height: 1.5;
}
.optimized-construction-adoption strong { flex: 0 0 auto; }
.optimized-construction-adoption span { min-width: 0; overflow-wrap: anywhere; }
.zhu-opt-action-rail h3 { margin: 3px 0 0; }
.zhu-opt-action-rail .field { padding: 9px 10px; background: #fff; }
.zhu-opt-action-rail .readonly { padding: 8px 10px; }
.zhu-opt-action-rail .section-label { margin: 1px 0 4px; }
.zhu-opt-action-rail .zhu-opt-standard { gap: 2px; }
.zhu-opt-action-rail .zhu-opt-standard span { line-height: 1.3; }
.zhu-opt-target-field { border-color: #c5ddd9; background: #f7fcfb !important; }
.zhu-opt-standard { display: grid; gap: 6px; line-height: 1.45; }
.zhu-opt-standard strong { color: var(--accent-2); font-size: 14px; }
.zhu-opt-standard span { color: #52616e; font-size: 12px; }
.zhu-opt-primary { width: 100%; min-height: 46px; font-size: 15px; font-weight: 800; }
.zhu-opt-plan-list { display: grid; gap: 13px; }
.zhu-opt-plan {
  border: 1px solid #dce5eb;
  border-radius: 9px;
  background: #fbfcfd;
  overflow: hidden;
}
.zhu-opt-plan-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 13px;
  border-bottom: 1px solid #e3eaef;
  background: #fff;
}
.zhu-opt-plan-head > div:first-child { display: grid; gap: 3px; }
.zhu-opt-plan-head > div:first-child strong { color: #17222b; font-size: 16px; }
.zhu-opt-plan-head > div:first-child span { color: var(--muted); font-size: 12px; }
.zhu-opt-plan-head .toolbar { margin: 0; justify-content: flex-end; }
.zhu-opt-layer-list { display: grid; }
.zhu-opt-layer-row {
  display: grid;
  grid-template-columns: 28px 54px minmax(180px, 1.2fr) minmax(145px, .8fr) 28px minmax(145px, .75fr) auto;
  gap: 9px;
  align-items: end;
  padding: 11px 13px;
  border-top: 1px solid #e8eef2;
}
.zhu-opt-layer-row:first-child { border-top: 0; }
.zhu-opt-layer-row > span { align-self: center; color: var(--muted); font-size: 12px; }
.zhu-opt-layer-row > label { display: grid; gap: 4px; color: #4b5965; font-size: 12px; font-weight: 700; }
.zhu-opt-layer-index {
  display: grid !important;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  color: var(--accent-2) !important;
  background: #e7f3f1;
  border: 1px solid #c4ddd8;
  font-weight: 800;
}
.zhu-opt-result-table { margin-top: 13px; }
.zhu-opt-result-table table { min-width: 1260px; }
.zhu-opt-result-table.segmented-route-results table { min-width: 2100px; }
.optimized-result-only-mobile { display: none; }
.optimized-result-heading {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.28;
}
.optimized-result-heading > span,
.optimized-result-heading-unit { white-space: nowrap; }
.optimized-result-heading-unit {
  margin-top: 2px;
  color: inherit;
  font-size: 11px;
  font-weight: 650;
}
.optimized-result-number-list,
.optimized-result-mobile-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
@media (min-width: 761px) {
  .zhu-opt-result-table th {
    vertical-align: middle;
    text-align: center;
  }
  .zhu-opt-result-table td {
    vertical-align: middle;
    text-align: center;
    font-variant-numeric: tabular-nums;
  }
  .zhu-opt-result-table td:nth-child(2) { text-align: left; }
  .zhu-opt-result-table .optimized-result-number-list { align-items: center; }
}
@media (max-width: 980px) {
  .login, .app { grid-template-columns: 1fr; }
  .login-visual { min-height: 42vh; }
  .sidebar { position: static; height: auto; }
  .col-3, .col-4, .col-6, .col-8 { grid-column: span 12; }
  .grid > .field { grid-column: span 12; }
  .kpis { grid-template-columns: 1fr; }
  .topbar { align-items: flex-start; flex-direction: column; }
  .result-card-head { flex-direction: column; }
  .scheme-history-head { grid-template-columns: 36px minmax(0, 1fr); }
  .scheme-history-head > button { width: 100%; white-space: normal; }
  .scheme-history-head > button.primary { grid-column: 1 / -1; }
  .scheme-history-meta { margin-left: 0; }
  .scheme-history-title-row { align-items: flex-start; flex-direction: column; gap: 4px; }
  .scheme-history-title-row > span { text-align: left; }
  .history-pagination { grid-template-columns: 1fr; }
  .history-pagination-options, .history-pagination-nav { justify-content: flex-start; }
  .zhu-visual-grid, .comparison-grid, .stats-grid, .reference-grid { grid-template-columns: 1fr; }
  .content { padding: 14px; gap: 12px; }
  .card { padding: 13px; }
  .scheme-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .scheme-actions button { min-height: 42px; }
  .scheme-config-table, .scheme-result-table { display: none; }
  .scheme-config-mobile { display: grid; gap: 12px; }
  .scheme-result-cards { display: grid; }
  .mobile-form-grid, .mobile-result-grid { grid-template-columns: 1fr; }
  .scheme-plan-config-head, .scheme-layer-card-head, .scheme-result-card-head { align-items: flex-start; }
  .scheme-layer-card-head { flex-direction: column; }
  .advanced-plan-table-head { display: none; }
  .advanced-plan-table { border: 0; background: transparent; overflow: visible; }
  .advanced-plan-list { display: grid; gap: 10px; }
  .advanced-plan-card { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
  .advanced-plan-line { grid-template-columns: 1fr; gap: 9px; padding: 10px; }
  .advanced-plan-line.optimized-cold-line { grid-template-columns: 1fr; }
  .advanced-plan-line.optimized-hot-line,
  .advanced-plan-line.optimized-hot-economic-line,
  .advanced-plan-line.optimized-cold-storage-line { grid-template-columns: 1fr; }
  .advanced-plan-cell:empty { display: none; }
  .advanced-plan-cell { justify-content: space-between; }
  .optimized-table-field { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 8px; }
  .optimized-table-field > span { display: block; }
  .advanced-row-actions { justify-content: stretch; }
  .advanced-row-actions button { flex: 1 1 auto; }
  .zhu-opt-scenario > summary { align-items: center; flex-direction: row; }
  .zhu-opt-workbench { grid-template-columns: 1fr; }
  .zhu-opt-action-rail { position: static; }
  .zhu-opt-plan-head { align-items: flex-start; flex-direction: column; }
  .zhu-opt-plan-head .toolbar { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
  .zhu-opt-layer-row { grid-template-columns: 28px 1fr; align-items: center; }
  .zhu-opt-layer-row > select,
  .zhu-opt-layer-row > label,
  .zhu-opt-layer-row > button { grid-column: 1 / -1; }
  .zhu-opt-layer-row > label { grid-template-columns: 70px minmax(0, 1fr); align-items: center; }
  .zhu-opt-layer-row > span:not(.zhu-opt-layer-index) { grid-column: 2; }
  .zhu-opt-result-table table { min-width: 1050px !important; }
  .optimized-structure-grid { grid-template-columns: 1fr; }
  .pipe-structure-card-head { align-items: stretch; flex-direction: column; }
  .pipe-structure-card-head > span { align-self: flex-start; }
  .pipe-structure-layout { grid-template-columns: 1fr; max-width: 420px; }
  .pipe-structure-copy { width: 100%; }
  .cold-storage-other-head { align-items: stretch; flex-direction: column; }
  .cold-storage-other-layer { grid-template-columns: 1fr; }
  .compact-kpis { grid-template-columns: 1fr; }
  .app-dialog-modal { padding: 14px; }
  .app-dialog-shell { grid-template-columns: 38px minmax(0, 1fr); gap: 11px; padding: 18px; border-radius: 11px; }
  .app-dialog-icon { width: 36px; height: 36px; border-radius: 10px; font-size: 18px; }
  .app-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .app-dialog-actions button:only-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .optimized-result-only-desktop { display: none !important; }
  .optimized-result-only-mobile { display: inline; }
  div.optimized-result-only-mobile { display: block; }
  .optimized-result-mobile-list { align-items: flex-start; }
}

@media (max-width: 760px) {
  #content[data-module-key="zhuHotOptimized"],
  #content[data-module-key="zhuColdOptimized"] { padding-bottom: 82px; }
  .thermal-model-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    max-width: 420px;
  }
  .thermal-model-stage .optimized-thermal-model-svg {
    width: min(100%, 220px);
  }
  .thermal-model-node-list { width: 100%; }
  .thermal-model-node { min-height: 29px; padding: 5px 8px; }
  .optimized-flow-strip { justify-content: flex-start; gap: 7px; min-height: 38px; padding: 7px 10px; overflow-x: auto; white-space: nowrap; font-size: 12px; }
  .zhu-opt-scenario > summary { padding: 11px 12px; }
  .zhu-opt-scenario > summary span { text-align: right; }
  .zhu-opt-scenario > .grid { padding: 10px 11px 12px; }
  .zhu-opt-scenario > .optimized-scenario-selector { display: grid; padding: 10px 11px 12px; }
  .optimized-desktop-scenario-tabs { display: none; }
  .optimized-mobile-scene-field { display: block; }
  .optimized-scenario-run-field { min-width: 0; margin-left: 0; }
  .optimized-parameter-group-title { display: none; }
  .zhu-opt-action-rail { gap: 9px; padding: 12px; }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > div:first-child {
    min-height: 0;
    padding-right: 0;
  }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail > .field:has(#hotOptConvergence) {
    min-width: 0;
  }
  .hot-opt-thickness-mode {
    position: static;
    width: 100%;
    box-sizing: border-box;
  }
  .optimized-status-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .optimized-status-strip .kpi { min-width: 0; padding: 9px 7px; }
  .optimized-status-strip .kpi span { font-size: 10px; }
  .optimized-status-strip .kpi strong { font-size: 15px; }
  .optimized-result-cards { display: grid; gap: 10px; margin-top: 12px; }
  .optimized-full-details:not([open]) .zhu-opt-result-table { display: none; }
  .optimized-full-details[open] .zhu-opt-result-table { overflow-x: auto; }
  .optimized-professional-details > summary { align-items: flex-start; padding: 11px 12px; }
  .optimized-professional-details > summary em { margin-top: 1px; }
  .optimized-professional-mobile-hint { display: block; margin: 0; padding: 7px 10px; color: #60757c; background: #f1f7f8; font-size: 11px; line-height: 1.45; }
  .optimized-professional-scroll { width: 100%; max-width: 100%; overflow-x: auto; scrollbar-gutter: auto; scrollbar-width: thin; }
  .optimized-professional-table { width: 100%; table-layout: fixed; }
  .optimized-professional-plan-count-1 { min-width: 100%; }
  .optimized-professional-plan-count-2 { min-width: 500px; }
  .optimized-professional-plan-count-3 { min-width: 680px; }
  .optimized-professional-plan-count-4 { min-width: 860px; }
  .optimized-professional-plan-count-5 { min-width: 1040px; }
  .optimized-professional-plan-count-6 { min-width: 1220px; }
  .optimized-professional-plan-count-7 { min-width: 1400px; }
  .optimized-professional-plan-count-8 { min-width: 1580px; }
  .optimized-professional-plan-count-9 { min-width: 1760px; }
  .optimized-professional-plan-count-10 { min-width: 1940px; }
  .optimized-professional-table th,
  .optimized-professional-table td { padding: 8px 7px; font-size: 11px; line-height: 1.45; }
  .optimized-professional-table thead th:first-child,
  .optimized-professional-table tbody > tr:not(.optimized-professional-group) > th {
    position: static;
    left: auto;
    width: 112px;
    min-width: 112px;
    max-width: 112px;
    z-index: auto;
  }
  .optimized-professional-table thead th:first-child { text-align: center; }
  .optimized-professional-table tbody > tr:not(.optimized-professional-group) > th { text-align: center; font-size: 11px; }
  .optimized-professional-table .parameter-label { justify-content: center; gap: 4px; }
  .optimized-professional-group th { padding: 8px 9px; }
  .optimized-professional-group strong,
  .optimized-professional-group span { display: block; margin: 0; }
  .optimized-professional-note { padding: 9px 11px 11px; }
  .optimized-output-actions { position: sticky; top: 8px; width: 100%; display: grid; grid-template-columns: 1.2fr 1fr; }
  .optimized-output-actions #hotOptSave,
  .optimized-output-actions #coldOptSave { grid-column: 1 / -1; }
  .optimized-output-actions button { min-height: 40px; }
  .result-image-settings-modal { padding: 10px; align-items: stretch; }
  .result-image-settings-dialog { width: 100%; max-height: calc(100vh - 20px); border-radius: 18px; }
  .result-image-settings-head { padding: 18px 16px 14px; }
  .result-image-settings-head h3 { font-size: 21px; }
  .result-image-settings-body { padding: 14px; gap: 12px; }
  .result-image-settings-section { padding: 13px; border-radius: 14px; }
  .result-image-settings-grid { grid-template-columns: 1fr; }
  .result-image-settings-actions { display: grid; grid-template-columns: 1fr 1fr; padding: 12px 14px 14px; }
  .result-image-settings-actions [data-result-image-copy] { grid-column: 1 / -1; }
  .optimized-mobile-action {
    position: fixed;
    z-index: 45;
    display: block;
    left: 12px;
    right: 12px;
    bottom: max(10px, env(safe-area-inset-bottom));
    padding: 8px;
    border: 1px solid rgba(205,220,226,.92);
    border-radius: 12px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 15px 42px rgba(14,34,43,.24);
    backdrop-filter: blur(10px);
  }
  .optimized-mobile-action button { width: 100%; min-height: 46px; font-size: 15px; font-weight: 850; }
  .app-toast { bottom: 82px; border-radius: 10px; }
}

.lifecycle-cost-section { min-width: 0; overflow: visible; }
.lifecycle-cost-section.is-stale { border-color: #dfab76; box-shadow: inset 4px 0 0 #d97824; }
.lifecycle-energy-basis { margin: 10px 0 16px; padding: 11px 13px; border: 1px solid #d8e7e4; border-radius: 9px; background: #f3f9f8; color: #356762; font-size: 13px; line-height: 1.6; }
.optimized-economic-check-detail { display: block; margin-top: 5px; color: #72818a; font-size: 11px; font-weight: 650; line-height: 1.45; }
.status.warn { background: #fff8e8; color: #93620e; border-color: #ead39a; }
.status.bad { background: #fff0ee; color: #a33a32; border-color: #edc2bd; }
.optimized-derived-field input[readonly], .scheme-table input[readonly] { color: #245d59; background: #f1f8f7; border-color: #c9e1dd; font-weight: 800; cursor: default; }
.lifecycle-cost-section .result-card-head > div:first-child p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.lifecycle-controls { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 18px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: #f7fafb; }
.lifecycle-controls label { display: flex; align-items: center; gap: 8px; font-weight: 750; }
.lifecycle-controls input { width: 88px; }
.lifecycle-view-toggle { display: inline-flex; gap: 4px; padding: 4px; border-radius: 9px; background: #e8eef1; }
.lifecycle-view-toggle button { border: 0; background: transparent; }
.lifecycle-view-toggle button.is-active { color: #fff; background: #1f7a75; box-shadow: 0 4px 10px rgba(31,122,117,.2); }
.lifecycle-rule-wrap { display: grid; grid-template-columns: minmax(220px,.55fr) minmax(520px,1.45fr); gap: 18px; align-items: start; margin-bottom: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.lifecycle-rule-wrap h4, .lifecycle-chart-head h4, .lifecycle-subtitle { margin: 0 0 6px; }
.lifecycle-rule-wrap p, .lifecycle-chart-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.lifecycle-rule-wrap table { min-width: 560px; }
.lifecycle-rule-wrap input { min-width: 76px; width: 100%; }
.lifecycle-material-dot { display: inline-block; width: 10px; height: 10px; margin-right: 7px; border-radius: 50%; vertical-align: 1px; }
.lifecycle-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin: 18px 0 22px; }
.lifecycle-summary > div { min-width: 0; padding: 14px 15px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg,#fff,#f7fafb); }
.lifecycle-summary span, .lifecycle-summary em { display: block; color: var(--muted); font-style: normal; font-size: 12px; line-height: 1.45; }
.lifecycle-summary strong { display: block; margin: 5px 0 3px; overflow-wrap: anywhere; font-size: 19px; }
.lifecycle-summary em { color: #1f7a75; font-weight: 700; }
.lifecycle-chart-head { display: flex; justify-content: space-between; gap: 12px; margin: 4px 0 8px; }
.lifecycle-chart-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.lifecycle-cost-chart { display: block; width: 100%; height: auto; user-select: none; -webkit-user-select: none; }
.lifecycle-grid line { stroke: #e6edf2; stroke-width: 1; }
.lifecycle-grid text, .lifecycle-axis-label { fill: #687783; font-size: 12px; }
.lifecycle-axis { stroke: #9eacb6; stroke-width: 1; }
.lifecycle-axis-title { fill: #52616e; font-size: 13px; font-weight: 650; }
.lifecycle-chart-interaction-plane { fill: transparent; cursor: crosshair; }
.lifecycle-series-path, .lifecycle-replacement-marker, .lifecycle-chart-legend,
.lifecycle-grid, .lifecycle-axis, .lifecycle-axis-label, .lifecycle-axis-title { pointer-events: none; }
.lifecycle-year-node { cursor: pointer; outline: none; }
.lifecycle-year-hit { fill: transparent; }
.lifecycle-year-point { stroke: #fff; stroke-width: 1.5; transition: r .12s ease, stroke-width .12s ease; }
.lifecycle-year-node:hover .lifecycle-year-point,
.lifecycle-year-node:focus-visible .lifecycle-year-point { r: 5px; stroke-width: 2.5; }
.lifecycle-year-node.is-selected .lifecycle-year-point { r: 6px; stroke-width: 2.5; filter: drop-shadow(0 2px 3px rgba(31,41,51,.28)); }
.lifecycle-year-cursor { outline: none; }
.lifecycle-cursor-line { stroke: #d97824; stroke-width: 2; stroke-dasharray: 6 4; pointer-events: none; filter: drop-shadow(0 0 3px rgba(217,120,36,.32)); }
.lifecycle-cursor-hit { fill: transparent; cursor: ew-resize; touch-action: none; }
.lifecycle-cursor-label { pointer-events: none; }
.lifecycle-cursor-label rect { fill: #d97824; stroke: #fff; stroke-width: 1.5; }
.lifecycle-cursor-label text { fill: #fff; font-size: 12px; font-weight: 800; }
.lifecycle-year-cursor:focus-visible .lifecycle-cursor-line { stroke-width: 3; }
.lifecycle-cursor-tooltip {
  position: fixed;
  z-index: 1300;
  box-sizing: border-box;
  width: min(330px, calc(100vw - 24px));
  max-height: min(60vh, 520px);
  overflow: auto;
  padding: 13px 14px 12px;
  border: 1px solid #c8d8df;
  border-radius: 11px;
  color: #edf7f6;
  background: rgba(31,53,61,.97);
  box-shadow: 0 12px 30px rgba(22,36,44,.24);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease;
}
.lifecycle-cursor-tooltip[hidden] { display: none; }
.lifecycle-cursor-tooltip.is-visible { opacity: 1; transform: translateY(0); }
.lifecycle-cursor-tooltip-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 9px; border-bottom: 1px solid rgba(255,255,255,.16); }
.lifecycle-cursor-tooltip-head strong { color: #fff; font-size: 18px; }
.lifecycle-cursor-tooltip-head span { color: #a9d8d4; font-size: 12px; font-weight: 700; }
.lifecycle-cursor-tooltip-list { display: grid; gap: 7px; padding: 10px 0; }
.lifecycle-cursor-tooltip-list > div { display: grid; grid-template-columns: 10px minmax(0,1fr) auto; gap: 8px; align-items: center; }
.lifecycle-cursor-tooltip-list i { width: 9px; height: 9px; border-radius: 50%; }
.lifecycle-cursor-tooltip-list b { min-width: 0; overflow-wrap: anywhere; font-size: 13px; }
.lifecycle-cursor-tooltip-list em { color: #fff; font-size: 13px; font-style: normal; font-weight: 800; text-align: right; white-space: nowrap; }
.lifecycle-cursor-tooltip small { display: block; color: #c6d4d8; font-size: 11px; line-height: 1.55; }
.lifecycle-empty { padding: 34px; color: #9a4f21; text-align: center; border: 1px dashed #dfb78e; border-radius: 10px; background: #fff8f1; }
.lifecycle-energy-note { color: #9a4f21; }
.lifecycle-subtitle { margin-top: 24px; }
.lifecycle-timeline { display: grid; gap: 10px; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-gutter: stable; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: #f8fafb; }
.lifecycle-timeline-row { display: grid; grid-template-columns: 150px minmax(360px,1fr); gap: 10px 18px; align-items: center; }
.lifecycle-timeline-row > strong { min-width: 0; overflow-wrap: anywhere; }
.lifecycle-timeline-row > strong i { display: inline-block; width: 9px; height: 9px; margin-right: 7px; border-radius: 50%; }
.lifecycle-timeline-track { position: relative; height: 32px; margin: 0 18px; }
.lifecycle-timeline-track::before { content: ""; position: absolute; top: 15px; left: 0; right: 0; height: 3px; border-radius: 3px; background: #ccd7dd; }
.lifecycle-event { position: absolute; top: 9px; width: 14px; height: 14px; margin-left: -7px; border: 3px solid #1f7a75; border-radius: 50%; background: #1f7a75; }
.lifecycle-event b { position: absolute; top: 16px; left: 50%; color: #52616e; font-size: 11px; white-space: nowrap; transform: translateX(-50%); }
.lifecycle-event.is-next { border-color: #d97824; background: #fff; }
.lifecycle-timeline-row small { grid-column: 2; color: var(--muted); line-height: 1.5; }
.lifecycle-comparison { min-width: 1240px; }
.lifecycle-comparison td { vertical-align: middle; }
.lifecycle-conclusion { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; margin-top: 18px; padding: 15px 16px; border: 1px solid #bddbd6; border-radius: 10px; background: #eaf5f3; }
.lifecycle-conclusion strong { color: #1f7a75; white-space: nowrap; }
.lifecycle-conclusion p { margin: 0; line-height: 1.7; }

@media (max-width: 980px) {
  .lifecycle-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lifecycle-rule-wrap { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .lifecycle-cost-section .result-card-head { align-items: stretch; }
  .lifecycle-cost-section .result-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .lifecycle-controls { align-items: stretch; flex-direction: column; }
  .lifecycle-view-toggle { display: grid; grid-template-columns: 1fr; }
  .lifecycle-summary { grid-template-columns: 1fr; }
  .lifecycle-rule-wrap { padding: 12px; }
  .lifecycle-timeline { overflow-x: auto; }
  .lifecycle-timeline-row { min-width: 680px; }
  .lifecycle-conclusion { grid-template-columns: 1fr; gap: 6px; }
}

/*
 * Zoom-aware module layout
 *
 * Viewport media queries cannot see the space consumed by the desktop sidebar.
 * These container queries react to the workspace's real inline size, so browser
 * zoom and a narrow Electron window reflow the calculation UI before content is
 * clipped. Wide data tables remain locally scrollable instead of widening the
 * entire page.
 */
@container workspace (max-width: 980px) {
  .col-3, .col-4, .col-6, .col-8 { grid-column: span 12; }
  .grid > .field { grid-column: span 12; }
  .kpis { grid-template-columns: 1fr; }
  .topbar { align-items: flex-start; flex-direction: column; }
  .result-card-head { flex-direction: column; }
  .scheme-history-head { grid-template-columns: 36px minmax(0, 1fr); }
  .scheme-history-head > button { width: 100%; white-space: normal; }
  .scheme-history-head > button.primary { grid-column: 1 / -1; }
  .scheme-history-meta { margin-left: 0; }
  .scheme-history-title-row { align-items: flex-start; flex-direction: column; gap: 4px; }
  .scheme-history-title-row > span { text-align: left; }
  .history-pagination { grid-template-columns: 1fr; }
  .history-pagination-options, .history-pagination-nav { justify-content: flex-start; }
  .zhu-visual-grid, .comparison-grid, .stats-grid, .reference-grid { grid-template-columns: 1fr; }
  .content { padding: 14px; gap: 12px; }
  .card { padding: 13px; }
  .scheme-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .scheme-actions button { min-height: 42px; }
  .scheme-config-table, .scheme-result-table { display: none; }
  .scheme-config-mobile { display: grid; gap: 12px; }
  .scheme-result-cards { display: grid; }
  .mobile-form-grid, .mobile-result-grid { grid-template-columns: 1fr; }
  .scheme-plan-config-head, .scheme-layer-card-head, .scheme-result-card-head { align-items: flex-start; }
  .scheme-layer-card-head { flex-direction: column; }
  .advanced-plan-table-head { display: none; }
  .advanced-plan-table { border: 0; background: transparent; overflow: visible; scrollbar-gutter: auto; }
  .advanced-plan-list { display: grid; gap: 10px; }
  .advanced-plan-card { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
  .advanced-plan-line,
  .advanced-plan-line.optimized-cold-line,
  .advanced-plan-line.optimized-hot-line,
  .advanced-plan-line.optimized-hot-economic-line,
  .advanced-plan-line.optimized-cold-storage-line { grid-template-columns: 1fr; gap: 9px; padding: 10px; }
  .advanced-plan-cell:empty { display: none; }
  .advanced-plan-cell { justify-content: space-between; }
  .optimized-table-field { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 8px; }
  .optimized-table-field > span { display: block; }
  .advanced-row-actions { justify-content: stretch; }
  .advanced-row-actions button { flex: 1 1 auto; }
  .zhu-opt-scenario > summary { align-items: center; flex-direction: row; }
  .zhu-opt-workbench { grid-template-columns: 1fr; }
  .zhu-opt-action-rail { position: static; }
  .zhu-opt-plan-head { align-items: flex-start; flex-direction: column; }
  .zhu-opt-plan-head .toolbar { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
  .zhu-opt-layer-row { grid-template-columns: 28px 1fr; align-items: center; }
  .zhu-opt-layer-row > select,
  .zhu-opt-layer-row > label,
  .zhu-opt-layer-row > button { grid-column: 1 / -1; }
  .zhu-opt-layer-row > label { grid-template-columns: 70px minmax(0, 1fr); align-items: center; }
  .zhu-opt-layer-row > span:not(.zhu-opt-layer-index) { grid-column: 2; }
  .zhu-opt-result-table table { min-width: 1050px !important; }
  .optimized-structure-grid { grid-template-columns: 1fr; }
  .pipe-structure-card-head { align-items: stretch; flex-direction: column; }
  .pipe-structure-card-head > span { align-self: flex-start; }
  .pipe-structure-layout { grid-template-columns: 1fr; max-width: 420px; }
  .pipe-structure-copy { width: 100%; }
  .cold-storage-other-head { align-items: stretch; flex-direction: column; }
  .cold-storage-other-layer { grid-template-columns: 1fr; }
  .compact-kpis { grid-template-columns: 1fr; }
  .app-dialog-modal { padding: 14px; }
  .app-dialog-shell { grid-template-columns: 38px minmax(0, 1fr); gap: 11px; padding: 18px; border-radius: 11px; }
  .app-dialog-icon { width: 36px; height: 36px; border-radius: 10px; font-size: 18px; }
  .app-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .app-dialog-actions button:only-child { grid-column: 1 / -1; }
  .lifecycle-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lifecycle-rule-wrap { grid-template-columns: 1fr; min-width: 0; }
}

@container workspace (max-width: 760px) {
  #content[data-module-key="zhuHotOptimized"],
  #content[data-module-key="zhuColdOptimized"] { padding-bottom: 82px; }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-workbench,
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-workbench {
    grid-template-columns: minmax(0, 1fr);
  }
  #content[data-module-key="zhuHotOptimized"] .zhu-opt-action-rail,
  #content[data-module-key="zhuColdOptimized"] .zhu-opt-action-rail {
    position: static;
  }
  body:not(.hh-mobile-active) #content[data-module-key="zhuColdOptimized"] .optimized-cold-basic-grid > .field,
  body:not(.hh-mobile-active) #content[data-module-key="zhuColdOptimized"] .optimized-cold-detail-grid > .field {
    grid-column: span 6;
  }
  .optimized-flow-strip { justify-content: flex-start; gap: 7px; min-height: 38px; padding: 7px 10px; overflow-x: auto; white-space: nowrap; font-size: 12px; }
  .zhu-opt-scenario > summary { padding: 11px 12px; }
  .zhu-opt-scenario > summary span { text-align: right; }
  .zhu-opt-scenario > .grid { padding: 10px 11px 12px; }
  .zhu-opt-action-rail { gap: 9px; padding: 12px; }
  .optimized-status-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .optimized-status-strip .kpi { min-width: 0; padding: 9px 7px; }
  .optimized-status-strip .kpi span { font-size: 10px; }
  .optimized-status-strip .kpi strong { font-size: 15px; }
  .optimized-result-cards { display: grid; gap: 10px; margin-top: 12px; }
  .optimized-full-details:not([open]) .zhu-opt-result-table { display: none; }
  .optimized-full-details[open] .zhu-opt-result-table { overflow-x: auto; }
  .optimized-professional-details > summary { align-items: flex-start; padding: 11px 12px; }
  .optimized-professional-details > summary em { margin-top: 1px; }
  .optimized-professional-mobile-hint { display: block; margin: 0; padding: 7px 10px; color: #60757c; background: #f1f7f8; font-size: 11px; line-height: 1.45; }
  .optimized-professional-scroll { width: 100%; max-width: 100%; overflow-x: auto; scrollbar-gutter: auto; scrollbar-width: thin; }
  .optimized-professional-table { width: 100%; table-layout: fixed; }
  .optimized-professional-plan-count-1 { min-width: 100%; }
  .optimized-professional-plan-count-2 { min-width: 500px; }
  .optimized-professional-plan-count-3 { min-width: 680px; }
  .optimized-professional-plan-count-4 { min-width: 860px; }
  .optimized-professional-plan-count-5 { min-width: 1040px; }
  .optimized-professional-plan-count-6 { min-width: 1220px; }
  .optimized-professional-plan-count-7 { min-width: 1400px; }
  .optimized-professional-plan-count-8 { min-width: 1580px; }
  .optimized-professional-plan-count-9 { min-width: 1760px; }
  .optimized-professional-plan-count-10 { min-width: 1940px; }
  .optimized-professional-table th,
  .optimized-professional-table td { padding: 8px 7px; font-size: 11px; line-height: 1.45; }
  .optimized-professional-table thead th:first-child,
  .optimized-professional-table tbody > tr:not(.optimized-professional-group) > th {
    position: static;
    left: auto;
    width: 112px;
    min-width: 112px;
    max-width: 112px;
    z-index: auto;
  }
  .optimized-professional-table thead th:first-child { text-align: center; }
  .optimized-professional-table tbody > tr:not(.optimized-professional-group) > th { text-align: center; font-size: 11px; }
  .optimized-professional-table .parameter-label { justify-content: center; gap: 4px; }
  .optimized-professional-group th { padding: 8px 9px; }
  .optimized-professional-group strong,
  .optimized-professional-group span { display: block; margin: 0; }
  .optimized-professional-note { padding: 9px 11px 11px; }
  .optimized-output-actions { position: sticky; top: 8px; width: 100%; display: grid; grid-template-columns: 1.2fr 1fr; }
  .optimized-output-actions #hotOptSave,
  .optimized-output-actions #coldOptSave { grid-column: 1 / -1; }
  .optimized-output-actions button { min-height: 40px; }
  .optimized-mobile-action {
    position: fixed;
    z-index: 45;
    display: block;
    left: 12px;
    right: 12px;
    bottom: max(10px, env(safe-area-inset-bottom));
    padding: 8px;
    border: 1px solid rgba(205,220,226,.92);
    border-radius: 12px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 15px 42px rgba(14,34,43,.24);
    backdrop-filter: blur(10px);
  }
  .optimized-mobile-action button { width: 100%; min-height: 46px; font-size: 15px; font-weight: 850; }
  .app-toast { bottom: 82px; border-radius: 10px; }
  .lifecycle-cost-section .result-card-head { align-items: stretch; }
  .lifecycle-cost-section .result-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .lifecycle-controls { align-items: stretch; flex-direction: column; }
  .lifecycle-view-toggle { display: grid; grid-template-columns: 1fr; }
  .lifecycle-summary { grid-template-columns: 1fr; }
  .lifecycle-rule-wrap { padding: 12px; }
  .lifecycle-timeline-row { min-width: 680px; }
  .lifecycle-conclusion { grid-template-columns: 1fr; gap: 6px; }
}

@media (min-width: 981px) {
  .optimized-mobile-action { display: none !important; }
}

.advanced-plan-table::-webkit-scrollbar,
.lifecycle-chart-scroll::-webkit-scrollbar,
.lifecycle-timeline::-webkit-scrollbar { height: 10px; }
.advanced-plan-table::-webkit-scrollbar-thumb,
.lifecycle-chart-scroll::-webkit-scrollbar-thumb,
.lifecycle-timeline::-webkit-scrollbar-thumb { background: #bcc9d3; border: 2px solid #eef3f6; border-radius: 999px; }
.advanced-plan-table::-webkit-scrollbar-track,
.lifecycle-chart-scroll::-webkit-scrollbar-track,
.lifecycle-timeline::-webkit-scrollbar-track { background: #eef3f6; border-radius: 999px; }
/* 正式版完整五模块：浏览器只负责交互、图表与结果展示。 */
.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.section-head h3 { margin: 0; }
.section-head > div { display: flex; gap: 10px; }
.scheme-table td:first-child { min-width: 235px; }
.scheme-table td:first-child small { display: block; margin-top: 4px; color: #6b7888; }
.scheme-table td:nth-child(2) { width: 96px; min-width: 96px; }
.scheme-table td:nth-child(3) { min-width: 230px; }
.scheme-table .actions { min-width: 260px; white-space: nowrap; }
.scheme-table .actions button { margin: 3px; }
.empty-state {
  padding: 34px 20px;
  border: 1px dashed #cad6df;
  border-radius: 12px;
  color: #687788;
  text-align: center;
  background: #f8fafc;
}
.warning {
  padding: 12px 15px;
  margin-bottom: 14px;
  border: 1px solid #efc46b;
  border-radius: 10px;
  background: #fff8e7;
  color: #7c5600;
}
.standard-card { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 16px 0 4px; padding: 14px 16px; border: 1px solid #d3e3e3; border-radius: 12px; background: #f4faf9; color: #425668; }
.standard-card strong { color: #146e68; }
.standard-card small { width: 100%; color: #7a5a10; }
.status {
  display: inline-flex;
  padding: 4px 9px;
  border-radius: 999px;
  background: #e6f5f1;
  color: #09665f;
  font-weight: 700;
}
.plan-swatch { display: inline-block; width: .68rem; height: .68rem; margin-right: .45rem; border-radius: 50%; background: #16857d; vertical-align: .03rem; }
.plan-color-0 { background: #16857d; }.plan-color-1 { background: #d28a34; }.plan-color-2 { background: #596fc5; }
.plan-color-3 { background: #b45b78; }.plan-color-4 { background: #5c8f43; }.plan-color-5 { background: #8a63ad; }
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.kpi {
  padding: 18px;
  border: 1px solid #d8e2ea;
  border-radius: 12px;
  background: #fff;
}
.kpi span { display: block; color: #708092; font-size: 13px; margin-bottom: 7px; }
.kpi strong { color: #172536; font-size: 20px; }
.kpi small { display: block; margin-top: 8px; color: #718091; line-height: 1.45; }
.visual-section { margin-top: 18px; }
.visual-grid { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 14px; margin-top: 16px; }
.visual-card, .curve-card { border: 1px solid #d9e3ea; border-radius: 12px; padding: 14px; background: #fbfcfd; }
.visual-card h4, .curve-card h4 { margin: 0 0 8px; }
.visual-card svg { display: block; width: 100%; max-height: 210px; }
.visual-card p { margin: 8px 0 0; color: #607080; font-size: 13px; line-height: 1.5; }
.curve-card { margin-top: 14px; overflow-x: auto; }
.curve-card svg { display: block; width: 100%; min-width: 580px; max-height: 360px; }
.toast {
  position: fixed;
  z-index: 9999;
  right: 24px;
  bottom: 24px;
  padding: 13px 18px;
  border-radius: 10px;
  color: white;
  background: #136f68;
  box-shadow: 0 12px 30px rgba(20, 39, 55, .2);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: .2s ease;
}
.toast.error { background: #b33b3b; }
.toast.show { opacity: 1; transform: translateY(0); }
.topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.build-label { color: #748394; font-size: 12px; white-space: nowrap; }
.account-identity { max-width: 110px; overflow: hidden; color: #6f4b38; font-size: 12px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.ghost-button { background: #fff; color: #425365; border: 1px solid #ccd8e1; }
.http-warning { margin: 14px 0; padding: 11px 13px; border: 1px solid #e5b75d; border-radius: 10px; background: #fff7df; color: #7a5200; font-size: 13px; line-height: 1.55; }
.hidden { display: none !important; }
.status.bad { background: #fdeaea; color: #a33232; }
.status.warn { background: #fff3d7; color: #8a5b00; }
.field-note { margin-top: 5px; color: #738292; font-size: 12px; line-height: 1.45; }
.field.is-required label::after { content: " 必填"; color: #b43c3c; font-size: 11px; }
.module-flow { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 18px; color: #657588; font-size: 13px; }
.module-flow span { display: inline-flex; align-items: center; gap: 8px; }
.module-flow span:not(:last-child)::after { content: "→"; color: #9aa9b7; }
.result-actions-sticky { position: sticky; bottom: 12px; z-index: 8; padding: 10px; border: 1px solid rgba(205,220,226,.92); border-radius: 12px; background: rgba(255,255,255,.94); box-shadow: 0 10px 34px rgba(14,34,43,.15); backdrop-filter: blur(10px); }
.storage-layer-table input, .storage-layer-table select { min-width: 110px; }
.report-dialog .toolbar { justify-content: flex-end; }
@media (max-width: 900px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-head { align-items: flex-start; flex-direction: column; }
  .scheme-table { min-width: 1080px; }
  .visual-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 560px) {
  .kpi-grid { grid-template-columns: 1fr; }
  .toast { left: 16px; right: 16px; bottom: 16px; text-align: center; }
  .visual-grid { grid-template-columns: 1fr; }
  .topbar-actions { flex-wrap: wrap; }
  .scheme-table { min-width: 0; border: 0; }
  .scheme-table thead { display: none; }
  .scheme-table, .scheme-table tbody, .scheme-table tr, .scheme-table td { display: block; width: 100%; }
  .scheme-table tr { margin-bottom: 12px; padding: 12px; border: 1px solid #d7e2e9; border-radius: 12px; background: #fff; }
  .scheme-table td { min-width: 0 !important; padding: 7px 0; border: 0; }
  .scheme-table td:first-child { padding-bottom: 10px; border-bottom: 1px solid #e6edf2; }
  .scheme-table td:nth-child(2)::before { content: "层名称"; }
  .scheme-table td:nth-child(3)::before { content: "材料（内→外）"; }
  .scheme-table td:nth-child(4)::before { content: "厚度(mm)"; }
  .scheme-table td:nth-child(5)::before { content: "价格"; }
  .scheme-table td:nth-child(6)::before { content: "上浮量 / K"; }
  .scheme-table td:nth-child(n+2)::before { display: block; margin-bottom: 5px; color: #6d7c8b; font-size: 12px; font-weight: 700; }
  .scheme-table .actions { white-space: normal; }
  .scheme-table .actions button { width: auto; min-height: 40px; }
}
@container workspace (min-width: 641px) and (max-width: 980px) {
  .grid > .field { grid-column: span 6; }
  .topbar { align-items: center; flex-direction: row; }
}
@container workspace (max-width: 640px) {
  .grid > .field { grid-column: span 12; }
}

/*
 * Thermal visual language
 *
 * Theme colors describe the physical scene only. Success, warning, error and
 * stale-result colors remain semantic and are intentionally not remapped.
 */
@media (min-width: 761px) {
  #content[data-thermal-theme="hot"] {
    --thermal-primary: #C64B2F;
    --thermal-deep: #9F3424;
    --thermal-soft: #FFF0EB;
    --thermal-tint: #FFF8F5;
    --thermal-line: #E9C1B5;
    --thermal-shadow: rgba(159, 52, 36, .15);
  }

  #content[data-thermal-theme="cold"] {
    --thermal-primary: #2477A8;
    --thermal-deep: #1F628C;
    --thermal-soft: #EAF6FD;
    --thermal-tint: #F5FBFF;
    --thermal-line: #B9D9EC;
    --thermal-shadow: rgba(31, 98, 140, .15);
  }

  .workspace:has(#content[data-thermal-theme="hot"]) {
    --thermal-primary: #C64B2F;
    --thermal-deep: #9F3424;
    --thermal-soft: #FFF0EB;
    --thermal-tint: #FFF8F5;
    --thermal-line: #E9C1B5;
    --thermal-shadow: rgba(159, 52, 36, .15);
    background: linear-gradient(180deg, #fffaf8 0, var(--bg) 320px);
  }

  .workspace:has(#content[data-thermal-theme="cold"]) {
    --thermal-primary: #2477A8;
    --thermal-deep: #1F628C;
    --thermal-soft: #EAF6FD;
    --thermal-tint: #F5FBFF;
    --thermal-line: #B9D9EC;
    --thermal-shadow: rgba(31, 98, 140, .15);
    background: linear-gradient(180deg, #f7fcff 0, var(--bg) 320px);
  }

  .workspace:has(#content[data-thermal-theme]) .topbar {
    border-bottom-color: var(--thermal-line, var(--line));
  }

  .workspace:has(#content[data-thermal-theme]) .topbar h2 {
    display: inline-flex;
    align-items: center;
    gap: 9px;
  }

  .workspace:has(#content[data-thermal-theme]) .topbar h2::after {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--thermal-line);
    border-radius: 10px;
    color: var(--thermal-deep);
    background: var(--thermal-soft);
    font-size: 17px;
    line-height: 1;
  }

  .workspace:has(#content[data-thermal-theme="hot"]) .topbar h2::after { content: "🔥"; }
  .workspace:has(#content[data-thermal-theme="cold"]) .topbar h2::after { content: "❄"; }

  #content[data-thermal-theme] .card > h3:first-child::before,
  #content[data-thermal-theme] .result-card-head h3::before {
    background: var(--thermal-primary);
  }

  #content[data-thermal-theme] .section-label,
  #content[data-thermal-theme] .zhu-opt-scenario > summary span,
  #content[data-thermal-theme] .zhu-opt-standard strong {
    color: var(--thermal-deep);
  }
}

/* ================= 全局设置面板与冻结工具条 ================= */

.global-settings-panel {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: end;
}

.global-settings-panel.hidden { display: none; }

.global-settings-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 25, 33, .42);
  backdrop-filter: blur(3px);
}

.global-settings-sheet {
  position: relative;
  width: min(580px, 100vw);
  max-height: 92vh;
  margin: 0;
  background: #fff;
  border-radius: 18px 18px 0 0;
  box-shadow: 0 -10px 60px rgba(14, 31, 43, .22);
  display: flex;
  flex-direction: column;
  animation: settingsSlideUp .2s ease-out;
}

@keyframes settingsSlideUp {
  from { transform: translateY(40px); opacity: .6; }
  to { transform: translateY(0); opacity: 1; }
}

.global-settings-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 22px;
  border-bottom: 1px solid #e3ebf1;
}

.global-settings-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #1f2933;
}

.global-settings-content {
  overflow: auto;
  padding: 18px 22px 28px;
}

.settings-section {
  margin-bottom: 22px;
}

.settings-section h3 {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 600;
  color: #1f7a75;
}

.settings-field {
  margin-bottom: 16px;
}

.settings-field > label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #52616e;
}

.settings-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.settings-radio-group label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: #f4f7fa;
  border: 1px solid #dbe3ea;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
}
.settings-radio-group label.is-disabled {
  opacity: .48;
  cursor: not-allowed;
  background: #eef2f5;
}

.settings-radio-group input[type="radio"] {
  margin: 0;
}

.settings-switches {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}

.settings-switch-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: #f7f9fb;
  border: 1px solid #e6edf2;
  border-radius: 10px;
  font-size: 14px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}

.settings-switch-row:hover { border-color: #c4d3dd; background: #f3f7f9; }

.settings-switch-row input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  border: 1.5px solid #b9c6d1;
  border-radius: 5px;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.settings-switch-row input[type="checkbox"]:checked {
  background: #1f7a75;
  border-color: #1f7a75;
  box-shadow: 0 1px 4px rgba(31, 122, 117, .35);
}

.settings-switch-row input[type="checkbox"]:checked::after {
  content: "";
  width: 9px;
  height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}

.settings-switch-label { line-height: 1.4; }

/* 导出图片字段：模块 × 工况 标签页 */
.settings-export-tabs,
.settings-geo-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

/* hidden 必须显式覆盖 display:flex，否则模块切换时隐藏失效（tab 平铺） */
.settings-geo-tabs[hidden],
.settings-export-panel[hidden] { display: none; }

.settings-tab {
  padding: 7px 20px;
  border: 1px solid #dbe3ea;
  border-radius: 999px;
  background: #f4f7fa;
  color: #52616e;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
}

.settings-tab:hover { border-color: #b9c6d1; color: #1f2933; }

.settings-tab.active {
  background: linear-gradient(180deg, #23857f, #1f7a75);
  border-color: #1f7a75;
  color: #fff;
  box-shadow: 0 3px 10px rgba(31, 122, 117, .25);
}

.settings-geo-tabs .settings-tab {
  padding: 5px 15px;
  font-size: 13px;
}

.settings-geo-tabs .settings-tab.active {
  background: #e7f4f2;
  border-color: #9bc7c3;
  color: #1f7a75;
  box-shadow: none;
}

.settings-hint {
  margin: -2px 0 12px;
  font-size: 13px;
  line-height: 1.5;
  color: #8a97a3;
}

.settings-export-panel { margin-top: 4px; }

.settings-thickness-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.settings-thickness-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: #f7f9fb;
  border: 1px solid #e6edf2;
  border-radius: 8px;
  font-size: 13px;
}

.settings-thickness-row span:first-child {
  flex: 1 1 auto;
  min-width: 0;
}

.settings-thickness-row input[type="number"] {
  width: 64px;
  padding: 5px 8px;
  border: 1px solid #ccd8e1;
  border-radius: 6px;
  text-align: right;
}

.settings-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 8px;
  border-top: 1px solid #e6edf2;
}

.settings-actions button {
  padding: 9px 16px;
  border-radius: 8px;
  font-size: 13px;
}

.topbar-actions .ghost-button {
  padding: 7px 13px;
  border-radius: 8px;
  font-size: 13px;
}

@media (min-width: 900px) {
  .global-settings-sheet {
    border-radius: 18px;
    max-height: 86vh;
    margin: 24px;
  }
}

@media (min-width: 761px) {
  #content[data-thermal-theme] button.primary,
  #content[data-thermal-theme] .zhu-opt-primary {
    border-color: var(--thermal-deep);
    color: #fff;
    background: linear-gradient(180deg, var(--thermal-primary), var(--thermal-deep));
    box-shadow: 0 7px 18px var(--thermal-shadow);
  }

  #content[data-thermal-theme] button.primary:hover,
  #content[data-thermal-theme] .zhu-opt-primary:hover {
    border-color: var(--thermal-deep);
    box-shadow: 0 9px 22px var(--thermal-shadow);
  }

  #content[data-thermal-theme] input:focus,
  #content[data-thermal-theme] textarea:focus,
  #content[data-thermal-theme] select:focus {
    border-color: var(--thermal-primary);
    box-shadow: 0 0 0 3px var(--thermal-shadow);
  }

  #content[data-thermal-theme] .zhu-opt-scenario {
    border-color: var(--thermal-line);
  }

  #content[data-thermal-theme] .zhu-opt-scenario > summary {
    color: var(--thermal-deep);
    background: linear-gradient(180deg, #fff, var(--thermal-tint));
  }

  #content[data-thermal-theme] .zhu-opt-scenario[open] > summary {
    border-bottom-color: var(--thermal-line);
  }

  #content[data-thermal-theme] .optimized-scenario-tab {
    border-color: var(--thermal-line);
    color: var(--thermal-deep);
    background: #fff;
  }

  #content[data-thermal-theme] .optimized-scenario-tab:hover {
    border-color: var(--thermal-primary);
    color: var(--thermal-deep);
    background: var(--thermal-tint);
  }

  #content[data-thermal-theme] .optimized-scenario-tab.is-active {
    border-color: var(--thermal-deep);
    color: #fff;
    background: linear-gradient(135deg, var(--thermal-primary), var(--thermal-deep));
    box-shadow: 0 7px 18px var(--thermal-shadow);
  }

  #content[data-thermal-theme] .optimized-scenario-icon {
    color: var(--thermal-deep);
    background: var(--thermal-soft);
  }

  #content[data-thermal-theme] .optimized-scenario-tab.is-active .optimized-scenario-icon {
    color: #fff;
    background: rgba(255, 255, 255, .18);
  }

  #content[data-thermal-theme] .optimized-parameter-group-title {
    border-color: var(--thermal-line);
    color: var(--thermal-deep);
    background: linear-gradient(90deg, var(--thermal-soft), var(--thermal-tint));
  }

  #content[data-thermal-theme] .optimized-parameter-group-title--specialty {
    border-color: var(--line);
    color: #29464c;
    background: linear-gradient(90deg, #f3f6f8, #fbfcfd);
  }

  #content[data-thermal-theme] .zhu-opt-action-rail {
    border-color: var(--thermal-line);
    background: linear-gradient(180deg, var(--thermal-tint), var(--thermal-soft));
    box-shadow: 0 10px 26px var(--thermal-shadow);
  }

  #content[data-thermal-theme] .zhu-opt-target-field {
    border-color: var(--thermal-line);
    background: var(--thermal-tint) !important;
  }

  #content[data-thermal-theme] .standard-card {
    border-color: var(--thermal-line);
    background: var(--thermal-tint);
  }

  #content[data-thermal-theme] .standard-card strong {
    color: var(--thermal-deep);
  }

  #content[data-thermal-theme] .zhu-opt-plan,
  #content[data-thermal-theme] .optimized-result-card {
    border-color: color-mix(in srgb, var(--thermal-line) 72%, var(--line));
  }

  #content[data-thermal-theme] .zhu-opt-plan-head {
    background: linear-gradient(90deg, #fff, var(--thermal-tint));
  }

  #content[data-thermal-theme] .zhu-opt-layer-index {
    border-color: var(--thermal-line);
    color: var(--thermal-deep) !important;
    background: var(--thermal-soft);
  }
}
.segmented-results-card {
  margin-top: 12px;
  padding: 0;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--thermal-line, var(--accent)) 58%, var(--line));
  background: var(--panel, #fff);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--thermal-shadow, rgba(0,0,0,.08)) 70%, transparent);
}
.segmented-results-card > .segmented-results-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 68px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
  background: linear-gradient(90deg, var(--thermal-tint, #fff7f2), #fff);
  transition: background .18s ease, box-shadow .18s ease;
}
.segmented-results-card > .segmented-results-summary::-webkit-details-marker { display: none; }
.segmented-results-card > .segmented-results-summary::marker { content: ""; }
.segmented-results-summary:hover,
.segmented-results-summary:focus-visible {
  background: linear-gradient(90deg, var(--thermal-soft, #fff0e9), #fff);
  outline: none;
}
.segmented-results-heading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}
.segmented-results-heading > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.segmented-results-heading strong { color: var(--thermal-deep, #7d311f); font-size: 15px; }
.segmented-results-heading small { color: var(--muted); font-weight: 400; line-height: 1.4; }
.segmented-results-heading .segmented-results-status {
  color: var(--thermal-deep, var(--accent));
  font-size: 11px;
  font-weight: 750;
}
.segmented-results-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: #fff;
  background: var(--thermal-main, var(--accent));
  box-shadow: 0 5px 12px var(--thermal-shadow, rgba(0,0,0,.12));
  font-size: 20px;
  font-style: normal;
  font-weight: 900;
}
.segmented-results-summary em {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 6px 11px;
  border: 1px solid var(--thermal-line, var(--line));
  border-radius: 999px;
  color: var(--thermal-deep, var(--accent));
  background: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}
.segmented-results-summary em::after {
  content: "▼";
  display: inline-block;
  font-size: 10px;
  transition: transform .18s ease;
}
.segmented-results-card[open] > .segmented-results-summary {
  border-bottom: 1px solid var(--thermal-line, var(--line));
  background: linear-gradient(90deg, var(--thermal-soft, #fff0e9), #fff);
}
.segmented-results-card[open] > .segmented-results-summary em::after { transform: rotate(180deg); }
.segmented-lazy-host { padding: 14px 16px 16px; }
.segmented-lazy-host > .note:only-child { margin: 0; }
.segmented-plan-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0;
}
.segmented-plan-tabs button {
  min-width: 0;
  min-height: 42px;
  padding: 8px 10px;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
}
.segmented-plan-tabs button[aria-selected="true"] { background: var(--accent, #b94f2d); color: #fff; border-color: transparent; }
.segmented-plan-panels > [data-segmented-panel] { min-width: 0; }
.segmented-scenario-grid, .segmented-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 12px 0; }
.segmented-scenario-grid article, .segmented-chart-grid figure { margin: 0; padding: 12px; border: 1px solid var(--line, #d8d2c9); border-radius: 12px; background: var(--panel, #fff); }
.segmented-chart-grid svg { display: block; width: 100%; height: auto; min-height: 150px; background: linear-gradient(180deg, rgba(208,91,47,.05), rgba(45,122,160,.04)); border-radius: 8px; }
.segmented-chart-grid figcaption { font-weight: 700; margin-bottom: 8px; }
.segmented-summary .kpi small { display: block; margin-top: 6px; font-weight: 400; }
.segmented-node-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.segmented-node-details > summary em {
  color: var(--accent);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}
.segmented-node-lazy-host { min-width: 0; padding-top: 10px; }
.segmented-node-lazy-host > .note:only-child { margin: 0; }
.segmented-table-scroll-hint {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
}
.segmented-node-table-scroll {
  position: relative;
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}
.segmented-node-table-scroll table { min-width: 980px; }
.segmented-node-table-scroll [data-segmented-sticky-column] {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 82px;
  background: var(--panel, #fff);
  box-shadow: 1px 0 0 var(--line, #d8d2c9);
}
.segmented-node-table-scroll thead [data-segmented-sticky-column] { z-index: 2; }
@media (max-width: 760px) {
  .segmented-scenario-grid, .segmented-chart-grid { grid-template-columns: 1fr; }
  .segmented-plan-tabs { position: sticky; top: 0; z-index: 2; padding: 6px 0; background: var(--surface, #f7f4ef); }
  .segmented-results-card > .segmented-results-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 58px;
    padding: 12px;
  }
  .segmented-results-heading { gap: 8px; }
  .segmented-results-icon { width: 32px; height: 32px; border-radius: 9px; font-size: 17px; }
  .segmented-results-heading span,
  .segmented-results-heading strong,
  .segmented-results-heading small { min-width: 0; overflow-wrap: anywhere; }
  .segmented-results-summary em { min-height: 34px; padding: 6px 9px; }
  .segmented-lazy-host { min-width: 0; padding: 12px; }
}
.steam-state-link {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel-soft) 88%, #fff);
}
.steam-state-link > .field { grid-column: auto !important; margin: 0; }
.steam-state-chain { font-size: 22px; line-height: 1; filter: grayscale(.15); }
.steam-state-link-status {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.steam-state-link-status[data-state="syncing"] { color: var(--blue); }
.steam-state-link-status[data-state="synced"] { color: var(--accent-2); }
.steam-state-link-status[data-state="waiting"] { color: var(--warn); }
@media (max-width: 760px) {
  .steam-state-link { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 6px; padding: 8px; }
  .steam-state-link > .field { padding: 8px; }
  .steam-state-chain { font-size: 18px; }
}
#hotOptTempDropSummary {
  flex-wrap: wrap;
}
#hotOptTempDropSummary > [data-hot-opt-temp-drop-title] {
  flex: 0 0 auto;
}
#hotOptTempDropSummary > [data-steam-inlet-summary] {
  min-width: 0;
  flex: 1 1 360px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
}
#hotOptTempDropSummary > [data-steam-inlet-summary][data-state="invalid"] {
  color: #a64b43;
}
#hotOptTempDropSummary > [data-steam-inlet-summary][data-state="waiting"] {
  color: #78858d;
}
.segmented-target-control {
  display: grid;
  gap: 8px;
  min-width: 0;
  width: 100%;
}
.segmented-target-control > label,
.segmented-target-value > label {
  color: #33454f;
  font-size: 12px;
  font-weight: 750;
}
.segmented-target-control > select {
  width: 100%;
}
.segmented-target-value {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: 6px 9px;
}
.segmented-target-value > label {
  grid-column: 1 / -1;
}
.segmented-target-value > input {
  min-width: 0;
  width: 100%;
}
.segmented-target-value > .unit {
  margin: 0;
  white-space: nowrap;
}
.segmented-target-note {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}
.segmented-target-note.is-warning {
  padding: 7px 8px;
  border: 1px solid #ead39a;
  border-radius: 7px;
  color: #8a5b12;
  background: #fff8e8;
}
.zhu-opt-primary {
  height: auto;
  white-space: normal;
  line-height: 1.35;
}
@media (max-width: 760px) {
  #hotOptTempDropSummary > [data-hot-opt-temp-drop-title] {
    flex: 1 1 auto;
  }
  #hotOptTempDropSummary > [data-steam-inlet-summary] {
    order: 3;
    flex-basis: 100%;
    padding-right: 2px;
  }
  .segmented-target-value {
    grid-template-columns: minmax(0, 1fr);
  }
  .segmented-target-value > .unit {
    white-space: normal;
  }
  .optimized-mobile-action button {
    white-space: normal;
    line-height: 1.35;
  }
}
/* Embedded AI assistant: fixed on desktop, full-width sheet on narrow screens. */
.hot-embedded-ai-panel { position: fixed; z-index: 60; top: 0; right: 0; width: min(390px, 38vw); height: 100dvh; display: flex; flex-direction: column; background: #fffaf6; border-left: 1px solid #e7c4b1; box-shadow: -12px 0 32px rgba(67, 36, 24, .16); }
.hot-embedded-ai-panel[hidden] { display: none; }
.hot-embedded-ai-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 20px; color: #442519; background: linear-gradient(135deg, #fff4eb, #f8dfce); border-bottom: 1px solid #e7c4b1; }
.hot-embedded-ai-head > div:first-child { flex: 1 1 220px; min-width: 0; }
.hot-embedded-ai-head strong { display: block; font-size: 18px; }
.hot-embedded-ai-head small { display: block; margin-top: 4px; color: #825d4d; font-size: 12px; }
.hot-embedded-ai-head button { border: 0; background: transparent; color: #74412d; font-size: 26px; line-height: 1; cursor: pointer; }
.hot-embedded-ai-head-actions { display: flex; flex: 0 0 auto; margin-inline-start: auto; align-items: center; gap: 5px; white-space: nowrap; }
.hot-embedded-ai-head-actions button { min-height: 30px; padding: 5px 7px; border: 1px solid #d9ae99; border-radius: 7px; font-size: 12px; line-height: 1.2; }
.hot-embedded-ai-head-actions button:last-child { border: 0; padding: 3px 5px; font-size: 26px; }
.hot-ai-motion-control { display: inline-flex; align-items: center; gap: 4px; color: #8f817a; font-size: 11px; font-weight: 800; white-space: nowrap; transition: color .18s ease; }
.hot-ai-motion-control.is-on { color: #b8442c; }
.hot-embedded-ai-head-actions .hot-ai-motion-control [data-ai-motion] { position: relative; width: 30px; min-width: 30px; height: 18px; min-height: 18px; padding: 0; border: 0; border-radius: 999px; background: #aaa5a2; box-shadow: inset 0 1px 3px rgba(60, 48, 42, .24); transition: background .18s ease, box-shadow .18s ease; }
.hot-embedded-ai-head-actions .hot-ai-motion-control [data-ai-motion][aria-checked="true"] { background: linear-gradient(90deg, #d9483b, #ec9b2d, #4ba667, #3f83cc); box-shadow: 0 0 0 2px rgba(208, 82, 47, .12); }
.hot-ai-motion-control [data-ai-motion] > i { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(64, 42, 34, .28); transition: transform .18s ease; }
.hot-ai-motion-control [data-ai-motion][aria-checked="true"] > i { transform: translateX(12px); }
.hot-embedded-ai-history { position: absolute; z-index: 2; inset: 68px 10px auto; max-height: min(62vh, 560px); overflow: auto; padding: 12px; border: 1px solid #e1c1b0; border-radius: 10px; background: #fffaf6; box-shadow: 0 12px 28px rgba(67, 36, 24, .18); }
.hot-embedded-ai-history-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; color: #442519; }
.hot-embedded-ai-history-title > div { display: flex; gap: 5px; }
.hot-embedded-ai-history-title button { min-height: 28px; padding: 4px 8px; border: 1px solid #d9ae99; border-radius: 6px; background: #fff; color: #74412d; cursor: pointer; }
.hot-embedded-ai-history [data-ai-history-list] { display: grid; gap: 7px; }
.hot-embedded-ai-history [data-ai-history-id] { display: grid; gap: 3px; width: 100%; padding: 9px 10px; border: 1px solid #edd8cb; border-radius: 8px; background: #fff; color: #3d2b24; text-align: left; cursor: pointer; }
.hot-ai-history-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px; align-items: stretch; }
.hot-ai-history-item > button:last-child { border: 1px solid #edd8cb; border-radius: 8px; background: #fff; color: #9b4b31; cursor: pointer; }
.hot-ai-history-item > button:last-child:hover { background: #fff0e8; }
.hot-embedded-ai-history [data-ai-history-id]:hover { border-color: #bd4a2e; background: #fff4eb; }
.hot-embedded-ai-history [data-ai-history-id] strong { overflow-wrap: anywhere; }
.hot-embedded-ai-history [data-ai-history-id] small { color: #825d4d; font-size: 11px; }
.hot-ai-history-empty { margin: 12px 0; color: #825d4d; text-align: center; }
.hot-embedded-ai-messages { flex: 1; overflow: auto; padding: 18px; }
.hot-embedded-ai-message { max-width: 88%; margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; white-space: pre-wrap; line-height: 1.55; font-size: 14px; }
.hot-embedded-ai-message.assistant { margin-right: auto; background: #fff; border: 1px solid #edd8cb; color: #3d2b24; }
.hot-embedded-ai-message.user { margin-left: auto; background: #bd4a2e; color: #fff; }
.hot-embedded-ai-message-images { display: grid; grid-template-columns: repeat(2, minmax(0, 112px)); gap: 7px; margin-top: 8px; }
.hot-embedded-ai-message-images img { display: block; width: 100%; max-width: 240px; aspect-ratio: 4 / 3; border: 2px solid rgba(255,255,255,.36); border-radius: 9px; background: #fff; object-fit: cover; }
.hot-embedded-ai-message-images img:only-child { width: min(240px, 54vw); aspect-ratio: auto; max-height: 220px; object-fit: contain; }
.hot-embedded-ai-message.assistant .hot-embedded-ai-message-images img { border-color: #e4c8b9; }
.hot-embedded-ai-status { margin: 0 18px 10px; color: #9b4b31; font-size: 13px; }
.hot-embedded-ai-compose { flex: 0 1 auto; min-height: 0; max-height: 60%; overflow-y: auto; padding: 14px 18px 18px; border-top: 1px solid #ead7cc; background: #fff; }
.hot-ai-task-modes { display: flex; gap: 5px; overflow-x: auto; margin: -3px 0 5px; padding: 2px 1px 5px; scrollbar-width: thin; }
.hot-ai-task-modes button { flex: 0 0 auto; display: grid; gap: 1px; min-width: 76px; padding: 6px 8px; border: 1px solid #dfc5b7; border-radius: 8px; background: #fff9f5; color: #704b3b; text-align: left; cursor: pointer; }
.hot-ai-task-modes button b { font-size: 11px; }
.hot-ai-task-modes button span { max-width: 90px; overflow: hidden; color: #987565; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.hot-ai-task-modes button[aria-pressed="true"] { border-color: #b73f28; background: #bd4a2e; color: #fff; box-shadow: 0 4px 12px rgba(166,58,36,.2); }
.hot-ai-task-modes button[aria-pressed="true"] span { color: #f6d9ce; }
.hot-ai-current-mode { margin: 0 2px 6px; color: #8a6656; font-size: 10px; }
.hot-ai-mode-suggestion { display: block; width: 100%; margin-top: 8px; padding: 8px 10px; border: 1px solid #a83e27; border-radius: 8px; background: #bd4a2e; color: #fff; font-weight: 800; cursor: pointer; }
.hot-ai-commercial-modal { position: fixed; z-index: 110; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(820px, calc(100vw - 40px)); height: min(85vh, 860px); overflow: hidden; display: flex; flex-direction: column; border: 1px solid #d8b8a7; border-radius: 18px; background: rgba(255,250,246,.98); box-shadow: 0 24px 70px rgba(52,27,18,.28); }
.hot-ai-commercial-modal[hidden] { display: none; }
.hot-ai-commercial-drag { flex: 0 0 auto; height: 30px; display: flex; align-items: center; justify-content: center; cursor: grab; user-select: none; touch-action: none; border-bottom: 1px solid #ead8cf; background: #fff7f2; border-radius: 18px 18px 0 0; }
.hot-ai-commercial-drag:active { cursor: grabbing; }
.hot-ai-commercial-drag-handle { width: 48px; height: 5px; border-radius: 3px; background: #d8b8a7; }
.hot-ai-commercial-dialog { flex: 1; min-height: 0; overflow: auto; }
.hot-embedded-ai-compose textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 70px; padding: 10px; border: 1px solid #dcbbaa; border-radius: 8px; font: inherit; }
.hot-embedded-ai-compose button { width: 100%; margin-top: 8px; min-height: 38px; }
.hot-embedded-ai-compose button { background: #bd4a2e; border-color: #bd4a2e; color: #fff; }
.hot-embedded-ai-compose button:hover { background: #a83e27; border-color: #a83e27; }
.hot-embedded-ai-compose .hot-ai-task-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
.hot-embedded-ai-compose .hot-ai-task-modes button { width: auto; min-width: 0; min-height: 34px; margin: 0; padding: 6px 7px; border-color: #dfc5b7; background: #fff9f5; color: #704b3b; text-align: center; }
.hot-embedded-ai-compose .hot-ai-task-modes button span { display: none; }
.hot-embedded-ai-compose .hot-ai-task-modes button[aria-pressed="true"] { border-color: #b73f28; background: #bd4a2e; color: #fff; }
.hot-embedded-ai-compose .hot-ai-task-modes button:hover { border-color: #b73f28; background: #fff1ea; color: #704b3b; }
.hot-embedded-ai-compose .hot-ai-task-modes button[aria-pressed="true"]:hover { background: #a83e27; color: #fff; }
/* Short windows and an open mobile keyboard must not push Send off-screen. */
@media (max-height: 560px) {
  .hot-embedded-ai-head { padding: 9px 14px; gap: 6px; }
  .hot-embedded-ai-head small { display: none; }
  .hot-embedded-ai-messages { min-height: 0; padding: 10px 14px; }
  .hot-embedded-ai-status { margin: 0 14px 6px; }
  .hot-embedded-ai-compose { padding: 8px 14px; }
  .hot-embedded-ai-compose .hot-ai-task-modes { display: flex; overflow-x: auto; }
  .hot-embedded-ai-compose .hot-ai-task-modes button { flex: 0 0 auto; padding-inline: 9px; }
  .hot-embedded-ai-compose textarea { max-height: 90px; }
}
.hot-embedded-ai-download { display: block; width: fit-content; margin: 8px 0; padding: 10px 14px; border-radius: 8px; background: #bd4a2e; color: #fff; text-decoration: none; font-weight: 700; }
.hot-ai-upload-queue { display: flex; gap: 7px; overflow-x: auto; margin-bottom: 8px; padding: 7px 9px; border-radius: 7px; background: #fff1e8; color: #8f3c28; font-size: 12px; }
.hot-ai-upload-queue[hidden] { display: none; }
.hot-ai-upload-chip { position: relative; flex: 0 0 76px; min-width: 0; padding: 4px; border: 1px solid #e4c8b9; border-radius: 8px; background: #fff; }
.hot-ai-upload-chip img { display: block; width: 66px; height: 52px; border-radius: 6px; object-fit: cover; }
.hot-ai-upload-chip span { display: block; overflow: hidden; margin-top: 2px; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.hot-ai-upload-chip button { position: absolute; top: -7px; right: -7px; width: 20px; min-height: 20px; margin: 0; padding: 0; border-radius: 50%; line-height: 18px; }
.hot-embedded-ai-asset { max-width: 88%; overflow-wrap: anywhere; border: 1px solid #9f3823; box-shadow: 0 4px 12px rgba(122, 57, 34, .14); }
.hot-embedded-ai-asset::before { content: "资料"; margin-right: 8px; padding: 2px 6px; border-radius: 999px; background: rgba(255, 255, 255, .2); font-size: 11px; }
.hot-ai-flight-layer { position: fixed; z-index: 90; inset: 0; overflow: hidden; pointer-events: none; perspective: 900px; }
.hot-ai-flight-token { position: fixed; top: 0; left: 0; display: grid; grid-template-columns: 14px auto auto 14px; align-items: center; gap: 6px; width: max-content; max-width: min(260px, 42vw); min-height: 38px; padding: 6px 10px; border: 2px solid transparent; border-radius: 999px; background: linear-gradient(#fffdf9, #fff9f3) padding-box, linear-gradient(115deg, #ff4b4b, #ffbd36, #48b96b, #3a8cff, #d65ad1) border-box; box-shadow: 0 12px 28px rgba(116, 65, 45, .22), 0 0 18px rgba(255, 152, 81, .22); color: #5b3022; font-size: 12px; line-height: 1; white-space: nowrap; will-change: transform, opacity; transform-origin: center; }
.hot-ai-flight-token::after { content: ""; position: absolute; z-index: -1; inset: -8px; border-radius: inherit; background: conic-gradient(from 90deg, rgba(255, 75, 75, .16), rgba(255, 189, 54, .2), rgba(72, 185, 107, .15), rgba(58, 140, 255, .18), rgba(214, 90, 209, .16), rgba(255, 75, 75, .16)); filter: blur(8px); }
.hot-ai-flight-token > span { color: #8b6253; font-weight: 700; }
.hot-ai-flight-token > b { overflow: hidden; max-width: 150px; background: linear-gradient(90deg, #dc3f33, #e6931c, #2d9a60, #2c74d8, #b842a7); background-size: 180% 100%; background-clip: text; -webkit-background-clip: text; color: transparent; font-size: 14px; text-overflow: ellipsis; animation: hotAiTokenRainbow 1.15s linear infinite; }
.hot-ai-flight-token small { font-size: 10px; font-weight: 700; }
.hot-ai-flight-token > i { width: 13px; height: 18px; border: 1px solid rgba(189, 74, 46, .24); border-radius: 85% 20% 75% 25%; background: linear-gradient(145deg, rgba(255, 209, 82, .9), rgba(255, 99, 132, .72), rgba(71, 146, 255, .78)); box-shadow: 0 0 8px rgba(255, 120, 93, .32); transform-origin: right center; animation: hotAiWingLeft .18s ease-in-out infinite alternate; }
.hot-ai-flight-token > i:last-child { border-radius: 20% 85% 25% 75%; transform-origin: left center; animation-name: hotAiWingRight; }
.hot-ai-flight-token.is-derived { background: linear-gradient(#f7fcff, #eef8ff) padding-box, linear-gradient(120deg, #72d7ff, #337ed8, #52bdc6) border-box; box-shadow: 0 12px 28px rgba(31, 96, 153, .2), 0 0 18px rgba(76, 180, 225, .22); color: #174c79; }
.hot-ai-flight-token.is-derived::after { background: radial-gradient(circle, rgba(77, 180, 226, .3), rgba(77, 180, 226, 0) 68%); }
.hot-ai-flight-token.is-derived > b { background: linear-gradient(90deg, #116fb0, #38a4c6, #2c77d0); background-clip: text; -webkit-background-clip: text; color: transparent; }
.hot-ai-flight-token.is-derived > i { border-color: rgba(31, 111, 176, .25); background: linear-gradient(145deg, rgba(116, 220, 255, .9), rgba(62, 129, 224, .75), rgba(84, 196, 187, .72)); }
.hot-ai-value-rainbow {
  color: #c94335 !important;
  -webkit-text-fill-color: transparent;
  background-image: repeating-linear-gradient(90deg, #d83d32 0 12px, #d88916 18px 28px, #24965a 34px 44px, #2878d2 50px 60px, #ad3e9f 66px 76px, #d83d32 82px 94px);
  background-color: #fff;
  background-clip: text;
  -webkit-background-clip: text;
  font-weight: 850;
}
.hot-ai-value-blue { color: #1677b8 !important; -webkit-text-fill-color: #1677b8; font-weight: 850; }
.hot-ai-value-emphasis { animation: hotAiLandingShake .92s cubic-bezier(.36,.07,.19,.97); }
.field.hot-ai-field-emphasis { animation: hotAiLandingGlow .92s ease-out; }
@keyframes hotAiWingLeft { from { transform: rotateY(18deg) rotateZ(-16deg) scaleX(.72); } to { transform: rotateY(70deg) rotateZ(10deg) scaleX(1.08); } }
@keyframes hotAiWingRight { from { transform: rotateY(-18deg) rotateZ(16deg) scaleX(.72); } to { transform: rotateY(-70deg) rotateZ(-10deg) scaleX(1.08); } }
@keyframes hotAiTokenRainbow { to { background-position: -180% 0; } }
@keyframes hotAiLandingShake { 0%, 100% { transform: translateX(0) rotate(0); } 12% { transform: translateX(-4px) rotate(-.7deg); } 24% { transform: translateX(4px) rotate(.7deg); } 36% { transform: translateX(-3px) rotate(-.45deg); } 48% { transform: translateX(3px) rotate(.45deg); } 62% { transform: translateX(-1.5px); } 76% { transform: translateX(1.5px); } }
@keyframes hotAiLandingGlow { 0% { box-shadow: 0 0 0 1px rgba(216, 61, 50, .2); } 24% { box-shadow: 0 0 0 3px rgba(236, 155, 45, .32), 0 0 22px rgba(71, 148, 104, .22); } 55% { box-shadow: 0 0 0 2px rgba(54, 125, 208, .28), 0 0 18px rgba(173, 62, 159, .16); } 100% { box-shadow: none; } }
body.hot-ai-open {
  --hot-ai-width: clamp(300px, 25vw, 440px);
  --hot-ai-nav-width: 272px;
  /* Clamp the shared size in CSS so window resizing also preserves calculator space. */
  --hot-ai-effective-width: clamp(300px, var(--hot-ai-width), min(60vw, max(300px, calc(100vw - var(--hot-ai-nav-width) - 520px))));
}
body.hot-ai-open .app { grid-template-columns: 272px minmax(0, calc(100% - 272px - var(--hot-ai-effective-width))); transition: grid-template-columns .22s ease; }
body.hot-ai-open .hot-embedded-ai-panel { width: var(--hot-ai-effective-width); }
body.hot-ai-resizing .app, body.hot-ai-resizing .hot-embedded-ai-panel { transition: none; }
.hot-embedded-ai-resize { position: absolute; top: 0; left: -5px; width: 10px; height: 100%; cursor: col-resize; touch-action: none; }
.hot-embedded-ai-resize::after { content: ""; position: absolute; top: 50%; left: 3px; width: 3px; height: 52px; transform: translateY(-50%); border-radius: 3px; background: #c88569; opacity: .6; }
@media (max-width: 720px) { .hot-embedded-ai-panel { width: 100%; } }
@media (max-width: 720px) { .hot-ai-commercial-modal { inset: 0; transform: none; width: auto; height: auto; border: 0; border-radius: 0; } .hot-ai-commercial-drag { display: none; } }
@media (max-width: 720px) { body.hot-ai-open .app { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .hot-ai-flight-token { grid-template-columns: 10px auto auto 10px; max-width: 72vw; min-height: 34px; padding: 5px 8px; } .hot-ai-flight-token > i { width: 10px; height: 14px; } }
@media (prefers-reduced-motion: reduce) { .hot-ai-flight-token, .hot-ai-flight-token::after, .hot-ai-flight-token > b, .hot-ai-flight-token > i, .hot-ai-value-emphasis, .field.hot-ai-field-emphasis { animation: none !important; } }
body.sidebar-collapsed .app { grid-template-columns: 0 minmax(0, 1fr); }
body.sidebar-collapsed.hot-ai-open { --hot-ai-nav-width: 0px; }
body.sidebar-collapsed.hot-ai-open .app { grid-template-columns: 0 minmax(0, calc(100% - var(--hot-ai-effective-width))); }
body.sidebar-collapsed .sidebar { width: 0; padding-left: 0; padding-right: 0; opacity: 0; overflow: hidden; pointer-events: none; }
.sidebar-toggle-zone { position: fixed; z-index: 55; top: 0; bottom: 0; left: 264px; width: 18px; display: flex; align-items: center; justify-content: center; }
.sidebar-toggle-zone button { width: 22px; height: 48px; padding: 0; border: 1px solid #ccd8df; border-radius: 0 8px 8px 0; background: rgba(255,255,255,.96); color: #526873; font-size: 26px; line-height: 1; opacity: 0; box-shadow: 2px 0 8px rgba(27,39,51,.12); transition: opacity .16s ease; }
.sidebar-toggle-zone:hover button, .sidebar-toggle-zone button:focus-visible { opacity: 1; }
body.sidebar-collapsed .sidebar-toggle-zone { left: 0; }
body.sidebar-collapsed .sidebar-toggle-zone button { opacity: .72; }
body.sidebar-collapsed .sidebar-toggle-zone:hover button, body.sidebar-collapsed .sidebar-toggle-zone button:focus-visible { opacity: 1; }
@media (min-width: 761px) and (max-width: 980px) {
  /* The narrow desktop cannot fit both sidebars. Closing AI restores navigation. */
  body.hot-ai-open { --hot-ai-nav-width: 0px; }
  body.hot-ai-open .app,
  body.sidebar-collapsed.hot-ai-open .app { grid-template-columns: minmax(0, calc(100% - var(--hot-ai-effective-width))); }
  body.hot-ai-open .sidebar,
  body.hot-ai-open .sidebar-toggle-zone { display: none; }
}
@media (max-width: 720px) { .sidebar-toggle-zone { display: none; } body.sidebar-collapsed .app, body.sidebar-collapsed.hot-ai-open .app { grid-template-columns: 1fr; } body.sidebar-collapsed .sidebar { width: auto; padding-left: 14px; padding-right: 14px; opacity: 1; pointer-events: auto; } }

/* ================= RBAC账号与权限后台 ================= */
.rbac-admin-panel { position: fixed; z-index: 1500; inset: 0; display: grid; place-items: stretch end; }
.rbac-admin-backdrop { position: absolute; inset: 0; background: rgba(20,27,31,.54); backdrop-filter: blur(4px); }
.rbac-admin-sheet { position: relative; display: flex; flex-direction: column; width: min(1040px, 92vw); height: 100vh; height: 100dvh; background: #f5f1eb; box-shadow: -18px 0 60px rgba(18,27,32,.24); animation: rbacSlideIn .22s ease-out; }
@keyframes rbacSlideIn { from { transform: translateX(40px); opacity: .7; } to { transform: translateX(0); opacity: 1; } }
.rbac-admin-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 24px 28px 20px; border-bottom: 1px solid #dccfc3; background: linear-gradient(120deg,#fffaf4,#f2e4d7); }
.rbac-admin-header span { color: #a64a34; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.rbac-admin-header h2 { margin: 3px 0 4px; color: #342923; font-family: Georgia,"Songti SC",serif; font-size: 25px; }
.rbac-admin-header p { margin: 0; color: #74645b; }
.rbac-admin-content { flex: 1; overflow: auto; padding: 22px 28px 38px; }
.rbac-tabs { display: flex; gap: 6px; padding: 5px; border: 1px solid #ddcfc3; border-radius: 12px; background: rgba(255,255,255,.72); }
.rbac-tabs button { flex: 1; border-color: transparent; background: transparent; color: #72584a; box-shadow: none; }
.rbac-tabs button.active { border-color: #b94b32; background: #bd4a2e; color: #fff; }
.rbac-tab-content { padding-top: 20px; }
.rbac-section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.rbac-section-head h3 { margin: 0 0 4px; color: #382b24; font-size: 19px; }
.rbac-section-head p { margin: 0; color: #7b6c63; }
.rbac-section-head > button,.rbac-editor footer button[type="submit"] { border-color: #bd4a2e; background: #bd4a2e; color: #fff; }
.rbac-card-list { display: grid; gap: 10px; }
.rbac-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 17px; border: 1px solid #ded4cb; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(54,39,31,.05); }
.rbac-card strong { color: #382b24; font-size: 15px; }
.rbac-card small { display: block; margin-top: 3px; color: #927a6c; }
.rbac-card p { margin: 7px 0 0; color: #65574f; }
.rbac-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.rbac-actions button { padding: 6px 9px; }
.rbac-editor-host { position: fixed; z-index: 1600; inset: 0; display: grid; place-items: center; padding: 24px; }
.rbac-editor-backdrop { position: absolute; inset: 0; background: rgba(18,23,27,.62); backdrop-filter: blur(4px); }
.rbac-editor { position: relative; display: flex; flex-direction: column; width: min(940px, 96vw); max-height: 92vh; border: 1px solid #dfcabb; border-radius: 16px; background: #fffdfa; box-shadow: 0 24px 80px rgba(22,28,32,.3); }
.rbac-editor > header,.rbac-editor > footer { display: flex; align-items: center; gap: 10px; padding: 15px 19px; border-bottom: 1px solid #eadfd6; }
.rbac-editor > header { justify-content: space-between; }
.rbac-editor > header h3 { margin: 0; color: #3d2c24; }
.rbac-editor > footer { justify-content: flex-end; border-top: 1px solid #eadfd6; border-bottom: 0; }
.rbac-editor > footer span { margin-right: auto; color: #b03f2e; }
.rbac-editor-body { overflow: auto; padding: 18px 20px 24px; }
.rbac-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-bottom: 18px; }
.rbac-form-grid label { display: grid; gap: 6px; color: #5e4f47; font-weight: 700; }
.rbac-form-grid .wide { grid-column: 1/-1; }
.rbac-role-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 8px; margin: 8px 0 18px; }
.rbac-role-grid label { display: flex; gap: 9px; padding: 11px; border: 1px solid #e2d6cc; border-radius: 9px; background: #fff; }
.rbac-role-grid input,.rbac-permission-item input,.rbac-mode-row input { width: auto; min-height: 0; }
.rbac-role-grid small { display: block; margin-top: 3px; color: #85746b; font-weight: 400; }
.rbac-mode-row { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; margin: 14px 0; padding: 12px; border-radius: 10px; background: #f4ede6; }
.rbac-mode-row label { display: inline-flex; align-items: center; gap: 5px; }
.rbac-mode-row select { width: min(240px,100%); }
.rbac-permission-tree { display: grid; gap: 12px; }
.rbac-permission-module { overflow: hidden; border: 1px solid #ded2c8; border-radius: 11px; background: #fff; }
.rbac-permission-module > header { padding: 10px 13px; border-bottom: 1px solid #e9dfd7; background: #f8f2ec; }
.rbac-permission-module > header small { display: block; margin-top: 2px; color: #87756a; }
.rbac-permission-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 1px; background: #eee5de; }
.rbac-permission-item { display: flex; align-items: flex-start; gap: 8px; min-height: 62px; padding: 10px 11px; background: #fff; }
.rbac-permission-item b,.rbac-permission-item small { display: block; }
.rbac-permission-item small { margin-top: 3px; color: #8a776c; font-size: 11px; overflow-wrap: anywhere; }
.rbac-kind-field { box-shadow: inset 3px 0 #d3973b; }.rbac-kind-scope { box-shadow: inset 3px 0 #378f87; }.rbac-kind-grant { box-shadow: inset 3px 0 #bd4a2e; }
.rbac-warning { padding: 10px 12px; border: 1px solid #e4bd75; border-radius: 9px; background: #fff7df; color: #7f570b; }
.rbac-table-wrap { overflow: auto; border: 1px solid #ddd1c7; border-radius: 11px; background: #fff; }.rbac-table-wrap table { width: 100%; border-collapse: collapse; }.rbac-table-wrap th,.rbac-table-wrap td { padding: 10px 11px; border-bottom: 1px solid #eee5de; text-align: left; white-space: nowrap; }.rbac-table-wrap th { background: #f6efe8; color: #675248; }
.rbac-loading,.rbac-empty { padding: 30px; color: #7a6a61; text-align: center; }
.knowledge-preview-text { margin: 0; max-height: 60vh; overflow: auto; white-space: pre-wrap; word-break: break-word; padding: 16px; border: 1px solid #eadfd6; border-radius: 12px; background: #fffaf5; color: #352c27; font: 14px/1.7 "Source Han Sans SC","Noto Sans CJK SC",sans-serif; }
.knowledge-subtabs { display: flex; gap: 8px; margin: -4px 0 20px; padding-bottom: 12px; border-bottom: 1px solid #ddd1c7; }
.knowledge-subtabs button { border: 1px solid #d8c7bb; background: #fff; color: #72584a; box-shadow: none; }
.knowledge-subtabs button.active { border-color: #a9432d; background: #a9432d; color: #fff; }
.knowledge-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }
.knowledge-metrics article { padding: 14px; border: 1px solid #ddcfc3; border-radius: 12px; background: linear-gradient(145deg,#fff,#f8eee5); }
.knowledge-metrics span,.knowledge-metrics small { display: block; color: #856f63; }
.knowledge-metrics strong { display: block; margin: 4px 0; color: #9f3d2a; font: 700 28px/1 Georgia,"Songti SC",serif; }
.knowledge-workbench-section { margin-top: 22px; }
.knowledge-workbench-section > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.knowledge-workbench-section h4 { margin: 0; color: #3e2e27; font-size: 16px; }
.knowledge-workbench-section > header small { color: #8b776c; }
.knowledge-pipeline-card { margin-bottom: 4px; border-left: 4px solid #41877d; }
.knowledge-evidence-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 9px; }
.knowledge-evidence-list article { min-width: 0; padding: 13px; border: 1px solid #dfd3ca; border-radius: 11px; background: #fff; }
.knowledge-evidence-list strong,.knowledge-evidence-list small,.knowledge-evidence-list code { display: block; }
.knowledge-evidence-list small { margin-top: 4px; color: #8d7669; }
.knowledge-evidence-list p { display: -webkit-box; overflow: hidden; margin: 8px 0; color: #62534b; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.knowledge-evidence-list code { overflow: hidden; color: #aa4d37; font-size: 10px; text-overflow: ellipsis; }
.knowledge-evidence-picker { display: grid; gap: 8px; max-height: 360px; overflow: auto; padding: 4px; }
.knowledge-evidence-picker label { display: flex; align-items: flex-start; gap: 9px; padding: 11px; border: 1px solid #e1d5cc; border-radius: 10px; background: #fff; }
.knowledge-evidence-picker input { width: auto; min-height: 0; margin-top: 4px; }
.knowledge-evidence-picker span,.knowledge-evidence-picker strong,.knowledge-evidence-picker small,.knowledge-evidence-picker em { display: block; min-width: 0; }
.knowledge-evidence-picker small { margin-top: 3px; color: #8a776c; }
.knowledge-evidence-picker em { display: -webkit-box; overflow: hidden; margin-top: 6px; color: #62544c; font-style: normal; font-weight: 400; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
@media (max-width:720px) { .rbac-admin-sheet { width: 100vw; }.rbac-admin-header { padding: 18px 16px 14px; }.rbac-admin-content { padding: 14px 12px 26px; }.rbac-tabs { overflow-x: auto; }.rbac-tabs button { min-width: 92px; }.rbac-section-head,.rbac-card { align-items: stretch; flex-direction: column; }.rbac-actions { justify-content: flex-start; }.rbac-form-grid { grid-template-columns: 1fr; }.rbac-editor-host { padding: 8px; }.rbac-editor { max-height: 96vh; }.rbac-permission-grid { grid-template-columns: 1fr; }.account-identity { display: none; } }
@media (max-width:720px) { .knowledge-subtabs { overflow-x: auto; }.knowledge-subtabs button { flex: 0 0 auto; }.knowledge-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }.knowledge-workbench-section > header { align-items: flex-start; flex-direction: column; }.knowledge-evidence-list { grid-template-columns: 1fr; } }
