/* Le fil conducteur SENTEKIA (voir assets/javascripts/fil.js). Rouge #E54325 par défaut, lisible sur noir et sur beige ;
   une page peut prendre la couleur de sa marque avec --fil-c sur l'hôte (études de cas). */
[data-fil-host] { position: relative; --fil-bg: #050505; --fil-c: #E54325; }
.fil-pcb { position: absolute; left: 0; top: 0; z-index: 3; overflow: visible; pointer-events: none; }
.fil-pcb path { fill: none; stroke-linecap: square; stroke-linejoin: miter; }
.fil-base path { stroke: rgba(128, 128, 128, 0.3); stroke-width: 2; }
.fil-base .is-frame { stroke: rgba(128, 128, 128, 0.2); stroke-width: 1.5; }
.fil-live path { stroke: var(--fil-c); stroke-width: 2.4; }
.fil-live { filter: drop-shadow(0 0 3px color-mix(in srgb, var(--fil-c) 90%, transparent)) drop-shadow(0 0 10px color-mix(in srgb, var(--fil-c) 45%, transparent)); }
.fil-live .is-frame { stroke-width: 4; }
.fil-dot { fill: rgba(128, 128, 128, 0.45); }
.fil-ring { fill: var(--fil-bg); stroke: rgba(128, 128, 128, 0.4); stroke-width: 3; }
.fil-end { fill: none; stroke: rgba(128, 128, 128, 0.4); stroke-width: 3; }
.fil-live .fil-dot, .fil-live .fil-term, .fil-live .fil-end { opacity: 0; transition: opacity 0.3s ease; }
.fil-live .fil-dot { fill: var(--fil-c); }
.fil-live .fil-ring, .fil-live .fil-end { stroke: var(--fil-c); }
.fil-live .is-on, .fil-live .fil-term .fil-dot { opacity: 1; }
/* Embrasement au contact, puis la bordure reste allumée ; une relance rejoue l'éclat */
.fil-live .fil-ignite { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 0.9s cubic-bezier(0.3, 0.7, 0.2, 1); }
.fil-live .fil-ignite.is-on { stroke-dashoffset: 0; animation: fil-flash 1.1s ease-out; }
.fil-live .fil-ignite.is-on.is-pulse { animation-name: fil-flash-b; }
.fil-live .fil-ignite.is-on.is-quiet { animation: none; transition: none; }
@keyframes fil-flash { 0%, 35% { stroke: #fff; stroke-width: 6; } 100% { stroke: var(--fil-c); stroke-width: 4; } }
@keyframes fil-flash-b { 0%, 35% { stroke: #fff; stroke-width: 6; } 100% { stroke: var(--fil-c); stroke-width: 4; } }
.fil-spark { position: absolute; left: 0; top: 0; z-index: 4; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--fil-c) 60%, transparent), 0 0 24px 8px color-mix(in srgb, var(--fil-c) 55%, transparent); opacity: 0; pointer-events: none; transition: opacity 0.25s ease; will-change: transform; }
@media (prefers-reduced-motion: reduce) {
  .fil-live .fil-ignite { transition: none; }
  .fil-live .fil-ignite.is-on { animation: none; }
}