/* Event-driven digital twin replay view */
.site-nav{display:flex;align-items:center;gap:6px}
.nav-link{border:1px solid transparent;background:transparent;color:#456984;border-radius:10px;padding:10px 13px;font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}
.nav-link:hover:not(:disabled){background:#f1f8ff;color:#176ba9}
.nav-link.is-active{color:#176ba9;background:linear-gradient(135deg,#eff9ff,#dff2ff);border-color:#bfe2f8;box-shadow:0 4px 12px #69b7e327}
.nav-link:disabled{opacity:.45;cursor:not-allowed}
.open-twin-button{margin-top:18px}
.twin-page{padding:20px 0 36px}
.twin-page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:0 0 17px}
.twin-page-head h1{font-size:28px;letter-spacing:-.035em;margin:7px 0;color:#214b70}
.twin-page-head p{font-size:11px;line-height:1.65;color:#70879b;margin:0;max-width:690px}
.twin-case-switcher{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;color:#68849c;font-size:11px}
.twin-case-list{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.twin-case-button{border:1px solid #d5e5f2;border-radius:10px;padding:9px 12px;background:#fff;color:#3e6688;font-size:11px;font-weight:700;cursor:pointer;box-shadow:0 3px 10px #4c82aa12}
.twin-case-button[aria-pressed=true]{color:#176ba9;border-color:#65b4e8;background:linear-gradient(135deg,#f2fbff,#d9f2ff);box-shadow:0 0 0 2px #7cc3f233}
.twin-layout{display:grid;grid-template-columns:minmax(0,1fr) 322px;gap:15px;align-items:start}
.twin-main-column{display:grid;gap:13px;min-width:0}
.twin-stage-panel{padding:16px 17px 12px;background:linear-gradient(145deg,#ffffffed,#f3faffed);border-color:#d6e9f6;overflow:hidden}
.twin-stage-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.twin-stage-head h2{font-size:16px;color:#234e71;margin:5px 0}
.twin-stage-head .mono{font-size:9px;margin:5px 0;overflow-wrap:anywhere}
.twin-stage-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.twin-stage-badges .replay-pill{background:#eaf7ff;border-color:#d0eafa;color:#39789e}
.twin-stage-badges .replay-pill i{background:#49a7d6}
.twin-frame-state{font-size:10px;color:#4a7fa2;background:#eaf5fc;border-radius:99px;padding:7px 10px;white-space:nowrap}
.twin-stage-note{font-size:9px;color:#8197a9;padding:8px 2px 3px}
.twin-svg-scroll{width:100%;overflow-x:auto;overflow-y:hidden;border-radius:13px;border:1px solid #e1eff8;background:#f8fcff;scrollbar-color:#bad9ed #eef6fc;scrollbar-width:thin}
#twin-canvas{display:block;width:100%;height:auto;min-width:960px;max-height:470px}
.station-shell{fill:#ffffffd9;stroke:#c6deef;stroke-width:1.5;filter:drop-shadow(0 5px 7px #6895b41c);transition:fill .2s,stroke .2s,filter .2s}
.station-title-plate{fill:#edf7fd;stroke:#d8eaf6;stroke-width:1}
.station-status-pill{fill:#f1f5f8;stroke:#dbe5ec;stroke-width:1}
.station-status-dot{fill:#9aabba}
.station-status-label{font-family:inherit}
.twin-station{cursor:pointer;outline:none}
.twin-station:focus-visible .station-shell{stroke:#168bd1;stroke-width:4}
.twin-station.is-selected .station-shell{stroke:#6ab5e5;stroke-width:2.5;filter:drop-shadow(0 6px 10px #3b99d43b)}
.twin-station[data-status=IDLE] .station-status-pill,.twin-station[data-status=UNKNOWN] .station-status-pill{fill:#f1f5f8;stroke:#dbe5ec}
.twin-station[data-status=IDLE] .station-status-dot,.twin-station[data-status=UNKNOWN] .station-status-dot{fill:#9aabba}
.twin-station[data-status=RUNNING] .station-status-pill{fill:#e8f5ff;stroke:#8fc6ec}
.twin-station[data-status=RUNNING] .station-status-dot{fill:#258bd0}
.twin-station[data-status=WAIT_UPSTREAM] .station-status-pill,.twin-station[data-status=WAIT_DOWNSTREAM] .station-status-pill{fill:#fff6e2;stroke:#eacb85}
.twin-station[data-status=WAIT_UPSTREAM] .station-status-dot,.twin-station[data-status=WAIT_DOWNSTREAM] .station-status-dot{fill:#d29a2f}
.twin-station[data-status=BLOCKED] .station-shell{fill:#fffaf1;stroke:#e8ad55;stroke-width:2.5}
.twin-station[data-status=BLOCKED] .station-status-pill{fill:#fff0d9;stroke:#e5ad58}
.twin-station[data-status=BLOCKED] .station-status-dot{fill:#d98621}
.twin-station[data-status=ALARM] .station-shell,.twin-station[data-status=ABORTED] .station-shell{fill:#fff3f2;stroke:#e78383;stroke-width:3;filter:drop-shadow(0 0 9px #e9717140)}
.twin-station[data-status=ALARM] .station-status-pill,.twin-station[data-status=ABORTED] .station-status-pill{fill:#ffe7e5;stroke:#e99b9b}
.twin-station[data-status=ALARM] .station-status-dot,.twin-station[data-status=ABORTED] .station-status-dot{fill:#d84c54}
.twin-station[data-status=COMPLETED] .station-status-pill{fill:#e8f7f1;stroke:#a8ddc8}
.twin-station[data-status=COMPLETED] .station-status-dot{fill:#219474}
.twin-station[data-status=RUNNING] .station-shell{animation:station-breathe 2.4s ease-in-out infinite}
.twin-station[data-status=ALARM] .station-shell,.twin-station[data-status=ABORTED] .station-shell{animation:alarm-breathe 1.4s ease-in-out 3}
@keyframes station-breathe{50%{filter:drop-shadow(0 0 9px #429ddd43)}}
@keyframes alarm-breathe{50%{filter:drop-shadow(0 0 15px #e64f5e72)}}
.return-station-tag{fill:#eef4f7;stroke:#d3e0e7}
.twin-product .tray-body{fill:#f9fdff;stroke:#3c83b7;stroke-width:2;filter:drop-shadow(0 4px 4px #235d842b)}
.twin-product .tray-wheel{fill:#5b7790;stroke:#eef7fc;stroke-width:1}
.twin-product.is-nok .tray-body{fill:#fff0ef;stroke:#c34e57;stroke-width:2.5}
.twin-product.is-pass .tray-body{fill:#eaf8f2;stroke:#299876}
.twin-product.is-moving{filter:drop-shadow(0 4px 5px #278dc23e)}
.propagation-arrow{fill:none;stroke:#df795d;stroke-width:3;stroke-dasharray:8 5;animation:propagation-flow 1.2s linear infinite}
.propagation-label{paint-order:stroke;stroke:#f8fcff;stroke-width:4px;stroke-linejoin:round}
@keyframes propagation-flow{to{stroke-dashoffset:-26}}
.twin-data-note{font-size:9px;color:#718ba1;min-height:14px;margin:7px 2px 0}
.twin-analysis-grid{display:grid;grid-template-columns:minmax(200px,.78fr) minmax(330px,1.35fr) minmax(225px,.9fr);gap:12px;align-items:stretch}
.twin-analysis-grid>.panel{padding:14px;min-width:0}
.twin-analysis-grid .panel-head{align-items:flex-start;gap:8px}
.twin-analysis-grid .panel-head h2{font-size:13px}
.twin-state-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:12px}
.twin-count-card{display:flex;justify-content:space-between;align-items:center;border:1px solid #edf2f6;border-radius:8px;padding:8px;background:#fbfdff;color:#71869b;font-size:9px}
.twin-count-card b{color:#345d7d;font-size:13px}
.twin-count-card[data-status=ALARM] b{color:#bd4e57}
.twin-count-card[data-status=BLOCKED] b{color:#bd7b20}
.twin-station-chips{display:grid;grid-template-columns:1fr;gap:5px;margin-top:8px}
.twin-station-chip{border:1px solid #e7eef4;border-radius:7px;padding:6px 8px;text-align:left;background:#fff;color:#637d93;font-size:9px;cursor:pointer}
.twin-station-chip[data-status=ALARM],.twin-station-chip[data-status=ABORTED]{border-color:#f0caca;background:#fff5f4;color:#ae4e53}
.twin-station-chip[data-status=BLOCKED]{border-color:#f0d7ad;background:#fff9ef;color:#a66b19}
.twin-chart-controls{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.twin-chart-controls label{display:grid;gap:4px;min-width:0;color:#71869b;font-size:9px}
.twin-chart-controls select{max-width:140px;font-size:9px;padding:6px}
.twin-chart{height:190px;margin-top:8px}
.twin-chart .muted{padding:10px}
.twin-timeline{list-style:none;padding:0;margin:11px 0 0;display:grid;gap:4px;max-height:230px;overflow:auto}
.twin-event-row{border-radius:8px;background:#fbfdff;border:1px solid #edf2f6;transition:opacity .15s,background .15s}
.twin-event-row.is-future{opacity:.42}
.twin-event-row.is-current{background:#edf7ff;border-color:#b8daf1;opacity:1}
.twin-event-row.is-alarm{background:#fff2f1;border-color:#f0cecb}
.twin-event-row.is-propagation{background:#fff8eb;border-color:#f0dcb7}
.twin-event-jump{width:100%;display:flex;gap:8px;align-items:flex-start;text-align:left;border:0;background:transparent;padding:7px;color:#34566f;cursor:pointer}
.twin-event-jump time{flex:0 0 47px;font:9px ui-monospace,Consolas,monospace;color:#65829a;padding-top:1px}
.twin-event-jump b,.twin-event-jump small{display:block;overflow-wrap:anywhere}
.twin-event-jump b{font-size:9px;line-height:1.4}
.twin-event-jump small{font-size:8px;color:#8798a7;margin-top:3px}
.replay-controller{display:grid;grid-template-columns:auto auto minmax(230px,1fr);align-items:center;gap:12px;padding:12px 15px;background:linear-gradient(120deg,#ffffff,#f0f8ff);border-color:#dcebf6}
.replay-buttons,.speed-buttons{display:flex;align-items:center;gap:5px}
.play-button,.control-button,.speed-buttons button{border:1px solid #d7e6f1;background:#fff;color:#47718f;border-radius:9px;padding:9px 11px;font-size:11px;font-weight:750;cursor:pointer}
.play-button{background:linear-gradient(135deg,#3ca2e3,#187ac4);border-color:#268ed1;color:#fff;border-radius:50%;width:38px;height:38px;padding:0;box-shadow:0 4px 12px #258bc33a}
.restart-button{white-space:nowrap}
.speed-buttons button[aria-pressed=true]{background:#e8f5ff;border-color:#72b6e2;color:#1876b3}
.replay-range-wrap{min-width:0}
.replay-time-readout{display:flex;justify-content:space-between;gap:10px;color:#54748f;font-size:9px;margin-bottom:6px}
.replay-time-readout b{color:#315c7e}
#twin-seek{display:block;width:100%;height:8px;margin:0;accent-color:#2389ce;cursor:pointer}
.twin-seek-markers{height:7px;position:relative;margin-top:3px}
.seek-marker{position:absolute;top:0;transform:translateX(-50%);width:8px;height:8px;padding:0;border:1px solid white;border-radius:50%;background:#418fc6;box-shadow:0 0 0 1px #418fc6;cursor:pointer}
.seek-marker.is-wait{background:#d7a336;box-shadow:0 0 0 1px #d7a336}
.seek-marker.is-alarm{background:#d95059;box-shadow:0 0 0 1px #d95059}
.seek-marker.is-propagation{background:#e18c36;box-shadow:0 0 0 1px #e18c36}
.twin-ai-panel{padding:17px;position:sticky;top:12px;background:linear-gradient(160deg,#fff,#f6fbff);border-color:#d9eaf6}
.twin-ai-panel .assistant-head{align-items:flex-start}
.twin-ai-panel .assistant-head h2{font-size:14px}
.twin-diagnosis-card{margin:16px 0 13px;padding:13px;border:1px solid #dcecf7;border-radius:11px;background:linear-gradient(135deg,#f7fcff,#eaf6ff)}
.twin-diagnosis-card>span{display:block;color:#7991a4;font-size:9px;margin-bottom:5px}
.twin-diagnosis-card>b{display:block;color:#2d5d80;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.twin-diagnosis-card>p,.twin-ai-section p{font-size:10px;line-height:1.65;color:#5f788e;margin:7px 0 0;overflow-wrap:anywhere}
.twin-ai-section{padding:11px 0;border-top:1px solid #e8f0f6}
.twin-ai-section h3{font-size:10px;color:#3e6484;margin:0}
.twin-ai-section .twin-cause{color:#3579aa;font-weight:700}
.twin-ai-panel>.primary-button{margin-top:7px}
.twin-report-disclaimer{font-size:8px;line-height:1.55;color:#8a9ba9;margin:9px 1px 0}
.twin-page .muted{font-size:9px}
@media(max-width:1280px){.twin-layout{grid-template-columns:minmax(0,1fr) 290px}.twin-analysis-grid{grid-template-columns:minmax(180px,.8fr) minmax(300px,1.2fr)}.twin-timeline-panel{grid-column:1/-1}.twin-timeline{max-height:180px;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1020px){.site-nav{gap:1px}.nav-link{padding:8px;font-size:10px}.twin-layout{grid-template-columns:minmax(0,1fr)}.twin-ai-panel{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px}.twin-ai-panel .assistant-head,.twin-diagnosis-card,.twin-ai-panel>.primary-button,.twin-report-disclaimer{grid-column:1/-1}.twin-ai-panel .assistant-head{margin-bottom:6px}.twin-ai-section{min-width:0}}
@media(max-width:760px){.site-nav{max-width:57vw;overflow-x:auto;scrollbar-width:none}.site-nav::-webkit-scrollbar{display:none}.nav-link{flex:0 0 auto;padding:8px 9px;font-size:9px}.topbar{gap:8px}.brand{gap:7px}.brand-mark{width:34px;height:34px}.brand small{font-size:9px}.twin-page{padding-top:16px}.twin-page-head{display:block}.twin-page-head h1{font-size:22px}.twin-page-head p{font-size:10px}.twin-case-switcher{justify-content:flex-start;margin-top:13px;display:block}.twin-case-list{justify-content:flex-start;margin-top:7px}.twin-case-button{font-size:9px;padding:8px}.twin-stage-panel{padding:12px 10px}.twin-stage-head{display:block}.twin-stage-head h2{font-size:14px}.twin-stage-badges{justify-content:flex-start;margin-top:8px}.twin-stage-badges .replay-pill{font-size:9px}.twin-stage-note{line-height:1.5}.twin-svg-scroll{margin:0 -1px}#twin-canvas{min-width:1000px}.twin-analysis-grid{grid-template-columns:1fr}.twin-timeline-panel{grid-column:auto}.twin-timeline{grid-template-columns:1fr;max-height:260px}.twin-analysis-grid>.panel{padding:12px}.twin-state-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.twin-chart{height:205px}.twin-chart-controls select{max-width:115px}.replay-controller{grid-template-columns:1fr auto;gap:9px}.replay-range-wrap{grid-column:1/-1;grid-row:2}.replay-buttons{grid-column:1;grid-row:1}.speed-buttons{grid-column:2;grid-row:1;justify-content:flex-end}.twin-ai-panel{display:block}.twin-ai-section{padding:10px 0}.replay-time-readout{font-size:8px}}
@media(prefers-reduced-motion:reduce){.twin-station[data-status=RUNNING] .station-shell,.twin-station[data-status=ALARM] .station-shell,.twin-station[data-status=ABORTED] .station-shell,.propagation-arrow{animation:none!important}}
@media print{#twin-view,.site-nav,.top-meta{display:none!important}}

/* V1.1 visual layer: motion is driven by replay frames, not wall-clock CSS cycles. */
.twin-stage-actions{display:grid;justify-items:end;gap:8px}
.twin-display-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.display-toggle{border:1px solid #cfe4f2;border-radius:8px;padding:7px 10px;background:#fff;color:#47718f;font-family:inherit;font-size:9px;font-weight:600;cursor:pointer;box-shadow:0 3px 10px #4c82aa10}
.display-toggle:hover{background:#edf8ff;border-color:#83c3e8;color:#126eaa}
.display-toggle[aria-pressed=true]{background:#e5f4fc;border-color:#86c4e4;color:#176b9d}
.twin-legend{display:flex;gap:6px;flex-wrap:wrap;padding:8px 1px 0}
.twin-legend span{display:inline-flex;align-items:center;gap:5px;border:1px solid #e3edf4;border-radius:99px;background:#fff;padding:4px 8px;color:#607b90;font-size:8px}
.twin-legend span:before{content:"";width:7px;height:7px;border-radius:50%;background:#9aabba}
.twin-legend [data-state=RUNNING]:before{background:#258bd0}
.twin-legend [data-state=WAIT_DOWNSTREAM]:before{background:#d29a2f}
.twin-legend [data-state=BLOCKED]:before{background:#d98621}
.twin-legend [data-state=ALARM]:before{background:#d84c54}
.twin-legend [data-state=COMPLETED]:before{background:#219474}
.twin-mode-status{min-height:0;margin:4px 1px 0;color:#ad5b36;font-size:9px}
.zone-tick{stroke:#d5f4ff;stroke-width:2;opacity:.9}
.zone-label{fill:#e4f7ff;font-family:inherit;font-size:8px;font-weight:700;paint-order:stroke;stroke:#277db4;stroke-width:2px}
.s01-pusher,.s02-carriage,.s03-press-ram,.s04-spindle{will-change:transform}
.s03-press-ram.is-stopped{filter:drop-shadow(0 0 7px #e6545b);stroke:#be4d52}
.s04-spindle[data-running=true]{filter:drop-shadow(0 0 5px #49a9d5)}
.s04-spindle.is-stopped{filter:drop-shadow(0 0 7px #e6545b)}
.s02-carriage[data-gripping=true] .s02-gripper{stroke:#e49a35;stroke-width:5}
.s05-quality-light{fill:#a9b9c5;stroke:#fff;stroke-width:1}
.s05-quality-light[data-quality=PASS]{fill:#28a17b;filter:drop-shadow(0 0 4px #43c693)}
.s05-quality-light[data-quality=NOK]{fill:#db4c54;filter:drop-shadow(0 0 5px #e25660)}
.s05-quality-label{paint-order:stroke;stroke:#f7fcff;stroke-width:2px}
.twin-product.is-moving .tray-body{stroke:#1598d1;stroke-width:3}
.twin-product.is-moving{filter:drop-shadow(0 0 7px #2c9bd270)}
.agent-flow-card{margin:12px 0 4px;padding:12px;border:1px solid #cfe5f4;border-radius:12px;background:linear-gradient(145deg,#f8fdff,#eaf6ff);box-shadow:inset 0 1px #fff,0 6px 16px #3783ac0d}
.agent-flow-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.agent-flow-heading h3{margin:0;color:#315e7e;font-size:10px}
.agent-flow-heading span{max-width:145px;text-align:right;color:#758da0;font-size:8px;line-height:1.4}
.agent-flow-list{list-style:none;counter-reset:agent-flow;margin:10px 0;padding:0;display:grid;gap:5px}
.agent-flow-list li{counter-increment:agent-flow;position:relative;display:grid;gap:2px;padding:7px 8px 7px 30px;border:1px solid #dfedf6;border-radius:8px;background:#ffffffc9;color:#3f6682}
.agent-flow-list li:before{content:counter(agent-flow);position:absolute;left:8px;top:8px;display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#dff2ff;color:#1680bd;font-size:8px;font-weight:800}
.agent-flow-list li:not(:last-child):after{content:"↓";position:absolute;z-index:1;bottom:-9px;left:14px;color:#40a0d1;font-size:10px;font-weight:800}
.agent-flow-list b{font-size:9px}
.agent-flow-list small{color:#7c93a5;font-size:8px}
.agent-flow-time{display:grid;grid-template-columns:1fr auto;gap:5px 8px;margin:8px 0 0;padding-top:8px;border-top:1px solid #dcebf5;color:#8094a5;font-size:8px}
.agent-flow-time b{color:#47718f;font-size:8px;text-align:right}
.twin-view:fullscreen{overflow:auto;box-sizing:border-box;width:100%;height:100%;padding:20px 3vw;background:#edf7ff}
.twin-view:fullscreen .twin-layout{grid-template-columns:minmax(0,1fr) minmax(300px,360px)}
.twin-view:fullscreen #twin-canvas{max-height:55vh}
.reduce-decorative-motion .twin-station[data-status=RUNNING] .station-shell,
.reduce-decorative-motion .twin-station[data-status=ALARM] .station-shell,
.reduce-decorative-motion .twin-station[data-status=ABORTED] .station-shell,
.reduce-decorative-motion .propagation-arrow{animation:none!important}
@media(max-width:1366px){.twin-page{padding-top:14px}.twin-page-head h1{font-size:24px}.twin-layout{grid-template-columns:minmax(0,1fr) 282px;gap:11px}.twin-stage-panel{padding:13px}.twin-analysis-grid{grid-template-columns:minmax(170px,.75fr) minmax(270px,1.15fr)}.twin-timeline-panel{grid-column:1/-1}}
@media(max-width:1020px){.twin-layout{grid-template-columns:minmax(0,1fr)}.twin-stage-actions{justify-items:start}.twin-stage-head{align-items:flex-start}.twin-ai-panel{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.agent-flow-card{grid-column:1/-1}}
@media(max-width:760px){.twin-layout{grid-template-columns:minmax(0,1fr)}.twin-analysis-grid{grid-template-columns:minmax(0,1fr)}.twin-timeline-panel{grid-column:auto}.twin-stage-panel{min-width:0}.twin-stage-actions{margin-top:9px}.twin-display-actions{justify-content:flex-start}.twin-legend{gap:4px}.twin-legend span{font-size:7px;padding:4px 6px}.twin-ai-panel{display:block}.agent-flow-card{margin-top:12px}.agent-flow-heading span{max-width:130px}.twin-view:fullscreen{padding:10px}.twin-view:fullscreen .twin-layout{grid-template-columns:minmax(0,1fr)}}

/* Actual Dify trace presentation. The static flow remains explicit when no trace exists. */
.agent-flow-heading>div{display:grid;gap:3px;min-width:0}
.agent-flow-heading>div small{font-size:8px;color:#7890a5;line-height:1.4}
.agent-flow-heading>span[data-status=running]{color:#176da8;background:#e7f5ff;border-radius:99px;padding:4px 7px}
.agent-flow-heading>span[data-status=success]{color:#14795e;background:#e6f7ef;border-radius:99px;padding:4px 7px}
.agent-flow-heading>span[data-status=failure]{color:#a9424b;background:#fff0f1;border-radius:99px;padding:4px 7px}
.agent-flow-list{counter-reset:none;gap:0}
.agent-flow-list>li{counter-increment:none;padding:0;border:0;background:none}
.agent-flow-list>li:before{display:none}
.agent-flow-list>li:not(:last-child):after{content:"↓";left:50%;bottom:-10px;transform:translateX(-50%);z-index:2;color:#55a4d2}
.agent-flow-node{display:grid;gap:4px;padding:8px 9px;border:1px solid #d8eaf6;border-radius:9px;background:linear-gradient(145deg,#fff,#f7fbff);transition:border-color .2s,box-shadow .2s,background-color .2s}
.agent-node-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.agent-node-head>b{font-size:9px;color:#365e7f;line-height:1.35}
.agent-node-head>.trace-status{flex:0 0 auto;padding:3px 6px;border-radius:99px;background:#eef3f7;color:#657b8d;font-size:7px;line-height:1.3}
.agent-flow-node>small{font-size:8px;line-height:1.4;color:#7e92a4}
.agent-flow-node details{margin-top:2px}
.agent-flow-node details summary{width:max-content;color:#5483a7;font-size:7px;cursor:pointer}
.agent-flow-node details p{margin:4px 0 0;color:#6e8395;font-size:8px;line-height:1.5;overflow-wrap:anywhere}
.agent-flow-node[data-status=running]{border-color:#67b3e0;background:#eff9ff;box-shadow:0 0 0 2px #b9e4fa70,0 5px 15px #3783ac12}
.agent-flow-node[data-status=running] .trace-status{background:#dff3ff;color:#146da4}
.agent-flow-node[data-status=success]{border-color:#a8dcc6;background:#f4fcf8}
.agent-flow-node[data-status=success] .trace-status{background:#e3f6ec;color:#16775c}
.agent-flow-node[data-status=failure]{border-color:#e5a9ad;background:#fff5f5;box-shadow:0 0 0 2px #f4d0d270}
.agent-flow-node[data-status=failure] .trace-status{background:#ffe5e6;color:#a43e47}
.agent-flow-node[data-status=not_called]{border-style:dashed;background:#f8fafc}
.agent-flow-node[data-status=not_called] .trace-status{background:#edf1f4;color:#64798a}
.agent-flow-node[data-status=unavailable]{opacity:.78}
.agent-flow-branch-group{padding:8px 0!important}
.agent-branch-heading{display:flex;justify-content:space-between;align-items:baseline;gap:6px;margin:0 0 8px;color:#577b98}
.agent-branch-heading>b{font-size:8px}
.agent-branch-heading>small{font-size:7px;color:#8497a8;text-align:right}
.agent-branch-lanes{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding-top:10px}
.agent-branch-lanes:before{content:"";position:absolute;top:3px;left:16.66%;right:16.66%;height:1px;background:#8fc3e2}
.agent-branch-node{position:relative;min-width:0;padding:7px 6px}
.agent-branch-node:before{content:"";position:absolute;left:50%;top:-8px;width:1px;height:8px;background:#8fc3e2}
.agent-branch-node .agent-node-head{align-items:flex-start;flex-direction:column;gap:4px}
.agent-branch-node .agent-node-head>b{font-size:8px}
.agent-flow-footnote{margin:7px 0 0;color:#8294a4;font-size:7px;line-height:1.5}
.agent-flow-time{font-size:8px}
.agent-flow-time b{font-size:8px;max-width:62%;overflow-wrap:anywhere}
@media(max-width:760px){.agent-branch-lanes{grid-template-columns:1fr;padding:0 0 0 10px}.agent-branch-lanes:before{top:8px;bottom:8px;left:3px;right:auto;width:1px;height:auto}.agent-branch-node:before{left:-8px;top:15px;width:8px;height:1px}.agent-branch-node .agent-node-head{flex-direction:row;align-items:center}.agent-branch-node .agent-node-head>b{font-size:9px}.agent-branch-node{padding:8px 9px}}
@media(prefers-reduced-motion:reduce){.agent-flow-node{transition:none}.agent-flow-node[data-status=running]{box-shadow:0 0 0 2px #b9e4fa70}}
@media(prefers-reduced-motion:reduce){.twin-station[data-status=RUNNING] .station-shell,.twin-station[data-status=ALARM] .station-shell,.twin-station[data-status=ABORTED] .station-shell,.propagation-arrow{animation:none!important}}
.twin-case-button{min-width:178px;border-left:3px solid #c9d9e6;padding:8px 10px}
.twin-case-button--fault{border-left-color:#d76d72}
.twin-case-button--normal{border-left-color:#37a883}
.twin-case-button--observation{border-left-color:#5c9dc8}
.twin-case-button .case-display-name{font-size:11px;line-height:1.35}
.twin-case-button .case-display-summary{color:#3d7099;line-height:1.4;overflow-wrap:anywhere}
.twin-case-button .case-display-meta{color:#607e96;font-size:8px}
.twin-case-button--fault .case-display-meta{color:#ad555c}
.twin-case-button--normal .case-display-meta{color:#27856b}
.twin-case-button--observation .case-display-meta{color:#497da0}
@media(max-width:760px){.twin-case-button{min-width:155px}}
.twin-chart .curve-hover-tooltip{font-size:9px}
.twin-chart-panel .curve-interpretation{padding:9px 11px}
.twin-chart-panel .curve-interpretation p{font-size:9px}
.twin-event-row.is-wait{background:#fbfdff;border-color:#edf2f6}
.twin-event-row.is-wait .twin-event-jump b{color:#536f86}
.event-sequence{color:#7c93a6;font-size:8px;font-weight:600}
.event-raw{border-top:1px solid #e8eef3;padding:6px 8px 2px}
.twin-event-row>.event-tone-badge{margin-left:57px}
