:root {
  --red: #c00000; --red-d: #9a0000; --red-l: #fbeaea; --dark: #1f1f1f; --ink: #262626; --mut: #707070;
  --line: #e4e4e4; --bg: #f3f3f2; --card: #fff; --green: #1e7d3a; --green-l: #e6f4ea; --blue: #1d5fbf; --blue-l: #e8f0fc;
  --amber: #b26b00; --amber-l: #fff4dc; --r: 6px;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font: 14px/1.4 "Segoe UI", system-ui, -apple-system, Arial, sans-serif; color: var(--ink); background: var(--bg); }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--red); }
.boot { height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; color: var(--mut); }
.spinner { width: 34px; height: 34px; border: 3px solid var(--line); border-top-color: var(--red); border-radius: 50%; animation: sp 0.8s linear infinite; }
@keyframes sp { to { transform: rotate(360deg); } }

/* top bar */
.top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 22px; height: 56px; padding: 0 20px; background: var(--dark); color: #fff; }
.top img { height: 30px; background: #fff; padding: 3px 6px; border-radius: 3px; }
.top nav { display: flex; gap: 2px; flex: 1; }
.top nav a { color: #cfcfcf; text-decoration: none; padding: 8px 14px; border-radius: 4px; cursor: pointer; font-weight: 500; }
.top nav a:hover { background: #333; color: #fff; }
.top nav a.on { background: var(--red); color: #fff; }
.top .me { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #cfcfcf; }
.top .me b { color: #fff; font-weight: 600; }
.top .btn { background: transparent; border-color: #555; color: #ddd; }
.top .btn:hover { border-color: #999; color: #fff; }
h1 .btn { font-size: 13.5px; font-weight: 500; }
.top .me .role { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #999; }

main { padding: 20px 24px 60px; max-width: 1680px; margin: 0 auto; }
h1 { font-size: 22px; margin: 0 0 16px; font-weight: 700; display: flex; align-items: center; gap: 12px; }
h2 { font-size: 16px; margin: 0 0 12px; font-weight: 700; }
.sub { color: var(--mut); font-size: 13px; }

/* buttons */
.btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: #fff; padding: 7px 14px; border-radius: var(--r); cursor: pointer; font-weight: 500; white-space: nowrap; }
.btn:hover { border-color: #bbb; }
.btn.pri { background: var(--red); border-color: var(--red); color: #fff; }
.btn.pri:hover { background: var(--red-d); }
.btn.dark { background: var(--dark); border-color: var(--dark); color: #fff; }
.btn.ghost { border-color: transparent; background: transparent; }
.btn.ghost:hover { background: #ececec; }
.btn.sm { padding: 4px 9px; font-size: 12.5px; }
.btn.block { width: 100%; justify-content: center; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.ico { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 0; background: transparent; border-radius: 4px; cursor: pointer; color: var(--mut); font-size: 15px; }
.ico:hover { background: #ececec; color: var(--ink); }
.ico.on { color: var(--red); }
.ico[disabled] { opacity: .3; cursor: default; }

/* cards & forms */
.card { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; margin-bottom: 16px; }
.card-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 12px; }
.grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 14px; }
.f { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.f label { font-size: 12px; color: var(--mut); font-weight: 500; }
.f label .req { color: var(--red); }
.in, .sel, textarea.in { width: 100%; border: 1px solid #d6d6d6; border-radius: 5px; padding: 6px 9px; background: #fff; min-height: 32px; }
.in:focus, .sel:focus { outline: 2px solid rgba(192,0,0,.18); border-color: var(--red); }
.in[readonly], .in[disabled], .sel[disabled] { background: #f6f6f6; color: #555; }
.in.err { border-color: var(--red); background: #fff8f8; }
.in.num { text-align: right; font-variant-numeric: tabular-nums; }
.span2 { grid-column: span 2; } .span4 { grid-column: 1 / -1; }
.hint { font-size: 12px; color: var(--mut); }
.banner { padding: 9px 12px; border-radius: 6px; font-size: 13px; margin: 8px 0; }
.banner.warn { background: var(--amber-l); color: #6d4300; border: 1px solid #f1d699; }
.banner.err { background: var(--red-l); color: var(--red-d); border: 1px solid #f0c2c2; }
.banner.ok { background: var(--green-l); color: var(--green); border: 1px solid #bfe0c8; }
.banner.info { background: var(--blue-l); color: #154a96; border: 1px solid #c6d8f5; }

/* badges */
.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.b-gray { background: #ececec; color: #555; } .b-blue { background: var(--blue-l); color: var(--blue); }
.b-green { background: var(--green-l); color: var(--green); } .b-dark { background: var(--dark); color: #fff; }
.b-red { background: var(--red-l); color: var(--red); } .b-amber { background: var(--amber-l); color: var(--amber); }
.t-labor { background: #eef3fb; color: #1d5fbf; } .t-contract { background: #f3ecfb; color: #6a3ab2; } .t-material { background: #eef6ee; color: #2e7d32; } .t-part { background: #fff1e0; color: #a35a00; }

/* tables */
table.t { width: 100%; border-collapse: collapse; background: #fff; }
table.t th { text-align: left; font-size: 12px; color: var(--mut); font-weight: 600; padding: 8px 10px; border-bottom: 2px solid var(--line); white-space: nowrap; }
table.t td { padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
table.t tr.click { cursor: pointer; }
table.t tr.click:hover td { background: #fafafa; }
.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.c { text-align: center; }
.warn-t { color: var(--red); font-weight: 600; }
.toolbar { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.toolbar .in { max-width: 420px; }
.grow { flex: 1; }

/* editor layout */
.ed { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 18px; align-items: start; }
.side { position: sticky; top: 72px; }
.tot { background: var(--dark); color: #fff; border-radius: 8px; padding: 18px; margin-bottom: 14px; }
.tot .row { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; font-size: 13.5px; color: #d0d0d0; }
.tot .row b { color: #fff; font-variant-numeric: tabular-nums; font-size: 15px; }
.tot .big { border-top: 1px solid #444; margin-top: 8px; padding-top: 10px; }
.tot .big b { font-size: 24px; }
.tot .row.m b.bad { color: #ff8a80; }
.tot .row.m b.good { color: #8fdc9f; }
.tot .disc { display: flex; gap: 6px; align-items: center; }
.tot .disc input { width: 64px; background: #2d2d2d; border: 1px solid #555; color: #fff; text-align: right; border-radius: 4px; padding: 3px 6px; }
.tot .wbox { margin-top: 10px; background: #5a3c00; color: #ffd98a; border-radius: 5px; padding: 8px 10px; font-size: 12.5px; }
.side .btns { display: grid; gap: 8px; }
.verline { font-size: 12px; color: var(--mut); margin: 10px 2px; }
.status-steps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }

/* services */
.dir-h { display: flex; align-items: center; gap: 10px; margin: 18px 0 8px; font-size: 12px; font-weight: 700; color: var(--red); text-transform: uppercase; letter-spacing: .06em; }
.dir-h::after { content: ""; flex: 1; height: 1px; background: #e9caca; }
.item { background: #fff; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; }
.item.gift { border-color: #e9caca; }
.item-h { display: grid; grid-template-columns: 28px minmax(0, 1fr) 66px 110px 110px 110px 74px auto; gap: 8px; align-items: center; padding: 8px 10px 8px 6px; }
.client .item-h { grid-template-columns: 28px minmax(0, 1fr) 66px 130px auto; }
.item-h .nm { font-weight: 600; min-width: 0; }
.item-h .nm small { display: block; font-weight: 400; color: var(--mut); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-h .val { text-align: right; font-variant-numeric: tabular-nums; }
.item-h .val span { display: block; font-size: 10.5px; color: var(--mut); text-transform: uppercase; letter-spacing: .04em; }
.item-h .val b { font-size: 14px; }
.item-b { border-top: 1px solid var(--line); padding: 10px 12px 12px 34px; }
.comps { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13px; }
.comps th { font-size: 11px; font-weight: 600; color: var(--mut); text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.comps td { padding: 4px 6px; border-bottom: 1px solid #f0f0f0; vertical-align: middle; }
.comps .in { min-height: 28px; padding: 3px 6px; }
.comps tr.removed td { opacity: .45; text-decoration: line-through; }
.comps tr.removed td:last-child { text-decoration: none; opacity: 1; }
.comps .chg { background: var(--amber-l); border-color: #e9c46a; }
.w-qty { width: 64px; } .w-ks { width: 60px; } .w-mk { width: 62px; } .w-unit { width: 96px; }

/* search dropdown */
.search { position: relative; }
.results { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px); background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.12); max-height: 420px; overflow: auto; }
.results .r { display: grid; grid-template-columns: 52px minmax(0, 1fr) 110px; gap: 10px; padding: 8px 12px; cursor: pointer; align-items: center; border-bottom: 1px solid #f3f3f3; }
.results .r:hover, .results .r.act { background: var(--red-l); }
.results .r .d { font-size: 11px; color: var(--red); font-weight: 700; }
.results .empty { padding: 14px; color: var(--mut); }
.chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.chip { border: 1px solid var(--line); background: #fff; padding: 3px 10px; border-radius: 14px; cursor: pointer; font-size: 12.5px; }
.chip.on { background: var(--red); border-color: var(--red); color: #fff; }

/* login */
.login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, rgba(31,31,31,.86) 0%, rgba(43,43,43,.62) 55%, rgba(58,11,11,.88) 100%), url('../assets/login-bg.jpg') center center / cover no-repeat, #1f1f1f; }
.login .box { background: #fff; width: 400px; max-width: calc(100vw - 32px); border-radius: 10px; padding: 30px 32px 28px; box-shadow: 0 20px 60px rgba(0,0,0,.4); }
.login img { height: 46px; margin-bottom: 10px; }
.login h1 { font-size: 20px; margin: 6px 0 4px; }
.login .u { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: 7px; background: #fff; cursor: pointer; margin-top: 8px; text-align: left; }
.login .u:hover { border-color: var(--red); background: var(--red-l); }
.login .u small { color: var(--mut); display: block; font-size: 12px; }
.login .demo { margin-top: 16px; font-size: 12px; color: var(--mut); background: #f6f6f6; padding: 9px 11px; border-radius: 6px; }

/* modal */
.mb { position: fixed; inset: 0; background: rgba(20,20,20,.55); z-index: 100; display: flex; align-items: flex-start; justify-content: center; padding: 5vh 20px; overflow: auto; }
.md { background: #fff; border-radius: 10px; width: min(760px, 100%); box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.md.wide { width: min(1240px, 100%); }
.md.xs { width: min(420px, 100%); }
.md-h { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.md-h h2 { margin: 0; }
.md-b { padding: 18px 20px; }
.md-f { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--line); background: #fafafa; border-radius: 0 0 10px 10px; }
.preview { width: 100%; height: 72vh; border: 1px solid var(--line); border-radius: 6px; background: #888; }

#toasts { position: fixed; right: 20px; bottom: 20px; z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast { background: var(--dark); color: #fff; padding: 10px 16px; border-radius: 6px; box-shadow: 0 6px 20px rgba(0,0,0,.25); max-width: 420px; animation: tin .2s ease-out; }
.toast.err { background: var(--red); } .toast.ok { background: var(--green); }
@keyframes tin { from { transform: translateY(8px); opacity: 0; } }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 16px; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 12px 16px; }
.kpi span { font-size: 11.5px; color: var(--mut); text-transform: uppercase; letter-spacing: .05em; }
.kpi b { display: block; font-size: 22px; margin-top: 2px; font-variant-numeric: tabular-nums; }
.tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--line); margin-bottom: 16px; }
.tabs a { padding: 8px 16px; cursor: pointer; font-weight: 600; color: var(--mut); border-bottom: 2px solid transparent; margin-bottom: -2px; }
.tabs a.on { color: var(--red); border-bottom-color: var(--red); }
.empty-state { text-align: center; padding: 50px 20px; color: var(--mut); }
.mut { color: var(--mut); }
.nowrap { white-space: nowrap; }
@media (max-width: 1280px) { .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ed { grid-template-columns: minmax(0, 1fr) 290px; } .item-h { grid-template-columns: 28px minmax(0, 1fr) 60px 96px 96px 96px 64px auto; } }

/* STS photos */
.sts-drop { border: 2px dashed #d0d0d0; border-radius: 10px; padding: 22px; text-align: center; cursor: pointer; background: #fafafa; }
.sts-drop:hover, .sts-drop.over { border-color: var(--red); background: var(--red-l); }
.sts-thumbs { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: -4px 0 12px; }
.sts-thumbs img { height: 54px; border-radius: 4px; border: 1px solid var(--line); cursor: pointer; }
.sts-thumbs.big { margin: 12px 0 0; }
.sts-thumbs.big .th { position: relative; }
.sts-thumbs.big img { height: 110px; cursor: default; }
.sts-thumbs.big .ico { position: absolute; top: 2px; right: 2px; background: rgba(255,255,255,.9); }

/* ---------- Дополнение № 1 ---------- */
.b-purple { background: #f1eafb; color: #6a3ab2; } .b-teal { background: #e3f5f3; color: #0f766e; }
.tabs { flex-wrap: wrap; }
.banner.sm { font-size: 12px; padding: 7px 10px; margin: 6px 0; }
.spanel { margin-top: 14px; padding: 14px 16px; }
.chain { display: flex; align-items: center; margin: 2px 0 10px; }
.chain .st { width: 22px; height: 22px; border-radius: 50%; background: #ececec; color: #888; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.chain .st.done { background: #cfe8d6; color: var(--green); } .chain .st.cur { background: var(--red); color: #fff; }
.chain i { flex: 1; height: 2px; background: #e4e4e4; }
.psec { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 10px; }
.psec-h { font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--mut); font-weight: 600; margin-bottom: 6px; }
.psec .btn.block, .spanel .btn.block { margin-top: 6px; width: 100%; justify-content: center; }
.prow { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; padding: 2px 0; }
.prow span { color: var(--mut); } .prow b { text-align: right; font-weight: 600; }
.prow.mut b { color: var(--mut); font-weight: 500; } .prow.warn-t b { color: var(--red); }
.docs { display: flex; flex-direction: column; gap: 3px; margin: 6px 0; font-size: 13px; }
.docs a { text-decoration: none; } .docs a:hover { text-decoration: underline; }
.comm { border-top: 1px solid #444; margin-top: 8px; padding-top: 8px; font-size: 13px; color: #d0d0d0; }
.comm .hint { color: #aaa; }
.comm .ck { display: flex; align-items: center; gap: 8px; padding: 3px 0; cursor: pointer; }
.comm .ck b { color: #fff; }
.comm .sel { background: #2d2d2d; color: #fff; border-color: #555; padding: 4px 6px; }
.comm .ico { color: #ddd; }
.ck { display: flex; align-items: center; gap: 8px; padding: 3px 0; cursor: pointer; }
.cc { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.cc2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.cab { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; align-items: start; }
.kvt td:first-child { color: var(--mut); width: 42%; }
.feed { max-height: 760px; overflow: auto; }
.feed .ev { padding: 7px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 10px; }
.photo-grid .th { position: relative; }
.photo-grid img { width: 100%; height: 110px; object-fit: cover; border-radius: 6px; cursor: zoom-in; border: 1px solid var(--line); display: block; }
.photo-grid .ico { position: absolute; top: 4px; right: 4px; background: #fff; }
.funnel .fr { display: grid; grid-template-columns: 170px 1fr 40px 110px; gap: 10px; align-items: center; font-size: 13px; padding: 3px 0; }
.funnel .bar, .hbars .bar { background: #f3f3f3; border-radius: 4px; height: 14px; overflow: hidden; }
.funnel .bar i, .hbars .bar i { display: block; height: 100%; border-radius: 4px; }
.funnel .bar i.b-gray { background: #bdbdbd; } .funnel .bar i.b-blue { background: var(--blue); } .funnel .bar i.b-green { background: var(--green); } .funnel .bar i.b-purple { background: #6a3ab2; }
.funnel .bar i.b-teal { background: #0f766e; } .funnel .bar i.b-amber { background: #e0a100; } .funnel .bar i.b-dark { background: var(--dark); } .funnel .bar i.b-red { background: var(--red); }
.funnel.big .fr { grid-template-columns: 200px 1fr 50px 130px; font-size: 14px; } .funnel.big .bar { height: 22px; }
.hbars .hb { display: grid; grid-template-columns: 240px 1fr 90px; gap: 10px; align-items: center; font-size: 13px; padding: 3px 0; }
.hbars .hb b { text-align: right; }
.chart svg { width: 100%; height: auto; display: block; }
.legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: var(--mut); margin-top: 4px; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.ring { display: flex; gap: 20px; align-items: center; } .ring svg { width: 140px; flex: none; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; }
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-bottom: 16px; }
.kpi.big small { display: block; color: var(--mut); font-size: 11.5px; margin-top: 2px; }
.kpi small.hint { display: block; }
tr.row-bad td { background: #fdf0f0; } tr.row-warn td { background: #fff9ea; } tr.row-me td { background: #eef5ff; font-weight: 600; }
table.fact tr.missing td { background: #fff7e6; }
.rights-list { columns: 1; max-height: 520px; overflow: auto; font-size: 13px; }
.tscroll { overflow: auto; } .t.rights td, .t.rights th { padding: 4px 8px; font-size: 12.5px; }
.fields { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; } .fields code { background: #f4f4f4; border-radius: 4px; padding: 2px 6px; font-size: 12px; }
.warn-t { color: var(--red); }
@media (max-width: 1200px) { .cc, .cc2, .cab { grid-template-columns: 1fr; } }
.item-h .val.qty input { width: 56px; text-align: center; padding: 3px 4px; font-weight: 600; }
.item-h .val.qty { text-align: center; }
.attn { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.attn .badge { font-size: 10.5px; }
.folder { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 10px; background: #fcfcfb; }
.folder > summary { cursor: pointer; padding: 10px 14px; font-size: 14px; list-style: none; }
.folder > summary::-webkit-details-marker { display: none; }
.folder > summary::before { content: '▸'; display: inline-block; width: 14px; color: var(--mut); }
.folder[open] > summary::before { content: '▾'; }
.folder .visit { margin: 0 14px 12px 28px; padding-top: 8px; border-top: 1px dashed var(--line); }
.folder .visit-h { font-size: 13px; margin-bottom: 4px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.folder .docs-t td:nth-child(2) { width: 110px; color: var(--mut); } .folder .docs-t td:nth-child(3) { width: 130px; }
.folder .ph-sec { margin-top: 6px; } .folder .ph-sec .photo-grid { margin-top: 4px; }
.ficon { display: inline-block; width: 17px; height: 14px; vertical-align: -2px; margin-right: 4px; color: #3d3d3d; }
.car-pick{display:grid;gap:8px}
.car-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:12px 14px;border:1px solid var(--line,#ddd);border-radius:10px;background:#fff;cursor:pointer;font:inherit}
.car-opt span{color:#777;font-size:13px}
.car-opt:hover{border-color:#b30000;background:#fff7f7}
.car-opt.new{border-style:dashed}
/* Дополнение № 2: чек-лист вложений, кабинет мастера */
.chk{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px solid var(--line,#eee)}
.chk:last-child{border-bottom:0}
.chk .mk{flex:0 0 22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:#f1f1f1;color:#888}
.chk.ok .mk{background:#e6f4ea;color:#1e7b34}
.chk .grow{flex:1;min-width:0;font-size:12.5px}
.chk .nowrap{font-size:12px}
.lnk{color:var(--red,#b30000);cursor:pointer;text-decoration:underline}
.attl{display:inline-flex;align-items:center;gap:4px}
.meter{height:8px;background:#eee;border-radius:4px;overflow:hidden;margin:4px 0 6px}
.meter i{display:block;height:100%;background:#2f8f4e}
.meter.mid i{background:#e0a100}.meter.bad i{background:var(--red)}
/* v1.3: шаги статуса с подписями, «Следующий шаг», сворачиваемые блоки */
.stepper{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin:4px 0 10px;position:relative}
.stepper .sp{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.stepper .sp:not(:last-child)::after{content:'';position:absolute;top:11px;left:calc(50% + 12px);right:calc(-50% + 12px);height:2px;background:#e4e4e4}
.stepper .sp.done:not(:last-child)::after{background:#cfe8d6}
.stepper .st{width:22px;height:22px;border-radius:50%;background:#ececec;color:#777;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.stepper .sp.done .st{background:#cfe8d6;color:var(--green)}.stepper .sp.cur .st{background:var(--red);color:#fff}
.stepper .sl{font-size:9.5px;line-height:1.1;color:#666;margin-top:3px;hyphens:manual;overflow-wrap:anywhere}.stepper .sp.cur .sl{color:var(--dark,#1f1f1f);font-weight:700}
.stepper .sd{font-size:9.5px;color:#999;min-height:11px}
.next{border:1px solid #f0d2d2;background:#fff8f8;border-radius:8px;padding:10px 12px;margin:4px 0 8px}
.next.ready{border-color:#cfe8d6;background:#f4fbf6}
.next-h{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#8a5a5a;font-weight:700}
.next.ready .next-h{color:#2f7a45}
.next-l{margin:4px 0 0 0;padding:0;list-style:none;font-size:12.5px}
.next-l li{padding:3px 0 3px 16px;position:relative}.next-l li::before{content:'○';position:absolute;left:0;color:#c66}
.next-l a{white-space:nowrap}
.status-steps.other{margin-top:4px}.status-steps.other .btn{font-size:12px}
.psec-h.tog{cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none}
.psec-h .car{font-size:11px;color:#999}
.psec.col > :not(.tog){display:none}
.hdr-compact{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px}
.hdr-compact .hc-line{flex:1;min-width:0;font-size:14px}.hdr-compact .sep{color:#bbb;margin:0 8px}
.hdr-compact .hc-act{display:flex;gap:10px;align-items:center}
/* v1.3: поиск, уведомления, сегодня, справка */
.top .me{gap:8px}
.bell{position:relative}.bell .cnt{position:absolute;top:-6px;right:-6px;background:#777;color:#fff;border-radius:9px;font-size:10px;min-width:17px;height:17px;line-height:17px;padding:0 4px;text-align:center}
.bell .cnt.u{background:var(--red)}
.notes{display:flex;flex-direction:column;gap:6px}
.note{padding:9px 12px;border-radius:6px;border-left:4px solid #bbb;background:#f7f7f7;cursor:pointer;font-size:13.5px}
.note:hover{background:#efefef}.note.n-red{border-color:var(--red);background:#fdf3f3}.note.n-amber{border-color:#e0a100;background:#fffaf0}
.note.n-green{border-color:#2f8f4e;background:#f3faf5}.note.n-purple{border-color:#7a4fc0;background:#f7f3fd}
.gs-res{margin-top:10px;max-height:60vh;overflow:auto}
.gs-r{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:6px;cursor:pointer}
.gs-r:hover,.gs-r.act{background:#f4f4f4}
.today h2{text-transform:none}
.help{margin:0 0 10px 18px;padding:0;line-height:1.55}.help li{margin-bottom:6px}
.hint{font-size:12.5px;color:#666}
.tip{display:inline-block;color:#999;cursor:help;font-weight:400;font-size:12px;text-transform:none;letter-spacing:0}
/* v1.3: пакеты, календарь, доска, связь */
.pkgs{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden;margin-left:8px}
.seg .btn{border:0;border-radius:0}.seg .btn.on{background:var(--dark,#1f1f1f);color:#fff}
.contact-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin-bottom:16px}
.cal-d{background:#fff;border:1px solid var(--line);border-radius:8px;min-height:150px;padding:6px}
.cal-d.today{border-color:var(--red);box-shadow:0 0 0 1px var(--red) inset}.cal-d.we{background:#fafafa}
.cal-h{font-weight:700;font-size:12.5px;padding:2px 4px 6px;border-bottom:1px solid var(--line);margin-bottom:6px}
.cal-e{border-left:3px solid #999;background:#f6f6f6;border-radius:4px;padding:5px 6px;margin-bottom:5px;font-size:12px;cursor:pointer}
.cal-e:hover{background:#eee}.cal-e.ev-in{border-color:#2f6fd0;background:#f0f5fd}.cal-e.ev-out{border-color:#e0a100;background:#fffaf0}
.cal-e.ev-late{border-color:var(--red);background:#fdf3f3}.cal-e.ev-done{border-color:#2f8f4e;background:#f3faf5}.cal-e.ev-start{border-color:#7a4fc0;background:#f7f3fd}
.loadbar{position:relative;background:#eee;border-radius:4px;height:18px}.loadbar i{display:block;height:100%;background:#c9a227;border-radius:4px}
.loadbar span{position:absolute;left:8px;top:0;font-size:12px;line-height:18px;font-weight:700}
.board{display:grid;grid-template-columns:repeat(6,minmax(180px,1fr));gap:10px;overflow-x:auto;padding-bottom:6px}
.bcol{background:#f3f3f3;border-radius:8px;padding:8px;min-height:200px}.bcol.over{background:#fdeeee;outline:2px dashed var(--red)}
.bcol-h{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:8px;font-size:12px}
.bcard{background:#fff;border:1px solid var(--line);border-radius:6px;padding:8px;margin-bottom:6px;cursor:grab;font-size:12.5px}
.bcard:hover{border-color:#bbb}.bcard.dragging{opacity:.5}
.rg-h { font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #666; margin: 2px 0 4px; }
.btn.danger { background: #b3261e; border-color: #b3261e; color: #fff; } .btn.danger:hover { background: #8f1d17; }
.chk .attf{margin:2px 0;font-size:12px;overflow-wrap:anywhere;word-break:break-word}
.chk .attf a{white-space:normal}
.attl{max-width:100%;overflow-wrap:anywhere}
.next-l .who{color:#777;font-size:12px}
.next-l .lnk{color:var(--red);cursor:pointer;white-space:nowrap;text-decoration:underline}
.next-who{font-size:12.5px;margin-top:2px}

/* 1.4.3: заголовки блоков панели — тёмные, свернуть все — стрелкой */
.psec-h.tog { font-size: 12.5px; font-weight: 700; color: var(--dark); }
.psec-h.tog .car { color: #888; }
.spanel-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.psec-ttl { font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--dark); }
.psall { font-size: 11px; color: #888; cursor: pointer; padding: 2px 4px; user-select: none; }
.psall:hover { color: var(--dark); }
.items-bar { display: flex; align-items: center; gap: 4px; margin: 10px 0 4px; font-weight: 600; font-size: 13px; color: #444; }
.comps .msrc{display:block;margin-top:3px;font-size:11.5px;padding:2px 4px;min-width:150px}
.sklad{font-style:italic}
.sys-row td{background:#f6f6f6}
.tot .row.sub-row, .row.sub-row{font-size:12px;opacity:.75;padding-top:0;margin-top:-2px}
.good-t{color:#2e7d32}
/* 1.5: расходные материалы */
.sklad-row td { background: #f4f4f4; color: #555; }
.sklad-row.click { cursor: pointer; }
.sklad-row.click:hover td { background: #ececec; }
.t tr.tot td { border-top: 2px solid #ddd; }
.t tr.grp td { background: #fafafa; }
th.sortable { cursor: pointer; user-select: none; }

/* выравнивание: заголовки числовых колонок — по правому краю, как цифры */
table.t th.n { text-align: right; }
/* 1.5.3: список КП во вкладке «Материалы» — со своей прокруткой, шапка и итог закреплены */
.mscroll { max-height: 560px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px; }
.mtab { width: 100%; }
.mtab th:nth-child(n+2), .mtab td:nth-child(n+2) { width: 150px; }
.mtab thead th { position: sticky; top: 0; background: #fff; z-index: 2; }
.mtab tfoot td { position: sticky; bottom: 0; z-index: 2; }
.mtab tr.grp td:first-child .ico { margin-right: 4px; }
.mtab tfoot td { background: var(--dark, #1f1f1f); color: #fff; }
.mtab tfoot td b { color: #fff; }
.mtab tfoot .warn-t { color: #ff8a80; } .mtab tfoot .good-t { color: #9be7a4; }

/* 1.5.4: правая часть верхнего меню — поиск, уведомления, меню пользователя */
.top .me { gap: 6px; }
.tb-ico { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 0; border-radius: 8px; background: transparent; color: #e6e6e6; cursor: pointer; transition: background .15s, color .15s; }
.tb-ico:hover { background: rgba(255,255,255,.08); color: #fff; }
.tb-ico.bell .cnt { top: 3px; right: 2px; background: #5c5c5c; border: 2px solid var(--dark); min-width: 18px; height: 18px; line-height: 14px; font-weight: 600; }
.tb-ico.bell .cnt.u { background: var(--red); }
.umenu { position: relative; margin-left: 6px; }
.uname { display: flex; align-items: center; gap: 8px; background: transparent; border: 0; border-radius: 8px; padding: 5px 8px 5px 12px; color: #cfcfcf; cursor: pointer; text-align: right; }
.uname:hover, .umenu.open .uname { background: rgba(255,255,255,.08); }
.uname span { display: flex; flex-direction: column; line-height: 1.2; }
.uname b { color: #fff; font-size: 13px; font-weight: 600; }
.uname small { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: #999; }
.uname svg { color: #999; transition: transform .15s; }
.umenu.open .uname svg { transform: rotate(180deg); }
.udrop { display: none; position: absolute; right: 0; top: calc(100% + 6px); min-width: 210px; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.06); padding: 6px; z-index: 1000; }
.umenu.open .udrop { display: block; }
.udrop button { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: 0; border-radius: 6px; padding: 9px 10px; font-size: 13.5px; color: var(--ink, #262626); cursor: pointer; text-align: left; }
.udrop button svg { color: #888; }
.udrop button:hover { background: #f3f3f3; }
.udrop button.out, .udrop button.out svg { color: var(--red); }
.udrop .sep { height: 1px; background: #eee; margin: 4px 6px; }
.comps .msrc{min-width:210px}

.u-lock { display: inline-flex; color: #a0a0a0; transition: color .15s; }
.u:hover .u-lock { color: var(--dark, #1f1f1f); }

.doc-ico { display: inline-flex; vertical-align: -3px; margin-right: 7px; color: #7a7a7a; }
.docs-t tr.signed .hint { margin-left: 24px; }

/* 1.5.11: исполнители — комментарий в одну строку (полностью — при наведении), прокрутка списка с закреплённой шапкой */
.emp-scroll { max-height: calc(100vh - 230px); min-height: 240px; overflow: auto; border-radius: 8px; }
.emp-t thead th { position: sticky; top: 0; background: #fff; z-index: 2; box-shadow: 0 1px 0 var(--line); }
.emp-t .emp-com { max-width: 320px; width: 28%; }
.emp-t .emp-com span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #555; cursor: help; }
.emp-t .emp-grp td { background: #1a1a1a; color: #fff; font-weight: 600; font-size: 12px; letter-spacing: .03em; text-transform: uppercase; padding: 7px 12px; }
.emp-t .emp-grp td .mut { color: #bbb; font-weight: 400; }

/* вход: поле с выпадающим списком пользователей */
.login .lu-f { margin-top: 14px; }
.lu-wrap { position: relative; }
.lu-in { padding-right: 34px; cursor: pointer; }
.lu-chev { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--mut); pointer-events: none; display: flex; transition: transform .15s; }
.lu-wrap.open .lu-chev { transform: translateY(-50%) rotate(180deg); }
.lu-list { display: none; position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 12px 32px rgba(0,0,0,.18); max-height: 300px; overflow-y: auto; padding: 4px; }
.lu-wrap.open .lu-list { display: block; }
.login .lu-list .u { margin: 0; border: 0; border-radius: 6px; padding: 8px 10px; }
.login .lu-list .u:hover, .login .lu-list .u.hl { background: var(--red-l); }
.login .lu-list .u.sel b { color: var(--red); }
.lu-list .u .u-lock svg { width: 15px; height: 15px; }
.lu-first { font-size: 12px; white-space: nowrap; }
.lu-none { display: none; padding: 10px; font-size: 13px; }
#pw-box:not(:empty) { margin-top: 2px; }
.login .lu-f { margin-bottom: 12px; }
.login #pw-box .in[disabled] { background: #f6f6f6; cursor: not-allowed; }
.login #pw-box .btn[disabled] { opacity: .45; cursor: not-allowed; }
.login .lu-note { margin: 0 0 10px; font-size: 13px; }
.login #pw-box .f + .f { margin-top: 10px; }
.login .lu-go { width: 100%; margin-top: 14px; justify-content: center; }

/* серверная версия */
.srv-off { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 3000; background: #b3261e; color: #fff; padding: 10px 16px; border-radius: 8px; font-size: 13px; box-shadow: 0 8px 24px rgba(0,0,0,.3); max-width: calc(100vw - 32px); }
.tmp-code { font: 600 30px/1.2 ui-monospace, Consolas, monospace; letter-spacing: .08em; text-align: center; padding: 14px; margin: 10px 0; background: #f6f6f6; border: 1px dashed #bbb; border-radius: 8px; user-select: all; }