/* Штаб IK v12 — мобильная версия (телефон, ширина до 760 px). Вид — по прототипу shtab-mobile/prototype.
   На компьютере ничего из этого не действует: всё включается классом body.m-on (его ставит mobile.js). */
#m-root{display:none;}
body.m-on #m-root{display:block;}
body.m-on #app > header.topbar,
body.m-on #tabs, body.m-on #moreSheet, body.m-on .subnav, body.m-on #previewBar{display:none !important;}
body.m-on.m-own #app > .shell{display:none !important;}
body.m-on.m-legacy #app > .shell{padding:12px 12px 96px !important;}
body.m-on.m-legacy #mMain, body.m-on.m-legacy #mFab{display:none !important;}
/* Обход ЖК и Конструктор КП (страницы во фрейме) — во весь экран между шапкой и нижним меню */
body.m-on.m-legacy.frame-view #app > .shell{padding:0 0 calc(64px + env(safe-area-inset-bottom,0px)) !important;}
body.m-on .app-frame{height:calc(100dvh - 150px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)) !important; min-height:0 !important; margin:0 !important; width:100% !important; border:0 !important; border-radius:0 !important;}
body.m-on.m-lock{overflow:hidden;}

#m-root{
  --m-brand:#1F5C4F; --m-brand-dark:#163F36; --m-bg:#F6F8F7; --m-ink:#16211E; --m-dim:#5F6B67; --m-line:#E6EAE8; --m-line2:#D3DAD7;
  font-family:'Manrope',system-ui,sans-serif; color:var(--m-ink);
}
body.m-on{background:#F6F8F7;}
#m-root button, #m-root input, #m-root textarea, #m-root select{font-family:inherit;}
#m-root button{cursor:pointer; -webkit-tap-highlight-color:transparent;}
#m-root :focus-visible{outline:3px solid #7FB6A6; outline-offset:2px;}
.m-sr{position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ---------- шапка ---------- */
.m-head{position:sticky; top:0; z-index:40; padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px; background:#fff; border-bottom:1px solid var(--m-line);
  display:flex; align-items:center; justify-content:space-between; gap:8px;}
.m-head-l{display:flex; flex-direction:column; gap:2px; min-width:0;}
.m-sub{font-size:12px; font-weight:600; color:var(--m-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-title{font-size:22px; font-weight:800; letter-spacing:-.3px; line-height:1.15;}
.m-head-r{display:flex; gap:8px; align-items:center; flex:none;}
.m-net{height:36px; padding:0 12px; border-radius:18px; font-size:12px; font-weight:800; display:flex; align-items:center; gap:6px; border:1px solid #A9D8BA; background:#E9F6EE; color:#1E6B3E; white-space:nowrap;}
.m-net::before{content:""; width:8px; height:8px; border-radius:4px; background:#2E7D4F;}
.m-net.off{border-color:#EFD27F; background:#FFF7DB; color:#7A4E0B;}
.m-net.off::before{background:#B7791F;}
.m-bell{width:44px; height:44px; border-radius:22px; border:1px solid #D9E0DD; background:#fff; color:var(--m-ink); position:relative; display:flex; align-items:center; justify-content:center; padding:0;}
.m-badge{position:absolute; top:-2px; right:-2px; min-width:18px; height:18px; padding:0 5px; box-sizing:border-box; border-radius:9px; background:#C62828; color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center;}
.m-offbar{padding:8px 16px; background:#FFF7DB; border-bottom:1px solid #EFD27F; font-size:12px; font-weight:600; color:#6B4A12; line-height:1.4;}

/* ---------- нижнее меню ---------- */
.m-nav{position:fixed; left:0; right:0; bottom:0; z-index:45; background:#fff; border-top:1px solid var(--m-line);
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); padding-bottom:env(safe-area-inset-bottom,0px);}
.m-nav button{height:64px; border:0; background:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  font-size:11.5px; font-weight:600; color:var(--m-dim); position:relative; padding:0;}
.m-nav button[aria-current="page"]{color:var(--m-brand); font-weight:800;}
.m-nav .m-badge{top:6px; right:calc(50% - 22px);}

/* ---------- основная область ---------- */
.m-main{padding:12px 16px calc(110px + env(safe-area-inset-bottom,0px)); display:flex; flex-direction:column; gap:14px;}
.m-grid4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px;}
.m-grid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px;}
.m-grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;}
.m-cnt{height:54px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; color:var(--m-ink); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:0 2px;}
.m-cnt b{font-size:17px; font-weight:800;}
.m-cnt span{font-size:11px; font-weight:700; white-space:nowrap;}
.m-cnt.red{color:#A61B1B;}
.m-cnt[aria-pressed="true"]{background:var(--m-brand); border-color:var(--m-brand); color:#fff;}
.m-chip{min-height:40px; border-radius:12px; border:1px solid #E0E6E3; background:#fff; color:var(--m-ink); font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:6px; padding:0 4px;}
.m-chip i{width:8px; height:8px; border-radius:4px; flex:none; background:var(--fg);}
.m-chip span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.m-chip b{font-weight:800; color:var(--m-dim);}
.m-chip[aria-pressed="true"]{border:1.5px solid var(--fg); background:var(--bg); color:var(--fg); font-weight:800;}
.m-chip[aria-pressed="true"] b{color:var(--fg);}
.m-who{padding:8px 8px 8px 12px; border-radius:12px; background:#E6F0ED; display:flex; align-items:center; justify-content:space-between; gap:8px;}
.m-who span{font-size:13px; font-weight:800; color:var(--m-brand);}
.m-pill-btn{min-height:36px; padding:0 12px; border-radius:18px; border:1px solid #9CC5B8; background:#fff; color:var(--m-brand); font-size:12px; font-weight:700;}
.m-group{display:flex; flex-direction:column; gap:8px;}
.m-group-h{font-size:13px; font-weight:800; color:var(--gc,var(--m-ink));}
.m-row{width:100%; text-align:left; background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px 14px; display:flex; gap:10px; align-items:flex-start; color:var(--m-ink);}
.m-row > .m-dot{width:10px; height:10px; border-radius:5px; margin-top:5px; flex:none;}
.m-row-main{display:flex; flex-direction:column; gap:5px; flex:1; min-width:0;}
.m-row-title{font-size:15px; font-weight:700; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere;}
.m-row-meta{display:flex; gap:6px; align-items:center; flex-wrap:wrap;}
.m-tag{padding:1px 7px; border-radius:8px; border:1px solid var(--fg); color:var(--fg); font-size:11px; font-weight:800; white-space:nowrap;}
.m-meta{font-size:12px; font-weight:600; color:var(--m-dim); line-height:1.4;}
.m-stlab{padding:3px 8px; border-radius:10px; font-size:11px; font-weight:800; flex:none; white-space:nowrap;}
.m-empty{padding:32px 16px; text-align:center; font-size:14px; font-weight:600; color:var(--m-dim);}
.m-more{min-height:44px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; color:var(--m-brand); font-size:13px; font-weight:700;}
.m-fab{position:fixed; right:16px; bottom:calc(80px + env(safe-area-inset-bottom,0px)); z-index:44; height:52px; padding:0 18px 0 14px; border-radius:26px; border:0;
  background:var(--m-brand); color:#fff; font-size:15px; font-weight:800; display:flex; align-items:center; gap:6px; box-shadow:0 6px 18px rgba(22,63,54,.28);}

/* ---------- экран задачи и страницы (поверх всего) ---------- */
.m-screen{position:fixed; inset:0; z-index:60; background:var(--m-bg); display:flex; flex-direction:column;}
.m-screen[hidden]{display:none;}
.m-screen-h{padding:calc(10px + env(safe-area-inset-top,0px)) 8px 10px; display:flex; align-items:center; gap:4px; background:#fff; border-bottom:1px solid var(--m-line);}
.m-back{width:44px; height:44px; border-radius:22px; border:0; background:none; color:var(--m-ink); display:flex; align-items:center; justify-content:center; padding:0;}
.m-screen-t{display:flex; flex-direction:column; min-width:0;}
.m-screen-t b{font-size:17px; font-weight:800;}
.m-screen-t span{font-size:11px; font-weight:600; color:var(--m-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-screen-b{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:16px; display:flex; flex-direction:column; gap:14px;}
.m-screen-b > *, .m-sheet > *{flex-shrink:0;}   /* блоки растут под текст, а не сжимаются */
.m-screen-f{padding:12px 16px calc(14px + env(safe-area-inset-bottom,0px)); background:#fff; border-top:1px solid var(--m-line);}
.m-chips{display:flex; gap:6px; flex-wrap:wrap;}
.m-badge2{padding:4px 10px; border-radius:12px; font-size:12px; font-weight:800;}
.m-lab{font-size:12px; font-weight:700; color:var(--m-dim);}
.m-ttl-row{display:flex; justify-content:space-between; align-items:center; gap:8px;}
.m-link{min-height:36px; padding:0 12px; border-radius:18px; border:1px solid #9CC5B8; background:#fff; color:var(--m-brand); font-size:13px; font-weight:700;}
.m-big{font-size:20px; font-weight:800; line-height:1.3; overflow-wrap:anywhere;}
.m-card{background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:14px 16px; display:flex; flex-direction:column; gap:8px;}
.m-card.flush{padding:0; gap:0; overflow:hidden;}
.m-card-row{padding:14px; display:flex; align-items:center; justify-content:space-between; gap:8px; border-bottom:1px solid #EEF1F0;}
.m-card-row:last-child{border-bottom:0;}
.m-card-row.col{flex-direction:column; align-items:stretch;}
.m-desc{font-size:15px; font-weight:500; line-height:1.6; color:var(--m-ink); white-space:pre-wrap; overflow-wrap:anywhere;}
.m-val{font-size:16px; font-weight:800;}
.m-opts{display:flex; gap:6px; flex-wrap:wrap;}
.m-opt{min-height:40px; padding:0 14px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; color:var(--m-ink); font-size:13px; font-weight:700;}
.m-opt[aria-pressed="true"]{background:var(--m-brand); border-color:var(--m-brand); color:#fff; font-weight:800;}
.m-date{min-height:44px; padding:0 12px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; font-size:16px; color:var(--m-ink);}
.m-st-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px;}
.m-st{min-height:44px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; font-size:13px; font-weight:700; color:var(--m-ink); padding:0 2px;}
.m-st[aria-pressed="true"]{border-color:transparent; color:#fff; font-weight:800;}
.m-req{background:#FFF7DB; border:1px solid #EFD27F; border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:4px; color:#6B4A12; font-size:13px; font-weight:600;}
.m-req b{color:#7A4E0B; font-weight:800;}
.m-cmt{display:flex; flex-direction:column; gap:4px; padding-bottom:10px; border-bottom:1px solid #EEF1F0;}
.m-cmt-h{font-size:12px; font-weight:700; color:var(--m-brand);}
.m-cmt-h i{font-style:normal; color:var(--m-dim); font-weight:600;}
.m-cmt-t{font-size:15px; font-weight:500; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere;}
.m-ta{width:100%; box-sizing:border-box; min-height:48px; padding:11px 12px; border-radius:12px; border:1px solid var(--m-line2); background:#fff;
  font-size:16px; line-height:1.5; color:var(--m-ink); resize:none; overflow:hidden; field-sizing:content;}
.m-ta.title{font-size:17px; font-weight:700;}
.m-ta:focus{border-color:var(--m-brand); outline:none; box-shadow:0 0 0 3px #CFE3DC;}
.m-count{font-size:12px; font-weight:700; color:var(--m-dim);}
.m-count.over{color:#A61B1B;}
.m-edit{background:#fff; border:1.5px solid #9CC5B8; border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:12px;}
.m-field{display:flex; flex-direction:column; gap:6px;}
.m-field-h{display:flex; justify-content:space-between; gap:8px;}
.m-btn{min-height:44px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; color:var(--m-ink); font-size:14px; font-weight:700; padding:0 12px;}
.m-btn.main{border:0; background:var(--m-brand); color:#fff; font-weight:800;}
.m-btn.big{min-height:52px; border-radius:14px; font-size:15px;}
.m-btn.warn{border-color:#F0B1AB; color:#A61B1B;}
.m-btn[disabled]{opacity:.5;}
.m-hint{font-size:12px; font-weight:600; color:var(--m-dim); line-height:1.35;}
.m-err{font-size:13px; font-weight:700; color:#A61B1B;}
.m-photos{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px;}
.m-photos a{display:block; aspect-ratio:1; border-radius:10px; overflow:hidden; background:#E9EEEC;}
.m-photos img{width:100%; height:100%; object-fit:cover; display:block;}
.m-select{min-height:44px; padding:0 10px; border-radius:12px; border:1px solid var(--m-line2); background:#fff; font-size:16px; color:var(--m-ink); width:100%;}
.m-note{padding:12px 14px; border-radius:14px; background:#fff; border:1px solid var(--m-line); display:flex; flex-direction:column; gap:3px; text-align:left; width:100%; color:var(--m-ink);}
.m-note b{font-size:14px; font-weight:800;}
.m-note span{font-size:13px; font-weight:500; color:var(--m-dim); line-height:1.4;}
.m-note i{font-style:normal; font-size:11px; font-weight:600; color:var(--m-dim);}
.m-note.unread{border-color:#9CC5B8; background:#F3FAF7;}

/* ---------- шторка снизу: непрозрачная, фон затемнён ---------- */
.m-sheet-wrap{position:fixed; inset:0; z-index:70; display:flex; flex-direction:column; justify-content:flex-end;}
.m-sheet-wrap[hidden]{display:none;}
.m-backdrop{position:absolute; inset:0; background:rgba(22,33,30,.5); border:0; padding:0;}
.m-sheet{position:relative; background:#fff; border-radius:20px 20px 0 0; max-height:92vh; overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:8px 16px calc(16px + env(safe-area-inset-bottom,0px)); display:flex; flex-direction:column; gap:14px; box-shadow:0 -8px 30px rgba(0,0,0,.18);}
.m-grab{width:40px; height:5px; border-radius:3px; background:#D3DAD7; margin:0 auto;}
.m-sheet-h{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.m-sheet-h b{font-size:18px; font-weight:800;}
.m-x{width:44px; height:44px; border-radius:22px; border:0; background:#F1F4F3; color:var(--m-ink); font-size:20px; padding:0;}

/* ---------- календарь «Мой день» ---------- */
body.m-on.m-own #mMain:has(.m-grid-cal){padding-top:0; gap:10px;}
.m-week{position:sticky; top:calc(66px + env(safe-area-inset-top,0px)); z-index:30; margin:0 -16px; padding:8px 6px 10px; background:#fff; border-bottom:1px solid var(--m-line);
  display:grid; grid-template-columns:26px repeat(7,minmax(0,1fr)) 26px; gap:3px;}
.m-wk-arrow{border:0; background:none; color:var(--m-dim); font-size:22px; font-weight:700; padding:0; min-height:58px;}
.m-wd{min-height:58px; border-radius:12px; border:1px solid transparent; background:#fff; color:var(--m-ink); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:0;}
.m-wd span{font-size:12px; font-weight:600; color:var(--m-dim);}
.m-wd b{font-size:18px; font-weight:700;}
.m-wd i{font-style:normal; font-size:10px; font-weight:700; color:var(--m-dim);}
.m-wd i.red{color:#C62828;}
.m-wd.today b{color:var(--m-brand);}
.m-wd[aria-pressed="true"]{background:var(--m-brand); color:#fff;}
.m-wd[aria-pressed="true"] span, .m-wd[aria-pressed="true"] i, .m-wd[aria-pressed="true"] b{color:#fff;}
.m-plan{padding:10px 12px; border-radius:12px; background:#EAF1FD; border:1px solid #AFC6F2; display:flex; flex-direction:column; gap:8px;}
.m-plan > span{font-size:13px; font-weight:700; color:#1D3F8A; line-height:1.35;}
.m-cal-h{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.m-cal-ht{display:flex; flex-direction:column; gap:2px; min-width:0;}
.m-cal-ht b{font-size:14px; font-weight:800;}
.m-cal-ht span{font-size:12px; font-weight:600; color:var(--m-dim);}
.m-cal-add{flex:none; min-height:40px; padding:0 14px 0 10px; border-radius:20px; border:0; background:var(--m-brand); color:#fff; font-size:13px; font-weight:800; display:flex; align-items:center; gap:4px;}
.m-nots{display:flex; flex-direction:column; gap:6px;}
.m-nots-row{width:100%; text-align:left; border:1px dashed #AFC6F2; background:#F8FAFF; border-radius:12px; padding:9px 12px; display:flex; flex-direction:column; gap:2px; color:var(--m-ink);}
.m-nots-row span{font-size:14px; font-weight:700; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;}
.m-nots-row i{font-style:normal; font-size:12px; font-weight:600; color:#1D3F8A;}
.m-grid-cal{position:relative; margin:0 -4px;}
.m-hr{position:absolute; left:0; right:0; height:0; border-top:1px solid #E3E8E6; margin-left:48px;}
.m-hr span{position:absolute; left:-48px; top:-8px; width:40px; font-size:11px; font-weight:600; color:var(--m-dim); text-align:right;}
.m-slot{position:absolute; left:56px; right:12px; border:1px dashed transparent; border-radius:10px; background:transparent; color:#5F6B67; font-size:12px; font-weight:700; text-align:left; padding:0 10px;}
.m-slot:hover, .m-slot:focus-visible{border-color:#C9D6D1; color:#66726E;}
.m-grid-cal.planning .m-slot{border-color:#AFC6F2; background:#F3F7FE; color:#1D3F8A;}
.m-blk{position:absolute; left:56px; right:12px; border:1px solid; border-left-width:4px; border-radius:10px; padding:5px 10px; text-align:left; color:var(--m-ink);
  display:flex; flex-direction:column; gap:2px; overflow:hidden; z-index:2;}
.m-blk-t{display:flex; align-items:center; gap:6px; min-width:0;}
.m-blk-t i{width:8px; height:8px; border-radius:4px; flex:none;}
.m-blk-t span{font-size:13px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-blk-m{font-size:11px; font-weight:600; color:#4E5A56; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-blk.moving{border:2px dashed #2563EB !important;}
.m-blk.dim{opacity:.55;}
.m-grid-cal.planning .m-blk{pointer-events:none;}
.m-now{position:absolute; left:46px; right:12px; height:0; border-top:2px solid #D9480F; pointer-events:none; z-index:3;}
.m-now::before{content:""; position:absolute; left:-5px; top:-6px; width:10px; height:10px; border-radius:5px; background:#D9480F;}
.m-when{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; border-radius:12px; background:#F2F6F4;}
.m-when > div{display:flex; flex-direction:column; gap:2px;}
.m-when b{font-size:16px; font-weight:800;}
.m-when > span{font-size:12px; font-weight:700; color:var(--m-brand); text-align:right;}
.m-late{padding:10px 12px; border-radius:12px; background:#FDEDEC; color:#A61B1B; font-size:12px; font-weight:700; line-height:1.4;}
.m-durs{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px;}
.m-durs .m-opt{padding:0 2px; min-height:44px;}
.m-opt.off{background:#F1F4F3; color:#9AA5A1; text-decoration:line-through; border-color:#E6EAE8;}

/* ---------- быстрый Обход ЖК ---------- */
.m-prog{height:8px; border-radius:4px; background:#E3E8E6; overflow:hidden;}
.m-prog i{display:block; height:8px; background:var(--m-brand); border-radius:4px;}
.m-ob-list{display:flex; flex-direction:column; gap:8px;}
.m-ob-row{background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px 14px; display:flex; flex-direction:column; gap:10px;}
.m-ob-row.ok{border-color:#A9D8BA;}
.m-ob-row.bad{border-color:#F0B1AB;}
.m-ob-h{display:flex; justify-content:space-between; gap:8px; align-items:flex-start;}
.m-ob-h > div{display:flex; flex-direction:column; gap:2px; min-width:0;}
.m-ob-h b{font-size:15px; font-weight:800;}
.m-ob-h span{font-size:12px; font-weight:600; color:var(--m-dim); line-height:1.35;}
.m-ob-note{display:flex; justify-content:space-between; align-items:center; gap:8px;}
.m-ob-note span{font-size:12px; font-weight:600; color:#4E5A56; line-height:1.35;}
.m-photo-row{display:flex; align-items:center; gap:12px;}
.m-thumb{width:64px; height:64px; border-radius:12px; border:2px solid #9CC5B8; padding:0; overflow:hidden; background:#E9EEEC; flex:none;}
.m-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.m-msg{background:#F6F8F7; border:1px solid var(--m-line); border-radius:14px; padding:12px; display:flex; flex-direction:column; gap:10px;}
.m-msg img{width:100%; max-height:200px; object-fit:cover; border-radius:10px;}
.m-msg div{font-size:13px; font-weight:500; line-height:1.5; white-space:pre-line; color:var(--m-ink); overflow-wrap:anywhere;}
.m-btn.wa{display:flex; align-items:center; justify-content:center; text-decoration:none; background:#1F7A4D;}
.m-draw{position:fixed; inset:0; z-index:80; background:#101A17; color:#fff; display:flex; flex-direction:column;}
.m-draw[hidden]{display:none;}
.m-draw-h{padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px; display:flex; justify-content:space-between; align-items:center; gap:8px;}
.m-draw-h > div{display:flex; flex-direction:column; gap:2px;}
.m-draw-h b{font-size:17px; font-weight:800;}
.m-draw-h span{font-size:12px; font-weight:600; color:#C9D1CE;}
.m-draw-tool{flex:none; padding:6px 12px; border-radius:16px; background:#E11D2E; color:#fff !important; font-size:12px !important; font-weight:800 !important;}
.m-draw-c{flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:0 8px;}
.m-draw-c canvas{max-width:100%; max-height:100%; touch-action:none; border-radius:8px; background:#000;}
.m-draw .m-btn{background:#fff; color:var(--m-ink);}
.m-draw .m-btn.main{background:var(--m-brand); color:#fff;}

/* ---------- Кабинет ---------- */
.m-head > .m-back{margin-left:-10px;}
body.m-on .overlay{z-index:90;}   /* прежние окна (бланк, контакт, загрузка файла) — поверх мобильных экранов */
.m-prof{flex-direction:row; align-items:center; gap:14px;}
.m-ava{width:72px; height:72px; border-radius:50%; overflow:hidden; background:#E6F0ED; color:var(--m-brand); display:flex; align-items:center; justify-content:center; flex:none; font-size:24px; font-weight:800;}
.m-ava img{width:100%; height:100%; object-fit:cover; display:block;}
.m-prof-t{display:flex; flex-direction:column; gap:4px; min-width:0;}
.m-prof-t b{font-size:18px; font-weight:800;}
.m-prof-t > span{font-size:13px; font-weight:600; color:var(--m-dim);}
.m-tile{min-height:84px; border-radius:14px; border:1px solid var(--m-line); background:#fff; color:var(--m-brand); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:8px 4px; text-align:center;}
.m-tile span{font-size:12px; font-weight:700; color:var(--m-ink); line-height:1.25;}
.m-cnt-b{display:inline-block; min-width:18px; padding:0 5px; border-radius:9px; background:#C62828; color:#fff; font-size:11px;}
.m-score{display:flex; align-items:center; gap:14px;}
.m-ring{width:84px; height:84px; border-radius:50%; flex:none; background:conic-gradient(var(--c) var(--deg), #E3E8E6 0); display:flex; align-items:center; justify-content:center;}
.m-ring span{width:66px; height:66px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; font-size:19px; font-weight:800;}
.m-score-t{display:flex; flex-direction:column; gap:4px;}
.m-score-t b{font-size:16px; font-weight:800;}
.m-score-t span{font-size:13px; font-weight:600; color:var(--m-dim); line-height:1.4;}
.m-kpi{border:1px solid #EEF1F0; border-radius:12px; padding:10px 12px; display:flex; flex-direction:column; gap:2px;}
.m-kpi b{font-size:20px; font-weight:800;}
.m-kpi span{font-size:12px; font-weight:600; color:var(--m-dim);}
.m-bars{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; align-items:end; height:96px;}
.m-bars > div{display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:2px; height:100%;}
.m-bars i{width:28px; border-radius:6px 6px 2px 2px; display:block;}
.m-bars b{font-size:11px; font-weight:800;}
.m-bars span{font-size:11px; font-weight:600; color:var(--m-dim);}
.m-obj-row{display:flex; justify-content:space-between; gap:8px; padding:8px 0; border-bottom:1px solid #EEF1F0; font-size:14px;}
.m-obj-row:last-child{border-bottom:0;}
.m-obj-row span{font-size:13px; font-weight:700; white-space:nowrap;}
.m-switch{width:52px; height:32px; border-radius:16px; border:0; padding:3px; background:#C9D1CE; display:flex; flex:none; justify-content:flex-start;}
.m-switch i{width:26px; height:26px; border-radius:13px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.25);}
.m-switch[aria-checked="true"]{background:var(--m-brand); justify-content:flex-end;}
.m-contact{background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px 14px; display:flex; flex-direction:column; gap:10px;}
.m-contact b{font-size:15px; font-weight:800;}
.m-c-phone{font-size:14px; font-weight:700; color:var(--m-ink); font-variant-numeric:tabular-nums;}
.m-contact .m-btn{display:inline-flex; align-items:center; justify-content:center; text-decoration:none; min-height:40px;}
.m-btn.wa-l{border-color:#A9D8BA; color:#1E6B3E; background:#E9F6EE; display:flex; align-items:center; justify-content:center; text-decoration:none;}
.m-doc{width:100%; text-align:left; background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px 14px; display:flex; gap:12px; align-items:center; color:var(--m-ink);}
.m-doc b{font-size:14px; font-weight:800; line-height:1.3;}
.m-doc-c{flex:none; width:46px; height:46px; border-radius:10px; background:#E6F0ED; color:var(--m-brand); font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center;}

body.m-on #app .view > .back-link{display:none;}   /* на телефоне «Назад» — в шапке */

/* ---------- Управление: сотрудники, команда ---------- */
.m-staff{width:100%; text-align:left; background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px; display:flex; gap:10px; align-items:center; color:var(--m-ink);}
.m-staff b{font-size:15px; font-weight:800;}
.m-staff.off{opacity:.7;}
.m-staff .m-badge2{flex:none; font-size:11px; padding:3px 8px;}
.m-ava.sm{width:40px; height:40px; font-size:14px;}
.m-jr{display:flex; flex-direction:column; gap:2px; padding:6px 0; border-bottom:1px solid #EEF1F0; font-size:12px; color:var(--m-dim);}
.m-jr:last-child{border-bottom:0;}
.m-jr b{font-size:13px; font-weight:700; color:var(--m-ink);}
.m-pwd{display:flex; gap:8px;}
.m-pwd input{flex:1; min-width:0;}
.m-pwd .m-btn{flex:none;}
.m-team{width:100%; text-align:left; background:#fff; border:1px solid var(--m-line); border-radius:14px; padding:12px 14px; display:flex; flex-direction:column; gap:6px; color:var(--m-ink);}
.m-team b{font-size:15px; font-weight:800;}

/* ===================== «Лёгкий» дизайн (пакет «Обход-Счётчики» 26.10.2026, design/tokens.css) =====================
   Белые карточки с мягкой тенью вместо рамок, одна крупная цифра в начале экрана, пастельные кружки категорий,
   статус — точка + слово, переключатель-«таблетка». Цвета — брендбук IK; текст остаётся контрастным (≥ 4.5). */
#m-root{--m-brand:#2A6058; --m-brand-dark:#1F4A44; --m-ink:#141B1D; --m-line:#E7ECEA;
  --m-shadow:0 1px 2px rgba(20,27,29,.04), 0 6px 20px rgba(20,27,29,.06); --m-shadow-f:0 10px 30px rgba(20,27,29,.12);}
.m-head{background:var(--m-bg); border-bottom:0;}
.m-bell{border:0; box-shadow:var(--m-shadow);}
.m-nav{background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-top:.5px solid var(--m-line);}
.m-main{gap:12px;}
.m-row, .m-card, .m-note, .m-contact, .m-doc, .m-staff, .m-team, .m-tile, .m-cnt, .m-more, .m-ob-row, .m-edit{
  border-color:transparent; box-shadow:var(--m-shadow); border-radius:16px;}
.m-row{align-items:center; gap:12px;}
.m-ob-row.ok{border-color:#BFE3CC;} .m-ob-row.bad{border-color:#F3C2BD;}
.m-note.unread{border-color:#BFDCD2;}
.m-cnt{height:58px;}
.m-cnt[aria-pressed="true"]{box-shadow:none;}
.m-chip{border-color:transparent; box-shadow:0 1px 2px rgba(20,27,29,.05); border-radius:999px;}
.m-chip[aria-pressed="true"]{border:1.5px solid transparent; background:var(--bg); box-shadow:none;}
.m-opt, .m-st, .m-btn, .m-date, .m-select, .m-ta{border-color:#DCE3E0;}
.m-btn.main.big, .m-fab{border-radius:999px;}
.m-btn.main.big{min-height:52px;}
.m-link, .m-pill-btn{border-color:#BFDCD2;}
.m-screen-h, .m-screen-f{border-color:var(--m-line);}
.m-group-h{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--gc,#5F6B67); padding:4px 2px 0;}
.m-lab{letter-spacing:.02em;}
/* одна крупная цифра */
.m-hero{display:flex; flex-direction:column; gap:2px; padding:2px 2px 0;}
.m-hero-n{font-size:34px; font-weight:800; letter-spacing:-.02em; line-height:1.1; font-variant-numeric:tabular-nums; color:var(--m-ink);}
.m-hero-n small{font-size:17px; font-weight:600; letter-spacing:0; color:var(--m-dim);}
.m-hero-s{font-size:13px; font-weight:600; color:var(--m-dim);}
/* кружок категории и статус «точка + слово» */
.m-cat{width:36px; height:36px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-size:17px; font-weight:800; line-height:1;}
.m-cat.sm{width:28px; height:28px; font-size:14px;}
.m-stw{flex:none; font-size:12px; font-weight:700; white-space:nowrap; display:flex; align-items:center; gap:5px;}
.m-stw::before{content:""; width:8px; height:8px; border-radius:4px; background:var(--c); flex:none;}
/* переключатель-таблетка */
.m-seg{display:flex; background:#EAEFED; border-radius:999px; padding:3px;}
.m-seg button{flex:1; min-height:38px; border:0; background:none; border-radius:999px; color:var(--m-dim); font-size:13px; font-weight:700;}
.m-seg button[aria-pressed="true"]{background:#fff; color:var(--m-ink); box-shadow:var(--m-shadow);}
/* календарь: неделя — светлая полоса, месяц — сетка с кружками категорий и нагрузкой по неделям */
.m-week{background:var(--m-bg); border-bottom:0;}
.m-wd{background:#fff; box-shadow:0 1px 2px rgba(20,27,29,.05);}
.m-wd.today{outline:1.5px solid var(--m-brand); outline-offset:-1.5px;}
.m-month{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px;}
.m-md-h{font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--m-dim); text-align:center;}
.m-md{aspect-ratio:1; border:0; border-radius:12px; background:#F1F5F3; padding:4px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start;
  font-size:12px; font-weight:700; color:var(--m-ink); min-width:0;}
.m-md.today{background:#fff; outline:1.5px solid var(--m-brand); outline-offset:-1.5px; color:var(--m-brand);}
.m-md.mute{opacity:.35;}
.m-md-dots{display:flex; gap:2px; align-items:center; align-self:center; min-height:12px;}
.m-md-dots i{width:11px; height:11px; border-radius:50%; display:block; box-shadow:0 1px 3px rgba(0,0,0,.12);}
.m-md-dots b{font-size:9px; font-weight:800; color:var(--m-dim);}
.m-weeks{display:flex; gap:6px; align-items:flex-end;}
.m-weeks div{flex:1; display:flex; flex-direction:column; gap:3px; min-width:0;}
.m-weeks b{display:block; height:5px; border-radius:3px; background:#9CC5B8;}
.m-weeks b.max{background:var(--m-brand); opacity:1 !important;}
.m-weeks span{font-size:10px; font-weight:700; color:var(--m-dim); white-space:nowrap;}
.m-card .m-wk-arrow{min-height:36px; width:36px;}

/* ---------- сканирование счётчика: камера на весь экран ---------- */
.m-scan{position:fixed; inset:0; z-index:85; background:#0D1110; color:#fff; overflow:hidden;}
.m-scan[hidden]{display:none;}
.m-scan video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.m-scan-frame{position:absolute; left:50%; top:42%; width:min(82vw,330px); height:min(56vw,230px); transform:translate(-50%,-50%); border-radius:20px;
  border:2px solid rgba(255,255,255,.8); box-shadow:0 0 0 2000px rgba(0,0,0,.38); transition:border-color .2s;}
.m-scan-frame.ok{border-color:#5FD39A;}
.m-scan-top{position:absolute; left:0; right:0; top:0; padding:calc(12px + env(safe-area-inset-top,0px)) 14px 12px; display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:linear-gradient(rgba(0,0,0,.45), transparent); font-size:13px; font-weight:700;}
.m-scan-top span{flex:1; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.m-scan-b{width:44px; height:44px; border-radius:22px; border:0; background:rgba(255,255,255,.92); color:#141B1D; font-size:22px; font-weight:700; flex:none;}
.m-scan-b[aria-pressed="true"]{background:#FFE27A;}
.m-scan-hint{position:absolute; left:50%; bottom:calc(150px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); max-width:calc(100% - 32px); background:rgba(255,255,255,.95); color:#141B1D;
  padding:10px 16px; border-radius:999px; font-size:14px; font-weight:700; text-align:center;}
.m-scan-dots{position:absolute; left:50%; bottom:calc(120px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); display:flex; gap:8px;}
.m-scan-dots i{width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.35);}
.m-scan-dots i.on{background:#5FD39A;}
.m-scan-card{position:absolute; left:12px; right:12px; bottom:calc(14px + env(safe-area-inset-bottom,0px)); background:#fff; color:#141B1D; border-radius:20px; padding:18px;
  display:flex; flex-direction:column; gap:6px; box-shadow:0 10px 30px rgba(0,0,0,.3); animation:mScanUp .3s cubic-bezier(.2,.9,.3,1.2);}
.m-scan-card[hidden]{display:none;}
.m-scan-card b{font-size:16px; font-weight:800;}
.m-scan-ok{color:#1E6B3E; font-weight:800; font-size:15px;}
@keyframes mScanUp{from{transform:translateY(40%); opacity:0;} to{transform:none; opacity:1;}}
@media (prefers-reduced-motion: reduce){ .m-scan-card{animation:none;} }
.m-scan-go{position:sticky; bottom:calc(76px + env(safe-area-inset-bottom,0px)); z-index:5; padding-top:4px;}
.m-scan-go .m-btn{width:100%; box-shadow:0 6px 18px rgba(22,63,54,.28);}