/* ── cards ── */
.card{position:absolute;width:215px;background:var(--bg-panel);border:1px solid var(--border-card);
      border-radius:9px;overflow:hidden;box-shadow:var(--shadow-card);pointer-events:all}
.card.sel{border-color:var(--accent-dark);box-shadow:0 0 0 2px rgba(59,130,246,.25),var(--shadow-card)}
.card.msel{border-color:#f59e0b;box-shadow:0 0 0 2px rgba(245,158,11,.25),var(--shadow-card)}
.rubber-band{position:fixed;pointer-events:none;border:1.5px dashed var(--accent,#4f8ef7);background:rgba(79,142,247,.06);z-index:9999}
.hdr{padding:6px 10px 5px;cursor:grab;border-bottom:1px solid var(--hdr-border);position:relative;background:var(--hdr-bg)}
.card-note{padding:4px 10px;font-size:10px;color:var(--text-secondary);font-style:italic;border-bottom:1px solid var(--border-subtle);background:var(--bg-panel)}
.hdr-edit{position:absolute;top:50%;right:4px;transform:translateY(-50%);
  background:var(--edit-bg);border:none;color:var(--edit-color);cursor:pointer;
  width:18px;height:18px;padding:0;display:flex;align-items:center;justify-content:center;
  border-radius:50%;opacity:0;transition:opacity .15s;z-index:var(--z-card-ui)}
.hdr-edit .lucide{width:10px;height:10px}
.hdr:hover .hdr-edit{opacity:1}
.hdr-edit:hover{color:var(--edit-hover-color);background:var(--edit-hover-bg)}
.hdr:active{cursor:grabbing}
.cn{font-size:11px;font-weight:700;color:var(--text-bright);letter-spacing:.02em}
.cp{font-size:8px;color:var(--text-muted);margin-top:1px}
table{width:100%;border-collapse:collapse}
tr.pr{cursor:pointer}
tr.pr:hover td{background:var(--row-hover)}
tr.pr.apin td{background:rgba(37,99,235,.32)}
td{padding:2px 5px;font-size:9px;border-top:1px solid var(--row-border);
   white-space:nowrap;color:var(--text-secondary)}
.pn{font-weight:700;font-size:8.5px;text-align:center;width:20px}
.pd{width:14px;text-align:center}
.pf{overflow:hidden;text-overflow:ellipsis;max-width:114px;color:var(--text-light)}
.pw{text-align:right;font-size:7.5px;padding-right:4px}
.pw-cab{display:inline-block;font-size:6.5px;color:var(--text-secondary);background:rgba(100,116,139,.18);
  border-radius:3px;padding:0 3px;margin-left:3px;vertical-align:middle;letter-spacing:.3px}
.pw-ins{display:inline-block;font-size:6.5px;color:var(--accent-light);background:rgba(96,165,250,.12);
  border-radius:3px;padding:0 3px;margin-left:3px;vertical-align:middle}
.ptarget{font-size:8px;color:var(--text-muted);padding:1px 3px;white-space:nowrap}
.pr-subrow .pn{visibility:hidden}
.pr-subrow .pf{visibility:hidden}
.pr-subrow .pa{visibility:hidden}
.pr-subrow .pnote{visibility:hidden}
.st-badge{font-size:7px;padding:0 3px;border-radius:3px;margin-left:3px;vertical-align:middle;white-space:nowrap}
.st-emi-A{background:rgba(239,68,68,.18);color:var(--danger-light)}
.st-emi-B{background:rgba(234,179,8,.15);color:var(--warn-light)}
.st-emi-C{background:rgba(148,163,184,.15);color:var(--text-secondary)}
html[data-theme="light"] .st-emi-A{background:rgba(239,68,68,.12);color:#991b1b}
html[data-theme="light"] .st-emi-B{background:rgba(217,119,6,.14);color:#92400e}
html[data-theme="light"] .st-emi-C{background:rgba(100,116,139,.14);color:#334155}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;
     border:1px solid rgba(0,0,0,.4);vertical-align:middle}

/* ── component cards (diode, resistor, splice) ── */
/* schematic symbol row inside standard connector card layout (fuse/resistor/diode/eyelet/splice) */
.comp-sym-row{display:flex;align-items:center;justify-content:center;
              padding:6px 8px 4px;opacity:.75}
.comp-sym-row svg{display:block;max-width:100%}
/* ── component icon node (resistor / diode in compact mode) ── */
.card--comp-icon{width:auto;background:transparent;border:none;box-shadow:none;overflow:visible}
.card--comp-icon.sel .comp-icon-dot svg{filter:drop-shadow(0 0 3px #3b82f6)}
.comp-icon-dot{position:relative;display:inline-flex;flex-direction:column;align-items:center;
               gap:4px;cursor:grab;padding:2px;overflow:visible}
.comp-icon-dot:active{cursor:grabbing}
.comp-icon-label{font-size:13px;font-weight:600;color:var(--text-secondary);white-space:nowrap;
                 text-align:center;max-width:120px;overflow:hidden;text-overflow:ellipsis}
/* compact-mode resistor: smaller symbol + label to save space */
.card--comp-icon[data-comp-type="resistor"] .comp-icon-dot{gap:2px;padding:1px}
.card--comp-icon[data-comp-type="resistor"] svg{width:44px;height:14px}
.card--comp-icon[data-comp-type="resistor"] .comp-icon-label{font-size:10px;max-width:90px}
.comp-icon-dot .splice-edit{position:absolute;top:-6px;right:-18px;z-index:var(--z-card-ui)}
.comp-icon-dot:hover .splice-edit{opacity:1}
.comp-pin{display:flex;align-items:center;gap:5px;padding:3px 8px;
          cursor:pointer;transition:background .1s}
.comp-pin:hover{background:rgba(255,255,255,.04)}
.comp-pin.apin{background:rgba(37,99,235,.32)}
/* ── splice node ── */
.card--splice{width:auto;background:transparent;border:none;box-shadow:none;overflow:visible}
.card--splice.sel .splice-dot svg circle:first-child{stroke:#3b82f6}
.splice-dot{position:relative;display:inline-flex;flex-direction:column;align-items:center;
            gap:3px;cursor:grab;padding:2px}
.splice-dot:active{cursor:grabbing}
.splice-label{font-size:10px;font-weight:600;color:var(--text-secondary);white-space:nowrap;
              text-align:center;max-width:70px;overflow:hidden;text-overflow:ellipsis}
.splice-edit{position:absolute;top:-6px;right:-18px;opacity:0;
  background:var(--edit-bg);border:none;color:var(--edit-color);cursor:pointer;
  width:18px;height:18px;padding:0;display:flex;align-items:center;justify-content:center;
  border-radius:50%;transition:opacity .15s;z-index:var(--z-card-ui)}
.splice-edit .lucide{width:10px;height:10px}
.splice-edit:hover{color:var(--edit-hover-color);background:var(--edit-hover-bg)}
.splice-dot:hover .splice-edit{opacity:1}

.comp-vd{padding:3px 8px 5px;font-size:9px;color:var(--text-muted);text-align:center;border-top:1px solid rgba(0,0,0,.2)}
.comp-vd span{color:var(--text-secondary)}

/* ── add / component dropdown ── */
.comp-dd{position:relative;display:inline-flex}
.comp-menu{position:fixed;z-index:var(--z-menu);
           background:var(--bg-elevated);border:1px solid var(--border-strong);border-radius:8px;
           padding:4px;min-width:160px;display:none;flex-direction:column;gap:1px;
           box-shadow:var(--shadow-sm)}
.comp-menu.open{display:flex}
.comp-menu-section{font-size:9px;font-weight:700;color:var(--text-dim);text-transform:uppercase;
                   letter-spacing:.07em;padding:5px 10px 3px}
.comp-menu-sep{height:1px;background:var(--border);margin:3px 4px}
.comp-opt{display:flex;align-items:center;gap:8px;padding:7px 10px;font-size:11px;
          font-weight:500;color:var(--text-secondary);background:transparent;border:none;
          border-radius:5px;cursor:pointer;white-space:nowrap;text-align:left;transition:all .1s}
.comp-opt svg.lucide{width:12px;height:12px;flex-shrink:0}
.comp-opt:hover{background:var(--bg-hover);color:var(--text)}

/* ── card FLRY badge ── */
.hdr-badge{min-width:18px;height:18px;border-radius:9px;font-size:9px;
  font-weight:700;padding:0 5px;display:flex;align-items:center;
  justify-content:center;line-height:1}
.hdr-badge--warn  {background:var(--warn-border);color:var(--warn-light);border:1px solid var(--warn)}
.hdr-badge--danger{background:var(--danger-border);color:var(--danger-light);border:1px solid var(--danger)}
.hdr-badge--over{background:var(--badge-over-bg);color:var(--badge-over-text);border:1px solid var(--badge-over-border)}
.hdr-badges{position:absolute;top:50%;right:24px;transform:translateY(-50%);display:flex;gap:3px;cursor:pointer;z-index:var(--z-card-badges)}
.hdr-badges:hover .hdr-badge{filter:brightness(1.3)}

/* ── card pin FLRY row indicators ── */
.pr-flry-danger{border-left:3px solid var(--danger)}
.pr-flry-warn  {border-left:3px solid var(--warn)}
.pr-flry-over  {border-left:3px solid var(--accent-muted)}

/* floating pin table (compact view) */
.card-pintbl{min-width:280px;width:auto}
.card-pintbl-hdr{cursor:grab;padding:4px 10px 3px}
.card-pintbl-hdr:active{cursor:grabbing}
.card-pintbl-hdr .cn{font-size:9px;font-weight:700}
.card-pintbl-hdr .cp{font-size:7.5px;color:var(--text-muted);margin-top:1px}
/* extra pintbl columns */
.pa{text-align:right;font-size:7.5px;color:var(--accent-bright);white-space:nowrap;padding-right:3px}
.psz{text-align:right;font-size:7.5px;color:var(--success-light);white-space:nowrap;padding-right:3px}
.plen{text-align:right;font-size:7.5px;color:var(--warn-dark);white-space:nowrap;padding-right:3px}
.lock-icon{width:9px;height:9px;vertical-align:-1px;opacity:.6}
.pnote{font-size:7.5px;color:var(--text-secondary);max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* harness auto-length indicator */
.ac-len--auto{background:var(--success-bg) !important;border-color:var(--success-border) !important}
.ac-len--auto:focus{border-color:var(--success) !important}

/* ── context menu ── */
#ctx-menu{position:fixed;z-index:var(--z-ctx);display:none;flex-direction:column;
  min-width:180px;padding:4px 0;
  background:var(--bg-elevated);border:1px solid var(--border-strong);
  border-radius:8px;box-shadow:var(--shadow-sm);font-size:11px;color:var(--text)}
#ctx-menu.open{display:flex}
.ctx-item{display:flex;align-items:center;gap:8px;padding:6px 12px;cursor:pointer;white-space:nowrap;
  border:none;background:none;color:inherit;font:inherit;width:100%;text-align:left}
.ctx-item:hover{background:var(--bg-hover)}
.ctx-item--danger{color:var(--danger)}
.ctx-item--danger:hover{background:var(--danger-hover-bg)}
.ctx-item svg,.ctx-item i{width:14px;height:14px;flex-shrink:0}
.ctx-sep{height:1px;background:var(--border);margin:3px 6px}
.ctx-section{font-size:9px;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;padding:4px 12px 2px;pointer-events:none}
.ctx-sub{position:relative}
.ctx-sub .ctx-submenu{display:none;position:absolute;left:100%;top:-4px;
  min-width:150px;padding:4px 0;
  background:var(--bg-elevated);border:1px solid var(--border-strong);
  border-radius:8px;box-shadow:var(--shadow-sm);flex-direction:column}
.ctx-sub:hover .ctx-submenu{display:flex}
.ctx-sub>.ctx-item::after{content:"›";margin-left:auto;opacity:.5}

/* ── System diagram blocks ── */
.sys-block{position:absolute;min-width:220px;background:var(--bg-panel);border:1px solid var(--border-card);
  border-radius:10px;overflow:hidden;box-shadow:var(--shadow-card);pointer-events:all;font-size:12px}
.sys-block--shared{border-color:#f59e0b;border-style:dashed;min-width:180px}
.sys-block__hdr{padding:7px 12px 6px;border-bottom:1px solid var(--hdr-border);background:var(--hdr-bg);
  display:flex;align-items:center;gap:6px;user-select:none}
.sys-block__hdr--shared{background:rgba(245,158,11,.1)}
.sys-block__list{padding:4px 0;max-height:280px;overflow-y:auto}
.sys-block__footer{padding:4px 12px;font-size:10px;color:var(--text-secondary);
  border-top:1px solid var(--border-subtle);background:var(--bg-subtle)}
.sys-block__empty{padding:8px 12px;color:var(--text-secondary);font-style:italic}
.sys-conn-row{padding:3px 12px;display:flex;align-items:center;gap:6px;cursor:default}
.sys-conn-row:hover{background:var(--bg-hover)}
.sys-conn-icon{font-size:11px;color:var(--text-secondary);width:14px;text-align:center;flex-shrink:0}
.sys-conn-icon--shared{color:#f59e0b}
.sys-conn-icon--mated{color:#3b82f6}
.sys-conn-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sys-conn-pins{color:var(--text-secondary);font-size:10px;flex-shrink:0}
.sys-conn-part{color:var(--text-secondary);font-size:9px;flex-shrink:0;max-width:80px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sys-type-badge{font-size:9px;color:var(--text-secondary);background:var(--bg-subtle);
  padding:1px 5px;border-radius:3px;margin-left:auto}
/* shared badge on regular diagram cards */
.shared-badge{display:inline-flex;align-items:center;gap:3px;font-size:9px;
  color:#f59e0b;background:rgba(245,158,11,.1);padding:1px 6px;border-radius:3px;margin-left:4px}
/* cross-diagram mating badge on connector card header */
.mate-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;border-radius:9px;font-size:10px;line-height:1;
  color:#a5b4fc;background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.45);
  padding:0 4px;cursor:pointer}
.mate-badge:hover{background:rgba(99,102,241,.24);filter:brightness(1.2)}