:root{
  --bg:#f8fafc; --panel:#ffffff; --fg:#1f2933; --muted:#52606d;
  --line:#e4e7eb; --accent:#2563eb; --accent2:#0f766e; --warn:#b45309;
  --ok:#15803d; --bad:#dc2626; --badbg:#fef2f2;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;
     background:var(--bg);color:var(--fg);font-size:14px}
header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
       padding:12px 20px;background:#0f172a;color:#fff}
.brand{display:flex;align-items:center;gap:12px}
.logo{font-size:26px}
.brand .t{font-weight:700;font-size:16px}
.brand .s{font-size:12px;color:#94a3b8}
.lang{display:flex;align-items:center;gap:8px;font-size:13px}
.lang select{padding:5px 8px;border-radius:6px;border:1px solid #334155;background:#1e293b;color:#fff}
.hdr-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.btn.ghost{padding:6px 12px;border:1px solid #334155;border-radius:8px;background:#1e293b;color:#e2e8f0;
  font-size:13px;text-decoration:none;cursor:pointer;margin-top:0;line-height:1.4}
.btn.ghost:hover{background:#334155;color:#fff;text-decoration:none}
main{display:grid;grid-template-columns:300px 1fr 320px;gap:14px;padding:14px;align-items:start}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.panel h2{font-size:15px;margin:4px 0 12px;color:var(--accent2);border-bottom:2px solid var(--line);padding-bottom:6px}
.panel h3{font-size:13px;margin:14px 0 6px;color:var(--muted)}
.row{display:flex;align-items:center;gap:8px;margin:7px 0}
.row label{flex:1;font-size:13px;color:var(--muted)}
.row input[type=number]{width:84px;padding:5px 7px;border:1px solid var(--line);border-radius:6px;font-size:13px}
.row select{padding:5px 7px;border:1px solid var(--line);border-radius:6px;font-size:13px;background:#fff}
.row .u{font-size:12px;color:var(--muted);min-width:30px}
.row.auto{justify-content:flex-start;gap:8px}
.row.auto label{flex:none}
.btn{padding:7px 14px;border:none;border-radius:8px;background:var(--accent);color:#fff;
      font-size:13px;cursor:pointer;margin-top:8px}
.btn:hover{background:#1d4ed8}
.exBtns{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chk{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);
     border:1px solid var(--line);border-radius:7px;padding:5px 8px;margin-left:4px}
.chk select{font-size:12px;padding:2px 4px;border:1px solid var(--line);border-radius:5px;
     background:#fff;color:var(--text);cursor:pointer}
.btn.ex{flex:1;min-width:64px;background:var(--accent2);margin-top:0}
.btn.ex:hover{background:#0b5d54}
.btn.ex.disabled{background:#cbd5e1;color:#64748b;cursor:not-allowed}
.view2d{width:100%;overflow:auto;border:1px solid var(--line);border-radius:8px;background:#fff;padding:6px}
.view2d svg{width:100%;height:auto;display:block}
#view3d{width:100%;border:1px solid var(--line);border-radius:8px;background:#0f172a}
.hint{font-size:11px;color:var(--muted);margin:8px 0 0;line-height:1.5}
table{width:100%;border-collapse:collapse;font-size:13px}
td{padding:6px 8px;border-bottom:1px solid var(--line)}
td:first-child{color:var(--muted)}
td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
tr.pass td:last-child{color:var(--ok)}
tr.warn td:last-child{color:#b45309;background:#fef3c7}
tr.fail td:last-child{color:var(--bad);background:var(--badbg)}
.verdict{font-weight:700}
.verdict.ok{color:var(--ok)} .verdict.no{color:var(--bad)}
.grp{font-size:12px;color:var(--warn);margin:16px 0 4px;font-weight:700;
     text-transform:uppercase;letter-spacing:.04em;border:none;padding:0}
#grp-select{margin-top:14px;border-top:2px dashed var(--line);padding-top:8px}
.selres{margin-top:8px;font-size:12px}
.selrow{display:flex;justify-content:space-between;margin:3px 0;color:var(--muted)}
.selrow b{color:var(--fg)}
.seltab{width:100%;border-collapse:collapse;margin-top:6px;font-size:12px}
.seltab th{background:#f1f5f9;color:var(--muted);padding:4px 6px;text-align:left}
.seltab td{padding:4px 6px;border-bottom:1px solid var(--line)}
.seltab tr.sel td{background:#dcfce7;color:var(--ok);font-weight:700}
.seltab tr.under td{color:var(--bad);background:var(--badbg)}
.cmpres{margin-top:8px}
.cmpres .seltab tr.pass td{color:var(--ok)}
.cmpres .seltab tr.fail td{color:var(--bad)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);
  background:#0f172a;color:#fff;padding:10px 16px;border-radius:8px;font-size:13px;
  opacity:0;transition:.25s;z-index:999;box-shadow:0 6px 20px rgba(0,0,0,.28);pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:980px){main{grid-template-columns:1fr}}
.seo{max-width:1100px;margin:0 auto 24px;padding:14px 18px;background:var(--panel);
     border:1px solid var(--line);border-radius:12px;color:var(--muted)}
.seo h2{font-size:14px;color:var(--accent2);margin:0 0 8px;border-bottom:2px solid var(--line);padding-bottom:6px}
.seo p{font-size:12px;line-height:1.6;margin:6px 0;color:#475569}

/* exploded view + dimension toggles */
.viewbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 8px}
.viewbar .chk{margin-left:0}
.vinfo{font-size:11px;color:var(--muted)}
#explodeAmt{vertical-align:middle}
#view2d.hide-dims .dims{display:none}

/* mode switch (Coupling / Shaft) */
.modebar{grid-column:1 / -1;display:flex;gap:8px;align-items:center}
.btn.mode{padding:7px 18px;background:#e2e8f0;color:#334155;margin-top:0}
.btn.mode:hover{background:#cbd5e1}
.btn.mode.active{background:var(--accent);color:#fff}
#shaftPanel .edtbl{display:flex;flex-direction:column;gap:4px;margin:2px 0 6px}
.edrow{display:flex;gap:4px;align-items:center;background:#f1f5f9;border:1px solid var(--line);
  border-radius:6px;padding:4px 6px}
.edcell{flex:1;display:flex}
.edcell input,.edcell select{width:100%;padding:4px 6px;border:1px solid var(--line);
  border-radius:5px;font-size:12px;background:#fff}
.btn.tiny{padding:2px 8px;font-size:12px;background:#dc2626;color:#fff;margin-top:0;border:none;border-radius:6px;cursor:pointer}
.btn.tiny:hover{background:#b91c1c}
#shaftView h3{font-size:13px;color:var(--accent2);margin:14px 0 6px;border-bottom:2px solid var(--line);padding-bottom:4px}
#shaftView .view2d{min-height:60px}

/* heat-treatment advisor readout */
.htout{margin-top:10px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;
  background:#f8fafc;font-size:12px}
.htout .htr{display:flex;justify-content:space-between;gap:10px;padding:3px 0;
  border-bottom:1px dashed var(--line)}
.htout .htr:last-child{border-bottom:none}
.htout .htr>span:first-child{color:var(--muted);flex:none;max-width:54%}
.htout .htr>span:last-child{color:var(--fg);text-align:right;font-weight:600;
  font-variant-numeric:tabular-nums}

/* heat-treatment temper-axis band plot */
.htplot{margin:8px 0 2px;display:block;background:var(--panel);border:1px solid var(--line);
  border-radius:6px;padding:3px 2px}
.htplotcap{font-size:11px;color:var(--muted);padding:1px 4px 4px}

/* 16 ENHANCEMENTS — advanced shaft analysis */
details.adv{margin:10px 0;border:1px solid var(--line);border-radius:8px;background:#fbfdff;overflow:hidden}
details.adv>summary{cursor:pointer;padding:8px 12px;font-weight:600;font-size:13px;
  background:linear-gradient(180deg,#eef4fb,#e3ecf6);color:var(--accent2);
  border-bottom:1px solid var(--line);user-select:none}
details.adv[open]>summary{border-bottom:1px solid var(--line)}
details.adv>summary::-webkit-details-marker{color:var(--accent2)}
details.adv .row,.details.adv .row.inline{padding:6px 12px}
.ro{margin:6px 12px 12px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;
  background:#f8fafc;font-size:12px;line-height:1.55;color:var(--fg)}
.ro b{color:var(--accent2)}
.cmptbl{width:100%;border-collapse:collapse;margin:6px 0;font-size:12px}
.cmptbl th,.cmptbl td{border:1px solid var(--line);padding:4px 6px;text-align:center}
.cmptbl th{background:#eef4fb;color:var(--accent2);font-weight:600}
.cmptbl td:first-child{text-align:left}
.pass{color:#15803d;font-weight:600}
.fail{color:#b91c1c;font-weight:600}
.warn{color:#b45309;font-weight:600}
.ubar{height:12px;border-radius:4px;min-width:2px}
.ubar.pass{background:#22c55e}
.ubar.warn{background:#f59e0b}
.ubar.fail{background:#ef4444}
.ucell{background:#eef2f7;border-radius:4px;width:140px;padding:2px!important}
.warn{color:#b45309;font-weight:600}
