.auto-preview-note{padding:12px 5%;display:flex;justify-content:center;gap:24px;flex-wrap:wrap;background:#163444;color:#d3eee9;font-size:12px}.auto-preview-note a{text-decoration:underline}.woi-card{max-width:500px}.woi-brand{position:relative;padding:4px 12px}.woi-brand img{max-height:260px}.woi-signals svg{max-height:140px}.auto-panel{padding:12px 16px 0;background:linear-gradient(135deg,#142333,#0c1826);border-bottom:1px solid #294054}.auto-heading{display:flex;justify-content:space-between;gap:12px;color:#adc7d4;font-size:9px;letter-spacing:1px}.auto-heading span:last-child{color:#7c9eae;font-size:8px}.auto-gates{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:12px 0}.auto-gate{display:flex;align-items:center;flex-direction:column;gap:6px;color:#c5d6df;font-size:10px}.gate-led{height:7px;width:7px;border-radius:50%;background:#607485;animation:gate-led 8s linear infinite;animation-delay:calc(var(--i)*.12s)}.gate-track{position:relative;width:18px;height:48px;border:1px solid #567383;border-radius:3px;background:#07131e;overflow:visible}.gate-track i{position:absolute;bottom:0;left:0;width:100%;height:24%;background:#53cdb2;opacity:.7;animation:gate-fill 8s ease-in-out infinite;animation-delay:calc(var(--i)*.12s)}.gate-track b{position:absolute;left:-4px;right:-4px;bottom:55%;height:1px;background:#d2e2e9}.auto-trend{display:flex;align-items:center;gap:12px;padding:5px 8px;background:#0c3544;color:#add0d7;font-size:9px;border-radius:3px}.auto-trend svg{width:100%;height:28px;overflow:hidden}.auto-scan{animation:auto-scan 8s linear infinite}.auto-status{height:40px;position:relative;display:flex;align-items:center;font-size:9px;color:#a7c8d4}.auto-status>span:not(.auto-cycle){position:absolute;left:0}.status-check{animation:auto-check 8s step-end infinite}.status-point{color:#79e5c7;animation:auto-point 8s step-end infinite}.auto-cycle{margin-left:auto;font-size:7px;letter-spacing:.6px;color:#6d929f}.auto-map-point{position:absolute;left:54%;top:58%;height:9px;width:9px;border:2px solid #effff6;background:#83f9ca;border-radius:50%;box-shadow:0 0 16px #74ffd1;animation:map-point 8s ease-out infinite;z-index:1}.woi-sweep{animation-duration:8s}.is-paused *, .is-paused *::before{animation-play-state:paused!important}@keyframes gate-fill{0%,12%{height:24%}25%{height:46%}40%{height:35%}58%,82%{height:76%}100%{height:24%}}@keyframes gate-led{0%,57%{background:#607485;box-shadow:none}58%,84%{background:#79e5c7;box-shadow:0 0 7px #79e5c766}85%,100%{background:#607485;box-shadow:none}}@keyframes auto-scan{to{transform:translateX(400px)}}@keyframes auto-check{0%,85%{opacity:1}65%{opacity:0}}@keyframes auto-point{0%,85%{opacity:0}65%{opacity:1}}@keyframes map-point{0%,63%,100%{opacity:0;transform:scale(.5)}66%{opacity:1;transform:scale(1.7)}72%,84%{opacity:1;transform:scale(1)}}@media(max-width:600px){.auto-gates{gap:10px}.auto-heading{font-size:8px}.auto-cycle{display:none}.woi-brand img{max-height:230px}.auto-preview-note{gap:8px}.auto-panel{padding:12px 12px 0}}@media(prefers-reduced-motion:reduce){.auto-panel *,.auto-map-point{animation:none!important}.status-point,.auto-map-point{opacity:0}.status-check{opacity:1}.woi-sweep{animation:none}}
/* Each bar is driven independently; the limit is the same 55% as the divider. */
.gate-track i,.gate-led,.status-check,.status-point,.auto-map-point{animation:none!important}
.gate-track i{background:#53cdb2;opacity:.9}
.gate-led{background:#79e5c7;box-shadow:0 0 7px #79e5c744}
.auto-gate.is-over .gate-track i{background:#fa5865}
.auto-gate.is-over .gate-led{background:#fa5865;box-shadow:0 0 7px #fa586555}
.gate-track b{z-index:2}