/* ============ Chitam design system — InPhase ============ */
:root{
  --navy:#1d2b4f; --ink:#233047; --body:#42506b; --muted:#7b87a3;
  --blue:#2f7fe0; --blue-d:#1565d8; --sky:#4aa3f0;
  --green:#0e9f6e; --green-l:#3ddc84;
  --amber:#f5a623; --red:#e0483e; --violet:#7c5cff; --pink:#ff00ff; --cyan:#3299CC;
  --bg:#f2f6fb; --card:#ffffff; --line:#e3eaf3;
  --grad:linear-gradient(135deg,#1565d8 0%,#2f9fe0 45%,#0e9f6e 100%);
  --shadow:0 2px 10px rgba(29,43,79,.08);
  --r:12px;
  font-size:15px;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,Arial,sans-serif;background:var(--bg);color:var(--body)}
h1,h2,h3{color:var(--ink);font-weight:700;line-height:1.25}
h1{font-size:1.5rem}h2{font-size:1.2rem}h3{font-size:1.02rem}
a{color:var(--blue-d);text-decoration:none}
code{background:#eef3fa;padding:1px 6px;border-radius:6px;font-size:.88em}
.muted{color:var(--muted)}
.center{text-align:center}

/* ---------- top bar ---------- */
.topbar{display:flex;align-items:center;gap:22px;background:#fff;border-bottom:1px solid var(--line);
  padding:0 20px;height:64px;position:sticky;top:0;z-index:50;box-shadow:var(--shadow)}
.brand{display:flex;align-items:center}
.logo{width:auto;display:block}
.brand .logo{height:44px}
.mainnav{display:flex;gap:4px;flex:1}
.mainnav a{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px;color:var(--body);font-weight:600;font-size:.93rem}
.mainnav a:hover{background:#eef4fc}
.mainnav a.on{background:var(--grad);color:#fff}
.nv{width:9px;height:9px;border-radius:3px;display:inline-block}
.nv-dash{background:var(--blue)} .nv-sld{background:var(--violet)} .nv-up{background:var(--amber)} .nv-rep{background:var(--green)}
.mainnav a.on .nv{background:#fff}
.mainnav a.backdash{background:#eef4fc;color:var(--blue-d)}
.mainnav a.backdash:hover{background:#e0ecfb}
.userbox{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.uname{font-weight:600;color:var(--ink);font-size:.92rem}
.uprof{position:relative;display:flex;align-items:center;gap:8px;cursor:pointer;padding:5px 10px;border-radius:12px}
.uprof:hover{background:#eef4fc}
.uprof .caret{color:var(--muted);font-size:.65rem}
.userdrop{display:none;position:absolute;top:46px;right:0;background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 14px 38px rgba(29,43,79,.2);width:280px;padding:14px;z-index:90;cursor:default}
.uprof.open .userdrop{display:block}
.ud-row{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;padding:6px 0;border-bottom:1px dashed var(--line)}
.ud-row span{color:var(--muted)}
.ud-row b{color:var(--ink);word-break:break-all;text-align:right;font-weight:600}
.userdrop .btn{margin-top:10px;width:100%}

.page{padding:22px;max-width:1500px;margin:0 auto;min-height:calc(100vh - 170px)}
.foot{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:var(--muted);font-size:.82rem;padding:20px 16px}
.foot .foot-brand{display:inline-flex}
.foot .logo{height:52px}
.foot .foot-txt{color:var(--muted)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);
  background:#fff;color:var(--ink);font-weight:600;font-size:.92rem;padding:9px 16px;border-radius:10px;cursor:pointer;transition:.15s}
.btn:hover{border-color:var(--blue);color:var(--blue-d)}
.btn.primary{background:var(--grad);border:none;color:#fff}
.btn.primary:hover{filter:brightness(1.06);color:#fff}
.btn.success{background:var(--green);border:none;color:#fff}
.btn.danger{background:#fff;border-color:#f2c6c2;color:var(--red)}
.btn.danger:hover{background:var(--red);color:#fff;border-color:var(--red)}
.btn.ghost{background:transparent}
.btn.sm{padding:5px 11px;font-size:.85rem;border-radius:8px}
.btn.block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.google{background:#fff;border:1px solid var(--line);color:var(--ink)}

/* ---------- forms ---------- */
label{display:block;font-size:.86rem;font-weight:600;color:var(--ink);margin:12px 0 4px}
input[type=text],input[type=password],input[type=number],input[type=email],select,textarea{
  width:100%;padding:9px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;color:var(--ink);background:#fff}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 3px rgba(74,163,240,.18)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.hint{font-size:.8rem;color:var(--muted);margin-top:8px}
.alert{padding:10px 14px;border-radius:10px;font-size:.9rem;margin:10px 0}
.alert.danger{background:#fdeceb;color:#9c2f27;border:1px solid #f5c9c5}
.alert.ok{background:#e8f8f0;color:#0b6e4d;border:1px solid #bfe9d6}
.alert.warn{background:#fdf3e2;color:#8a5a10;border:1px solid #f3ddb2}

/* ---------- auth ---------- */
.authbg{background:var(--bg) radial-gradient(1000px 500px at 80% -10%,rgba(47,127,224,.15),transparent),
  radial-gradient(800px 500px at -10% 110%,rgba(14,159,110,.14),transparent);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.authwrap{display:flex;width:min(880px,100%);background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 14px 50px rgba(29,43,79,.16)}
.authside{flex:1.05;background:var(--grad);color:#fff;display:flex;align-items:center}
.authside-in{padding:44px}
.authside .logo{box-sizing:content-box;background:#fff;padding:12px 18px;border-radius:16px;box-shadow:0 8px 22px rgba(0,0,0,.14)}
.authside h2{color:#fff;font-size:1.7rem;margin:26px 0 10px}
.authside p{opacity:.92;line-height:1.55}
.dots{display:flex;gap:8px;margin-top:26px}
.dots span{width:26px;height:8px;border-radius:6px;background:rgba(255,255,255,.5)}
.dots .d1{background:#fff;width:44px}
.authcard{flex:1;padding:44px 40px;background:#fff}
.authcard h1{margin:0 0 4px}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.82rem;margin:16px 0}
.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}
.authcard form .btn{margin-top:18px}

/* ---------- cards / dashboard ---------- */
.pagehead{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.pagehead h1{margin:0}
.pagehead .grow{flex:1}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.stat{background:var(--card);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow);border-top:4px solid var(--blue)}
.stat.s2{border-top-color:var(--violet)} .stat.s3{border-top-color:var(--amber)} .stat.s4{border-top-color:var(--green)}
.stat b{font-size:1.6rem;color:var(--ink);display:block}
.stat span{font-size:.84rem;color:var(--muted)}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:18px}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.reccard{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:10px;border-left:5px solid var(--blue);transition:.15s}
.reccard:nth-child(3n+2){border-left-color:var(--violet)}
.reccard:nth-child(3n){border-left-color:var(--green)}
.reccard:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(29,43,79,.14)}
.reccard h3{margin:0}
.reccard .ref{font-size:.78rem;color:var(--muted);letter-spacing:.4px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;background:#eef4fc;color:var(--blue-d)}
.chip.g{background:#e8f8f0;color:#0b6e4d}.chip.a{background:#fdf3e2;color:#8a5a10}.chip.v{background:#f0ecff;color:#5b3fd4}
.reccard .actions{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap}

/* ---------- tables ---------- */
table.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th{background:#f6f9fd;color:var(--ink);text-align:left;padding:9px 12px;border-bottom:2px solid var(--line);font-size:.8rem;text-transform:uppercase;letter-spacing:.4px}
.tbl td{padding:8px 12px;border-bottom:1px solid var(--line)}
.tbl tr:hover td{background:#fafcff}

/* ---------- modal ---------- */
.modal-back{position:fixed;inset:0;background:rgba(20,30,55,.45);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.modal-back.open{display:flex}
.modal{background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25);width:min(560px,100%);max-height:92vh;overflow:auto}
.modal .mhead{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.modal .mhead h2{margin:0;font-size:1.05rem}
.modal .mbody{padding:16px 20px}
.modal .mfoot{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}
.x{background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}

/* ---------- toast ---------- */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px}
.toastmsg{background:var(--ink);color:#fff;padding:10px 18px;border-radius:10px;font-size:.9rem;box-shadow:0 6px 20px rgba(0,0,0,.25);animation:tin .2s}
.toastmsg.ok{background:var(--green)} .toastmsg.err{background:var(--red)}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1}}

/* ---------- SLD layout ---------- */
.sldwrap{display:flex;gap:16px;align-items:stretch;height:calc(100vh - 175px);min-height:560px}
.sldcanvas{flex:1;background:#fff;border-radius:var(--r);box-shadow:var(--shadow);overflow:auto;position:relative;
  background-image:linear-gradient(#eef3fa 1px,transparent 1px),linear-gradient(90deg,#eef3fa 1px,transparent 1px);background-size:24px 24px}
.sldcanvas svg{display:block;min-width:100%}
.sldpanel{width:360px;flex:none;background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:18px;overflow:auto}
.sldpanel h2{margin:0 0 2px}
.sldpanel .sub{font-size:.8rem;color:var(--muted);margin-bottom:8px}
.modal .sub{font-size:.8rem;color:var(--muted);margin:-2px 0 4px}
.sldbar{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.sldbar .grow{flex:1}
.legend{display:flex;gap:16px;font-size:.8rem;color:var(--body);background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:6px 14px;position:absolute;bottom:12px;left:12px}
.legend i{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:5px}
.lg-none{background:#fff;border:2px solid #9aa7ba}.lg-decl{background:var(--amber)}.lg-ok{background:var(--green)}.lg-bad{background:var(--red)}
.tapinfo{background:#eef4fc;border:1px solid #cfe0f5;border-radius:10px;padding:10px 12px;font-size:.83rem;color:#274b77;margin-top:10px}
.tapinfo b{display:block;font-size:.72rem;letter-spacing:.8px;color:#3d6db5;margin-bottom:6px}

/* small info icon with a hover/focus tooltip (replaces the always-on help line) */
.infoi{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;
  margin-left:5px;border-radius:50%;background:#3d6db5;color:#fff;font-size:10px;font-weight:700;font-style:normal;
  line-height:1;cursor:help;vertical-align:middle}
.infoi::after{content:'i'}
.infotip{position:absolute;right:0;left:auto;top:calc(100% + 9px);min-width:210px;max-width:270px;
  background:var(--ink);color:#fff;font-weight:400;font-size:.78rem;line-height:1.5;letter-spacing:0;text-transform:none;
  padding:8px 11px;border-radius:8px;box-shadow:0 10px 26px rgba(29,43,79,.32);
  opacity:0;visibility:hidden;transition:.15s;z-index:60;pointer-events:none}
.infotip::before{content:'';position:absolute;right:4px;bottom:100%;border:6px solid transparent;border-bottom-color:var(--ink)}
.infoi:hover .infotip,.infoi:focus .infotip{opacity:1;visibility:visible}
.taps{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px;margin:2px 0 4px}
.taps label{display:inline-flex;align-items:center;gap:7px;margin:2px 0;font-weight:500;white-space:nowrap}
.taps input{width:auto}

/* collapsible attribute set in the element editor */
.attrsec{border-top:1px dashed var(--line);margin-top:14px;padding-top:10px}
.attrhdr{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;padding:4px 0;cursor:pointer;
  font:inherit;font-size:.86rem;font-weight:700;color:var(--ink);text-align:left}
.attrhdr .plus{width:20px;height:20px;flex:none;border:1px solid var(--line);border-radius:6px;background:#f6f9fd;
  display:inline-flex;align-items:center;justify-content:center;font-size:.95rem;line-height:1;color:var(--blue-d)}
.attrhdr:hover .plus{background:#eef4fc;border-color:var(--blue)}
.attrhdr .muted{margin-left:auto;font-weight:500;font-size:.78rem}
.attrsec #p-attrs label:first-child{margin-top:6px}
.badge{font-size:.7rem;font-weight:700;border-radius:999px;padding:2px 9px;vertical-align:middle}
.badge.decl{background:#fdf3e2;color:#8a5a10;border:1px solid #f0d9a8}
.badge.ok{background:#e8f8f0;color:#0b6e4d}
.badge.none{background:#eef1f6;color:#68758c}
.panel-actions{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.panel-links{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px;display:flex;flex-direction:column;gap:8px}

/* SLD svg */
.el-sym{cursor:grab}
.el-sym:active{cursor:grabbing}
.el-sym .shape{stroke:var(--ink);stroke-width:1.6;fill:#fff}
.el-sym text.nm{font:600 12px "Segoe UI",sans-serif;fill:var(--ink)}
.el-sym text.dt{font:11px "Segoe UI",sans-serif;fill:#8a97ad}
.el-sym.sel .halo{fill:none;stroke:var(--blue);stroke-width:1.6;stroke-dasharray:5 4;rx:8}
.wire{stroke:#5b6b85;stroke-width:1.4;fill:none}
.busline{stroke:var(--ink);stroke-width:6;stroke-linecap:round}
.tapdot{stroke:#8a97ad;stroke-width:1.4;fill:#fff}
.tapdot.decl{fill:var(--amber);stroke:#c8871a}
.tapdot.ok{fill:var(--green);stroke:#0b6e4d}
.tapdot.bad{fill:var(--red);stroke:#a3271f}
.tlab{font:10px "Segoe UI",sans-serif;fill:#98a5ba}

/* ---------- upload ---------- */
.upgrid{display:grid;grid-template-columns:400px 1fr;gap:16px;align-items:start}
.dropzone{border:2px dashed #b9cdea;border-radius:14px;background:#f7fafd;padding:34px 20px;text-align:center;color:var(--muted);cursor:pointer;transition:.15s}
.dropzone:hover,.dropzone.drag{border-color:var(--blue);background:#eef4fc;color:var(--blue-d)}
.dropzone b{display:block;color:var(--ink);font-size:1rem;margin-bottom:4px}
.steps{counter-reset:st;display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
.kv{display:grid;grid-template-columns:170px 1fr;gap:4px 12px;font-size:.88rem}
.kv dt{color:var(--muted)}.kv dd{margin:0;color:var(--ink);font-weight:600}
.mapfound{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.mapfound .chip{background:#e8f8f0;color:#0b6e4d}
.mapfound .chip.miss{background:#fdeceb;color:#9c2f27}
.prog{height:8px;background:#e8eef7;border-radius:6px;overflow:hidden;margin-top:10px}
.prog i{display:block;height:100%;background:var(--grad);width:0;transition:width .2s}

/* upload progress — spinner + status line (auto preprocess → upload → report) */
.uploading{display:flex;align-items:center;gap:12px;padding:6px 0}
.uploading .ldr{width:22px;height:22px;flex:none;border:3px solid #d7e2f2;border-top-color:var(--blue-d);border-radius:50%;animation:ldrspin .8s linear infinite}
#pp-status-txt{font-size:.9rem;color:var(--ink);font-weight:500}
@keyframes ldrspin{to{transform:rotate(360deg)}}

/* ---------- report ---------- */
.repgrid{display:grid;grid-template-columns:1fr;gap:16px}
.chartcard{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:14px 16px;page-break-inside:avoid;scroll-margin-top:130px;min-width:0}
.chartcard h3{margin:0 0 8px;display:flex;align-items:center;gap:8px}
.chartcard h3 i{width:10px;height:10px;border-radius:3px;display:inline-block}
.chartcard .cwrap{position:relative;height:310px;overflow:hidden;min-width:0}
.chartcard .cwrap canvas{max-width:100%}
.card{scroll-margin-top:130px}

/* collapsible report sections — header bar with "expand" hint + arrow */
.cardhdr{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;margin:-2px 0 0}
.cardhdr h2,.cardhdr h3{margin:0;flex:0 1 auto}
.cardhdr .exphint{margin-left:auto;font-size:.78rem;color:var(--muted);font-weight:600}
.cardhdr .exphint::before{content:'click here to expand'}
.coll:not(.collapsed) .cardhdr .exphint::before,
.chartcard:not(.collapsed) .cardhdr .exphint::before{content:'click to collapse'}
.cardhdr .arrow{font-size:.9rem;color:var(--blue-d);transition:transform .18s;transform:rotate(0deg)}
.coll:not(.collapsed) .cardhdr .arrow,
.chartcard:not(.collapsed) .cardhdr .arrow{transform:rotate(90deg)}
.collapsed .cardbody{display:none}
.chartcard.collapsed{padding-bottom:12px}

/* per-chart toolbar (full view · reset zoom) + zoom hint */
.chtoolbar{display:flex;justify-content:flex-end;gap:8px;margin:6px 0 2px}

/* full view — a fixed full-screen overlay driven only by the .isfull class.
   No inline height is used, so removing the class restores the chart to its exact size. */
body.chart-full-open{overflow:hidden}
.chartcard.isfull{position:fixed;inset:0;z-index:200;background:#fff;overflow:auto;
  border-radius:0;padding:18px 24px;margin:0;max-width:none}
.chartcard.isfull .cwrap{height:calc(100vh - 150px)!important}
.btn-mini{border:1px solid var(--line);background:#f6f9fd;color:var(--ink);font-size:.76rem;font-weight:600;
  padding:3px 10px;border-radius:8px;cursor:pointer}
.btn-mini:hover{background:#eef4fc}

/* per-chart Max/Min/Avg mini table */
.miniwrap{margin-top:10px;overflow:auto}
.tbl.mini{font-size:.84rem}
.tbl.mini th{padding:6px 10px}
.tbl.mini td{padding:5px 10px}
.tbl.mini td i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:7px}

/* harmonic odd/even order selector */
.hsel{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:4px 0 10px}
.hseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.hseg .hpar{border:none;background:#fff;color:var(--body);font-weight:600;font-size:.82rem;padding:5px 14px;cursor:pointer}
.hseg .hpar.active{background:var(--grad);color:#fff}
.hords{display:flex;flex-wrap:wrap;gap:6px}
.hords .hord{border:1px solid var(--line);background:#f6f9fd;color:var(--ink);font-size:.8rem;font-weight:600;
  padding:4px 11px;border-radius:8px;cursor:pointer}
.hords .hord:hover{background:#eef4fc}
.hords .hord.active{background:var(--blue-d);color:#fff;border-color:var(--blue-d)}
.tbl.mini th i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:6px}

/* Harmonic Analysis chart — multi-select orders + phase filter */
.hsel-col{flex-direction:column;align-items:stretch;gap:14px}
.hselgrp{display:flex;flex-direction:column;gap:7px}
.hlbl{font-size:.78rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.hao{border:1px solid var(--line);background:#f6f9fd;color:var(--ink);font-size:.78rem;font-weight:600;
  padding:4px 9px;border-radius:8px;cursor:pointer;min-width:40px}
.hao:hover{background:#eef4fc}
.hao.active{background:var(--blue-d);color:#fff;border-color:var(--blue-d)}
.hao.off{opacity:.4;cursor:not-allowed;background:#fff}
.hquick{display:flex;gap:8px;margin-top:2px}
.hphase{display:flex;flex-wrap:wrap;gap:8px}
.hph{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--body);
  font-size:.8rem;font-weight:600;padding:5px 12px;border-radius:9px;cursor:pointer}
.hph i{width:10px;height:10px;border-radius:3px;display:inline-block}
.hph.active{background:#eef4fc;border-color:var(--blue-d);color:var(--ink)}
.hph:not(.active){opacity:.5}

/* chart index — sticky pill bar with jump links */
.chartnav{position:sticky;top:66px;z-index:40;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);padding:8px 14px;margin-bottom:14px;display:flex;flex-wrap:wrap;align-items:center;gap:2px;font-size:.86rem}
.chartnav a{color:var(--blue-d);font-weight:600;padding:3px 9px;border-radius:8px;white-space:nowrap}
.chartnav a:hover{background:#eef4fc}
.chartnav .sep{color:#c9d4e4;padding:0 2px}

/* click-to-inspect value strip */
.chartdetail{margin-top:8px;background:#f6f9fd;border:1px solid var(--line);border-radius:10px;padding:8px 12px;
  font-size:.85rem;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;color:var(--body)}
.chartdetail .dv i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:5px}
.chartdetail b{color:var(--ink)}
.chartdetail .hintc{color:var(--muted);font-size:.78rem}

/* back-to-top */
.totop{position:fixed;right:26px;bottom:26px;z-index:120;width:46px;height:46px;border-radius:50%;border:none;
  background:var(--grad);color:#fff;font-size:1.25rem;cursor:pointer;box-shadow:0 8px 22px rgba(29,43,79,.35);
  display:none;align-items:center;justify-content:center}
.totop.show{display:flex}
.repcover{background:var(--grad);border-radius:var(--r);color:#fff;padding:28px;margin-bottom:18px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.repcover h1{color:#fff;margin:0}
.rp-allbtn{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.55);color:#fff;font-weight:600}
.rp-allbtn:hover{background:rgba(255,255,255,.3);color:#fff;border-color:#fff}
.repcover .meta{font-size:.9rem;opacity:.95}
.obs-min{color:var(--blue-d);font-weight:600}.obs-max{color:var(--red);font-weight:600}.obs-avg{color:var(--green);font-weight:600}

/* ---------- element / load types (admin master data) ---------- */
.hidden{display:none!important}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace}
.row{display:flex;align-items:center;gap:10px}
.row.btw{justify-content:space-between}
.subtabs{display:flex;gap:2px;border-bottom:2px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.subtabs span{padding:8px 14px;font-size:.88rem;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px}
.subtabs span:hover{color:var(--ink)}
.subtabs span.on{color:var(--blue-d);border-bottom-color:var(--blue-d)}
.tsearch{width:200px}
.box{margin-bottom:14px}
.box .boxh{font-size:.72rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.lbl2{font-size:.86rem;font-weight:600;color:var(--ink);margin:12px 0 4px}
.tdgrid{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.tdmain{flex:1;min-width:320px}
.tdside{width:240px;flex:none}
.symprev{height:96px;border:1px dashed var(--line);background:#f7fafd;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-top:4px}
.verwarn{border:1px solid #4aa3f0;background:#f5f7fc;border-radius:10px;padding:10px 12px;margin-top:12px;font-size:.82rem;color:var(--ink);line-height:1.6}
.chk{display:flex;align-items:center;gap:8px;font-weight:500;margin:6px 0}
.chk input{width:auto}
#td-attrs-tbl input[type=text],#td-attrs-tbl select{padding:5px 8px;border-radius:8px}

/* solutions — inputs strip, variant cards, report notes */
.solinputs{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.solin-h{font-size:.72rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);width:100%}
.solin{display:flex;flex-direction:column;font-size:.82rem;color:var(--muted)}
.solin b{color:var(--ink);font-size:.95rem}
.solgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.solcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:14px}
.solcard.sel{border-color:var(--green,#0e9f6e);box-shadow:0 0 0 2px rgba(14,159,110,.15),var(--shadow)}
.solhd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.solrow{display:flex;align-items:center;gap:8px;margin:5px 0}
.solrow span{width:88px;flex:none;font-size:.78rem;font-weight:600;color:var(--muted)}
.solrow input{padding:5px 8px;border-radius:8px;font-size:.85rem}
.solft{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:9px;border-top:1px solid var(--line)}
.solnote{font-size:.85rem;color:var(--body);margin-top:5px;line-height:1.55}

/* settings console — left menu, right content */
.setwrap{display:flex;gap:18px;align-items:flex-start}
.setnav{width:236px;flex:none;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:10px;position:sticky;top:78px}
.setnav-h{font-size:.7rem;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--muted);padding:8px 10px 8px}
.setlink{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:10px;color:var(--body);
  font-weight:600;font-size:.9rem;cursor:pointer;margin-bottom:3px;transition:.15s}
.setlink:hover{background:#eef4fc;color:var(--blue-d)}
.setlink.on{background:var(--grad);color:#fff}
.setmain{flex:1;min-width:0}
.setpane .pagehead{margin-bottom:14px}
@media(max-width:900px){
  .setwrap{flex-direction:column}
  .setnav{width:auto;position:static;display:flex;flex-wrap:wrap;gap:6px}
  .setnav-h{width:100%}
  .setlink{margin-bottom:0}
}

/* meter profiles + auto-mapping builder */
#me-map-tbl input[type=text],#me-map-tbl select,#me-scan input[type=text],#me-scan select{padding:5px 8px;border-radius:8px;font-size:.85rem}
.confbar{display:inline-block;width:56px;height:7px;background:#e8eef7;border-radius:5px;overflow:hidden;vertical-align:middle;margin-right:6px}
.confbar i{display:block;height:100%;width:0}
#me-scan .box{margin-bottom:0}
#me-dz.drag{border-color:var(--blue);background:#eef4fc}

@media print{
  .topbar,.foot,.noprint,#toast,.chartnav,.totop,.chartdetail,.chtoolbar,.hsel,.cardhdr .exphint,.cardhdr .arrow{display:none!important}
  .page{padding:0;max-width:none}
  body{background:#fff}
  .chartcard,.card{box-shadow:none;border:1px solid #dfe6ef}
  .repgrid{grid-template-columns:1fr 1fr}
  .collapsed .cardbody{display:block!important}
  .cardhdr{cursor:default}
}
@media (max-width:1000px){
  .sldwrap{flex-direction:column;height:auto}
  .sldpanel{width:auto}
  .upgrid{grid-template-columns:1fr}
  .authside{display:none}
}

/* ── Solution panel (solution-spec §08–§12) ── */
.wrap{flex-wrap:wrap}
.mid{align-items:center}
.sol-final td{background:#eafaf1}
.sol-inv td{background:#fdf1f1}
.sol-strike{color:#9aa2b1;text-decoration:line-through}
.sol-lbl{display:block;font-size:.72rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.sol-sel,.sol-in{width:100%;border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:.92rem;background:#fff;color:var(--ink)}
.sol-in-sm{width:120px;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:.92rem}
.sol-in-xs{width:72px;border:1px solid var(--line);border-radius:6px;padding:3px 6px;font-size:.85rem;text-align:center}
.sol-harm{width:auto;margin:6px 0 0}
.sol-harm th,.sol-harm td{padding:4px 10px}
.sol-x{color:var(--red);cursor:pointer;font-size:.9rem;user-select:none}
.sol-drop{padding:18px 14px;margin:0}
.sol-detail-frame{width:100%;height:460px;border:1px solid var(--line);border-radius:10px;background:#fbfcfe;margin-top:2px}
.sol-detail-meta{display:flex;gap:34px;flex-wrap:wrap;margin-top:10px;font-size:.9rem}
.sol-cap{display:block;font-size:.7rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.sol-sumbox{background:#f5f7fb;border-radius:10px;padding:10px 12px;margin-top:10px;font-size:.85rem;text-align:left}
.sol-spin{width:34px;height:34px;border-radius:50%;border:3px solid #e3e9f4;border-top-color:var(--blue);animation:solspin .8s linear infinite;margin:0 auto}
@keyframes solspin{to{transform:rotate(360deg)}}
