/* Road Estimator - CS Template Master (child window) */
.tm-back { position: fixed; inset: 0; background: rgba(0, 0, 0, .3); z-index: 2660; display: none; }
.tm { position: fixed; z-index: 2670; display: none; flex-direction: column; background: #2b3038; color: #d6dbe1;
  border: 1px solid #56606c; box-shadow: 0 14px 40px rgba(0, 0, 0, .6); font: 12px "Segoe UI", Arial, sans-serif; }
.tm.show { display: flex; }
.tm * { box-sizing: border-box; }
.tm-t { display: flex; align-items: center; height: 30px; padding-left: 10px; background: #1f2329; cursor: move; border-bottom: 1px solid #3b424c; user-select: none; }
.tm-t .tt { flex: 1; font-weight: 600; }
.tm-t .x { width: 44px; height: 30px; border: 0; background: none; color: #d6dbe1; cursor: pointer; font-size: 15px; }
.tm-t .x:hover { background: #c42b1c; color: #fff; }
.tm input, .tm select { background: #1f2329; color: #d6dbe1; border: 1px solid #4a535f; border-radius: 2px; font: inherit; padding: 2px 4px; }
.tm input:disabled, .tm select:disabled { opacity: .4; }
.tm input:focus, .tm select:focus { outline: 1px solid #3c8dde; }
.tm .hint { color: #8b95a1; font-size: 11px; }
.tbtn { background: #3a424d; border: 1px solid #56606c; color: #d6dbe1; border-radius: 2px; padding: 2px 9px; cursor: pointer; font: inherit; }
.tbtn:hover { background: #46505c; }
.tbtn.big { min-width: 96px; padding: 5px 12px; }
.tbtn.on { background: #2f4f73; border-color: #3c8dde; }
.tm-top { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 10px; padding: 8px 10px 0; min-height: 0; }
.tm-row { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.tm-row select { flex: 1; }
.tm fieldset { border: 1px solid #4a535f; padding: 6px 10px 8px; margin: 0; }
.tm legend { float: none; width: auto; font-size: 12px; margin: 0; padding: 0 4px; color: #8fc4ff; font-weight: 600; }
.tm-grid { display: grid; grid-template-columns: 62px 1fr 70px 1fr; gap: 5px 6px; align-items: center; }
.tm-grid input, .tm-grid select { width: 100%; }
.tm-grid .wide { grid-column: 2 / 5; }
.tm-cks { grid-column: 3 / 5; display: flex; gap: 12px; }
.tm-grid .nm { grid-column: 2 / 4; }
.tm-cks.dm { grid-column: 4 / 5; }
.tm-cks label, .tm-blk label { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.tm-ratio { display: flex; align-items: center; gap: 4px; }
.tm-blk { grid-column: 2 / 5; display: flex; gap: 8px; align-items: center; }
.tm-blk input[type=text] { flex: 1; }
.tm .more { display: none; }
.tm.show-more .more { display: flex; }
.tm.show-more label.more { display: block; }
.tm-view { display: flex; flex-direction: column; min-height: 0; }
.tm-zoom { display: flex; gap: 3px; margin-bottom: 4px; }
.tm-canvas { position: relative; flex: 1; min-height: 210px; background: #000; border: 1px solid #4a535f; }
.tm-canvas svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.tm-canvas .seg { stroke: #2fd02f; stroke-width: 1.6; }
.tm-canvas .seg.int { stroke-dasharray: 6 3; }
.tm-canvas .seg.above { stroke: #6fe36f; } .tm-canvas .seg.below { stroke: #2fbf9f; }
.tm-canvas .pt { fill: none; stroke: #ffd400; stroke-width: 1.4; cursor: pointer; }
.tm-canvas .pt.o { stroke: #ffffff; }
.tm-canvas .pt.on { stroke: #ff4b4b; stroke-width: 2.4; }
.tm-canvas .cl { stroke: #555; stroke-dasharray: 10 3 2 3; }
.tm-canvas .gl { stroke: #7a5230; stroke-dasharray: 4 4; }
.tm-canvas .gt { fill: #8a6a48; font-size: 10px; }
.tm-canvas .pn { fill: #ffd400; font-size: 11px; }
.tm-canvas .dm { stroke: #6fa8ff; stroke-width: 1; }
.tm-canvas .dme { stroke: #6fa8ff; stroke-width: 0.7; stroke-dasharray: 2 2; opacity: 0.7; }
.tm-canvas .dma { fill: #6fa8ff; }
.tm-canvas .dt { fill: #9cc4ff; font-size: 10px; }
.tm-btns { display: flex; gap: 8px; padding: 8px 10px; align-items: center; }
.tm-btns .sp { flex: 1; }
.tm-btns .msg { color: #9be89b; font-size: 11.5px; }
.tm-data { margin: 0 10px !important; flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 110px; gap: 10px; }
.tm-tbl { overflow: auto; min-height: 0; background: #c0c4c8; border: 1px solid #4a535f; }
.tm-tbl table { border-collapse: collapse; font-size: 11.5px; color: #fff; white-space: nowrap; }
.tm-tbl th { background: #e8eaed; color: #222; font-weight: 400; padding: 2px 6px; border: 1px solid #9aa2ab; position: sticky; top: 0; }
.tm-tbl td { padding: 1px 6px; border: 1px solid #c8cdd2; cursor: pointer; }
.tm-tbl td.n { text-align: right; font-family: Consolas, monospace; }
.tm-tbl tr.o td { background: #000; }
.tm-tbl tr.l td { background: #1c5a94; }
.tm-tbl tr.r td { background: #8a5a28; }
.tm-tbl tr.on td { outline: 2px solid #ffd400; outline-offset: -2px; }
.tm-tbl tr:hover td { filter: brightness(1.15); }
.tm-tbl .ckb { display: inline-block; width: 12px; height: 12px; background: #fff; color: #000; text-align: center; line-height: 12px; font-size: 10px; }
.tm-legend { display: flex; flex-direction: column; gap: 6px; align-self: center; font-size: 12px; }
.tm-legend .sw { display: block; width: 34px; height: 14px; }
.tm-legend .sw.l { background: #1c5a94; } .tm-legend .sw.r { background: #8a5a28; }
.tm-f { display: flex; gap: 6px; align-items: center; padding: 8px 12px; border-top: 1px solid #3b424c; background: #262b32; margin-top: 8px; }
.tm-f .sp { flex: 1; }
.tm .dbtn { min-width: 78px; padding: 4px 12px; background: #3a424d; border: 1px solid #56606c; border-radius: 2px; cursor: pointer; color: #d6dbe1; font: inherit; }
.tm .dbtn.pri { background: #2f6cb0; border-color: #3c8dde; color: #fff; }
