/* Road sections app - layout on top of the shared culvert/style.css */
.new-section { display: grid; grid-template-columns: minmax(260px, 1.3fr) minmax(220px, 1fr) auto; gap: 14px; align-items: end; }
.rs-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(400px, 0.75fr); gap: 16px; align-items: start; }
.rs-preview { position: sticky; top: 64px; }
.rs-preview .preview-box svg { width: 100%; height: auto; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.inline { display: flex; gap: 8px; align-items: center; }
.inline select { flex: 1; }
.add-row { margin-top: 10px; }
.rs-tbl td { vertical-align: middle; padding: 4px 6px; }
.rs-tbl input, .rs-tbl select, .inline select, .new-section select, .new-section input {
  padding: 5px 7px; border: 1px solid #c9d2dc; border-radius: 6px; font: inherit; background: #fff; }
.rs-tbl input[type=number] { width: 66px; }
.rs-tbl input[type=text] { width: 104px; }
.rs-tbl select { max-width: 170px; }
.rs-tbl input.wide { width: 220px; }
.rs-tbl input[type=checkbox] { width: 16px; height: 16px; }
.rs-tbl .det { white-space: nowrap; }
.rs-tbl .det label { display: inline-flex; align-items: center; gap: 4px; margin-right: 8px; font-size: 12.5px; color: var(--muted); }
.rs-tbl .det input[type=number] { width: 62px; }
.rs-tbl .acts { white-space: nowrap; }
.rs-tbl .acts button { border: 1px solid var(--line); background: #fff; border-radius: 5px; width: 26px; height: 26px; cursor: pointer; margin-left: 2px; }
.rs-tbl .acts button:hover { background: #eef3f9; }
#qty td { white-space: normal; }
@media (max-width: 1200px) {
  .rs-layout { grid-template-columns: 1fr; }
  .rs-preview { position: static; }
  .new-section { grid-template-columns: 1fr; }
}