:root {
  --bg: #f2f0ec;
  --panel: #ffffff;
  --soft: #f6f4f1;
  --ink: #1d1916;
  --ink2: #5b534d;
  --muted: #9a918a;
  --line: #e6e1da;
  --accent: #a47e5f;
  --warn: #c2702e;
  --danger: #c0392b;
  --r: 16px;
  --sh: 0 1px 2px rgba(29,25,22,.04), 0 6px 24px rgba(29,25,22,.05);
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
:root { color-scheme: light; }
body { background: var(--bg); color: var(--ink); font: 14px/1.45 'Manrope', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
input, select, textarea {
  width: 100%; border: 1px solid var(--line); background: var(--panel); border-radius: 11px;
  padding: 9px 12px; outline: none; transition: border-color .15s, box-shadow .15s;
}
input:focus, select:focus, textarea:focus { border-color: #bfb3a7; box-shadow: 0 0 0 3px rgba(164,126,95,.14); }
textarea { resize: vertical; }
kbd { font: 600 11px 'Manrope'; background: var(--panel); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 5px; padding: 1px 5px; }
h1, h2, h3, h4 { margin: 0; letter-spacing: -.02em; }
.sub { color: var(--muted); font-size: 13px; margin: 4px 0 0; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; padding: 0 16px; border-radius: 99px; border: 1px solid var(--line); background: var(--panel); font-weight: 600; font-size: 13.5px; white-space: nowrap; transition: transform .1s, background .15s, opacity .15s; }
.btn:active { transform: scale(.98); }
.btn.primary { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.primary:hover { background: #3a332e; }
.btn.dark { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.ghost { background: transparent; }
.btn.ghost:hover { background: var(--panel); }
.btn.ghost.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn.lg { height: 46px; padding: 0 22px; font-size: 14.5px; }
.btn.sm { height: 32px; padding: 0 12px; font-size: 12.5px; }
.btn:disabled { opacity: .45; cursor: default; }
.icon-btn { width: 36px; height: 36px; display: inline-grid; place-items: center; border-radius: 10px; border: 0; background: transparent; color: var(--ink2); flex: none; }
.icon-btn:hover { background: var(--soft); color: var(--ink); }
.icon-btn.sm { width: 28px; height: 28px; border-radius: 8px; }
.icon-btn.danger:hover { color: var(--danger); background: #fbeeec; }
.icon-btn:disabled { opacity: .3; pointer-events: none; }

.seg { display: inline-flex; background: #e9e5df; border-radius: 99px; padding: 3px; gap: 2px; flex: none; }
.seg button { border: 0; background: transparent; padding: 6px 13px; border-radius: 99px; font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.seg button.on { background: var(--panel); color: var(--ink); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.seg.big { margin: 0 0 18px; }
.seg.big button { padding: 8px 18px; font-size: 13.5px; }

.field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.lbl { font-size: 12px; font-weight: 600; color: var(--ink2); }
.hint { font-size: 11.5px; color: var(--muted); }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.toggle { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; cursor: pointer; user-select: none; }
.toggle input { display: none; }
.tg { width: 34px; height: 20px; border-radius: 99px; background: #d8d1c8; position: relative; transition: background .15s; flex: none; }
.tg::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.toggle input:checked + .tg { background: var(--ink); }
.toggle input:checked + .tg::after { transform: translateX(14px); }

.search { display: flex; align-items: center; gap: 8px; background: var(--panel); border: 1px solid var(--line); border-radius: 99px; padding: 0 14px; color: var(--muted); flex: 1; }
.search input { border: 0; padding: 10px 0; box-shadow: none !important; background: transparent; color: var(--ink); }
.sel { width: auto; border-radius: 99px; padding: 10px 14px; }

/* ---------- навигация ---------- */
.topnav { display: flex; align-items: center; gap: 28px; padding: 14px 32px; border-bottom: 1px solid var(--line); background: rgba(242,240,236,.85); backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 5; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font-weight: 700; }
.brand .md-logo { width: 42px; }
.brand span { padding-left: 10px; border-left: 1px solid var(--line); font-size: 13px; letter-spacing: .08em; }
.nav-links { display: flex; gap: 4px; }
.nav-links a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 99px; color: var(--ink2); text-decoration: none; font-weight: 600; font-size: 13.5px; }
.nav-links a.on { background: var(--panel); color: var(--ink); box-shadow: var(--sh); }

.page-wrap { max-width: 1080px; margin: 0 auto; padding: 34px 32px 80px; }
.list-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 22px; }
.list-head h1 { font-size: 40px; font-weight: 400; letter-spacing: -.04em; line-height: 1.05; }
.list-tools { display: flex; gap: 10px; margin-bottom: 16px; }
.kp-list { display: flex; flex-direction: column; gap: 8px; }
.kp-row { display: grid; grid-template-columns: 76px 1fr auto auto; align-items: center; gap: 16px; background: var(--panel); border-radius: var(--r); padding: 10px 12px 10px 10px; cursor: pointer; box-shadow: var(--sh); transition: transform .12s; }
.kp-row:hover { transform: translateY(-1px); }
.thumb { width: 76px; height: 54px; border-radius: 10px; overflow: hidden; background: var(--soft); display: grid; place-items: center; color: #c9c0b6; }
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb .md-logo { width: 30px; }
.kr-title { font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kr-main { min-width: 0; }
.kr-meta { display: flex; gap: 12px; color: var(--muted); font-size: 12.5px; margin-top: 3px; flex-wrap: wrap; }
.tag { background: var(--soft); color: var(--ink2); border-radius: 99px; padding: 0 8px; }
.kr-sum { text-align: right; font-weight: 600; font-size: 16px; letter-spacing: -.01em; white-space: nowrap; }
.kr-sum span { display: block; font-weight: 500; font-size: 12px; color: var(--muted); }
.kr-act { display: flex; opacity: .5; transition: opacity .15s; }
.kp-row:hover .kr-act { opacity: 1; }
.empty { text-align: center; background: var(--panel); border-radius: 24px; padding: 54px 20px; box-shadow: var(--sh); }
.empty-ic { width: 56px; height: 56px; border-radius: 50%; background: var(--soft); display: grid; place-items: center; margin: 0 auto 14px; color: var(--accent); }
.empty h3 { font-size: 22px; font-weight: 500; }
.empty p { color: var(--ink2); max-width: 420px; margin: 8px auto 18px; }

/* ---------- редактор ---------- */
#app { height: 100%; }
.editor { height: 100%; display: flex; flex-direction: column; }
.ed-top { display: flex; align-items: center; gap: 14px; padding: 10px 18px; background: var(--panel); border-bottom: 1px solid var(--line); z-index: 4; }
.ed-title { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; }
.ttl { border: 0; font-size: 16px; font-weight: 600; padding: 7px 8px; background: transparent; min-width: 0; }
.ttl:hover { background: var(--soft); }
.save-state { font-size: 12px; color: var(--muted); white-space: nowrap; }
.save-state.error, .save-state.conflict { color: var(--danger); font-weight: 600; }
.banner { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; padding: 10px 16px; background: #fbeeec; color: #8a2a1f; font-size: 13.5px; font-weight: 500; }
.ed-total { text-align: right; line-height: 1.15; }
.ed-total span { font-size: 11.5px; color: var(--muted); display: block; }
.ed-total b { font-size: 19px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; }
.mobile-only { display: none; }

.ed-body { flex: 1; display: grid; grid-template-columns: minmax(460px, 600px) 1fr; min-height: 0; }
.ed-form { overflow-y: auto; padding: 18px 18px 120px; display: flex; flex-direction: column; gap: 12px; border-right: 1px solid var(--line); }
.card { background: var(--panel); border-radius: var(--r); padding: 16px 18px; box-shadow: var(--sh); display: flex; flex-direction: column; gap: 12px; }
.card h3 { font-size: 16px; font-weight: 600; }
.card h4 { font-size: 14px; font-weight: 600; margin-top: 10px; }
.card-h { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.kp-no { font-size: 12px; color: var(--muted); font-weight: 600; }
.opts summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--ink2); }
.opts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 12px; }

.var-bar { display: flex; flex-direction: column; gap: 8px; }
.vb-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.vb-tab { display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: transparent; border-radius: 12px; padding: 7px 12px; font-weight: 600; font-size: 13px; }
.vb-tab.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.vb-sum { font-weight: 500; font-size: 12px; opacity: .65; }
.vb-tab .star { color: var(--accent); display: inline-flex; }
.vb-add { border: 1px dashed #cbc2b8; background: transparent; border-radius: 12px; padding: 7px 12px; font-weight: 600; font-size: 13px; color: var(--ink2); display: flex; align-items: center; gap: 4px; }
.vb-tools { display: flex; gap: 8px; align-items: center; }
.vb-tools input { max-width: 200px; padding: 6px 10px; }
.vb-coef { display: flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 600; color: var(--ink2); }
.vb-coef select { width: auto; max-width: 100%; padding: 6px 10px; font-size: 13px; }
@media (max-width: 640px) { .vb-coef { flex-direction: column; align-items: stretch; gap: 4px; } }

.room-card { border: 1.5px solid transparent; transition: border-color .15s; }
.room-card.active { border-color: #d9cfc4; }
.rc-h { display: flex; align-items: center; gap: 8px; }
.rc-n { font-size: 22px; font-weight: 300; letter-spacing: -.04em; color: var(--muted); width: 30px; flex: none; }
.rc-type { width: 132px; flex: none; font-weight: 600; padding: 7px 10px; }
.rc-title { padding: 7px 10px; min-width: 0; flex: 1; }
.rc-sum { font-weight: 600; white-space: nowrap; font-size: 14px; }
.rc-tools { display: flex; }
.rc-desc { font-size: 13px; }

.drop { display: flex; flex-wrap: wrap; gap: 8px; border: 1.5px dashed #d6cdc3; border-radius: 14px; padding: 8px; transition: background .15s, border-color .15s; }
.drop.over { background: #f7f1ea; border-color: var(--accent); }
.drop-btn { flex: 1; min-width: 120px; min-height: 76px; border: 0; background: transparent; color: var(--ink2); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-weight: 600; font-size: 13px; border-radius: 10px; }
.drop-btn:hover { background: var(--soft); }
.drop-btn small { font-weight: 500; color: var(--muted); font-size: 11.5px; }
.drop.has .drop-btn { flex: 0 0 104px; min-height: 76px; }
.ph-th { position: relative; cursor: grab; }
.ph-th .thumb { width: 104px; height: 76px; }
.ph-th.main .thumb { outline: 2px solid var(--ink); outline-offset: 1px; }
.ph-badge { position: absolute; left: 5px; bottom: 5px; background: rgba(29,25,22,.8); color: #fff; font-size: 10px; border-radius: 99px; padding: 1px 7px; }
.ph-x { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(255,255,255,.92); display: grid; place-items: center; opacity: 0; transition: opacity .15s; }
.ph-th:hover .ph-x { opacity: 1; }
.note-sm { font-size: 11.5px; color: var(--muted); margin-top: -4px; }

.items { display: flex; flex-direction: column; gap: 10px; }
.ig-t { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin-bottom: 2px; }
.it { display: grid; grid-template-columns: 1fr auto 70px auto auto; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--soft); }
.it.zero .it-name { color: var(--warn); }
.it-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.it-name { font-size: 13px; line-height: 1.3; }
.it-note { border: 0; padding: 2px 0; font-size: 12px; color: var(--ink2); background: transparent; box-shadow: none !important; }
.it-note::placeholder { color: #c4bbb2; }
.it-note:focus { border-bottom: 1px solid var(--line); border-radius: 0; }
.it-custom { display: grid; grid-template-columns: 1fr 110px; gap: 6px; }
.it-custom .it-name-in { grid-column: 1 / -1; }
.it-custom input, .it-custom select { padding: 5px 8px; font-size: 12.5px; border-radius: 8px; }
.it-sum { text-align: right; font-size: 12px; color: var(--muted); white-space: nowrap; }
.qty { display: flex; align-items: center; background: var(--soft); border-radius: 10px; height: 32px; }
.qty.zero { background: #fbf0e6; }
.qty button { width: 26px; height: 32px; border: 0; background: transparent; color: var(--ink2); display: grid; place-items: center; border-radius: 8px; }
.qty button:hover { color: var(--ink); background: rgba(0,0,0,.04); }
.qty input { width: 44px; border: 0; background: transparent; text-align: right; padding: 0 2px; font-weight: 600; box-shadow: none !important; }
.qty .u { font-size: 11px; color: var(--muted); padding: 0 2px 0 3px; min-width: 22px; }
.items-empty { color: var(--muted); font-size: 13px; padding: 10px; text-align: center; background: var(--soft); border-radius: 12px; }
.rc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.rc-foot { display: flex; align-items: center; gap: 10px; padding-top: 10px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.rc-foot .manual { width: 130px; padding: 5px 10px; }
.rc-calc { margin-left: auto; font-size: 12px; color: var(--muted); text-align: right; }
.rc-calc b { color: var(--ink); }
.warn { color: var(--warn); display: block; }

.add-room { border: 1.5px dashed #d0c7bd; border-radius: var(--r); padding: 14px 16px; }
.ar-t { display: flex; align-items: center; gap: 6px; font-weight: 600; margin-bottom: 10px; }
.ar-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ar-chips button { border: 1px solid var(--line); background: var(--panel); border-radius: 99px; padding: 6px 13px; font-size: 13px; font-weight: 500; }
.ar-chips button:hover { border-color: var(--ink); }
.paste-hint { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: var(--muted); padding: 0 4px; }

/* предпросмотр */
.preview { overflow-y: auto; padding: 24px; background: #e3dfd9; }
.pv-scale { margin: 0 auto; }
.pv-inner { width: 1123px; zoom: var(--s); }
.pv-inner .kp-doc { display: flex; flex-direction: column; gap: 24px; }
.pv-inner .kp-page { box-shadow: 0 4px 30px rgba(29,25,22,.12); border-radius: 4px; }
.pv-scale { height: auto; }

/* модальное окно выбора */
.modal-bg { position: fixed; inset: 0; background: rgba(29,25,22,.35); backdrop-filter: blur(3px); z-index: 20; display: grid; place-items: center; padding: 24px; }
.modal { background: var(--panel); border-radius: 22px; width: min(820px, 100%); max-height: min(780px, 100%); display: flex; flex-direction: column; box-shadow: 0 24px 80px rgba(0,0,0,.25); overflow: hidden; }
.pk-h { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 20px 6px; }
.pk-h h3 { font-size: 22px; font-weight: 500; }
.pk-tools { display: flex; gap: 10px; padding: 8px 20px; align-items: center; }
.pk-groups { display: flex; gap: 6px; padding: 4px 20px 12px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--line); }
.pk-groups button { border: 1px solid var(--line); background: var(--panel); border-radius: 99px; padding: 5px 12px; font-size: 12.5px; font-weight: 600; white-space: nowrap; color: var(--ink2); }
.pk-groups button.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.pk-list { overflow-y: auto; flex: 1; padding: 6px 12px; }
.pk-it { width: 100%; display: grid; grid-template-columns: 1fr auto 34px; gap: 14px; align-items: center; text-align: left; border: 0; background: transparent; padding: 9px 10px; border-radius: 12px; }
.pk-it:hover { background: var(--soft); }
.pk-it.in { background: #f6efe8; }
.pk-name { font-size: 13.5px; line-height: 1.3; }
.pk-name small, .pk-price small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 1px; }
.pk-price { text-align: right; font-weight: 600; font-size: 13px; white-space: nowrap; }
.pk-add { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--soft); font-size: 12px; font-weight: 700; }
.pk-it.in .pk-add { background: var(--ink); color: #fff; }
.pk-foot { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; border-top: 1px solid var(--line); gap: 10px; }

/* настройки */
.settings .card { margin-bottom: 14px; }
.row-ed { display: flex; gap: 8px; align-items: center; }
.row-ed .w-city { width: 160px; flex: none; }
.row-ed .w-num { width: 100px; flex: none; }
.mgr-ph { cursor: pointer; flex: none; }
.mgr-ph .thumb { width: 42px; height: 42px; border-radius: 50%; }
.usp-ed { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.usp-imgs { display: flex; gap: 6px; overflow-x: auto; }
.usp-imgs button { border: 2px solid transparent; padding: 0; border-radius: 9px; overflow: hidden; width: 64px; height: 48px; flex: none; background: none; }
.usp-imgs button.on { border-color: var(--ink); }
.usp-imgs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.step-ed input:nth-of-type(1) { width: 220px; flex: none; }
.price-table { display: flex; flex-direction: column; max-height: 60vh; overflow-y: auto; }
.pt-row { display: grid; grid-template-columns: 1fr 150px 110px 86px; gap: 8px; align-items: center; padding: 5px 0; border-bottom: 1px solid var(--soft); }
.pt-row input, .pt-row select { padding: 6px 9px; font-size: 13px; border-radius: 8px; }
.pt-sec { font-size: 12px; color: var(--muted); }
.pt-price { text-align: right; }

.toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 11px 18px; border-radius: 99px; font-size: 13.5px; font-weight: 500; z-index: 50; box-shadow: 0 10px 30px rgba(0,0,0,.25); animation: tin .2s ease-out; }
@keyframes tin { from { opacity: 0; transform: translate(-50%, 8px); } }
.loading { padding: 60px; text-align: center; color: var(--muted); }

/* узкие экраны */
@media (max-width: 1000px) {
  .ed-body { grid-template-columns: 1fr; }
  .mobile-only { display: inline-flex; }
  .tab-edit .preview { display: none; }
  .tab-preview .ed-form { display: none; }
  .ed-title .save-state { display: none; }
}
@media (max-width: 640px) {
  .page-wrap { padding: 20px 16px 60px; }
  .topnav { padding: 12px 16px; gap: 12px; }
  .nav-links a { padding: 7px 10px; font-size: 12.5px; }
  .topnav { flex-wrap: wrap; }
  .nav-user span { display: none; }
  .list-head { flex-direction: column; align-items: stretch; }
  .list-head h1 { font-size: 30px; }
  .list-tools { flex-direction: column; }
  .kp-row { grid-template-columns: 60px 1fr; }
  .kr-sum { grid-column: 2; text-align: left; }
  .kr-act { display: none; }
  .thumb { width: 60px; }
  .grid2, .opts-grid { grid-template-columns: 1fr; }
  .ed-top { flex-wrap: wrap; padding: 8px 10px; gap: 8px; }
  .ed-title { display: none; }
  .ed-total { margin-right: auto; }
  .ed-total { order: 3; }
  .ed-form { padding: 12px 10px 100px; }
  .rc-h { flex-wrap: wrap; }
  .rc-title { flex: 1 1 100%; order: 5; }
  .it { grid-template-columns: 1fr auto auto auto; }
  .it-sum { display: none; }
  .it-custom { grid-template-columns: 1fr; }
  .preview { padding: 10px; }
  .row-ed { flex-wrap: wrap; }
  .pt-row { grid-template-columns: 1fr 100px; }
  .pt-sec, .pt-unit { display: none; }
}

/* прайс */
.sync-box { background: var(--soft); border-radius: 12px; padding: 12px 14px; font-size: 13px; line-height: 1.5; color: var(--ink2); }
.sync-box.bad { background: #fbeeec; color: #8a2a1f; }
.pt-row.ro { padding: 8px 0; font-size: 13px; }
.pt-row.ro .pt-price { font-weight: 600; text-align: right; white-space: nowrap; }
.pt-row.ro .pt-unit { color: var(--muted); }
.row-ed .ro { flex: 1; display: flex; flex-direction: column; font-size: 13px; min-width: 0; }
.row-ed .ro span { color: var(--muted); font-size: 12px; }
.coef-list { display: flex; flex-wrap: wrap; gap: 6px; }
.coef-list .tag { padding: 4px 10px; font-size: 12.5px; }
.drift { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #fbf0e6; border-radius: 12px; padding: 10px 14px; font-size: 13px; }
.drift span { flex: 1; min-width: 180px; }

/* импорт PRO100 */
.modal.p100 { width: min(980px, 100%); }
.p100-drop { margin: 10px 20px 20px; border: 1.5px dashed #cfc6bb; border-radius: 16px; padding: 40px 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; cursor: pointer; color: var(--ink2); }
.p100-drop:hover { background: var(--soft); }
.p100-drop span { font-size: 12.5px; color: var(--muted); max-width: 460px; }
.p100-drop span b { color: var(--ink2); }
.p100-err { margin: 0 20px 20px; }
.p100-busy { padding: 50px 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.p100-sum { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 6px 20px 12px; font-size: 13px; border-bottom: 1px solid var(--line); }
.ok-t { color: #2f7d4f; font-weight: 600; }
.warn-t { color: var(--warn); font-weight: 600; }
.p100-table { overflow-y: auto; flex: 1; padding: 4px 12px; }
.p100-row { display: grid; grid-template-columns: 24px 1fr 112px 104px 92px; gap: 8px; align-items: center; padding: 7px 8px; border-radius: 10px; }
.p100-row.head { font-size: 11.5px; color: var(--muted); font-weight: 600; padding-top: 4px; padding-bottom: 4px; }
.p100-row.st-fixed { background: #fbf4e6; }
.p100-row.st-check { background: #fbeeec; }
.p100-row.off { opacity: .45; }
.p100-row input[type=checkbox] { width: 16px; height: 16px; }
.p100-row input { padding: 6px 8px; font-size: 13px; border-radius: 8px; }
.p100-name { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.p100-name small { font-size: 11.5px; color: var(--muted); }
.p100-name small b { color: var(--warn); font-weight: 600; }
.st-check .p100-name small b { color: var(--danger); }
.p100-q { display: flex; align-items: center; gap: 4px; }
.p100-q span { font-size: 11.5px; color: var(--muted); min-width: 26px; }
.p100-p { text-align: right; }
.p100-s { text-align: right; font-size: 13px; font-weight: 600; white-space: nowrap; }
.p100-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.it-src { font-size: 11px; color: var(--accent); }
@media (max-width: 640px) {
  .p100-row { grid-template-columns: 22px 1fr 1fr; }
  .p100-name { grid-column: 2 / 4; }
  .p100-row .p100-q { grid-column: 2; }
  .p100-row.head { display: none; }
}

/* диалоги */
.modal.ask { width: min(400px, 100%); padding: 22px; gap: 18px; }
.modal.ask p { margin: 0; font-size: 15px; line-height: 1.45; }
.ask-btns { display: flex; justify-content: flex-end; gap: 8px; }
.btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.modal.progress { width: min(340px, 100%); padding: 28px 24px; align-items: center; gap: 10px; text-align: center; }
.spin { width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--ink); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spin { animation-duration: 3s; } }
.demo-note { background: #f6efe8; border-radius: 14px; padding: 12px 16px; font-size: 13px; color: var(--ink2); margin-bottom: 14px; line-height: 1.45; }
.pw-in { flex: 0 1 150px !important; }

/* вход */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login { width: min(400px, 100%); background: var(--panel); border-radius: 24px; padding: 32px 28px; box-shadow: var(--sh); display: flex; flex-direction: column; gap: 14px; }
.login .md-logo { width: 64px; color: var(--ink); margin-bottom: 6px; }
.login h1 { font-size: 28px; font-weight: 400; letter-spacing: -.03em; }
.login .sub { margin-top: -8px; }
.login .btn { margin-top: 6px; }
.login-err { background: #fbeeec; color: #8a2a1f; border-radius: 10px; padding: 9px 12px; font-size: 13px; }
.nav-user { margin-left: auto; display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink2); font-weight: 600; }
.user-row { flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--soft); }
.user-row > input, .user-row > select { flex: 1 1 150px; width: auto; }
.user-row.off { opacity: .5; }
.u-login { width: 110px; flex: none; font-size: 13px; }
.card.narrow { max-width: 440px; }

/* полноэкранный просмотр */
.docview { min-height: 100vh; background: #dcd7d0; }
.dv-bar { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: 12px; padding: 10px 18px; background: rgba(255,255,255,.9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.dv-t { flex: 1; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dv-pages { padding: 28px 0 60px; overflow-x: auto; }
.dv-pages .kp-doc { display: flex; flex-direction: column; align-items: center; gap: 28px; zoom: var(--z, 1); }
.dv-pages .kp-page { box-shadow: 0 6px 40px rgba(29,25,22,.14); flex: none; }
@media (max-width: 1000px) { .hide-sm { display: none; } }

/* печать: только документ */
@media print {
  body { background: #fff; }
  .no-print, .ed-top, .ed-form, .modal-bg, .toast { display: none !important; }
  .docview { background: none; }
  .dv-pages { padding: 0; overflow: visible; }
  .dv-pages .kp-doc { display: block; zoom: 1 !important; }
  .dv-pages .kp-page { box-shadow: none; }
  .editor { height: auto; display: block; }
  .ed-body { display: block; }
  .preview { display: block !important; overflow: visible; padding: 0; background: none; }
  .pv-scale { width: auto !important; }
  .pv-inner { zoom: 1 !important; width: auto; }
  .pv-inner .kp-doc { display: block; }
  .pv-inner .kp-page { box-shadow: none; border-radius: 0; }
}