/* A parts figure from the user's own manual with clickable callouts, and the parts-list-first panel. */
.stage.fig{cursor:default;background:#e9ecee}
#fview{position:absolute;inset:0;overflow:hidden}
.fcanvas{position:absolute;inset:0;cursor:grab;touch-action:none}
#fview.panning .fcanvas{cursor:grabbing}
.fworld{position:absolute;left:0;top:0;transform-origin:0 0;background:#fff;box-shadow:0 1px 2px rgba(20,30,40,.12),0 8px 28px rgba(20,30,40,.10);
  transition:opacity .18s ease;will-change:transform}
.fworld.swap{opacity:0}
.fworld img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none;pointer-events:none}
#fsvg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}

/* callouts: outlined = linked to a parts row; dashed grey = not in the parts list */
g.co{cursor:pointer}
g.co .hit{fill:transparent;stroke:none}
g.co .bx{fill:rgba(11,110,117,.07);stroke:#0b6e75;stroke-width:1.6;vector-effect:non-scaling-stroke;
  transition:fill .15s ease,stroke .15s ease,stroke-width .15s ease,opacity .2s ease}
g.co.un .bx{fill:rgba(138,151,168,.06);stroke:#8a97a8;stroke-dasharray:4 3}
g.co:hover .bx{fill:rgba(11,110,117,.16);stroke-width:2.4}
g.co.rel .bx{fill:rgba(184,86,26,.10);stroke:#b8561a;stroke-width:2}
g.co.sel .bx{fill:rgba(184,86,26,.20);stroke:#b8561a;stroke-width:3}
g.co.hitq .bx{fill:rgba(255,213,74,.45);stroke:#a37a00;stroke-width:2.4}
g.co.dim .bx{opacity:.35}
g.co .pulse{fill:none;stroke:#b8561a;stroke-width:3;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;
  animation:fpulse .55s cubic-bezier(.2,.7,.3,1) 2;pointer-events:none}
@keyframes fpulse{from{transform:scale(1);opacity:.95}to{transform:scale(2.1);opacity:0}}

.fzoom{position:absolute;right:16px;bottom:54px;z-index:5;display:flex;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px;
  box-shadow:0 1px 3px rgba(20,30,40,.08)}
.fzoom button{border:0;background:transparent;border-radius:7px;min-width:34px;height:30px;padding:0 9px;cursor:pointer;font-weight:650;color:#3b434a;font-size:15px}
.fzoom button:hover{background:var(--soft)}
.fzoom button.on{color:var(--accent)}
.fcap{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;align-items:center;gap:12px;padding:8px 16px;background:rgba(255,255,255,.94);
  border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden}
.fcap b{color:var(--ink);font-size:13px;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:40%}
.fcap span{overflow:hidden;text-overflow:ellipsis}
.fcap .keys{margin-left:auto;flex:none;display:flex;align-items:center;gap:6px}
.fcap .keys i{display:inline-block;width:16px;height:11px;border-radius:3px;margin-left:8px}
.fcap .k1{border:1.6px solid #0b6e75;background:rgba(11,110,117,.07)}
.fcap .k2{border:1.6px dashed #8a97a8}
.fpick{display:inline-flex;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px;max-width:min(560px,46vw)}
.fpick button{border:0;background:transparent;border-radius:7px;width:30px;height:28px;cursor:pointer;font-size:18px;line-height:1;color:#3b434a}
.fpick button:hover{background:var(--soft)}
.fpick select{border:0;background:transparent;font:600 13px/1.2 inherit;color:var(--ink);padding:4px 6px;min-width:0;max-width:100%;text-overflow:ellipsis;cursor:pointer}
.fpick select:disabled{cursor:default;opacity:1;appearance:none;-webkit-appearance:none}
.chip.fchip{background:var(--accent-soft);color:var(--accent);font-weight:600}
.chip.warn{background:var(--warn-bg);color:var(--warn-ink)}

/* parts table: callout, part number, description, page */
.ftab{margin:6px 0 4px}
.ftab th:first-child{width:62px}
.ftab th{white-space:nowrap}
.ftab td{cursor:pointer}
.ftab td.co{white-space:normal;max-width:104px}
.ftab td{overflow-wrap:anywhere}
.ftab td.pn{font-weight:600;white-space:normal}
.ftab td.pg{white-space:nowrap;width:48px}
.ftab tbody tr{transition:background .15s ease}
.ftab tbody tr:hover td{background:#f6f8f9}
.ftab tr.sel td{background:#fdf0e5}
.ftab tr.sel td:first-child{box-shadow:inset 3px 0 0 #b8561a}
.ftab tr.flash td{background:#fff3c4}
.cchip{display:inline-block;min-width:24px;padding:0 6px;margin:0 3px 3px 0;border:1.5px solid #0b6e75;border-radius:6px;color:#0b6e75;background:#fff;
  font:700 12px/20px ui-monospace,SFMono-Regular,Menlo,monospace;text-align:center;cursor:pointer;white-space:nowrap;overflow-wrap:normal}
.cchip:hover{background:#e3f1f1}
.cchip.sel,tr.sel .cchip{border-color:#b8561a;color:#b8561a}
.cchip.un{border-color:#8a97a8;border-style:dashed;color:#5f6871}
.cchip.off{border-color:#c9d0d6;color:#5f6871;cursor:default}
.ftab .none{color:#b0b8c0}
.nopn{color:var(--muted);font-style:italic;font-weight:400;font-family:inherit;font-size:12px}
.unl{margin:2px 0 6px}
.cnt{font-weight:500;color:var(--muted);font-size:13px;margin-left:6px}

/* the selected callout or row: stays in view while the table scrolls under it */
.fsel{position:sticky;top:-14px;z-index:2;background:#fff;border:1.5px solid #b8561a;border-radius:10px;padding:9px 11px 6px;margin:0 0 10px;
  box-shadow:0 6px 14px -10px rgba(184,86,26,.6);animation:fin .22s cubic-bezier(.16,1,.3,1)}
@keyframes fin{from{transform:translateY(-4px);opacity:0}to{transform:none;opacity:1}}
.fsh{display:flex;align-items:center;gap:6px;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:650;margin-bottom:4px}
.fsh .cchip{text-transform:none;letter-spacing:0;margin:0}
.fsh .x{margin-left:auto;cursor:pointer;font-size:18px;line-height:1;color:var(--muted);padding:0 2px}
.fsh .x:hover{color:var(--ink)}
.fe{padding:5px 0;border-top:1px solid var(--soft)}
.fe:first-of-type{border-top:0}
.fpn{font:700 15px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink)}
.fpn .or{font:500 12px system-ui,sans-serif;color:var(--muted);margin:0 4px}
.fd{font-size:13.5px;font-weight:550}

/* list view: no figure and no drawing for this device type: the parts list takes the page */
#result.listonly .stage{display:none}
#result.listonly .panel{flex:1;width:auto;border-left:0;background:var(--bg)}
#result.listonly .search,#result.listonly .pbody{width:100%;max-width:1040px;margin:0 auto}
#result.listonly .search{border-bottom:0;padding-top:18px}
#result.listonly .pbody{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:18px;padding:16px 20px 24px}
#result.listonly .ftab td.pn{white-space:normal}
.lnote{background:#f3f6f8;border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-size:13px;color:#3b434a;margin:0 0 14px}
.lnote b{color:var(--ink)}
