/* Lean toolkit (OEE, kanban sizing, SMED): shared by the builder dialog and the public calculator pages */
.lt-tool { display: grid; gap: 14px; font-size: 13.5px; align-items: start; }
.lt-in, .lt-out { display: grid; gap: 9px; min-width: 0; }
@media (min-width: 900px) { .lt-tool { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } }
.lt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 10px; }
.lt-grid label { display: grid; gap: 3px; font-size: 12px; font-weight: 600; align-content: end; }
.lt-grid label em { font-style: normal; font-weight: 400; color: var(--muted); }
.lt-tool input, .lt-tool select { font: inherit; padding: 5px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--ink); min-width: 0; }
.lt-tool input:focus, .lt-tool select:focus { outline: 2px solid var(--accent); outline-offset: -1px; }
.lt-check { display: flex !important; align-items: center; gap: 8px; font-weight: 400 !important; font-size: 13px; }
.lt-sub { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
.lt-tbl { width: 100%; border-collapse: collapse; }
.lt-tbl td, .lt-tbl th { padding: 2px 6px 2px 0; text-align: left; vertical-align: middle; }
.lt-tbl th { font-size: 12px; color: var(--muted); font-weight: 600; }
.lt-tbl td input { width: 100%; }
.lt-tbl input.sm { width: 70px; }
.lt-smed { table-layout: fixed; }
.lt-smed th:nth-child(2) { width: 58px; }
.lt-smed th:nth-child(3) { width: 92px; }
.lt-smed th:nth-child(4) { width: 150px; }
.lt-smed th:nth-child(5) { width: 26px; }
.lt-smed td select { width: 100%; }
.lt-smed td:nth-child(4) input.sm { width: 48px; margin-top: 3px; }
.lt-smed td input.sm { width: 100%; }
.lt-x { border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 14px; padding: 4px 6px; border-radius: 6px; }
.lt-x:hover { background: var(--surface-2); color: var(--warn); }
.lt-res { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; padding: 10px; border-radius: 12px; background: var(--accent-soft); }
.lt-big { flex: 1 1 200px; }
.lt-big b { display: block; font-size: 26px; line-height: 1.1; color: var(--accent); font-variant-numeric: tabular-nums; }
.lt-big span { font-size: 13px; color: var(--ink); }
.lt-kpis { flex: 2 1 260px; display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; }
.lt-kpis div { background: var(--surface); border-radius: 9px; padding: 6px 9px; }
.lt-kpis b { display: block; font-size: 16px; font-variant-numeric: tabular-nums; }
.lt-kpis span { font-size: 12px; color: var(--muted); }
.lt-bars { display: grid; gap: 4px; }
.lt-bar { display: grid; grid-template-columns: 120px 1fr 70px; gap: 8px; align-items: center; font-size: 12.5px; }
.lt-bar i { display: block; height: 14px; border-radius: 4px; background: var(--muted); opacity: .45; }
.lt-bar.bad i { background: var(--warn); opacity: .8; }
.lt-bar.good i { background: var(--accent); opacity: .9; }
.lt-bar b { text-align: right; font-variant-numeric: tabular-nums; }
.lt-note { margin: 0; font-size: 13px; background: var(--surface-2); border-radius: 9px; padding: 8px 10px; }
.lt-help { margin: 0; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.lt-watch { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lt-clock { font: 600 20px 'IBM Plex Mono', monospace; min-width: 70px; }
.lt-pick { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.lt-dlg { width: min(1060px, calc(100vw - 24px)); max-width: none; }
.lt-min { white-space: nowrap; width: 1%; }
.lt-dlg .dlg-head h3 { font-size: 17px; }
.lt-dlg form { width: auto; max-height: calc(100vh - 60px); overflow-y: auto; overflow-x: hidden; }
.lt-msg { margin: 0; font-size: 13px; color: var(--accent); min-height: 18px; }
.lt-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.btn.small { padding: 5px 10px; font-size: 13px; }
@media (max-width: 600px) { .lt-bar { grid-template-columns: 90px 1fr 60px; } .lt-smed th:nth-child(3), .lt-smed td:nth-child(3) { display: none; } }
/* SMED: internal vs external */
.lt-hint { display: block; font-size: 11px; color: #9a6b00; margin-top: 1px; }
.lt-smed tr.conv td:first-child input { border-color: #3b82c4; }
.lt-stack { display: grid; grid-template-columns: 52px 1fr 70px; gap: 8px; align-items: center; font-size: 12.5px; }
.lt-stack b { text-align: right; font-variant-numeric: tabular-nums; }
.lt-track { display: flex; height: 16px; border-radius: 5px; overflow: hidden; background: var(--surface-2); }
.lt-track i, .lt-legend i { display: block; height: 100%; }
.lt-track .int { background: var(--warn); opacity: .85; }
.lt-track .int2, .lt-legend .int2 { background: var(--accent); }
.lt-track .ext, .lt-legend .ext { background: #3b82c4; }
.lt-track .gone, .lt-legend .gone { background: repeating-linear-gradient(45deg, var(--line), var(--line) 3px, transparent 3px, transparent 6px); }
.lt-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 11.5px; color: var(--muted); }
.lt-legend span { display: inline-flex; align-items: center; gap: 5px; }
.lt-legend i { width: 12px; height: 10px; border-radius: 2px; }
/* video SMED */
.lt-idea { display: block; font-size: 11px; color: var(--muted); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lt-ai ol { margin: 4px 0 0; padding-left: 18px; }
.vs-grid { display: grid; gap: 14px; align-items: start; }
@media (min-width: 900px) { .vs-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); } }
.vs-left, .vs-right { display: grid; gap: 8px; min-width: 0; }
.vs-drop { display: grid; gap: 4px; place-items: center; text-align: center; padding: 28px 16px; border: 2px dashed var(--line); border-radius: 12px; cursor: pointer; background: var(--surface-2); }
.vs-drop:hover { border-color: var(--accent); }
.vs-drop span { font-size: 12.5px; color: var(--muted); max-width: 340px; }
.vs-drop.small { padding: 6px 10px; display: flex; justify-content: center; border-width: 1px; }
.vs-drop.small span { display: none; }
#vsVideo { width: 100%; max-height: 46vh; background: #000; border-radius: 10px; }
.vs-ctrl { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.vs-time { font: 600 15px 'IBM Plex Mono', monospace; min-width: 48px; }
.vs-speed { display: inline-flex; gap: 2px; }
.vs-speed .on { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.vs-ctrl kbd { font: 600 10px 'IBM Plex Mono', monospace; padding: 0 4px; border: 1px solid currentColor; border-radius: 4px; opacity: .7; margin-left: 3px; }
.vs-ai { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.vs-sum { font-size: 12.5px; background: var(--accent-soft); border-radius: 10px; padding: 8px 10px; }
.vs-sum p { margin: 0 0 4px; } .vs-sum ol { margin: 0; padding-left: 18px; }
.vs-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 44vh; overflow-y: auto; }
.vs-steps li { display: grid; grid-template-columns: 96px 1fr auto; gap: 8px; align-items: start; padding: 6px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.vs-steps .vs-empty { display: block; color: var(--muted); font-size: 13px; text-align: center; border-style: dashed; padding: 16px; }
.vs-thumb { border: 0; padding: 0; background: none; cursor: pointer; display: grid; gap: 2px; text-align: left; }
.vs-thumb img { width: 96px; border-radius: 6px; display: block; }
.vs-thumb span { font: 600 11px 'IBM Plex Mono', monospace; color: var(--muted); }
.vs-body { display: grid; gap: 4px; min-width: 0; }
.vs-body input, .vs-body select { font: inherit; font-size: 13px; padding: 4px 7px; border: 1px solid var(--line); border-radius: 7px; background: var(--bg); color: var(--ink); min-width: 0; }
.vs-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: 12px; }
.vs-w { font-size: 11px; padding: 0 6px; border-radius: 8px; background: var(--warn-soft); color: var(--warn); }
.lt-vid .lt-idea { white-space: normal; }
/* the video dialog fills the window and never scrolls; only the step list scrolls inside it */
.lt-vid form { height: calc(100vh - 48px); max-height: calc(100vh - 48px); display: flex; flex-direction: column; overflow: hidden; }
.lt-vid .vs-grid { flex: 1; min-height: 0; }
.lt-vid .vs-right { height: 100%; min-height: 0; grid-template-rows: auto auto minmax(0, 1fr); }
.lt-vid .vs-steps { max-height: none; height: 100%; }
.lt-vid #vsVideo { max-height: calc(100vh - 290px); }
.vs-sum summary { cursor: pointer; }
.vs-sum details[open] { max-height: 28vh; overflow-y: auto; }
@media (max-width: 899px) { .lt-vid form { height: auto; overflow-y: auto; } .lt-vid .vs-steps { max-height: 40vh; } }
.lt-dlg .lt-scroll { max-height: calc(100vh - 400px); min-height: 120px; overflow-y: auto; }
.lt-smed thead th { position: sticky; top: 0; background: var(--surface); z-index: 1; }
.lt-ai summary { cursor: pointer; }
/* time study */
.ts-dyn { display: contents; }
@media (min-width: 900px) {
  .ts-dlg .lt-tool, .tool-card .lt-tool:has(.ts-dyn) { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
  .ts-vidwrap { grid-column: 1; grid-row: 1; }
  .ts-dyn > .lt-in { grid-column: 1; grid-row: 2; }
  .ts-dyn > .lt-out { grid-column: 2; grid-row: 1 / span 2; }
}
.ts-vidwrap { display: grid; gap: 6px; }
.ts-vidwrap[hidden] { display: none; }
.ts-vidwrap video { width: 100%; max-height: 30vh; background: #000; border-radius: 10px; }
.ts-vidbar { display: flex; gap: 8px; align-items: center; justify-content: space-between; }
.ts-rec { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ts-rec kbd { font: 600 10px 'IBM Plex Mono', monospace; padding: 0 4px; border: 1px solid currentColor; border-radius: 4px; opacity: .7; margin-left: 3px; }
.ts-live { font: 600 12.5px 'IBM Plex Mono', monospace; color: var(--accent); }
.ts-tbl th:nth-child(2) { width: 120px; } .ts-tbl th:nth-child(3), .ts-tbl th:nth-child(4) { width: 72px; } .ts-tbl th:nth-child(5) { width: 50px; } .ts-tbl th:nth-child(6) { width: 26px; }
.ts-tbl { table-layout: fixed; } .ts-tbl td select { width: 100%; }
.ts-num { font-variant-numeric: tabular-nums; text-align: right; padding-right: 10px !important; }
.ts-bad { color: var(--warn); font-weight: 700; }
.ts-tbl tr.ts-now td { background: var(--accent-soft); }
.ts-foot { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ts-takt-in { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; }
.ts-takt-in input { width: 70px; }
.ts-gantt, .ts-stack { position: relative; height: 26px; border-radius: 6px; background: var(--surface-2); overflow: hidden; }
.ts-gantt i { position: absolute; top: 3px; bottom: 3px; border-right: 1px solid var(--surface); }
.ts-stack { display: flex; }
.ts-stack i { display: block; height: 100%; }
.ts-takt { position: absolute; top: 0; bottom: 0; width: 2px; background: #c62828; }
.ts-manual { background: var(--accent); }
.ts-walk { background: repeating-linear-gradient(90deg, #e0a82e, #e0a82e 4px, #f3d48a 4px, #f3d48a 8px); }
.ts-machine { background: #3b82c4; opacity: .75; }
.ts-wait { background: repeating-linear-gradient(45deg, #c9c6bb, #c9c6bb 3px, transparent 3px, transparent 6px); }
.lt-legend .ts-tk { background: #c62828; width: 3px; }
@media (min-width: 900px) {
  .ts-dlg .lt-tool, .tool-card .lt-tool:has(.ts-dyn) { grid-template-rows: auto 1fr; align-items: start; }
  .ts-vidwrap[hidden] + .ts-dyn > .lt-in { grid-row: 1 / span 2; }
}
/* cell design */
.cd-tbl { table-layout: fixed; } .cd-tbl th:first-child { width: 28px; } .cd-tbl th:nth-last-child(1), .cd-tbl th:nth-last-child(2) { width: 84px; }
.cd-tbl td input[type=checkbox] { width: auto; }
.cd-tbl tr.cd-off td { opacity: .5; }
.cd-tbl td input.sm { width: 100%; }
.cd-set { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12.5px; font-weight: 600; }
.cd-set label { display: flex; align-items: center; gap: 6px; } .cd-set input { width: 64px; }
.cd-yama { width: 100%; max-height: 190px; color: var(--ink); }
.cd-cell { width: 100%; max-height: 160px; color: var(--ink); }
.tool-card .cd-tbl th:first-child { width: auto; }
.cd-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.cd-charts .cd-yama { max-height: 170px; } .cd-charts .cd-cell { max-height: 150px; }
@media (max-width: 600px) { .cd-charts { grid-template-columns: 1fr; } }