/* traffic.css — Traffic & Intersection studio (v50). Builds on atelier.css (cp-*), jetty.css (jt-*), road.css and ui.css. */
.tr-app .jt-fig svg { width: 100%; height: auto; display: block; }
.tr-app .cp-card, .tr-app .cp-grid2 > * { min-width: 0; }
.tr-app .cp-tab td { white-space: normal; }
.tr-app .cp-edit input[type=number] { min-width: 0; }
.tr-app .tr-los { display: inline-block; min-width: 1.6em; text-align: center; border-radius: 4px; padding: 0 .35em; font-weight: 700; color: #fff; }
.tr-app .tr-A { background: #2e7d4f; } .tr-app .tr-B { background: #4c9a5f; } .tr-app .tr-C { background: #8a9a2e; }
.tr-app .tr-D { background: #c58b12; } .tr-app .tr-E { background: #c2551a; } .tr-app .tr-F { background: #b42318; }
.tr-app .tr-simbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.tr-app .tr-spd { display: inline-flex; flex-direction: row; gap: 6px; align-items: center; margin: 0; }
.tr-app .tr-spd select { width: auto; }
.tr-app .tr-sim { background: #f6f7f4; border: 1px solid var(--line, #e3e3dd); border-radius: 8px; overflow: hidden; }
.tr-app .tr-sim canvas { width: 100%; height: auto; display: block; max-width: 900px; margin: 0 auto; }
.tr-app #tr-simstat { font-variant-numeric: tabular-nums; }
@media (max-width: 700px) { .tr-app .cp-edit input[type=number] { width: 52px !important; } }