:root{
  --bg:#ffffff;--panel:#f8fafc;--panel2:#f1f5f9;--border:#e2e8f0;
  --txt:#0f172a;--txt2:#475569;--txt3:#64748b;
  --cyan:#0891b2;--blue:#2563eb;--green:#16a34a;--yellow:#ca8a04;--red:#dc2626;--orange:#ea580c;--purple:#7c3aed;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC",system-ui,sans-serif;background:var(--bg);color:var(--txt);min-height:100vh}
.header{padding:20px 32px 14px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(96,165,250,.06) 0%,transparent 100%)}
.header .chapter{font-size:11px;color:var(--blue);letter-spacing:3px;font-weight:500;margin-bottom:5px}
.header h1{font-family:"Songti SC","SimSun",serif;font-size:22px;font-weight:700}
.header .sub{font-size:12px;color:var(--txt2);margin-top:3px}
.tabs{display:flex;padding:0 32px;border-bottom:1px solid var(--border);background:var(--panel);overflow-x:auto}
.tab{padding:13px 22px;font-size:13px;color:var(--txt2);cursor:pointer;border-bottom:2px solid transparent;transition:all .25s;user-select:none;font-weight:500;white-space:nowrap}
.tab:hover{color:var(--txt)}
.tab.active{color:var(--blue);border-bottom-color:var(--blue);background:rgba(96,165,250,.05)}
.view{display:none;padding:20px 32px 32px}
.view.active{display:block;animation:fadeIn .4s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.stitle{font-size:14px;color:var(--txt);font-weight:500;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.stitle::before{content:'';width:4px;height:16px;background:var(--blue);border-radius:2px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:18px;margin-bottom:14px}
.btn{background:var(--panel2);border:1px solid var(--border);color:var(--txt);padding:7px 16px;border-radius:6px;cursor:pointer;font-size:12px;transition:all .2s;user-select:none}
.btn:hover{border-color:var(--blue);color:var(--blue)}
.btn.primary{background:var(--blue);color:#ffffff;border-color:var(--blue);font-weight:600}
.btn.primary:hover{background:#1d4ed8}
.btn.danger{border-color:var(--red);color:var(--red)}
.btn.active{background:var(--blue);color:#ffffff;border-color:var(--blue)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn-group{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.metric{background:var(--panel2);border-radius:8px;padding:12px;text-align:center}
.metric .label{font-size:11px;color:var(--txt2);margin-bottom:4px}
.metric .value{font-size:20px;font-weight:700;font-family:"Consolas","Courier New",monospace}
.metric .unit{font-size:11px;color:var(--txt3);margin-left:3px}
.tag{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:600}
.tag-cyan{background:rgba(34,211,238,.15);color:var(--cyan)}
.tag-green{background:rgba(74,222,128,.15);color:var(--green)}
.tag-yellow{background:rgba(250,204,21,.15);color:var(--yellow)}
.tag-red{background:rgba(248,113,113,.15);color:var(--red)}
.tag-blue{background:rgba(96,165,250,.15);color:var(--blue)}
.tag-orange{background:rgba(251,146,60,.15);color:var(--orange)}
.tag-purple{background:rgba(167,139,250,.15);color:var(--purple)}
svg{display:block}
.info-box{background:rgba(96,165,250,.06);border:1px solid rgba(96,165,250,.2);border-radius:8px;padding:12px;font-size:12px;line-height:1.7;color:var(--txt2)}
.info-box strong{color:var(--blue)}
.warn-box{background:rgba(248,113,113,.06);border:1px solid rgba(248,113,113,.2);border-radius:8px;padding:12px;font-size:12px;line-height:1.7;color:var(--txt2)}
.warn-box strong{color:var(--red)}
.formula-box{background:var(--panel2);border-left:3px solid var(--yellow);border-radius:0 6px 6px 0;padding:10px 14px;margin:10px 0}
.formula-box .label{font-size:10px;color:var(--yellow);letter-spacing:1px;margin-bottom:4px}
.formula-box .formula{font-size:16px;font-family:"Consolas","Courier New",monospace;color:var(--txt);letter-spacing:1px}
.key-concept{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid rgba(15,23,42,.06)}
.key-concept:last-child{border-bottom:none}
.concept-icon{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--cyan));display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#ffffff;flex-shrink:0}
.concept-body h5{font-size:13px;color:var(--txt);margin-bottom:3px}
.concept-body p{font-size:11px;color:var(--txt2);line-height:1.5}
.gauge{margin-bottom:12px}
.gauge .g-label{font-size:11px;color:var(--txt2);margin-bottom:5px;display:flex;justify-content:space-between;align-items:center}
.gauge .g-value{font-size:16px;font-weight:700;font-family:"Consolas","Courier New",monospace}
.gauge .g-bar{height:8px;background:var(--panel2);border-radius:4px;overflow:hidden;margin-top:4px}
.gauge .g-fill{height:100%;border-radius:4px;transition:width .3s,background .3s;width:0}
.chip{background:var(--panel2);border-radius:6px;padding:8px 10px;text-align:center}
.chip .chip-label{font-size:10px;color:var(--txt3);margin-bottom:3px}
.chip .chip-value{font-size:12px;font-weight:600;color:var(--txt2)}
.chip.on .chip-value{color:var(--green)}
.chip.off .chip-value{color:var(--txt3)}
.step-list{display:flex;flex-direction:column;gap:6px}
.step-item{display:flex;gap:10px;align-items:flex-start;padding:8px 12px;border-radius:6px;background:var(--panel2);border-left:3px solid var(--border);transition:all .3s}
.step-item.active{border-left-color:var(--blue);background:rgba(96,165,250,.08)}
.step-item.done{border-left-color:var(--green);opacity:.6}
.step-num{width:22px;height:22px;border-radius:50%;background:var(--panel);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.step-item.active .step-num{background:var(--blue);color:#ffffff;border-color:var(--blue)}
.step-item.done .step-num{background:var(--green);color:#fff;border-color:var(--green)}
.step-text{font-size:12px;line-height:1.5}
.step-text .st{font-weight:600;color:var(--txt)}
.step-text .sd{color:var(--txt2);font-size:11px;margin-top:1px}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--txt2);margin-top:8px}
.legend-item{display:flex;align-items:center;gap:5px}
.legend-dot{width:10px;height:10px;border-radius:2px}
.comparison-card{background:var(--panel2);border-radius:10px;padding:16px;border:1px solid var(--border);transition:all .3s;cursor:pointer}
.comparison-card:hover{border-color:var(--blue);transform:translateY(-2px)}
.comparison-card.selected{border-color:var(--blue);box-shadow:0 0 12px rgba(96,165,250,.3)}
.comparison-card h3{font-size:14px;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.comparison-card .desc{font-size:11px;color:var(--txt2);line-height:1.6;margin-bottom:10px}
.comparison-card .spec{display:flex;justify-content:space-between;font-size:11px;padding:3px 0;border-bottom:1px solid rgba(15,23,42,.06)}
.comparison-card .spec:last-child{border-bottom:none}
.comparison-card .spec .k{color:var(--txt2)}
.comparison-card .spec .v{font-weight:600;font-family:"Consolas","Courier New",monospace}
table{width:100%;border-collapse:collapse;font-size:12px}
th{text-align:left;padding:7px;color:var(--txt2);border-bottom:2px solid var(--border)}
td{padding:6px;border-bottom:1px solid rgba(15,23,42,.06)}
.wire{stroke:#334155;stroke-width:2.5;transition:stroke .3s}
.sw-blade{stroke:#64748b;stroke-width:2.5;stroke-linecap:round;transition:all .3s}
.sw-blade.closed{stroke:var(--green)}
.sw-terminal{stroke:#64748b;stroke-width:3;stroke-linecap:round}
.stage-indicator{display:flex;gap:4px;margin-bottom:12px}
.stage{flex:1;padding:8px 6px;border-radius:5px;background:var(--panel2);text-align:center;font-size:10px;color:var(--txt3);transition:all .3s;border:1px solid transparent}
.stage.active{background:rgba(96,165,250,.15);color:var(--blue);border-color:var(--blue)}
.stage.done{background:rgba(74,222,128,.1);color:var(--green);border-color:rgba(74,222,128,.3)}
.log-box{background:#f1f5f9;border-radius:6px;padding:10px;height:120px;overflow-y:auto;font-family:"Consolas","Courier New",monospace;font-size:10px;line-height:1.6}
.log-box .log-line{color:var(--txt3)}
.log-box .log-line .time{color:var(--txt3)}
.log-box .log-line .action{color:var(--blue)}
.log-box .log-line .ok{color:var(--green)}
.log-box .log-line .warn{color:var(--yellow)}
/* ===== 流程仿真：机组剖面图 + 步骤提示条 ===== */
.step-banner{display:flex;align-items:center;gap:14px;background:rgba(96,165,250,.08);border:1px solid rgba(96,165,250,.35);border-left:4px solid var(--blue);border-radius:10px;padding:12px 16px;margin-bottom:14px;transition:all .3s}
.step-banner.done{background:rgba(74,222,128,.08);border-color:rgba(74,222,128,.35);border-left-color:var(--green)}
.step-banner .b-num{font-size:28px;font-weight:700;font-family:"Consolas","Courier New",monospace;color:var(--blue);flex-shrink:0;min-width:40px;text-align:center;line-height:1}
.step-banner.done .b-num{color:var(--green)}
.step-banner .b-body{flex:1}
.step-banner .b-title{font-size:16px;font-weight:700;color:var(--txt)}
.step-banner .b-desc{font-size:12px;color:var(--txt2);margin-top:3px;line-height:1.6}
.step-banner .b-total{font-size:12px;color:var(--txt3);flex-shrink:0;font-family:"Consolas","Courier New",monospace}
.step-banner .b-total b{color:var(--blue);font-size:14px}
.step-banner.done .b-total b{color:var(--green)}
@keyframes flowdash{to{stroke-dashoffset:-10}}
.pipe-flow{stroke-dasharray:4 6;animation:flowdash .6s linear infinite}
/* ===== 电路仿真：开关高亮提示框 ===== */
.hint-box{fill:none;stroke:var(--yellow);stroke-width:2;stroke-dasharray:5 3;opacity:0;pointer-events:none;rx:6}
.hint-box.active{opacity:1;animation:hintpulse .9s ease-in-out infinite}
@keyframes hintpulse{0%,100%{stroke-opacity:1}50%{stroke-opacity:.15}}