/* Fixed terminal hit targets (loaded after trainer.css and the level CSS).
   trainer.css v5.63 and the dense-terminal loupe magnified the terminal BUTTON on
   hover (2x, or 2.7x on PLC/contactor/relay blocks). A scaled button is a scaled
   hit box, so a hovered terminal covered its neighbours' centres and swallowed the
   next click (e.g. clicking PBK landed on PBU). The button now keeps its real size
   and position in every state; the magnified ring is a ::before halo with
   pointer-events:none, so it is visual only. */
.photo-stage .wire-terminal::before{
  content:""; position:absolute; left:50%; top:50%; width:100%; height:100%;
  border-radius:50%; pointer-events:none; box-sizing:border-box;
  transform:translate(-50%,-50%) scale(1); opacity:0;
  border:2px solid #2474c6; background:rgba(36,116,198,.15);
  box-shadow:0 0 0 3px rgba(36,116,198,.30), 0 2px 7px rgba(0,0,0,.22);
  transition:transform .08s ease, opacity .08s ease;
}
@media (hover: hover){
  .photo-stage .wire-terminal:hover,
  .dev-plc      .photo-stage .wire-terminal:hover,
  .dev-ps       .photo-stage .wire-terminal:hover,
  .dev-clx      .photo-stage .wire-terminal:hover,
  .dev-di       .photo-stage .wire-terminal:hover,
  .dev-do       .photo-stage .wire-terminal:hover,
  .dev-safrelay .photo-stage .wire-terminal:hover,
  .dev-contactor .photo-stage .wire-terminal:hover{
    transform:translate(-50%,-50%);   /* same box as at rest: no bigger hit area */
    z-index:30;                        /* no raise over neighbours either */
    box-shadow:none;
  }
  .photo-stage .wire-terminal:hover::before{ opacity:1; transform:translate(-50%,-50%) scale(2); }
  .dev-plc      .photo-stage .wire-terminal:hover::before,
  .dev-ps       .photo-stage .wire-terminal:hover::before,
  .dev-clx      .photo-stage .wire-terminal:hover::before,
  .dev-di       .photo-stage .wire-terminal:hover::before,
  .dev-do       .photo-stage .wire-terminal:hover::before,
  .dev-safrelay .photo-stage .wire-terminal:hover::before,
  .dev-contactor .photo-stage .wire-terminal:hover::before{
    transform:translate(-50%,-50%) scale(2.7); background:rgba(232,243,255,.55);
    box-shadow:0 0 0 2px rgba(255,255,255,.95), 0 0 0 4px rgba(36,116,198,.55), 0 3px 11px rgba(0,0,0,.32);
  }
  .guard-qd .wire-terminal:hover{ transform:none; }
}
.photo-stage .wire-terminal.selected::before{ opacity:1; transform:translate(-50%,-50%) scale(1.6); border-color:#2474c6; background:rgba(36,116,198,.22); }
@media (prefers-reduced-motion: reduce){ .photo-stage .wire-terminal::before{ transition:none; } }
