/* phase-bar/1: no native app layout, motors, gate evaluation or global navigation. */
[data-telaio-phase-boundary]{--tf-bg:#0d2018;--tf-ink:#fff;--tf-muted:#c9d9cf;--tf-accent:#57d68b;--tf-font:var(--es3d-font,Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif);--tf-pad:8px;--tf-pad-compact:4px;--tf-badge:22px;--tf-line:20px;--tf-gap:4px;--tf-gap-compact:2px;--tf-normal-height:calc(7px + 2*var(--tf-pad) + var(--tf-badge) + var(--tf-line) + var(--tf-gap));--tf-compact-height:calc(7px + 2*var(--tf-pad-compact) + var(--tf-badge) + var(--tf-line) + var(--tf-gap-compact));--tf-top:0px}
[data-telaio-phase-origin]{display:block;height:0;min-height:0;margin:0;padding:0;border:0}
[data-telaio-phase-bar]{position:sticky;top:var(--tf-top);z-index:20;min-width:0;max-width:100%;height:var(--tf-normal-height);margin:0;pointer-events:none;box-sizing:border-box;text-align:start}
[data-telaio-phase-bar] .tf-rail{position:relative;pointer-events:auto;min-width:0;max-width:100%;box-sizing:border-box;margin:0;padding:var(--tf-pad) 8px;border:1px solid #ffffff38;border-radius:12px;background:var(--tf-bg);color:var(--tf-ink);font:500 14px/var(--tf-line) var(--tf-font);box-shadow:none}
[data-telaio-phase-bar] .tf-scroll{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;max-width:100%;min-width:0;padding:0 4px}
[data-telaio-phase-bar] .tf-scroll::-webkit-scrollbar{display:none}
[data-telaio-phase-bar] .tf-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(max-content,1fr);min-width:100%;width:max-content;gap:4px;list-style:none;margin:0;padding:0}
[data-telaio-phase-bar] .tf-item{position:relative;display:block;flex:1 0 auto;min-width:68px;margin:0;padding:0;list-style:none}
[data-telaio-phase-bar] .tf-step{appearance:none;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--tf-gap);box-sizing:border-box;width:100%;min-height:44px;margin:0;padding:0 10px 5px;border:0;border-radius:0;background:transparent;color:var(--tf-muted);font:inherit;letter-spacing:normal;text-transform:none;text-decoration:none;white-space:nowrap;cursor:pointer;touch-action:manipulation}
[data-telaio-phase-bar] .tf-step::before{content:none}
[data-telaio-phase-bar] .tf-step::after{content:"";position:absolute;height:3px;left:8px;right:8px;bottom:0;background:transparent}
[data-telaio-phase-bar] .tf-step[data-phase-current]{color:var(--tf-ink);font-weight:600}
[data-telaio-phase-bar] .tf-step[data-phase-current]::after{background:var(--tf-accent)}
[data-telaio-phase-bar] .tf-step[data-phase-state=blocked]{cursor:help;color:#b8c9bf}
[data-telaio-phase-bar] .tf-step[data-phase-state=blocked] .tf-badge{border-style:dashed}
[data-telaio-phase-bar] .tf-step[data-phase-state=complete] .tf-badge{border-color:transparent}
[data-telaio-phase-bar] .tf-step:focus-visible{outline:3px solid var(--tf-accent);outline-offset:-3px;border-radius:4px}
[data-telaio-phase-bar] .tf-badge{display:flex;align-items:center;justify-content:center;flex:none;box-sizing:border-box;width:var(--tf-badge);height:var(--tf-badge);border:1px solid currentColor;border-radius:50%;font-size:14px;font-weight:500;line-height:1}
[data-telaio-phase-bar] .tf-label{display:block;font:inherit}
[data-telaio-phase-bar] .tf-reason{overflow-wrap:anywhere;pointer-events:auto;box-sizing:border-box;max-width:100%;margin:6px 0 0;padding:10px 14px;border:1px solid #9bb7a6;border-radius:8px;background:#f4f8f5;color:#253e30;font:400 14px/1.5 var(--tf-font);box-shadow:0 3px 12px #0d20181a}
[data-telaio-phase-bar] .tf-reason[hidden]{display:none}
[data-telaio-phase-bar] .tf-overflow{position:absolute;top:0;bottom:0;display:none;align-items:center;justify-content:center;pointer-events:none;width:15px;border-radius:12px;font:400 20px/1 var(--tf-font);color:var(--tf-muted)}
[data-telaio-phase-bar] .tf-overflow--left{left:0;background:linear-gradient(to right,var(--tf-bg) 55%,transparent)}
[data-telaio-phase-bar] .tf-overflow--right{right:0;background:linear-gradient(to left,var(--tf-bg) 55%,transparent)}
[data-telaio-phase-bar][data-overflow-left=true] .tf-overflow--left,[data-telaio-phase-bar][data-overflow-right=true] .tf-overflow--right{display:flex}
[data-telaio-phase-bar][data-phase-compact=true] .tf-rail{padding-block:var(--tf-pad-compact)}
[data-telaio-phase-bar][data-phase-compact=true] .tf-step{gap:var(--tf-gap-compact)}
[data-telaio-phase-boundary] [data-telaio-phase-target]{scroll-margin-top:calc(var(--tf-top) + var(--tf-navigation-height,var(--tf-compact-height)) + 12px)}
[data-telaio-phase-bar] .tf-sr{position:absolute!important;left:0!important;top:0!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:767px){[data-telaio-phase-boundary]{--tf-pad:8px;--tf-badge:20px;--tf-line:18px}[data-telaio-phase-bar] .tf-rail{font-size:13px}[data-telaio-phase-bar] .tf-badge{font-size:13px}}
@media(prefers-reduced-motion:reduce){[data-telaio-phase-bar] *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

[data-telaio-phase-bar][data-phase-position=inline]{position:relative;top:auto}
