:root {
  --ink: #16181D; --ink2: #3F4652; --muted: #5B6270; --faint: #8A909B; --line: #E3E6EB; --line2: #EEF0F3;
  --bg: #F4F5F7; --card: #fff; --blue: #1D4ED8; --blue-dark: #1E3A8A; --blue-bg: #EEF3FF; --brown: #9A3412; --grey: #6B7280;
  --violet: #7C3AED; --side: #16181D; --side-ink: #C9CDD4;
  --sans: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 14px; }
a { color: var(--blue); } a:hover { color: var(--blue-dark); }
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
table { border-collapse: collapse; width: 100%; }
th { text-align: left; font-weight: 600; font-size: 12px; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); background: #FAFBFC; position: sticky; top: 0; white-space: nowrap; z-index: 1; }
td { padding: 9px 12px; border-bottom: 1px solid var(--line2); font-size: 14px; vertical-align: top; }
th.r, td.r { text-align: right; }
tr.rowlink:hover td { background: #F2F5FF; cursor: pointer; }
.nm { text-align: left; border-radius: 6px; padding: 1px 5px; margin: -1px 1px -1px -5px; outline: 2px solid transparent; transition: outline-color .12s, background .12s; cursor: pointer; color: inherit; text-decoration: none; background: none; border: none; font: inherit; font-weight: inherit; }
.nm:hover, .nm:focus-visible { outline-color: var(--blue); background: #fff; }
input, select, textarea { font: inherit; font-size: 14px; padding: 9px 10px; border: 1px solid #CDD2DA; border-radius: 8px; background: #fff; color: var(--ink); min-height: 40px; width: 100%; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--blue); outline-offset: 1px; border-color: var(--blue); }
label { font-size: 12px; font-weight: 600; color: var(--ink2); display: flex; flex-direction: column; gap: 6px; }
button { font: inherit; cursor: pointer; }
button:disabled { opacity: .55; cursor: default; }

/* каркас */
.app { display: flex; min-height: 100vh; }
.side { width: 220px; flex: none; background: var(--side); color: #fff; padding: 20px 14px; display: flex; flex-direction: column; gap: 14px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.brand { font-weight: 800; font-size: 22px; letter-spacing: .5px; padding: 0 8px; }
.who { padding: 0 8px; font-size: 12px; color: var(--side-ink); line-height: 1.4; }
.who b { color: #fff; font-weight: 600; font-size: 13px; display: block; }
.nav { display: flex; flex-direction: column; gap: 2px; }
.nav button { text-align: left; border: none; border-radius: 8px; padding: 10px 12px; min-height: 42px; font-size: 14px; font-weight: 500; background: transparent; color: var(--side-ink); }
.nav button:hover { background: #22262E; color: #fff; }
.nav button.on { background: #2E3440; color: #fff; font-weight: 600; }
.nav .sep { height: 1px; background: #343A46; margin: 8px 6px; }
.nav .badge { display: inline-block; margin-left: 6px; background: #E5C65A; color: #3A2A00; border-radius: 999px; padding: 1px 7px; font-size: 11px; font-weight: 700; }
.side-foot { margin-top: auto; display: flex; flex-direction: column; gap: 4px; }
.side-foot button { background: none; border: none; color: var(--side-ink); text-align: left; padding: 6px 8px; font-size: 13px; border-radius: 6px; }
.side-foot button:hover { color: #fff; background: #22262E; }
.main { flex: 1; min-width: 0; padding: 24px 28px 60px; display: flex; flex-direction: column; gap: 18px; }
h1 { margin: 0; font-size: 26px; font-weight: 700; }
.sub { font-size: 14px; color: var(--muted); margin-top: 4px; line-height: 1.5; max-width: 980px; }
.box { background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
.box h2 { margin: 0; font-size: 16px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.scroll { overflow: auto; max-height: 620px; }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.between { justify-content: space-between; }
.grow { flex: 1; }
.muted { color: var(--muted); } .small { font-size: 12px; } .faint { color: var(--faint); }
.blue { color: var(--blue); } .brown { color: var(--brown); } .grey { color: var(--grey); }
.b { font-weight: 700; }

/* плитки */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.tile { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px; }
.tile .l { font-size: 13px; color: var(--muted); }
.tile .v { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 22px; font-weight: 700; white-space: nowrap; }
.tile .s { font-size: 12px; color: var(--muted); margin-top: 4px; }

/* кнопки */
.btn { border-radius: 9px; padding: 10px 16px; min-height: 42px; font-weight: 600; border: 1px solid #CDD2DA; background: #fff; color: var(--ink); }
.btn:hover { border-color: #9AA1AC; }
.btn.pri { background: var(--blue); color: #fff; border-color: var(--blue); }
.btn.pri:hover { background: #1A43BF; }
.btn.dark { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn.danger { background: #fff; color: var(--brown); border-color: #F3C99A; }
.btn.danger.full { background: var(--brown); color: #fff; border-color: var(--brown); }
.btn.sm { padding: 6px 10px; min-height: 34px; font-size: 13px; border-radius: 8px; }
.pill { border-radius: 999px; padding: 8px 14px; min-height: 40px; font-size: 14px; font-weight: 500; background: #fff; color: var(--ink); border: 1px solid #CDD2DA; }
.pill.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.pill.reset { color: var(--brown); border-color: #E8B4A0; }
.link { background: none; border: none; color: var(--blue); padding: 0; font-size: 13px; text-align: left; }

/* период */
.period { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.period label { width: 170px; }
.hint { flex-basis: 100%; font-size: 13px; color: var(--muted); line-height: 1.45; }

/* сортировка */
.sorth { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.sorth button { border: 1px solid #CDD2DA; background: #fff; color: var(--muted); border-radius: 5px; width: 22px; height: 22px; padding: 0; font-size: 10px; line-height: 1; }
.sorth button.on { background: var(--blue); border-color: var(--blue); color: #fff; }

/* строка ввода в таблице */
tr.entry td { background: var(--blue-bg); padding: 8px 6px; vertical-align: middle; }

/* окна */
.overlay { position: fixed; inset: 0; background: rgba(22,24,29,.35); display: flex; align-items: center; justify-content: center; z-index: 50; padding: 16px; }
.modal { width: 440px; max-width: 100%; background: #fff; border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; box-shadow: 0 12px 40px rgba(0,0,0,.18); max-height: 92vh; overflow-y: auto; }
.modal h2 { margin: 0; font-size: 18px; }
.x { background: none; border: 1px solid #CDD2DA; border-radius: 8px; width: 36px; height: 36px; font-size: 17px; color: var(--ink2); flex: none; }
.drawer-wrap { position: fixed; inset: 0; background: rgba(22,24,29,.3); display: flex; justify-content: flex-end; z-index: 45; }
.drawer { width: 470px; max-width: 100%; height: 100%; background: #fff; padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; box-shadow: -8px 0 30px rgba(0,0,0,.12); }
.drawer h2 { margin: 0; font-size: 20px; }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.preview { font-size: 13px; color: var(--ink2); background: #F4F5F7; border-radius: 8px; padding: 8px 10px; white-space: pre-line; }
.err { color: var(--brown); font-size: 14px; }
.warn { font-size: 13px; color: #7A5200; background: #FFF7D6; border-radius: 8px; padding: 8px 10px; }
.chip { background: #EEF3FF; color: var(--blue); border: 1px solid #C9D6F5; border-radius: 999px; padding: 3px 9px; min-height: 26px; font-size: 12px; font-weight: 500; white-space: nowrap; align-self: flex-start; }
.stat { display: flex; gap: 18px; }
.stat > div { flex: 1; background: #F6F7F9; border-radius: 10px; padding: 10px 12px; }
.stat .l { font-size: 12px; color: var(--muted); }
.stat .v { font-family: var(--mono); font-size: 18px; font-weight: 700; }
.badge-st { align-self: flex-start; border-radius: 999px; padding: 5px 12px; font-size: 13px; font-weight: 600; }
.st-done { background: #E8F0FF; color: var(--blue-dark); } .st-part { background: #FFF7D6; color: #7A5200; } .st-wait { background: #FFF4E5; color: var(--brown); }
.sect { border-top: 1px solid var(--line); padding-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.sect h3 { margin: 0; font-size: 15px; }

/* тост */
.toast { position: sticky; top: 0; z-index: 15; border-radius: 10px; padding: 10px 14px; font-size: 14px; background: var(--blue-bg); color: var(--blue-dark); border: 1px solid #C9D6F5; display: flex; justify-content: space-between; gap: 10px; }
.toast.err { background: #FFF1EC; color: var(--brown); border-color: #F3C99A; }
.toast button { background: none; border: none; color: inherit; font-size: 16px; }

/* вход */
.login { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; }
.login form { width: 360px; max-width: 100%; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 28px; display: flex; flex-direction: column; gap: 14px; }
.login .brand { color: var(--ink); padding: 0; font-size: 30px; }


/* режим просмотра глазами другой роли */
.viewas { padding: 0 8px 8px; font-size: 12px; font-weight: 500; color: var(--side-ink); gap: 4px; }
.viewas select { background: #22262E; color: #fff; border: 1px solid #3A3F4A; min-height: 34px; padding: 5px 8px; font-size: 13px; }
.preview-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: #fff4d6; border: 1px solid #f0c95a; color: #5c4400; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }

.mtop, .mbar { display: none; }
/* ================= телефон ================= */
@media (max-width: 760px) {
  html, body { font-size: 15px; }
  input, select, textarea { font-size: 16px; min-height: 44px; } /* 16px — чтобы iPhone не увеличивал страницу */
  /* каркас телефона: экран = прокручиваемая область + нижняя панель (без position: fixed — в Safari она «плавала») */
  html, body { height: 100%; overflow: hidden; overscroll-behavior: none; }
  #root { height: 100%; }
  .app { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
  .app > .main { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
  .app > .main > * { flex-shrink: 0; }
  .mtop { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 25; background: var(--side); color: #fff;
    padding: 8px 12px; padding-top: max(8px, env(safe-area-inset-top)); min-height: 52px; }
  .mburger { background: none; border: none; color: #fff; font-size: 24px; width: 40px; height: 40px; border-radius: 8px; }
  .mburger:active { background: #2E3440; }
  .mtitle { font-weight: 700; font-size: 17px; flex: 1; }
  .mbadge { border: none; font-size: 13px !important; padding: 4px 10px !important; }
  .mback { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 39; }
  /* «Ещё» — лист снизу, над нижней панелью */
  .side { position: fixed; left: 0; right: 0; top: auto; bottom: calc(60px + env(safe-area-inset-bottom)); width: 100%; height: auto; max-height: 75vh;
    z-index: 40; border-radius: 16px 16px 0 0; transform: translateY(110%); transition: transform .2s ease; padding: 16px 14px 12px; visibility: hidden; }
  .side.open { transform: none; visibility: visible; box-shadow: 0 -8px 30px rgba(0,0,0,.35); }
  .side .brand, .side .who { display: none; }
  .side .nav { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
  .side .nav .sep { display: none; }
  .side-foot { margin-top: 8px; border-top: 1px solid #343A46; padding-top: 8px; }
  .mbar { display: flex; flex: none; position: relative; z-index: 42; background: #fff; border-top: 1px solid var(--line);
    padding: 4px 4px env(safe-area-inset-bottom); box-shadow: 0 -2px 10px rgba(0,0,0,.05); }
  .mbar button { flex: 1; min-width: 0; height: 56px; background: none; border: none; color: var(--faint); display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 3px; font-size: 11px; font-weight: 600; position: relative; border-radius: 10px; }
  .mbar button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mbar button.on { color: var(--blue); }
  .mbar button.on svg { stroke-width: 2.3; }
  .mbar .badge { position: absolute; top: 4px; left: 50%; margin-left: 6px; background: #E5C65A; color: #3A2A00; border-radius: 999px; padding: 0 6px; font-size: 10px; font-style: normal; font-weight: 700; line-height: 16px; }
  .mback { bottom: calc(60px + env(safe-area-inset-bottom)); }
  .nav button { min-height: 46px; font-size: 16px; }
  .main { padding: max(14px, env(safe-area-inset-top)) 12px 24px; gap: 12px; }
  .mob .main > h1, .mob .main > div > h1, .titlebar h1 { font-size: 22px; }
  .sub { font-size: 13px; }

  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tile { padding: 10px 12px; }
  .tile .l { font-size: 12px; }
  .tile .v { font-size: 17px; }

  .box { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  th { padding: 8px 8px; }
  td { padding: 9px 8px; font-size: 14px; }
  .sorth { gap: 3px; }
  .sorth button { width: 24px; height: 24px; }

  .period { padding: 10px; gap: 8px; }
  .period label { width: calc(50% - 4px); }
  .pill { min-height: 38px; padding: 7px 12px; font-size: 14px; }
  .row.between { align-items: stretch; }
  .row.between > label { width: 100% !important; }



  .overlay { padding: 0; align-items: flex-end; }
  .modal { width: 100%; border-radius: 16px 16px 0 0; max-height: 92vh; padding: 16px 16px max(16px, env(safe-area-inset-bottom)); }
  .drawer { width: 100%; padding: 16px 14px max(20px, env(safe-area-inset-bottom)); }
  .grid2 { grid-template-columns: 1fr; }
  .stat { flex-direction: column; gap: 8px; }
  .btn { min-height: 44px; }
  .btn.sm { min-height: 38px; }
  .preview-bar { margin-bottom: 0; }
  .toast { top: 0; }
  .main .sub, .hint { display: none; }          /* длинные пояснения на телефоне лишние */
  .box h2 { font-size: 14px; padding: 10px 12px; font-weight: 600; }
  /* Сбор / Расход кассы / Мои расходы: каждая запись — компактная карточка в две строки */
  .scroll { max-height: none; }
}


/* ================= Кадры ================= */
:root {
  --over: #7F1D1D; --red: #DC2626; --red-bg: #FDE2E1; --orange: #C2410C; --orange-bg: #FFEAD5; --yellow: #8A6100; --yellow-bg: #FEF3C7;
  --green: #15803D; --green-bg: #E3F5E8;
  --cold: #DBEAFE; --cold-ink: #1E40AF; --fresh: #DCFCE7; --fresh-ink: #166534; --dry: #FEF3C7; --dry-ink: #92400E;
}
.red { color: var(--red); } .green { color: var(--green); }
.titlebar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.titlebar h1 { margin: 0; }
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.search { width: 300px; max-width: 100%; }
input.month { width: 170px; }
a.btn { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }
a.btn.disabled { opacity: .5; pointer-events: none; }
.btn.sm { min-height: 34px; }
.pad { padding: 14px 16px; }
.empty { padding: 22px 16px; color: var(--muted); text-align: center; }
.foot { padding: 10px 16px; border-top: 1px solid var(--line2); }
.boxhead { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--line); }
.boxhead h2 { padding: 0; border: none; margin-right: auto; }
.box h2 .faint { font-weight: 400; font-size: 14px; }
.nmcell b { font-weight: 600; }
.r { text-align: right; }
.back { margin-bottom: -8px; font-size: 14px; }
.check { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; font-size: 14px; color: var(--ink); }
.check input { width: 18px; height: 18px; min-height: 0; flex: none; }
.okbox { background: var(--green-bg); color: var(--green); border-radius: 8px; padding: 10px 12px; }
.hintbox { background: var(--blue-bg); color: var(--blue-dark); border-radius: 8px; padding: 8px 10px; font-size: 13px; }
ul.plain { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.span2 { grid-column: 1 / -1; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sticky-foot { position: sticky; bottom: -22px; background: #fff; padding: 10px 0; margin-bottom: -10px; border-top: 1px solid var(--line); }
.tscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* плитки-фильтры */
button.tile { text-align: left; font: inherit; color: inherit; cursor: pointer; }
button.tile:hover { border-color: #9AA1AC; }
.tile.on { outline: 3px solid var(--ink); outline-offset: -1px; }
.tile.t-over { background: var(--over); border-color: var(--over); } .tile.t-over .l, .tile.t-over .s { color: #FECACA; } .tile.t-over .v { color: #fff; }
.tile.t-red { background: var(--red-bg); border-color: #F8B4B4; } .tile.t-red .v { color: var(--red); }
.tile.t-orange { background: var(--orange-bg); border-color: #FDC596; } .tile.t-orange .v { color: var(--orange); }
.tile.t-yellow { background: var(--yellow-bg); border-color: #F7D774; } .tile.t-yellow .v { color: var(--yellow); }
.tiles { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }

/* плашка срока */
.due { display: inline-flex; align-items: baseline; gap: 6px; border-radius: 7px; padding: 3px 8px; font-size: 13px; white-space: nowrap; font-weight: 600; }
.due .num { font-weight: 600; }
.due small { font-size: 11px; font-weight: 600; opacity: .9; }
.lv-ok, .lv-none { background: #F1F3F5; color: var(--ink2); font-weight: 500; }
.lv-yellow { background: var(--yellow-bg); color: var(--yellow); }
.lv-orange { background: var(--orange-bg); color: var(--orange); }
.lv-red { background: var(--red-bg); color: var(--red); }
.lv-over { background: var(--over); color: #fff; }
.lv-missing { background: #fff; color: var(--muted); border: 1px dashed #B8BDC6; }
tr.lvrow-over td:first-child { box-shadow: inset 4px 0 0 var(--over); }
tr.lvrow-missing td:first-child { box-shadow: inset 4px 0 0 #B8BDC6; }
tr.lvrow-red td:first-child { box-shadow: inset 4px 0 0 var(--red); }
tr.lvrow-orange td:first-child { box-shadow: inset 4px 0 0 #FB923C; }
tr.lvrow-yellow td:first-child { box-shadow: inset 4px 0 0 #FACC15; }
td { vertical-align: middle; }
.dtable td, .etable td { padding-top: 8px; padding-bottom: 8px; }

/* метки */
.tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.tag { display: inline-block; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; background: #EEF0F3; color: var(--ink2); white-space: nowrap; }
.tag.b-patent { background: #EEF3FF; color: var(--blue-dark); }
.tag.b-ru { background: var(--green-bg); color: var(--green); }
.tag.b-rvp, .tag.b-vnzh { background: #F3E8FF; color: #6B21A8; }
.tag.st-active { background: var(--green-bg); color: var(--green); }
.tag.st-hiring { background: var(--yellow-bg); color: var(--yellow); }
.tag.st-fired { background: #F1F3F5; color: var(--muted); }

/* переключатель */
.seg { display: inline-flex; flex-wrap: wrap; gap: 4px; background: #EEF0F3; border-radius: 10px; padding: 3px; }
.seg button { border: none; background: transparent; border-radius: 8px; padding: 7px 12px; min-height: 36px; font-size: 14px; font-weight: 500; color: var(--ink2); }
.seg button:hover { background: #E2E5EA; }
.seg button.on { background: #fff; color: var(--ink); font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.seg.sm button { padding: 5px 9px; min-height: 32px; font-size: 13px; }
.seg button.on.mk-work { background: var(--green); color: #fff; }
.seg button.on.mk-load { background: #475569; color: #fff; }
.seg button.on.mk-off { background: var(--over); color: #fff; }
.seg button.on.mk-sick { background: #EA580C; color: #fff; }
.seg button.on.z-cold { background: var(--cold); color: var(--cold-ink); }
.seg button.on.z-fresh { background: var(--fresh); color: var(--fresh-ink); }
.seg button.on.z-dry { background: var(--dry); color: var(--dry-ink); }
label > .seg { align-self: flex-start; }

/* карточка */
.cact { justify-content: flex-end; }
.dchips { display: flex; gap: 8px; flex-wrap: wrap; }
.dchip { border-radius: 12px; padding: 10px 14px; min-width: 160px; }
.dchip .l { font-size: 12px; font-weight: 600; opacity: .85; }
.dchip .v { font-size: 20px; font-weight: 700; }
.dchip .s { font-size: 12px; opacity: .9; }
.dchip.lv-ok, .dchip.lv-none { background: #fff; border: 1px solid var(--line); }
.cgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.cgrid .wide { grid-column: 1 / -1; }
.csec .cbody { padding: 12px 16px 14px; display: flex; flex-direction: column; gap: 10px; }
.kv { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 6px 12px; margin: 0; font-size: 14px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.pstat { display: flex; gap: 10px 26px; flex-wrap: wrap; align-items: flex-end; }
.pstat .l { font-size: 12px; color: var(--muted); }
.pstat .v { font-size: 16px; font-weight: 600; }
.pbar { display: grid; grid-template-columns: repeat(12, 1fr); gap: 3px; }
.pbar i { height: 8px; border-radius: 3px; background: #E5E7EB; }
.pbar i.on { background: var(--blue); }
.ptable td, .ptable th { white-space: nowrap; }
.payer { font-size: 12px; font-weight: 600; border-radius: 6px; padding: 2px 7px; }
.p-self { background: #EEF3FF; color: var(--blue-dark); }
.p-debt { background: var(--orange-bg); color: var(--orange); }
.p-free { background: var(--green-bg); color: var(--green); }
.docs li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 8px; border-radius: 8px; }
.docs li.rowlink:hover { background: #F2F5FF; cursor: pointer; }
details.hist summary { cursor: pointer; color: var(--blue); font-size: 13px; }
details.hist ul { margin-top: 8px; }
.thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.thumb { border: 1px solid var(--line); background: #F6F7F9; border-radius: 10px; padding: 0; overflow: hidden; display: flex; flex-direction: column; aspect-ratio: 3 / 4; }
.thumb img { width: 100%; flex: 1; object-fit: cover; min-height: 0; }
.thumb .ficon { flex: 1; display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--brown); font-size: 18px; }
.thumb .cap { font-size: 12px; padding: 4px; background: #fff; border-top: 1px solid var(--line); }
.thumb:hover { border-color: var(--blue); }
.fview { width: 100%; max-height: 70vh; object-fit: contain; background: #F4F5F7; border-radius: 8px; }
.fview.pdf { height: 70vh; border: none; }
.hlist li { font-size: 13px; line-height: 1.45; }
.stat .v.sm { font-size: 15px; }
.chip { cursor: pointer; }
.checklist { max-height: 46vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; }

/* табель */
.daybar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.daybar input[type=date] { width: 165px; }
.daybar .dlabel { font-size: 15px; }
.tday td { padding: 6px 10px; }
.tday tr.grp td { background: #F4F5F7; font-weight: 700; font-size: 13px; color: var(--ink2); padding: 6px 12px; }
.tday tr.changed td { background: #FFFBEB; }
.ti { min-height: 36px; padding: 6px 8px; text-align: right; font-family: var(--mono); }
.ti.h { width: 72px; } .ti.b { width: 92px; }
.ti:disabled { background: #F4F5F7; color: var(--faint); }
.bx-good { background: #DCFCE7 !important; color: #14532D; }
.bx-ok { background: #fff; }
.bx-low { background: #FEE2E2 !important; color: #991B1B; }
.bx-bad { background: #FCA5A5 !important; color: #7F1D1D; }
.savebar { position: sticky; bottom: 0; z-index: 6; display: flex; align-items: center; gap: 10px; justify-content: flex-end; background: #fff; border: 1px solid var(--line);
  border-radius: 12px; padding: 10px 14px; box-shadow: 0 -4px 16px rgba(0,0,0,.06); }
.savebar span { margin-right: auto; color: var(--muted); font-size: 14px; }
.tsum th, .tsum td { white-space: nowrap; padding: 7px 8px; }
.tsum .zl { border-left: 2px solid var(--line); }
.tsum th.zh { text-align: center; border-left: 2px solid var(--line); }
.tsum th.z-cold { background: var(--cold); color: var(--cold-ink); } .tsum th.z-fresh { background: var(--fresh); color: var(--fresh-ink); } .tsum th.z-dry { background: var(--dry); color: var(--dry-ink); }
.tsum thead tr:first-child th { position: static; }
.tsum tfoot td { font-weight: 700; background: #FAFBFC; border-top: 2px solid var(--line); }
.tgrid { border-collapse: separate; border-spacing: 0; }
.tgrid th, .tgrid td { padding: 0; }
.tgrid .stick { position: sticky; left: 0; background: #fff; z-index: 2; padding: 4px 10px; min-width: 170px; border-right: 1px solid var(--line); }
.tgrid thead .stick { z-index: 3; background: #FAFBFC; }
.tgrid th.c { width: 40px; min-width: 40px; text-align: center; font-size: 12px; padding: 4px 0; line-height: 1.1; }
.tgrid th.c small { display: block; font-weight: 500; color: var(--faint); font-size: 10px; }
.tgrid th.we { background: #F1F3F5; }
.tgrid th.td { background: var(--blue); color: #fff; } .tgrid th.td small { color: #DCE6FF; }
.tgrid td.c { height: 40px; text-align: center; border-right: 1px solid #fff; border-bottom: 1px solid #fff; cursor: pointer; font-size: 12px; line-height: 1.05; }
.tgrid td.c:hover { outline: 2px solid var(--blue); outline-offset: -2px; }
.tgrid td.c .t { display: block; font-weight: 600; }
.tgrid td.c .bx { display: block; font-size: 10px; font-family: var(--mono); }
.tgrid td.z-cold { background: var(--cold); } .tgrid td.z-fresh { background: var(--fresh); } .tgrid td.z-dry { background: var(--dry); }
.tgrid td.m-off { background: #7F1D1D; color: #fff; }
.tgrid td.m-sick { background: #FDBA74; color: #7C2D12; }
.tgrid td.m-load { background: #CBD5E1; color: #1E293B; }
.tgrid td.m-work:not([class*=z-]) { background: #F1F3F5; }
.tgrid td.c.bx-bad .bx, .tgrid td.c.bx-low .bx { color: #B91C1C; font-weight: 700; }
.tgrid td.c.bx-bad, .tgrid td.c.bx-low, .tgrid td.c.bx-good { background-image: none; }
.tgrid td.c.z-cold.bx-bad, .tgrid td.c.z-fresh.bx-bad, .tgrid td.c.z-dry.bx-bad,
.tgrid td.c.z-cold.bx-low, .tgrid td.c.z-fresh.bx-low, .tgrid td.c.z-dry.bx-low { background: inherit; }
.tgrid td.z-cold.bx-bad, .tgrid td.z-cold.bx-low, .tgrid td.z-cold.bx-good { background: var(--cold) !important; color: inherit; }
.tgrid td.z-fresh.bx-bad, .tgrid td.z-fresh.bx-low, .tgrid td.z-fresh.bx-good { background: var(--fresh) !important; color: inherit; }
.tgrid td.z-dry.bx-bad, .tgrid td.z-dry.bx-low, .tgrid td.z-dry.bx-good { background: var(--dry) !important; color: inherit; }
.tgrid td.empty { background: #FAFBFC; }
:root { --freeze: #E0E7FF; --freeze-ink: #3730A3; --load: #E2E8F0; --load-ink: #1E293B; }
.tgrid td.z-freeze { background: var(--freeze); } .tgrid td.z-pallet, .tgrid td.z-receiving, .tgrid td.z-defect { background: var(--load); color: var(--load-ink); font-weight: 600; }
.legend i.z-freeze { background: var(--freeze); } .legend i.z-pallet { background: var(--load); }
.tsum th.z-freeze { background: var(--freeze); color: var(--freeze-ink); } .tsum th.z-load { background: var(--load); color: var(--load-ink); }
.seg button.on.z-freeze { background: var(--freeze); color: var(--freeze-ink); }
.seg button.on.z-pallet, .seg button.on.z-receiving, .seg button.on.z-defect { background: #475569; color: #fff; }
.seg button.home:not(.on) { box-shadow: inset 0 -2px 0 #9AA1AC; }
.zsel { display: flex; gap: 6px; flex-wrap: wrap; }
.other { color: var(--orange); font-weight: 600; }
.tgrid td.z-freeze.bx-bad, .tgrid td.z-freeze.bx-low, .tgrid td.z-freeze.bx-good { background: var(--freeze) !important; color: inherit; }
.boolf { align-self: end; min-height: 40px; }
.tdslots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.tdslot { border: 1px dashed #B8BDC6; border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.tdslot.has { border-style: solid; border-color: var(--line); background: #FAFBFC; }
.tdslot .t { font-weight: 600; }
.tdslot .fn { font-size: 13px; overflow-wrap: anywhere; }
.flags { display: flex; gap: 16px; flex-wrap: wrap; }
.miss { color: #B91C1C; font-weight: 600; }
.tag.no { background: #FEE2E2; color: #991B1B; } .tag.yes { background: var(--green-bg); color: var(--green); }
.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 10px 14px; font-size: 12px; color: var(--ink2); border-top: 1px solid var(--line); position: sticky; left: 0; }
.legend i { display: inline-block; width: 14px; height: 14px; border-radius: 4px; vertical-align: -3px; margin-right: 5px; }
.legend i.z-cold { background: var(--cold); } .legend i.z-fresh { background: var(--fresh); } .legend i.z-dry { background: var(--dry); }
.legend i.m-load { background: #CBD5E1; } .legend i.m-off { background: #7F1D1D; } .legend i.m-sick { background: #FDBA74; }

/* баланс менеджера */
.cr { font-size: 12px; font-weight: 600; border-radius: 6px; padding: 2px 8px; white-space: nowrap; }
.c-manager { background: #F3E8FF; color: #6B21A8; } .c-company { background: var(--orange-bg); color: var(--orange); } .c-rs { background: #EEF3FF; color: var(--blue-dark); }
.p-rs { background: #EEF3FF; color: var(--blue-dark); } .p-manager { background: #F3E8FF; color: #6B21A8; }
tr.done td { color: var(--faint); }
.tile.t-now { background: var(--blue); border-color: var(--blue); } .tile.t-now .l, .tile.t-now .s { color: #DCE6FF; } .tile.t-now .v { color: #fff; }
.wtable td, .dbtable td, .ltable2 td { padding-top: 8px; padding-bottom: 8px; }
.wtable input[type=checkbox] { width: 20px; height: 20px; min-height: 0; }
.dbtable tfoot td { font-weight: 700; background: #FAFBFC; border-top: 2px solid var(--line); }
tr.r-in td:first-child { box-shadow: inset 4px 0 0 #22A05A; } tr.r-out td:first-child { box-shadow: inset 4px 0 0 #D64545; }

/* согласование */
@keyframes pulse { 0%, 100% { background: #FEE2E2; box-shadow: 0 0 0 0 rgba(220, 38, 38, .45); } 50% { background: #FCA5A5; box-shadow: 0 0 0 5px rgba(220, 38, 38, 0); } }
.alarm { display: inline-flex; align-items: center; gap: 4px; color: #991B1B; font-weight: 700; border-radius: 999px; padding: 2px 9px; font-size: 12px; animation: pulse 1.4s ease-in-out infinite; white-space: nowrap; }
.alarm.big { width: 30px; height: 30px; justify-content: center; font-size: 18px; padding: 0; }
.alarm.sm { padding: 0 7px; margin-left: 6px; }
.alarmrow { display: flex; align-items: center; gap: 8px; }
.okc { color: var(--green); font-weight: 600; } .noc { color: #B91C1C; font-weight: 600; } .procc { color: var(--yellow); font-weight: 600; white-space: nowrap; }
.stage { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600; background: #EEF0F3; color: var(--ink2); white-space: nowrap; }
.st-new { background: #FEF3C7; color: #8A6100; } .st-patent, .st-applied { background: #EEF3FF; color: var(--blue-dark); }
.st-training, .st-sb { background: #F3E8FF; color: #6B21A8; } .st-approved { background: #DCFCE7; color: #166534; }
.st-claimed { background: var(--green-bg); color: var(--green); } .st-black, .st-rejected { background: #7F1D1D; color: #fff; }
.onb .osteps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.ostep { display: flex; gap: 10px; padding: 12px 14px; border-top: 1px solid var(--line2); border-right: 1px solid var(--line2); min-width: 0; }
.ostep:nth-child(3n) { border-right: none; }
.ostep.dim { opacity: .5; }
.onum { flex: none; width: 26px; height: 26px; border-radius: 50%; background: #EEF0F3; color: var(--ink2); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }
.s-ok .onum { background: var(--green); color: #fff; } .s-stop .onum { background: #7F1D1D; color: #fff; } .s-alarm .onum { background: #DC2626; color: #fff; }
.obody { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1; }
.otitle { font-weight: 700; font-size: 14px; }
.docrows { display: flex; flex-direction: column; gap: 4px; }
.docrow { display: flex; align-items: baseline; gap: 8px; text-align: left; background: #FFF7F7; border: 1px dashed #F0B4AA; border-radius: 8px; padding: 6px 9px; font-size: 13px; color: var(--ink); min-width: 0; }
.docrow.has { background: #FAFBFC; border: 1px solid var(--line); }
.docrow:hover:not(:disabled) { border-color: var(--blue); background: #F2F5FF; }
.docrow:disabled { cursor: default; }
.docrow .dl { font-weight: 600; flex: none; }
.docrow .di { color: var(--muted); font-size: 12px; min-width: 0; }
.docrow:not(.has) .di { color: var(--blue); }
.docl { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; }
.pcl { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; }
.pcl .check { font-size: 13px; }
.readybox { background: var(--green-bg); color: var(--green); border-radius: 8px; padding: 8px 10px; font-size: 13px; font-weight: 600; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.readybox.blue { background: var(--blue-bg); color: var(--blue-dark); }
.stopbox { background: #7F1D1D; color: #fff; border-radius: 8px; padding: 8px 10px; font-size: 13px; font-weight: 600; }
.inline { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; font-size: 13px; }
.inline input { width: auto; min-height: 34px; padding: 5px 8px; }
.mt6 { margin-top: 6px; }
.onb.done .boxhead { border-bottom: none; }
.otable th, .otable td { white-space: nowrap; }
.otable td.nmcell { white-space: normal; min-width: 180px; }
.otable .c { text-align: center; } .otable .pch { background: #FAFBFC; }
.otable thead .pch { background: #F1F5F9; }
.otable tr.nomed td:first-child { box-shadow: inset 4px 0 0 #DC2626; }
.nowrap { white-space: nowrap; }
.tag.cit { background: #FFF7ED; color: #9A3412; }
/* направление */
.dirdoc { padding: 18px 18px 22px; }
.dirhead { display: flex; flex-direction: column; align-items: center; gap: 2px; font-family: 'Times New Roman', Times, serif; font-size: 15px; margin-bottom: 12px; }
.dirbar { margin-bottom: 8px; }
.dirtable { font-family: 'Times New Roman', Times, serif; border: 1px solid #000; }
.dirtable th { background: #BFBFBF; color: #000; font-size: 12px; text-align: center; white-space: normal; border: 1px solid #000; padding: 4px; position: static; }
.dirtable td { font-size: 12.5px; border: 1px solid #000; padding: 2px 5px; vertical-align: middle; }
.dirtable td.c { text-align: center; }
.dirtable tr.split td { border-top: 2.5px solid #000; }
.dirtable td:last-child { border: none; padding-left: 8px; }
.dirtable th:last-child { background: none; border: none; }
.mv { border: 1px solid #CDD2DA; background: #fff; border-radius: 5px; width: 24px; height: 24px; font-size: 10px; padding: 0; margin-right: 2px; }
.mv.x { color: var(--brown); font-size: 14px; }
.mv:disabled { opacity: .3; }
.dirfoot { display: flex; justify-content: space-around; margin-top: 26px; font-family: 'Times New Roman', Times, serif; }
.dirfoot span { display: flex; flex-direction: column; align-items: center; min-width: 220px; border-bottom: 0; }
.dirfoot b { border-bottom: 1px solid #000; padding: 0 20px 2px; }
.dirfoot small { font-size: 10px; font-style: italic; color: var(--muted); }

/* выработка */
.tile.t-good { background: var(--green-bg); border-color: #A7E3B9; } .tile.t-good .v { color: var(--green); }
.ogrid th.c, .ogrid td.c { min-width: 46px; width: 46px; }
.ogrid td.c .t { font-family: var(--mono); font-size: 11px; font-weight: 600; }
.ogrid .zt { padding: 4px 10px; white-space: nowrap; border-left: 2px solid var(--line); font-size: 13px; }
.ogrid th.zt { font-size: 12px; }
.ogrid th.z-dry { background: var(--dry); color: var(--dry-ink); } .ogrid th.z-cold { background: var(--cold); color: var(--cold-ink); }
.ogrid th.z-freeze { background: var(--freeze); color: var(--freeze-ink); } .ogrid th.z-fresh { background: var(--fresh); color: var(--fresh-ink); }
.ogrid tfoot td { background: #FAFBFC; font-weight: 700; border-top: 2px solid var(--line); padding: 6px 4px; font-size: 11px; }
.ogrid tfoot td.zt { font-size: 13px; }
.ogrid tfoot .stick { font-size: 13px; }
.ogrid td.c.bx-bad .t, .ogrid td.c.bx-low .t { color: #B91C1C; }
.ogrid td.c.bx-good .t { color: #15803D; }
.ogrid td.zt.bx-bad, .ogrid td.zt.bx-low { color: #B91C1C; background: #FEF2F2 !important; } .ogrid td.zt.bx-good { color: #15803D; background: #F0FDF4 !important; }
.tsum th.z-load { background: var(--load); color: var(--load-ink); }

/* перевод в течение смены */
:root { --zc-dry: #FEF3C7; --zc-cold: #DBEAFE; --zc-freeze: #E0E7FF; --zc-fresh: #DCFCE7; --zc-pallet: #CBD5E1; --zc-receiving: #CBD5E1; --zc-defect: #CBD5E1; }
.tday tr.hassplit td { border-bottom: none; }
.tday .seg { flex-wrap: nowrap; }
.tday tr.split2 td { padding-top: 0; background: #FAFBFC; }
.tday tr.split2.changed td { background: #FFFBEB; }
.tday tr.split2 td:first-child { font-style: italic; }

/* опоздания */
.latetag.over { color: #9A3412; background: #FFEDD5; white-space: normal; display: inline-block; margin-top: 2px; }
.latetag { margin-left: 6px; font-size: 11px; font-weight: 700; color: #B45309; background: #FEF3C7; border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
td.late { color: #B45309; font-weight: 700; }
.tgrid td.c.islate { box-shadow: inset 0 -3px 0 #F59E0B; }
.tgrid td.c.islate .t { color: #B45309; }
.legend i.islate { background: #fff; box-shadow: inset 0 -3px 0 #F59E0B; border: 1px solid var(--line); }

/* настройки */
.setgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.setgrid .wide { grid-column: 1 / -1; }
.setgrid section { display: flex; flex-direction: column; gap: 10px; }
.setgrid .h { padding: 0; border: none; font-size: 16px; }
.steps { margin: 0; padding-left: 18px; line-height: 1.6; }

@media (max-width: 760px) {
  .titlebar { gap: 8px; }
  .titlebar > .grow { flex-basis: 100%; }
  .toolbar { gap: 8px; }
  .search { width: 100%; }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid3 { grid-template-columns: 1fr; }
  .cgrid, .setgrid { grid-template-columns: 1fr; }
  .kv { grid-template-columns: 120px minmax(0, 1fr); font-size: 14px; }
  .cact { justify-content: flex-start; }
  .cact .btn { flex: 1 1 auto; }
  .dchip { min-width: 0; flex: 1 1 calc(50% - 8px); padding: 8px 10px; }
  .dchip .v { font-size: 17px; }
  .boxhead { padding: 10px; }
  .boxhead .seg { width: 100%; }
  .boxhead .seg button { flex: 1; }
  .sticky-foot { bottom: -20px; }

  /* списки — карточками */
  .dtable thead, .etable thead { display: none; }
  .dtable tr, .etable tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 10px 12px; border-bottom: 1px solid var(--line2); align-items: center; }
  .dtable td, .etable td { display: block; border: none; padding: 0 !important; }
  .dtable td:empty, .etable td:empty { display: none; }
  .dtable td.r { grid-column: 1 / -1; text-align: left; }
  .dtable td.r .btn { width: 100%; }
  .dtable td:nth-child(4).small { grid-column: 1 / -1; }
  .etable td:nth-child(1) { grid-column: 1; }
  .etable td:nth-child(2) { grid-column: 2; grid-row: 1; text-align: right; color: var(--muted); font-size: 13px; }
  .etable td:nth-child(3) { display: none; }
  .etable td:nth-child(4)::before { content: 'Патент '; font-size: 12px; color: var(--muted); }
  .etable td:nth-child(5)::before { content: 'Регистр. '; font-size: 12px; color: var(--muted); }
  .etable td:nth-child(6), .etable td:nth-child(7) { display: none; }
  tr.lvrow-over td:first-child, tr.lvrow-red td:first-child, tr.lvrow-orange td:first-child, tr.lvrow-yellow td:first-child, tr.lvrow-missing td:first-child { box-shadow: none; }
  .dtable tr.lvrow-over { box-shadow: inset 4px 0 0 var(--over); } .dtable tr.lvrow-red { box-shadow: inset 4px 0 0 var(--red); }
  .dtable tr.lvrow-orange { box-shadow: inset 4px 0 0 #FB923C; } .dtable tr.lvrow-yellow { box-shadow: inset 4px 0 0 #FACC15; } .dtable tr.lvrow-missing { box-shadow: inset 4px 0 0 #B8BDC6; }
  .dtable td:nth-child(2) { grid-column: 1; font-size: 13px; color: var(--ink2); }
  .dtable td:nth-child(3) { grid-column: 2; grid-row: 1 / span 2; }

  /* табель за день: каждая строка — карточка */
  .tday thead { display: none; }
  .tday tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 8px; padding: 10px 10px 12px; border-bottom: 1px solid var(--line); }
  .tday td { display: block; padding: 0; border: none; }
  .tday tr.grp { display: block; padding: 0; }
  .tday tr.grp td { display: block; }
  .tday td:nth-child(1) { grid-column: 1 / -1; }
  .tday td:nth-child(2) { grid-column: 1 / -1; }
  .tday td:nth-child(2) .seg { display: grid; grid-template-columns: repeat(4, 1fr); width: 100%; }
  .tday td:nth-child(5) { grid-column: 1 / -1; }
  .tday td:nth-child(5) .seg { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
  .ti.h, .ti.b { width: 100%; }
  .tday tr.idle td:nth-child(n+3) { display: none; }
  .tday tr.changed { background: #FFFBEB; }
  .tday tr.changed td { background: none; }
  .tday tr.m-load td:nth-child(n+4) { display: none; }
  .tday tr { grid-template-columns: 76px 96px minmax(0, 1fr); }
  .tday td:nth-child(5) { grid-column: 3; grid-row: 3; align-self: end; }
  .tday td:nth-child(5) .seg { padding: 2px; }
  .tday td:nth-child(3)::before { content: 'Часы'; display: block; font-size: 11px; color: var(--muted); margin-bottom: 2px; }
  .tday td:nth-child(4)::before { content: 'Короба'; display: block; font-size: 11px; color: var(--muted); margin-bottom: 2px; }
  .seg.sm button { min-height: 40px; }
  .daybar input[type=date] { flex: 1; width: auto; min-width: 0; }
  .daybar .dlabel { display: none; }
  .daybar > .grow { display: none; }
  .daybar > .small { flex-basis: 100%; }
  .daybar > .btn:last-child { flex-basis: 100%; }
  .savebar { border-radius: 12px; padding: 8px 10px; }
  .savebar span { font-size: 13px; }
  .tgrid .stick { min-width: 120px; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
  .atable thead { display: none; }
  .atable tr { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; padding: 10px 12px; border-bottom: 1px solid var(--line2); }
  .atable td { display: block; padding: 0; border: none; }
  .atable td:nth-child(2) { text-align: right; font-size: 12px; font-weight: 600; }
  .atable td:nth-child(3) { display: none; }
  .atable td:nth-child(4), .atable td:nth-child(5) { grid-column: 1 / -1; }
  .ptable th:nth-child(1), .ptable td:nth-child(1) { display: none; }
  .wtable thead, .dbtable thead, .ltable2 thead { display: none; }
  .wtable tr, .dbtable tr, .ltable2 tr { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 8px; padding: 10px 12px; border-bottom: 1px solid var(--line2); align-items: center; }
  .wtable td, .dbtable td, .ltable2 td { display: block; padding: 0 !important; border: none; }
  .wtable td:nth-child(4) { display: none; }
  .wtable td:nth-child(5) { grid-column: 2; font-size: 12px; color: var(--muted); text-align: left; }
  .wtable td:nth-child(5)::before { content: 'остаток '; }
  .wtable td:nth-child(6) { grid-column: 3; grid-row: 1 / span 2; }
  .wtable td:nth-child(7) { grid-column: 1 / -1; }
  .wtable td:nth-child(7) .btn { width: 100%; }
  .wtable .ti.b { width: 110px; }
  .dbtable tr { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dbtable td:nth-child(1), .dbtable td:nth-child(5) { grid-column: 1 / -1; text-align: left; }
  .dbtable td:nth-child(5) .btn { width: 100%; }
  .dbtable td:nth-child(2)::before { content: 'менеджеру'; display: block; font-size: 11px; color: var(--muted); font-family: var(--sans); }
  .dbtable td:nth-child(3)::before { content: 'компании'; display: block; font-size: 11px; color: var(--muted); font-family: var(--sans); }
  .dbtable td:nth-child(4)::before { content: 'Р/С'; display: block; font-size: 11px; color: var(--muted); font-family: var(--sans); }
  .dbtable td.r { text-align: left; }
  .dbtable tfoot tr { background: #FAFBFC; }
  .ltable2 tr { grid-template-columns: auto minmax(0, 1fr) auto; }
  .ltable2 td:nth-child(3), .ltable2 td:nth-child(4) { grid-column: 2; font-size: 12px; }
  .ltable2 td:nth-child(3):has(.faint), .ltable2 td:nth-child(4):empty { display: none; }
  .ltable2 td:nth-child(5) { grid-column: 3; grid-row: 1; }
  .ltable2 td:nth-child(6) { grid-column: 3; grid-row: 2; font-size: 12px; color: var(--muted); }
  .ltable2 td:nth-child(7) { display: none; }
}

/* выбор периода оплаты патента */
.monthpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:6px;margin-top:4px}
.monthpick .mp{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);cursor:pointer;font:inherit;text-align:left}
.monthpick .mp b{font-size:14px}
.monthpick .mp span{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.monthpick .mp.on{border-color:var(--blue);background:var(--blue-bg);box-shadow:inset 0 0 0 1px var(--blue)}
.monthpick .mp.on span{color:var(--blue)}

/* действия в плитках сроков */
.dchip .dact { margin-top: 8px; }
.dchip .dnote { margin-top: 6px; font-style: italic; }
.btn.need { border-color: var(--brown); color: var(--brown); }
.csec .pre { white-space: pre-wrap; }

/* плитки: сроки слева, данные о работе справа (отдельная окраска) */
.tilerow { display: flex; gap: 22px; flex-wrap: wrap; align-items: stretch; margin-bottom: 16px; }
.tilerow .dchips { margin: 0; }
.wtiles { display: flex; gap: 8px; flex-wrap: wrap; align-items: stretch; padding-left: 22px; border-left: 2px dashed var(--line); position: relative; }
.wt { background: #F1EEFC; border: 1px solid #DDD5F7; border-radius: 12px; padding: 10px 14px; min-width: 140px; }
.wt .l { font-size: 12px; font-weight: 600; color: #6D28D9; }
.wt .v { font-size: 16px; font-weight: 700; margin-top: 4px; color: var(--ink); }
.wt .v.num { font-size: 18px; letter-spacing: .02em; }
.wt .v.faint { color: var(--faint); font-weight: 500; }
.wt .s { font-size: 12px; color: var(--muted); margin-top: 4px; }
.wtiles .wedit { align-self: flex-start; }
.wlogin { color: #6D28D9; font-weight: 600; }
.nowrap { white-space: nowrap; }

/* отпуск, увольнение, временно убран */
.tag.vac { background: #E0F2FE; color: #075985; }
.tag.hold { background: #FEF3C7; color: #92400E; }
.tag.hold .link { margin-left: 6px; font-size: 12px; }
.vacs { color: #0369A1; }
.tgrid td.m-vac { background: #E0F2FE; color: #075985; font-weight: 600; }
.legend i.m-vac { background: #E0F2FE; }
.heldbox { margin-top: 14px; }
.heldbox ul { padding: 8px 16px 14px; }
.heldbox li { padding: 6px 0; border-bottom: 1px solid var(--line2); }

/* плитки работы — нажимаются */
button.wt { font: inherit; text-align: left; cursor: default; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; }
.wt.click { cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.wt.click:hover { border-color: #A78BFA; box-shadow: 0 1px 0 #DDD5F7; }
.wt .pen { margin-left: 6px; opacity: 0; font-size: 12px; }
.wt.click:hover .pen { opacity: .8; }
/* сворачивание блоков */
.foldbtn { border: 0; background: transparent; cursor: pointer; font-size: 14px; color: var(--muted); padding: 2px 6px 2px 0; }
.foldt { cursor: pointer; user-select: none; }
.csec.folded .boxhead { border-bottom: 0; }
.tddates { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin-top: 10px; }
.tddates label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted); }

.filters select.possel, select.possel { width: auto; flex: 0 0 auto; height: 40px; border: 1px solid var(--line); border-radius: 10px; padding: 0 10px; font: inherit; background: #fff; color: var(--ink); }
.modal .boolf { justify-content: flex-start; align-self: flex-start; }
th.r .sorth { justify-content: flex-end; }

/* итоги табеля: значения и названия по центру колонки, стрелки сортировки — под названием */
.tsum th.c, .tsum td.c { text-align: center; }
th.c .sorth { flex-direction: column; gap: 4px; }
.sorth .sb { display: inline-flex; gap: 4px; }
th.c .sorth .sb button { width: 20px; height: 18px; font-size: 9px; }

/* доп. грузчик в табеле */
:root { --zc-extra: #FDE68A; }
.tgrid td.z-extra { background: #FDE68A; color: #78350F; font-weight: 600; }
.legend i.z-extra { background: #FDE68A; }
.seg button.on.z-extra { background: #B45309; color: #fff; }
/* дополнительные должности — несколько галочек */
.possbox .lbl { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.possgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
.possgrid .check { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; font-size: 14px; }
.possgrid .check.on { border-color: var(--blue); background: var(--blue-bg); }