/* Virtual Lab current-flow overlay (js/lab-flow.js) */
.lf-bar { display:flex; flex-wrap:nowrap; align-items:center; gap:10px; margin:0 0 8px; font-size:13px; }
.lf-btn { font:inherit; padding:5px 12px; border:1px solid var(--charcoal,#1A1A1A); border-radius:6px; background:#fff; color:var(--charcoal,#1A1A1A); cursor:pointer; }
.lf-status { color:#555; font-size:13px; line-height:1.35; margin:8px 0 0; height:5.6em; overflow:auto; }
@media (max-width:600px) { .lf-status { height:9.5em; } }
.lf-dots { fill:none; stroke:#F5A400; stroke-width:5; stroke-linecap:round; stroke-dasharray:0 14; animation:lf-flow 1s linear infinite; pointer-events:none; }
@keyframes lf-flow { to { stroke-dashoffset:-14; } }
.lf-note { font-size:11px; font-weight:700; fill:#1A1A1A; pointer-events:none; }
.lf-note.lf-warn { fill:var(--red,#CC0000); }
@media (prefers-reduced-motion: reduce) { .lf-dots { animation:none; } }
.lf-ac { fill:none; stroke-width:6; stroke-linecap:round; stroke-dasharray:0 14; pointer-events:none; animation:lf-ac 2.4s ease-in-out infinite alternate; }
@keyframes lf-ac { from { stroke-dashoffset:0; } to { stroke-dashoffset:-28; } }
.lf-rotor { animation:lf-spin 0.9s linear infinite; }
.lf-rotor.is-slow { animation-duration:3.6s; }
.lf-rotor.is-off { animation:none; }
@keyframes lf-spin { to { transform:rotate(360deg); } }
.lf-shake { animation:lf-shake .14s linear infinite; }
@keyframes lf-shake { 0% { transform:translate(790px,150px); } 25% { transform:translate(791.5px,149px); } 50% { transform:translate(790px,151px); } 75% { transform:translate(788.5px,149.5px); } 100% { transform:translate(790px,150px); } }
.lf-pill { cursor:pointer; outline:none; }
.lf-pill[aria-disabled="true"] { cursor:not-allowed; }
.lf-pill:hover rect, .lf-pill:focus-visible rect { stroke:#F5A400; stroke-width:2.5; }
.lf-pill.is-down { transform:translateY(2px); }
@media (prefers-reduced-motion: reduce) { .lf-ac, .lf-rotor, .lf-shake { animation:none; } }
@keyframes lf-shake-a { 0% { transform:translate(1270px,145px) scale(.88); } 25% { transform:translate(1271.5px,144px) scale(.88); } 50% { transform:translate(1270px,146px) scale(.88); } 75% { transform:translate(1268.5px,144.5px) scale(.88); } 100% { transform:translate(1270px,145px) scale(.88); } }
.lf-shake-a { animation:lf-shake-a .14s linear infinite; }
@media (prefers-reduced-motion: reduce) { .lf-shake-a { animation:none; } }
@keyframes lf-bf { from { stroke-dashoffset:0; } to { stroke-dashoffset:-9; } }
.lf-ac.lf-bf { stroke-width:4; opacity:.85; animation-name:lf-bf; }
.lf-halo { fill:none; stroke:rgba(126,34,206,.28); stroke-width:14; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; animation:lf-halo 1.6s ease-in-out infinite alternate; }
@keyframes lf-halo { from { opacity:.35; } to { opacity:1; } }
@media (prefers-reduced-motion: reduce) { .lf-ac.lf-bf, .lf-halo { animation:none; } }
.lf-btn { flex:0 0 auto; white-space:nowrap; }
.lf-fault { flex:1 1 0; min-width:0; font-size:12px; font-weight:700; line-height:1.25; height:2.5em; overflow:hidden; display:flex; align-items:center; }
#current-fault-badge.lf-moved { display:none; }

/* Expanded (full-screen) view: the flow bar and status float over the circuit instead of sitting beside it */
.zp-host.zp-full .lf-bar { position: absolute; top: 12px; left: 12px; z-index: 5; margin: 0; max-width: calc(100% - 260px); background: rgba(255,255,255,.94); padding: 4px 6px; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.18); }
.zp-host.zp-full .lf-status { position: absolute; right: 12px; bottom: 12px; z-index: 5; width: min(360px, calc(100% - 260px)); height: auto; max-height: 40%; margin: 0; padding: 6px 8px; background: rgba(255,255,255,.94); border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.18); }
@media (max-width: 600px) { .zp-host.zp-full .lf-bar { top: 70px; max-width: calc(100% - 24px); } }
@media (max-width: 900px), (max-height: 600px) { .zp-host.zp-full .lf-status { display: none; } }

/* F1-blown open-delta callout: blink three times when it appears, then stay as a steady outlined note */
@keyframes lf-blink { 0%,100% { opacity:1; } 50% { opacity:.1; } }
@keyframes lf-boxpulse { 0%,100% { stroke-width:1; } 50% { stroke-width:3.5; } }
@keyframes lf-hitpulse { 0%,100% { stroke-width:14; } 50% { stroke-width:24; } }
@keyframes lf-stflash { 0%,100% { background:transparent; } 50% { background:#FEF3C7; } }
.lf-attn { animation: lf-blink .9s ease-in-out 5; }
.lf-attn-box { animation: lf-boxpulse .9s ease-in-out 5; }
.lf-hit { animation: lf-hitpulse .9s ease-in-out 5, lf-halo 1.6s ease-in-out infinite alternate; }
.lf-status-flash { animation: lf-stflash .9s ease-in-out 5; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .lf-attn, .lf-attn-box, .lf-hit, .lf-status-flash { animation: none; } }

/* Circuit A has the longest status messages: reserve more room on phones (fixed, so the circuit never moves) */
.lf-status.lf-tall { height:7.6em; }
@media (max-width:600px) { .lf-status.lf-tall { height:13.5em; } }