  /* Inter лежит внутри продукта (web/fonts) — интернет для шрифта не нужен.
     Файл переменный: одно начертание покрывает все веса. Три набора символов: кириллица и латиница. */
  @font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/inter-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
  @font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/inter-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
  @font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
  :root{--ink:#1d2733;--muted:#7c8794;--line:#e9ebef;--accent:#3d82e0;--danger:#c2384a;
        --page:#edeff3;--wrap:#edeff3;--surface:#fff;--surface2:#f7f8fa;--field:#fff;--border:#e7e9ee;--text:#2c3440;--textdim:#98a1ad;--hover:#f2f4f8;--panel:rgba(255,255,255,.82);
        --brand:#5b9bf0;--brand-deep:#3d82e0;--brand-ink:#33404c;--brand-soft:#eef4fd;
        --black:#15181d;--card-r:22px}
  *{box-sizing:border-box}
  html,body{margin:0;height:100%;background:var(--page);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;color:var(--ink);overflow:hidden}
  /* Оболочка по макету: серая страница, на ней две белые карты — меню слева и рабочая область. */
  #wrap{position:fixed;inset:0;overflow:hidden;background:var(--page);display:flex;gap:13px;padding:13px}
  /* заготовка доски: видна с первых миллисекунд, пока грузится основной скрипт; исчезает после первого настоящего кадра */
  #bootCal{display:none}
  html.booting-cal #bootCal{display:block;position:absolute;inset:6px 10px 10px;background:#fff;border-radius:14px;
    background-image:linear-gradient(to right, transparent 0, transparent calc(100% - 7px), #f4f6f9 calc(100% - 7px));
    background-size:calc(100%/7) 100%;background-repeat:repeat-x}
  html.booting-cal #calHost>canvas{visibility:hidden}
  canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
  canvas.drag{cursor:grabbing}
  .panel{position:absolute;z-index:5}
  .btn{appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);height:34px;padding:0 14px;border-radius:10px;font:inherit;font-size:12.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;box-shadow:0 1px 2px rgba(20,30,45,.05)}
  .btn:hover{background:#f6f7f9}
  .btn.icon{width:32px;padding:0;justify-content:center;font-size:15px}
  .btn:disabled{opacity:.4;cursor:default}
  /* фокус: ОДНА накладка гасит и размывает всё вокруг колонки сегодня (дыра в маске = эта колонка).
     Раньше размывали каждую плашку через ctx.filter='blur()' — замер 31.08.2026: 1120 мс/кадр против 1.1 мс
     на накладке, отсюда и тормоза всего интерфейса в фокусе. ⚠️ blur в цикле отрисовки не возвращать. */
  #focusFx{position:absolute;inset:0;z-index:4;pointer-events:none;display:none;
    background:rgba(18,26,38,.26);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
    -webkit-mask-image:linear-gradient(#000,#000),var(--hole,linear-gradient(#000,#000));mask-image:linear-gradient(#000,#000),var(--hole,linear-gradient(#000,#000));
    -webkit-mask-size:100% 100%,var(--hw,0px) var(--hh,0px);mask-size:100% 100%,var(--hw,0px) var(--hh,0px);
    -webkit-mask-position:0 0,var(--hx,0px) var(--hy,0px);mask-position:0 0,var(--hx,0px) var(--hy,0px);
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:xor;mask-composite:exclude}
  .dlg.dlg2{width:640px;background:#fff;border-radius:22px;box-shadow:0 22px 64px rgba(20,30,45,.22)}
  .archside .arow{display:grid;grid-template-columns:1fr 84px 130px;gap:8px;align-items:center;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:13px}
  .archside .arow:hover{background:#eef5ff}
  .archside .ahead{font-size:11.5px;color:#8592a1;cursor:pointer;user-select:none;padding:4px 10px}
  .archside .ahead:hover{color:#3b82f6}
  /* контекстное меню (день календаря, профиль) */
  .ctxmenu{position:absolute;z-index:20;background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 12px 32px rgba(20,30,45,.22);padding:5px;min-width:196px;display:none;font-size:13px;user-select:none;max-height:56vh;overflow:auto}
  .ctxmenu.show{display:block}
  .ctxmenu .ci{padding:9px 12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:9px;color:var(--ink);white-space:nowrap}
  .ctxmenu .ci:hover{background:#f2f4f6}
  .ctxmenu .cisep{height:1px;background:var(--line);margin:4px 6px}
  /* карточка задачи — правая панель по макету (растягивается за левый край) */
  /* объект в КОРЗИНЕ: карточка только для чтения. CSS, а не только JS — блоки чек-листа/комментариев/вложений дорисовываются асинхронно уже после открытия. */
  #tsBody.trashro *{pointer-events:none!important;user-select:text}
  #tsBody.trashro #tcRestore{pointer-events:auto!important;opacity:1}
  #tsBody.trashro input,#tsBody.trashro select,#tsBody.trashro textarea,#tsBody.trashro [contenteditable]{background:#f2f4f8;color:#78818d}
  #tsBody.trashro .tlink,#tsBody.trashro .tdel2,#tsBody.trashro .sfmt2,#tsBody.trashro .tfold-body{opacity:.5}
  .tside{position:absolute;z-index:12;top:0;right:0;height:100%;width:780px;min-width:760px;background:#f6f8fc;border-left:1px solid #e3e7ee;box-shadow:-12px 0 36px rgba(20,30,45,.16);visibility:hidden;pointer-events:none;display:flex;flex-direction:column}   /* НЕ используем transform/opacity для показа: это композитные свойства, у части браузеров их переключение не пересчитывается (глюк) — панель уезжает в центр, залипает или становится невидимой. Позиция всегда right:0; показ/скрытие — ТОЛЬКО через visibility (не композитное свойство, не глючит). Без анимации, зато надёжно. */
  .tside.show{visibility:visible;pointer-events:auto}
  .tside.noanim{transition:none}
  .tside .tgrip{position:absolute;left:-4px;top:0;width:9px;height:100%;cursor:ew-resize;z-index:3}
  .tside .tclose,.archside .tclose{position:absolute;top:12px;left:14px;width:34px;height:34px;border-radius:10px;border:1px solid #cfe0fb;background:#eaf2ff;font-size:16px;font-weight:600;color:#3b82f6;cursor:pointer;z-index:2;line-height:1}   /* крестик — В ЛЕВОМ ВЕРХНЕМ углу, компактный */
  .tside .tclose:hover,.archside .tclose:hover{background:#dbe9ff}
  .tside .tbody2{flex:1;overflow:auto;padding:54px 20px 10px 20px}   /* сверху место под ✕ и ← — не наезжают на «Название» */
  .tside .tback{position:absolute;top:12px;left:56px;width:34px;height:34px;border-radius:10px;border:1px solid #e3e7ee;background:#fff;font-size:15px;color:#5b6572;cursor:pointer;z-index:2;display:none}   /* «назад» — правее крестика */
  .tside .tback:hover{background:#f0f3f8}
  .sfmt2{display:flex;gap:2px;margin-bottom:6px;position:sticky;top:0;z-index:7;background:#f6f8fc;border:1px solid #e9edf3;border-radius:10px;padding:4px;margin-left:-5px;margin-right:-5px;box-shadow:0 3px 10px -5px rgba(20,30,45,.28)}
  .tside .sfmt2{top:48px}   /* в карточке — ниже плавающих ✕/←, в модалке создания — у самого верха */
  .sfmt2 button{border:1px solid #e3e7ee;background:#fff;min-width:28px;height:26px;border-radius:7px;cursor:pointer;font-size:12px;color:#3f4854}
  .sfmt2 button:hover{background:#f0f3f8}
  #tcDesc a,#atDesc a{color:#3d82e0;text-decoration:underline;cursor:pointer}   /* кликабельные ссылки в описании задачи */
  .tside .tfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 20px;border-top:1px solid #e9edf3}
  .trow2{display:grid;grid-template-columns:128px 1fr;gap:12px;margin:0 0 13px}
  .trow2>div{min-width:0}   /* иначе grid не сжимает контент (nowrap-строки списка задач растягивали панель) */
  span[title^="Автор"]{min-width:0;overflow:hidden}   /* бейдж автора на узкой панели не должен выталкивать селект */
  span[title^="Автор"]>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px;display:inline-block;vertical-align:middle}
  .trow2>.tlab{display:flex;gap:8px;align-items:center;color:#5b6572;font-size:13px;align-self:start;padding-top:10px;line-height:1.2}
  .tin{width:100%;border:1px solid #e3e7ee;border-radius:11px;padding:10px 12px;font:inherit;font-size:13.5px;background:#fff;color:var(--ink)}
  /* дропдаун меток */
  .csel{position:relative;font-size:13px;user-select:none}
  .cselbtn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #e3e7ee;border-radius:11px;padding:7px 11px;background:#fff;cursor:pointer;min-height:37px}
  .csel.dis .cselbtn{opacity:.75;cursor:default;background:#f6f8fc}
  .cselmenu{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:6;background:#fff;border:1px solid #e3e7ee;border-radius:11px;box-shadow:0 10px 28px rgba(20,30,45,.18);padding:5px;display:none}
  .csel.open .cselmenu{display:block}
  .cselopt{padding:5px 6px;border-radius:8px;cursor:pointer}
  .cselopt:hover{background:#f2f5fa}
  .pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:20px;font-size:12.5px;font-weight:500;white-space:nowrap}
  .pill .pdot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
  .pill .x{cursor:pointer;opacity:.6}
  .pill .x:hover{opacity:1}
  .toast{display:flex;align-items:center;gap:12px;background:rgba(32,40,52,.86);backdrop-filter:blur(8px);color:#fff;padding:11px 15px;border-radius:12px;box-shadow:0 12px 32px rgba(20,30,45,.3);font-size:13.5px;transform:translateX(130%);opacity:0;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s;max-width:360px}
  .toast.in{transform:none;opacity:1}
  .toast .tx{cursor:pointer;opacity:.65;font-size:12px}
  .toast .tx:hover{opacity:1}
  /* тумблер доступа пользователя */
  .uSw{position:relative;display:inline-block;width:38px;height:22px;flex:0 0 auto}
  .uSw input{opacity:0;width:0;height:0}
  .uSw .uSwT{position:absolute;inset:0;background:#cfd6df;border-radius:22px;transition:.18s;cursor:pointer}
  .uSw .uSwT:before{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:.18s}
  .uSw input:checked + .uSwT{background:#22c55e}
  .uSw input:checked + .uSwT:before{transform:translateX(16px)}
  .uSw input:disabled + .uSwT{opacity:.5;cursor:default}
  textarea.tin{min-height:84px;resize:vertical}
  select.tin{appearance:auto}
  /* красивый выбор даты (месяц сеткой) */
  .dpbtn{cursor:pointer;text-align:left;display:flex;align-items:center}
  .datepop{position:fixed;z-index:60;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 44px rgba(20,30,45,.22);padding:12px;width:288px;display:none;user-select:none}
  .datepop .dphead{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .datepop .dpm{font-weight:600;font-size:14px}
  .datepop .dpnav{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:#fff;cursor:pointer;font-size:16px;color:var(--ink)}
  .datepop .dpnav:hover{background:var(--hover)}
  .datepop .dpwd{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
  .datepop .dpwd span{text-align:center;font-size:10.5px;color:var(--textdim)}
  .datepop .dpgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
  .datepop .dpc{height:34px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:13.5px;cursor:pointer;color:var(--ink)}
  .datepop .dpc.empty{cursor:default}
  .datepop .dpc:not(.empty):hover{background:var(--hover)}
  .datepop .dpc.today{color:#3b82f6;font-weight:600}
  .datepop .dpc.sel{background:#3b82f6;color:#fff!important}
  .tcard2{background:#fff;border:1px solid #e9edf3;border-radius:13px;padding:12px 14px}
  .tseg{display:flex;gap:8px;flex-wrap:wrap}
  .tseg .sg{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:11px;border:1px solid #e3e7ee;background:#fff;font-size:13px;cursor:pointer;color:#3f4854;user-select:none}
  .tseg .sg .dt{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
  .tseg .sg.on{background:#3b82f6;border-color:#3b82f6;color:#fff}
  .tseg .sg.on .dt{background:#fff!important}
  /* сворачиваемый блок в карточке (повторение) — свёрнут по умолчанию */
  .tfold{border:1px solid #e9edf3;border-radius:13px;background:#fff;margin:0 0 13px}
  .tfold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:11px 14px;font-size:13px;color:#5b6572;user-select:none}
  .tfold>summary::-webkit-details-marker{display:none}
  .tfold>summary:hover{background:#f6f8fc;border-radius:13px}
  .tfold-sub{color:#98a1ad;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .tfold .chev{margin-left:auto;color:#b0b8c4;font-size:18px;line-height:1;transition:transform .15s;flex:0 0 auto}
  .tfold[open] .chev{transform:rotate(90deg)}
  .tfold-body{padding:2px 14px 14px}
  /* поле «Описание» в карточках — заметный полужирный контур, чтобы выделялось */
  .tin-desc{border:2px solid #bcd2f2}
  .tin-desc:focus{border-color:#3d82e0;outline:none}
  /* ЕДИНЫЙ вид описания: что бы ни вставили из Word/Excel/почты — шрифт, размер и цвет наши.
     Размер меняется только нашими классами fs-*; длинные слова/ссылки переносятся, ничего не вылезает за рамку. */
  .tin-desc[contenteditable]{font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-size:13.5px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere;word-break:normal;max-width:100%;overflow-x:hidden}
  .tin-desc[contenteditable] *{font-family:inherit!important;font-size:inherit!important;line-height:inherit!important;color:inherit!important;background:transparent!important;max-width:100%}
  .tin-desc[contenteditable] .fs-s{font-size:11.5px!important}
  .tin-desc[contenteditable] .fs-m{font-size:13.5px!important}
  .tin-desc[contenteditable] .fs-l{font-size:16px!important}
  .tin-desc[contenteditable] .fs-xl{font-size:19px!important}
  .tin-desc[contenteditable] a{color:#2563eb!important;text-decoration:underline}
  .tin-desc[contenteditable] ul,.tin-desc[contenteditable] ol{margin:4px 0;padding-left:22px}
  .tin-desc[contenteditable] li{margin:1px 0}
  .tin-desc[contenteditable] b,.tin-desc[contenteditable] strong{font-weight:700}
  .tin-desc[contenteditable] s,.tin-desc[contenteditable] strike,.tin-desc[contenteditable] del{text-decoration:line-through}   /* правило выше снимает чужие стили — зачёркивание задаём явно */
  /* чек-лист в описании: пункт/подпункт с флажком; отмеченный зачёркивается и сереет */
  .tin-desc[contenteditable] .cl-item{position:relative;padding:1px 0 1px 24px;margin:1px 0;min-height:19px}
  .tin-desc[contenteditable] .cl-item.cl-sub{margin-left:30px}
  .tin-desc[contenteditable] .cl-box{position:absolute!important;left:2px;top:2px;width:15px;height:15px;border:1.5px solid #a7b0bc;border-radius:4.5px;background:#fff!important;cursor:pointer}
  .tin-desc[contenteditable] .cl-box::after{content:'';position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(43deg);opacity:0}
  .tin-desc[contenteditable] .cl-item.cl-done>.cl-box{background:#3d82e0!important;border-color:#3d82e0}
  .tin-desc[contenteditable] .cl-item.cl-done>.cl-box::after{opacity:1}
  .tin-desc[contenteditable] .cl-item.cl-done{text-decoration:line-through;color:#9aa3ad!important}
  .sfmt2 .fsz{min-width:auto;padding:0 7px;font-size:11.5px;color:#5b6572}
  .sfmt2 .fsz.on{background:#eef4fd;border-color:#a9c9f5;color:#2563eb}
  .sfmt2 .sep{width:1px;background:#e3e7ee;margin:2px 4px;align-self:stretch}
  /* «это часть чужой задачи» — некликабельная плашка над подзадачами */
  .prow{padding:2px 0 10px}
  .pchip{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:10px;border:1px solid #d8e4f7;background:#f2f7ff;color:#42556e;font-size:13px;cursor:default;user-select:none}
  .pchip::before{content:'↳';font-size:14px;color:#7ba3d8}
  /* подзадачи — плашки: кружок (пустой = в работе, зелёный = завершена), название, ответственный, дата */
  .subcard{display:flex;align-items:center;gap:9px;padding:8px 10px;margin:0 0 6px;border:1px solid #e3e7ee;border-radius:10px;background:#fff;cursor:pointer;transition:border-color .12s,background .12s}
  .subcard:hover{border-color:#a9c9f5;background:#f8fbff}
  .subcard.done .subname{color:#98a1ad;text-decoration:line-through}
  .subdot{flex:0 0 auto;width:16px;height:16px;border-radius:50%;border:2px solid #cfd6e0;display:inline-flex;align-items:center;justify-content:center;font-size:10px;line-height:1;color:#fff}
  .subdot.on{background:#22c55e;border-color:#22c55e}
  .subname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;color:#2c3440}
  .submeta{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px}
  .subwho{font-size:12.5px;color:#5b6572;white-space:nowrap;max-width:120px;overflow:hidden;text-overflow:ellipsis}
  .subdate{flex:0 0 auto;font-size:12.5px;color:#5b6572;white-space:nowrap}
  .tchip2{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:11px;border:1px solid #e3e7ee;background:#fff;font-size:13px;cursor:pointer;margin:0 6px 6px 0;user-select:none}
  .tchip2.on{border-color:#9ec5fe;background:#eef5ff}
  .tchip2 .x{color:#98a1ad;cursor:pointer;font-weight:600}
  .tchip2 .x:hover{color:#c2384a}
  .tava{border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;flex:0 0 auto;font-weight:600}
  .tlink{color:#3b82f6;font-size:13px;cursor:pointer;background:none;border:0;padding:7px 0 2px;display:inline-flex;gap:6px;align-items:center;font-family:inherit}
  .tlink:hover{text-decoration:underline}
  .titem{display:flex;align-items:center;gap:9px;padding:8px 2px;border-bottom:1px solid #f0f3f7;font-size:13.5px}
  .titem:last-child{border-bottom:0}
  .titem .grow{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tdel2{color:#98a1ad;cursor:pointer;flex:0 0 auto} .tdel2:hover{color:#c2384a}
  .tsw2{width:38px;height:22px;border-radius:99px;background:#d7dce1;position:relative;cursor:pointer;transition:background .18s;flex:0 0 auto}
  .tsw2::after{content:"";position:absolute;top:2.5px;left:2.5px;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s}
  .tsw2.on{background:#3b82f6} .tsw2.on::after{transform:translateX(16px)}
  .fbadge{width:36px;height:25px;border-radius:6px;color:#fff;font-size:9px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;letter-spacing:.3px}
  .tbtn{appearance:none;border:1px solid #e3e7ee;background:#fff;color:#3f4854;height:38px;padding:0 16px;border-radius:11px;font:inherit;font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
  .tbtn:hover{background:#f0f3f8}
  .tbtn.blue{background:#3b82f6;border-color:#3b82f6;color:#fff} .tbtn.blue:hover{background:#2f6fd9}
  .tbtn.danger{color:#d64545;border-color:#f2cfcf;background:#fff} .tbtn.danger:hover{background:#fdf1f1}
  /* мобильная версия: один день календаря + свайп */
  #mobile{display:none;position:fixed;inset:0;z-index:30;background:var(--page);flex-direction:column}
  body.mobile #wrap{background:var(--page)}   /* #wrap остаётся (в нём живут карточки), но канвас и панели скрыты — сверху лежит #mobile */
  /* запуск: полотно скрыто, пока вид не выставлен — иначе на долю секунды мелькает стартовый мелкий календарь */
  body.booting #wrap>canvas{visibility:hidden}
  body.mobile #wrap>canvas,body.mobile #focusFx,body.mobile .panel{display:none!important}
  body.mobile #mobile{display:flex}
  #mobile .mtop{display:flex;align-items:center;justify-content:space-between;padding:12px 12px;gap:6px}
  #mobile .mtop>div{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}   /* заголовок ужимается, кнопки не выдавливаются за экран */
  #mobile .mtop .mt-btn{flex:0 0 auto;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:17px;overflow:hidden;padding:0}
  #mobile .mnav{display:flex;align-items:center;justify-content:space-between;padding:6px 16px 12px}
  #mobile .mnav button{width:44px;height:44px;border-radius:12px;border:1px solid var(--border);background:var(--surface);font-size:22px;color:var(--ink)}
  #mobile .mnav .md{text-align:center}
  #mobile .mnav .md .dnum{font-size:22px;font-weight:700}
  #mobile .mnav .md .dwd{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
  #mobile .mnav .md.today .dnum{color:#3b82f6}
  #mobile .mlist{flex:1;overflow:auto;padding:6px 14px 90px;touch-action:pan-y}
  #mobile .mrow{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:13px 14px;margin-bottom:9px}
  #mobile .mrow .mtime{font-size:13px;color:#3b82f6;font-weight:600;flex:0 0 auto;min-width:42px}
  #mobile .mrow .mname{flex:1;min-width:0;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #mobile .mrow .msub{width:17px;height:17px;flex:0 0 auto}   /* подзадача: угловая стрелка без фона */
  #mobile .mrow .mdot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
  #mobile .mempty{text-align:center;color:var(--muted);font-size:14px;padding:50px 20px}
  #mobile .mfab{position:fixed;right:20px;bottom:24px;width:58px;height:58px;border-radius:50%;border:0;background:#3b82f6;color:#fff;font-size:28px;box-shadow:0 8px 24px rgba(59,130,246,.4);z-index:31}
  #mobile .mtoday{position:fixed;left:20px;bottom:24px;height:58px;padding:0 20px;border-radius:29px;border:1px solid var(--border);background:var(--surface);color:#3b82f6;font-size:15px;font-weight:600;box-shadow:0 6px 20px rgba(20,30,45,.14);z-index:31;display:none}
  #mobile .mtoday.show{display:inline-flex;align-items:center;gap:6px}
  /* на телефоне плашка задачи в две строки: название целиком (оно главное), под ним — кто и когда.
     В одну строку на 375px название ужималось до «[t…» и читать было нечего. */
  @media (max-width:700px){
    .subcard{flex-wrap:wrap;row-gap:3px}
    .subname{flex:1 1 calc(100% - 26px);white-space:normal;overflow:visible;overflow-wrap:anywhere}
    .submeta{margin-left:25px}
    .subwho{max-width:none}
  }
  @media (max-width:700px){ .tside{width:100%!important;min-width:0!important;left:0;right:0;z-index:36!important} .tside .tgrip{display:none} .archside{width:100%!important;left:0;right:0;z-index:35!important} .dlg,.dlg.dlg2{width:94vw!important} .ctxmenu{z-index:42}
    .tside:not(.show),.archside:not(.show){display:none!important}   /* скрытые панели убираем из потока — иначе сдвинутая за край карточка тянула горизонтальную прокрутку и телефон отзумливал страницу */
    .trow2{grid-template-columns:1fr;gap:5px} .trow2>.tlab{padding-top:0} .tside .tbody2{padding:56px 16px 10px}
    .tin,input,textarea,select{font-size:16px!important}   /* iOS не зумит экран при фокусе инпута, если шрифт ≥16px */
    button,.mt-btn,.mfab,.mnav button,.tin,select,input{touch-action:manipulation}   /* без зума по двойному тапу (стрелки дней и т.д.) */ }
  /* task modal */
  /* ⚠️ iOS Safari: нижняя панель браузера перекрывает низ окна, а inset:0 и vh считаются по БОЛЬШОМУ
     окну — без панели. Из-за этого кнопки «Отмена» и «Создать задачу» уезжали под панель (жалоба
     владельца 20.09.2026): в приложении с рабочего стола панели нет, и там всё было видно.
     Берём svh — МАЛОЕ окно: оно посчитано с уже показанной панелью и, в отличие от dvh, не меняется,
     когда панель сворачивается на прокрутке (иначе окно дышало бы по высоте). Лесенка запасных
     значений: старый браузер садится на vh и остаётся как был. */
  .modal{position:fixed;inset:0;z-index:40;background:rgba(20,28,38,.34);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;
    height:100vh;height:100dvh;height:100svh;padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}
  .modal.show{display:flex}
  .dlg{width:390px;max-width:92%;background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(20,30,45,.3);padding:20px;max-height:92%;overflow:auto}
  .dlg h3{margin:0 0 14px;font-size:16px}
  .dlg input[type=text]:not(.tin),.dlg input[type=date]:not(.tin),.dlg select:not(.tin),.dlg textarea:not(.tin){width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 10px;font:inherit;font-size:13px;background:#fff;color:var(--ink)}
  .dlg textarea:not(.tin){min-height:68px;resize:vertical}
  /* login */
  .brandmark{display:inline-block;vertical-align:middle}
  .brandname{font-family:ui-rounded,'SF Pro Rounded','Nunito',system-ui,sans-serif;font-weight:700;letter-spacing:-.3px;color:var(--brand-ink)}
  .login{position:fixed;inset:0;z-index:50;background:radial-gradient(1100px 620px at 50% -8%,#e8f0fc 0%,#eef1f6 52%,#eceef1 100%);display:flex;align-items:center;justify-content:center;padding:20px}
  .login .card{background:#fff;border:1px solid #e7edf5;border-radius:20px;padding:32px 32px 28px;width:372px;max-width:92%;box-shadow:0 22px 64px rgba(40,72,124,.16),0 2px 8px rgba(40,72,124,.05);text-align:center}
  .login .brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:7px}
  .login .brand .brandmark{width:36px;height:36px}
  .login .brand .brandname{font-size:31px}
  .login .sub{color:var(--muted);font-size:13px;margin:0 0 22px}
  .login label{display:block;color:var(--muted);font-size:12px;margin:13px 0 5px;text-align:left}
  .login input{width:100%;border:1px solid #dbe3ed;border-radius:12px;padding:12px 13px;font:inherit;font-size:14px;background:#fff;transition:border-color .15s,box-shadow .15s}
  .login input::placeholder{color:#b3bcc8}
  .login input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(91,155,240,.18)}
  .login .err{color:var(--danger);font-size:12.5px;min-height:16px;margin-top:10px}
  .login button{width:100%;margin-top:16px;height:46px;border:none;border-radius:12px;background:linear-gradient(180deg,#66a4f6,var(--brand-deep));color:#fff;font:inherit;font-weight:600;font-size:15px;cursor:pointer;box-shadow:0 8px 18px rgba(61,130,224,.28);transition:filter .15s,transform .04s}
  .login button:hover{filter:brightness(1.05)}
  .login button:active{transform:translateY(1px)}
  .hidden{display:none!important}

  /* ======================= ВИЗУАЛ ПО МАКЕТУ (19.09.2026) =======================
     Страница — серое поле, на нём белые карты со скруглением 22px: меню слева, рабочая
     область справа. Внутри рабочей области: шапка вида, строка недели и полотно календаря.
     Акцент действий — чёрный (создать, активный переключатель), подсветка — синяя. */
  .ico{width:17px;height:17px;flex:0 0 auto;display:inline-block;vertical-align:-3px}
  /* ---- меню слева ---- */
  #nav{flex:0 0 178px;background:#fff;border-radius:var(--card-r);padding:20px 12px 14px;display:flex;flex-direction:column;box-shadow:0 2px 14px rgba(20,30,45,.05)}
  #nav .nv-me{text-align:center;padding:10px 4px 10px;margin-bottom:2px;cursor:pointer;border-radius:16px}   /* зазор до первого пункта — такой же, как между пунктами (gap у .nv-list) */
  #nav .nv-me:hover{background:#f6f7fa}
  #nav .nv-me .tava{width:64px;height:64px;font-size:26px;margin-bottom:8px}
  #nav .nv-nm{font-size:14.5px;font-weight:650;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #nav .nv-list{display:flex;flex-direction:column;gap:2px}
  .nv-i{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;font:inherit;font-size:13px;color:#525c68;padding:10px 11px;border-radius:13px;cursor:pointer;text-align:left}
  .nv-i:hover{background:#f4f6fa}
  .nv-i.on{background:#eaf1fd;color:var(--ink);font-weight:600}
  .nv-i .ico{color:#9aa4b1}
  .nv-i.on .ico{color:#3b82f6}
  #nav .nv-bot{margin-top:auto;display:flex;flex-direction:column;align-items:center}
  /* Часы внизу меню (правка владельца 30.09.2026): вместо чёрной кнопки «＋». Образец — значок «Часы» на айфоне,
     но БЕЗ подложки: фон прозрачный, только ободок, цифры и стрелки. Идут по-настоящему; нажатие открывает
     календарь месяца (#monOv). Создание задачи осталось у «＋» в шапке календаря и у полосок «＋» в днях. */
  .nv-clock{width:74px;height:74px;border:0;padding:0;background:none;border-radius:50%;cursor:pointer;display:block;transition:transform .14s ease}
  .nv-clock:hover{transform:scale(1.05)}
  .nv-clock svg{width:100%;height:100%;display:block;overflow:visible}
  .nv-clock .tk{display:none}
  .nv-fabl{font-size:12px;color:#5b6572;margin:9px 0 12px;text-align:center}
  #nav .nv-i.nv-set{justify-content:flex-start;width:100%}
  /* ---- ТЁМНАЯ ТЕМА (правка владельца 30.09.2026; переключатель — в карточке своего профиля) ----
     В файле ~700 цветов, зашитых в стили, в разметку из скрипта и в рисование полотна (канвас CSS не слушает).
     Перекрашивать каждый — значит вести две палитры в трёх местах. Поэтому тема делается ОДНИМ правилом: весь экран
     инвертируется и доворачивается по цветовому кругу на 180° — светлое становится тёмным, а синий остаётся синим,
     красный — красным. Полотно календаря темнеет вместе со всем остальным. contrast(.9) — чтобы карточки были
     тёмно-серыми, а не угольно-чёрными.
     ⚠️ Картинки (аватарки, фотографии) под общим правилом стали бы негативами — им тот же фильтр ставится ВТОРОЙ раз,
        и он возвращает исходные цвета. Новая картинка в интерфейсе = класс tava или тег img, иначе в тёмной теме негатив.
     ⚠️ Затемнения под окнами в тёмной теме заданы СВЕТЛЫМИ: после инверсии они становятся тёмными. */
  html.dark{filter:invert(1) hue-rotate(180deg) contrast(.9)}
  html.dark img,html.dark video,html.dark .tava{filter:invert(1) hue-rotate(180deg)}
  html.dark .modal,html.dark #cfmOv,html.dark #monOv{background:rgba(226,232,240,.5)!important}
  /* ---- календарь месяца: открывается часами внизу меню. Лежит под карточкой задачи (.tside, z-index 12), поэтому
     задача открывается поверх него, а закрыл карточку — снова месяц. Фон затемняем слегка. ---- */
  #monOv{position:fixed;inset:0;z-index:11;background:rgba(20,28,38,.26);display:none;align-items:center;justify-content:center;padding:20px}
  #monOv.show{display:flex}
  body.imp #monOv{padding-top:calc(20px + var(--imp))}
  .mon-card{width:min(1180px,100%);height:min(820px,100%);background:#fff;border-radius:var(--card-r);box-shadow:0 18px 60px rgba(20,30,45,.22);display:flex;flex-direction:column;overflow:hidden}
  .mon-h{display:flex;align-items:center;gap:9px;padding:16px 18px 12px}
  .mon-h h2{margin:0 auto 0 4px;font-size:19px;font-weight:650;color:var(--ink);letter-spacing:-.01em}
  .mon-h h2 span{color:#98a1ad;font-weight:500}
  .mon-wd{display:grid;grid-template-columns:repeat(7,1fr);padding:0 12px;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#98a1ad}
  .mon-wd div{padding:0 8px 7px}
  /* Сетка — НЕПРЕРЫВНАЯ ЛЕНТА НЕДЕЛЬ в обычной прокрутке браузера (правка владельца 30.09.2026: «на тачпаде плавно
     двигать календарь»): два пальца по тачпаду листают её плавно и с инерцией, как любую страницу. Высота недели —
     пятая часть окна (--mon-rh ставит monFit), неделя с большим числом задач растёт вниз: своей прокрутки у дней нет,
     иначе палец над таким днём листал бы его, а не календарь. Месяцы различаются тоном (чётный/нечётный). */
  /* Остановка ровно по неделям (правка владельца 30.09.2026): лента доезжает так, чтобы сверху стояла целая неделя.
     Делает это сам браузер (scroll-snap) — плавность и инерция тачпада остаются родными. */
  .mon-g{flex:1;min-height:0;position:relative;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 12px;scroll-snap-type:y mandatory}
  .mon-w{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;min-height:var(--mon-rh,120px);margin-bottom:6px;scroll-snap-align:start}
  .mon-c{min-width:0;background:#f6f8fc;border-radius:13px;padding:6px 6px 5px;display:flex;flex-direction:column}
  .mon-c.alt{background:#eef2f8}
  .mon-d em{font-style:normal;font-weight:650;color:var(--ink);margin-left:-3px}
  .mon-d{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#525c68;margin:0 0 4px 2px;flex:0 0 auto}
  .mon-d b{font-weight:600;min-width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
  .mon-c.today .mon-d b{background:#3b82f6;color:#fff}
  .mon-l{display:flex;flex-direction:column;gap:3px}
  .mon-t{display:flex;align-items:center;gap:5px;width:100%;flex:0 0 auto;border:1px solid #eef0f4;background:#fff;border-radius:8px;padding:0 6px 0 4px;height:23px;font:inherit;font-size:12px;color:var(--ink);text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(20,30,45,.05)}
  .mon-t:hover{background:#f7faff}
  .mon-t.tg{border-width:1.5px}                      /* рамка цветом первой метки — цвет приходит инлайном */
  .mon-t.on{box-shadow:0 0 0 2px rgba(59,130,246,.45)}   /* открытая задача: кольцо, рамку метки не перекрашиваем */
  .mon-t u{flex:0 0 3px;height:13px;border-radius:2px;background:transparent}
  .mon-t b{flex:0 0 auto;font-size:10.5px;font-weight:650;color:#3b82f6}   /* время исполнения: синее — впереди, красное — прошло (как на полотне) */
  .mon-t b.late{color:#e5484d}
  .mon-t.done b{color:#98a1ad}
  /* фильтр по меткам: нажал на метку — остались задачи только с ней, нажал ещё раз — все */
  .mon-f{display:flex;flex-wrap:wrap;gap:6px;padding:0 18px 12px}
  .mon-f button{display:inline-flex;align-items:center;gap:6px;height:27px;padding:0 11px 0 9px;border-radius:14px;border:1px solid var(--border);background:#fff;font:inherit;font-size:12px;color:#3f4854;cursor:pointer}
  .mon-f button:hover{background:#f4f6fa}
  .mon-f button u{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
  .mon-f button.on{background:#eaf1fd;border-color:#3b82f6;color:var(--ink);font-weight:600}
  .mon-t span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mon-t.done span{color:#98a1ad;text-decoration:line-through}
  /* «＋» в ячейке дня: тонкая, приглушённая, по наведению на ячейку — полная. Клик — новая задача с датой этого дня */
  .mon-d .mon-plus{margin-left:auto;width:19px;height:19px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:#b6bdc6;cursor:pointer;opacity:.55}
  .mon-c:hover .mon-plus{opacity:1}
  .mon-d .mon-plus:hover{background:#e3edfd;color:#3b82f6}
  /* ---- рабочая область ---- */
  #main{flex:1;min-width:0;background:#fff;border-radius:var(--card-r);display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:0 2px 14px rgba(20,30,45,.05)}
  .mh{display:flex;align-items:flex-start;gap:14px;padding:18px 20px 12px}
  .mh .mh-t{min-width:0}
  .mh h1{margin:0;font-size:21px;font-weight:700;letter-spacing:-.2px;white-space:nowrap}
  .mh-s{font-size:12.5px;color:var(--textdim);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mh-r{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
  .srch{display:flex;align-items:center;gap:8px;background:#f4f6f9;border:1px solid transparent;border-radius:13px;padding:0 13px;height:38px;width:236px;color:#98a1ad}
  .srch:focus-within{background:#fff;border-color:#cfe0fb}
  .srch input{border:0;background:none;outline:none;font:inherit;font-size:13px;width:100%;min-width:0;color:var(--ink)}
  .sg2{height:38px;padding:0 14px;border-radius:13px;border:1px solid var(--border);background:#fff;font:inherit;font-size:13px;color:#3f4854;cursor:pointer;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
  .sg2:hover{background:#f6f7f9}
  .sg2.on{background:var(--black);border-color:var(--black);color:#fff}
  .sg2.on .ico{color:#fff}
  .sg2 .ico{color:#7d879a}
  .ib{width:38px;height:38px;border-radius:13px;border:1px solid var(--border);background:#fff;color:#5b6572;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
  .ib:hover{background:#f6f7f9}
  .ib:disabled{opacity:.35;cursor:default}
  .wknav{display:flex;align-items:center;gap:8px;padding:0 20px 12px}
  .wkrange{font-size:15.5px;font-weight:650;margin-left:8px;white-space:nowrap}
  .pill-b{height:38px;padding:0 17px;border-radius:13px;border:1px solid var(--border);background:#fff;font:inherit;font-size:13px;color:#3f4854;cursor:pointer}
  .pill-b:hover{background:#f6f7f9}
  .fab-s{width:40px;height:40px;border-radius:50%;border:0;background:var(--black);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
  .fab-s .ico{width:19px;height:19px}
  #calHost{position:relative;flex:1;min-height:0}
  /* ---- списочные виды меню (мои задачи, команда, метки, делегированные, настройки) ---- */
  #viewHost{flex:1;min-height:0;overflow:auto;padding:0 20px 22px}
  .vw-bar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:0 0 14px}
  .vw-seg{display:inline-flex;background:#f4f6f9;border-radius:13px;padding:3px;gap:3px}
  .vw-seg button{border:0;background:none;font:inherit;font-size:13px;color:#5b6572;padding:0 15px;height:32px;border-radius:11px;cursor:pointer}
  .vw-seg button.on{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(20,30,45,.12)}
  .vw-sort{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--textdim)}
  .vw-sort select{height:34px;border:1px solid var(--border);border-radius:11px;background:#fff;font:inherit;font-size:13px;color:#3f4854;padding:0 8px}
  .lrow{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #eef0f4;border-radius:14px;background:#fff;margin-bottom:8px;cursor:pointer}
  .lrow:hover{border-color:#cfe0fb;background:#fafcff}
  .lrow.done .lname{color:var(--textdim);text-decoration:line-through}
  .lrow .lmark{width:18px;height:18px;border-radius:50%;border:2px solid #d4dae2;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:11px}
  .lrow .lmark.on{background:#22c55e;border-color:#22c55e}
  .lname{flex:1;min-width:0;font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .lmeta{flex:0 0 auto;font-size:12.5px;color:#7c8794;display:inline-flex;align-items:center;gap:8px}
  .lempty{text-align:center;color:var(--textdim);font-size:13.5px;padding:44px 10px}
  .vw-h{font-size:11.5px;letter-spacing:.07em;color:var(--textdim);margin:0 0 10px}
  .trow{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #eef0f4;border-radius:14px;background:#fff;margin-bottom:8px}
  .trow .tnm{font-size:13.5px;color:var(--ink);font-weight:550}
  .trow .trl{font-size:12px;color:var(--textdim)}
  .actbar{width:132px;height:7px;border-radius:7px;background:#eef0f4;overflow:hidden;flex:0 0 auto}
  .actbar i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,#7fb2f5,#3b82f6)}
  .tagrow{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #eef0f4;border-radius:14px;background:#fff;margin-bottom:8px}
  .tagrow .tgc{width:13px;height:13px;border-radius:50%;flex:0 0 auto}
  .icobtn{width:32px;height:32px;border-radius:10px;border:1px solid var(--border);background:#fff;color:#7c8794;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
  .icobtn:hover{background:#f4f6fa;color:#3f4854}
  .icobtn.del:hover{color:var(--danger);border-color:#f0cfd3;background:#fdf3f4}
  /* ---- общие ресурсы: строка кликабельна (открывает карточку), «Открыть» — ссылка кнопкой ---- */
  .resrow{cursor:pointer}
  .resrow:hover{border-color:#cfe0fb;background:#fafcff}
  .resrow .tnm,.resrow .trl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  a.rs-open{text-decoration:none;height:32px;padding:0 12px;font-size:13px;color:#3f4854;flex:0 0 auto}
  /* ---- кабинет сотрудника глазами администратора: красная рамка по контуру и метка в верхнем левом углу.
     Под метку освобождаем полосу сверху (--imp): она ничего не перекрывает ни на компьютере, ни на телефоне.
     Зачем полоса: на телефоне верхний левый угол занят аватаром шапки и кнопкой «‹ Назад», внизу — «Сегодня» и «＋»;
     свободного угла нет, поэтому 26px сверху отдаём метке и сдвигаем контейнеры: #wrap — отступом,
     остальные position:fixed — через top. z-index 90 — выше модалки (40), подтверждения (70) и тостов (80);
     у рамки pointer-events:none — кликается только метка. ---- */
  body.imp{--imp:26px}
  #impFrame{position:fixed;inset:0;z-index:90;pointer-events:none;border:3px solid #e5484d}
  #impFrame .imp-lbl{position:absolute;left:12px;top:0;height:calc(var(--imp) - 3px);pointer-events:auto;display:flex;align-items:center;gap:8px;background:#e5484d;color:#fff;font-size:12px;line-height:1;padding:0 4px 0 11px;border-radius:0 0 9px 9px;max-width:calc(100vw - 30px);white-space:nowrap;box-shadow:0 4px 12px rgba(229,72,77,.25)}
  #impFrame .imp-txt{overflow:hidden;text-overflow:ellipsis;min-width:0}
  #impFrame .imp-txt b{font-weight:650}
  #impFrame .imp-exit{appearance:none;flex:0 0 auto;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.16);color:#fff;font:inherit;font-size:11.5px;height:18px;padding:0 8px;border-radius:6px;cursor:pointer;line-height:1}
  #impFrame .imp-exit:hover{background:rgba(255,255,255,.3)}
  body.imp #wrap{padding-top:calc(13px + var(--imp))}
  body.imp .tside{top:calc(13px + var(--imp))}
  body.imp #mobile{top:var(--imp)}
  body.imp .mvback{top:calc(12px + var(--imp))}
  body.imp.mobile #viewHost{padding-top:calc(64px + var(--imp))}
  body.imp .mdrawer .mdr-card{top:var(--imp)}
  body.imp .modal{padding-top:var(--imp)}   /* высокая карточка (профиль на телефоне) не должна заезжать под метку */
  /* ---- правая карточка задачи: та же панель, но как отдельная карта ---- */
  .tside{top:13px;right:13px;bottom:13px;height:auto;border-radius:var(--card-r);border-left:0;background:#fff;box-shadow:0 12px 44px rgba(20,30,45,.18)}
  .tside .tbody2{padding:56px 22px 10px}
  .tside .tclose,.archside .tclose,.tside .tback{border-radius:12px;border:1px solid var(--border);background:#fff;color:#5b6572}
  .tside .tclose:hover,.archside .tclose:hover,.tside .tback:hover{background:#f4f6fa}
  .tside .tfoot{padding:14px 22px;border-top:1px solid #eef0f4}
  .sfmt2{background:#fff}
  .tcard2{background:#fff;border-color:#eef0f4}
  .tin{border-radius:12px;border-color:var(--border)}
  .tbtn{border-radius:12px}
  .tbtn.blue{background:var(--black);border-color:var(--black)}
  .tbtn.blue:hover{background:#000}
  .tbtn.dark{background:var(--black);border-color:var(--black);color:#fff}
  .tbtn.dark:hover{background:#000}
  /* шапка карточки задачи по макету: «ЗАДАЧА» и крупное название */
  .tc-kind{font-size:10.5px;letter-spacing:.12em;color:var(--textdim);margin:6px 0 6px}
  .tc-name{width:100%;border:0;outline:none;background:none;font:inherit;font-size:22px;font-weight:700;letter-spacing:-.3px;color:var(--ink);padding:0;margin:0 0 16px;line-height:1.25}
  .tc-name:disabled{color:#5b6572}
  .tc-when{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:0 0 18px}
  .tc-when .dpbtn{width:auto;min-width:184px;border-radius:12px;gap:9px}
  .sw{width:24px;height:24px;border-radius:50%;display:inline-block;cursor:pointer;box-shadow:0 0 0 2px #fff inset;border:2px solid transparent}
  .sw.on{border-color:var(--black)}
  /* ---- ТЕЛЕФОН: тот же визуал, что на компьютере ---- */
  #mobile .mtop .mt-btn{border-radius:14px;border:1px solid var(--border);background:#fff;color:#5b6572}
  #mobile .mnav button{border-radius:14px;background:#fff;border-color:var(--border)}
  #mobile .mrow{display:flex;align-items:stretch;gap:0;border-radius:16px;border-color:#eef0f4;padding:0;overflow:hidden;box-shadow:0 1px 4px rgba(20,30,45,.05)}
  #mobile .mrow .macc{width:4px;flex:0 0 auto;border-radius:4px;margin:11px 0 11px 11px}
  #mobile .mrow .mbody{flex:1;min-width:0;padding:12px 14px}
  #mobile .mrow .mtop2{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
  #mobile .mrow .mtime{font-size:13px;font-weight:650;min-width:0}
  #mobile .mrow .mdots{display:inline-flex;gap:5px}
  #mobile .mrow .mname{font-size:15px;line-height:1.3;white-space:normal;overflow:visible;display:block;color:var(--ink)}
  #mobile .mrow .msub{vertical-align:-3px;margin-right:5px}
  #mobile .mfab{background:var(--black);box-shadow:0 8px 22px rgba(20,25,35,.3)}
  #mobile .mtoday{color:#3f4854;border-radius:29px}
  /* шторка меню на телефоне: те же пункты, что в меню слева */
  .mdrawer{position:fixed;inset:0;z-index:48;background:rgba(20,28,38,.34);display:none}
  .mdrawer.show{display:block}
  .mdrawer .mdr-card{position:absolute;left:0;top:0;bottom:0;width:250px;max-width:82vw;background:#fff;border-radius:0 22px 22px 0;padding:22px 14px 16px;display:flex;flex-direction:column;box-shadow:12px 0 40px rgba(20,30,45,.22);overflow:auto}
  .mdrawer .nv-me{text-align:center;padding:2px 4px 18px}
  .mdrawer .nv-me .tava{width:60px!important;height:60px!important;font-size:24px;margin-bottom:9px}
  .mdrawer .nv-nm{font-size:15px;font-weight:650}
  .mdrawer .nv-i{font-size:14.5px;padding:12px 12px}
  .mdrawer .nv-bot{margin-top:auto;display:flex;flex-direction:column;align-items:center}
  /* списочные виды меню на телефоне — на весь экран, с кнопкой «назад» */
  body.mobile.vwopen #wrap{z-index:40}   /* #wrap с position:fixed — свой слой; иначе список меню остаётся ПОД экраном дня */
  body.mobile #viewHost{position:fixed;inset:0;z-index:38;background:var(--page);padding:64px 12px 26px;overflow:auto}
  body.mobile #viewHost .vw-bar{flex-direction:column;align-items:stretch}
  body.mobile #viewHost .srch{width:auto!important}
  body.mobile #viewHost .vw-sort{margin-left:0}
  .mvback{display:none;position:fixed;left:12px;top:12px;z-index:46;height:40px;padding:0 15px;border-radius:14px;border:1px solid var(--border);background:#fff;color:#3f4854;font:inherit;font-size:14px;align-items:center;gap:7px}
  body.mobile.vwopen .mvback{display:inline-flex}
  /* ---- правки владельца 19.09.2026 ---- */
  .mh{align-items:center;padding:16px 18px 14px;gap:10px;flex-wrap:nowrap}
  .mh h1{font-size:20px}
  .mh .mh-t{flex:0 1 auto;min-width:64px;overflow:hidden}
  .mh .mh-t h1{overflow:hidden;text-overflow:ellipsis}
  .mh-r{gap:7px;flex-wrap:nowrap}
  .wknav{padding:0;margin-left:14px;flex:0 0 auto}
  .wkrange{font-size:15px;margin-left:6px}
  .srch{flex:0 1 190px;width:190px;min-width:110px}
  /* ноутбук поуже: у «Фокуса» остаётся только значок, поиск ужимается — строка всё равно одна */
  @media (max-width:1400px){ .mh-r .sg2#focusBtn span{display:none} .srch{flex:0 1 160px;width:160px} }
  @media (max-width:1180px){ .mh .mh-s{display:none} .wkrange{font-size:13.5px} .pill-b,.sg2{padding:0 11px} }
  /* сворачивание меню слева */
  #nav{position:relative;transition:flex-basis .16s ease}
  .nv-toggle{position:absolute;right:-11px;top:26px;width:24px;height:24px;border-radius:50%;border:1px solid var(--border);background:#fff;color:#7c8794;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;z-index:3;box-shadow:0 2px 6px rgba(20,30,45,.1)}
  .nv-toggle:hover{color:#3f4854;background:#f4f6fa}
  .nv-toggle .ico{width:13px;height:13px}
  body.navmin #nav{flex-basis:70px;min-width:0;padding:20px 9px 14px}   /* min-width:0 обязателен: без него min-width:auto держит полосу по самому широкому содержимому, и меню не сворачивается */
  body.navmin #nav .nv-i>span,body.navmin #nav .nv-nm,body.navmin .nv-fabl{display:none}
  body.navmin #nav .nv-i{justify-content:center;padding:11px 0}
  body.navmin #nav .nv-me{padding-bottom:14px}
  /* ⚠️ Размер аватарки приходит ИНЛАЙНОМ из ava(size), поэтому правила, задающие ей другой размер
     по месту, обязаны идти с !important — иначе картинка остаётся 64px и вылезает за край узкой
     полосы свёрнутого меню (жалоба владельца 20.09.2026). */
  body.navmin #nav .nv-me .tava{width:42px!important;height:42px!important;font-size:18px;margin-bottom:0}
  body.navmin .nv-clock{width:50px;height:50px}
  body.navmin .nv-clock .nm{display:none}   /* в узком меню цифры нечитаемы — вместо них риски */
  body.navmin .nv-clock .tk{display:block}
  body.navmin .nv-toggle{transform:rotate(180deg)}
  /* панель поиска из календаря — на 40% экрана, стилем как списки меню */
  .tside.searchwide{width:40vw;min-width:360px}
  .tside .lrow{margin-bottom:8px}
  /* ======================= КАРТОЧКА ЗАДАЧИ ПО МАКЕТУ ======================= */
  .tside .tbody2{padding:56px 22px 6px}
  .tmore{position:absolute;top:12px;right:14px;width:34px;height:34px;border-radius:12px;border:1px solid var(--border);background:#fff;color:#5b6572;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;padding:0}
  .tmore:hover{background:#f4f6fa}
  .tc-head{display:flex;align-items:flex-start;gap:14px;margin:0 0 14px}
  .tc-head .tc-name{margin:0;flex:1;min-width:0}
  .tc-head .tbtn{flex:0 0 auto;height:40px}
  .tc-when .tin,.tc-when .dpbtn{background:#f4f6f9;border-color:#eceff4;height:44px}
  .tc-when .tc-time{position:relative;display:inline-flex;align-items:center;gap:6px}
  .tc-when select.tin{width:150px;padding-left:12px}
  /* блок-поле: светлый фон, подпись сверху, белые контролы (макет) */
  .fld{background:#f5f7fa;border-radius:16px;padding:11px 13px 13px;margin:0 0 12px;min-width:0}
  .fld-l{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#8b95a3;margin-bottom:8px;min-width:0}
  .fld-l>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fld-l svg{width:15px;height:15px;flex:0 0 auto;opacity:.85}
  .fld-b{min-width:0}
  .fld-b .tin,.fld-b select.tin{background:#fff;border-color:#e9ecf1;width:100%}
  .fld-b select.tin,.fld-b .tin:not(.tin-desc){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fld-note{font-size:12px;color:#98a1ad;padding:2px 2px}
  .fld-cnt{font-size:12px;color:#8b95a3;white-space:nowrap;margin-left:4px}
  .fld-row3{display:grid;grid-template-columns:1fr 1.15fr .85fr;gap:10px}
  .fld-row2{display:grid;grid-template-columns:.85fr 1.15fr;gap:10px}
  .fld-row3>.fld,.fld-row2>.fld{margin-bottom:12px}
  .tc-author{display:flex;align-items:center;gap:9px;height:40px;padding:0 12px;background:#fff;border:1px solid #e9ecf1;border-radius:12px;font-size:13.5px;min-width:0}
  .tc-author>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .fld .sfmt2{background:#fff;border-color:#e9ecf1;margin-left:0;margin-right:0;position:static}
  .fld .tin-desc{border:1px solid #e9ecf1}
  .fld .tin-desc:focus{border-color:#bcd2f2}
  .fld-rec .norep{background:#fff;color:#7c8794;display:flex;align-items:center}
  .fld-rec .tseg.wd{gap:5px;margin-top:8px}
  .fld-rec .tseg.wd .sg{padding:7px 8px;font-size:12.5px;border-radius:9px}
  /* плашка авторской (родительской) задачи — под названием, стилем подзадачи */
  .authcard{background:#eef4ff;border-color:#d8e4f7;cursor:default;margin:0 0 14px}
  .authcard .subdot{border-color:#9dc0ee}
  .authcard .subname{color:#42556e}
  /* подзадачи */
  .subrow{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #edf0f4;border-radius:11px;padding:9px 11px;margin:0 0 6px}
  .subrow:last-child{margin-bottom:0}
  .subrow .subchk{width:19px;height:19px;border-radius:6px;border:2px solid #cfd6e0;flex:0 0 auto;cursor:pointer;position:relative}
  .subrow .subchk:hover{border-color:#3b82f6}
  .subrow .subchk.on{background:#3b82f6;border-color:#3b82f6}
  .subrow .subchk.on::after{content:'';position:absolute;left:5px;top:1.5px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(43deg)}
  .subrow .subname{flex:1;min-width:0;font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
  .subrow .subname:hover{color:#2563eb}
  .subrow.done .subname{color:#98a1ad;text-decoration:line-through}
  .subrow .subwho{font-size:12px;color:#8b95a3;white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}
  .pbar{width:110px;height:6px;border-radius:6px;background:#e5e9ef;overflow:hidden;flex:0 0 auto}
  .pbar i{display:block;height:100%;background:#22c55e;border-radius:6px}
  .tbtn.mini{height:30px;padding:0 11px;font-size:12.5px;border-radius:10px;gap:5px}
  .tbtn.mini svg{width:14px;height:14px}
  .icobtn.sm{width:26px;height:26px;border:0;background:none;border-radius:8px}
  .icobtn.sm svg{width:15px;height:15px}
  .icobtn.big{width:38px;height:38px;border-radius:12px}
  /* вложения */
  .filerow{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:10px}
  .filechip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #edf0f4;border-radius:12px;padding:8px 9px;max-width:230px;min-width:0}
  .filechip .fbadge{width:30px;height:30px;border-radius:8px;font-size:9px}
  .filechip .fc-t{min-width:0;display:flex;flex-direction:column}
  .filechip .fc-n{font-size:12.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
  .filechip .fc-n:hover{color:#2563eb}
  .filechip .fc-m{font-size:11px;color:#98a1ad;white-space:nowrap}
  .dropzone{border:1.6px dashed #d4dbe4;border-radius:13px;background:#fff;padding:16px 12px;text-align:center;cursor:pointer;color:#7c8794}
  .dropzone:hover{border-color:#9cc4f4;background:#fafcff}
  .dropzone svg{width:19px;height:19px;display:block;margin:0 auto 6px}
  .dropzone b{display:block;font-size:13.5px;color:#3f4854;font-weight:600}
  .dropzone span{display:block;font-size:11.5px;margin-top:3px}
  /* комментарии */
  .cmfld{padding-bottom:11px}
  .cm-head{cursor:pointer;margin-bottom:0;user-select:none}
  .cm-head:hover{color:#5b6572}
  .cm-chev{margin-left:auto;display:inline-flex;transition:transform .15s}
  .cm-chev svg{width:16px;height:16px}
  .cm-chev.on{transform:rotate(180deg)}
  .cm-list{margin-top:9px;display:flex;flex-direction:column;gap:7px}
  .cmitem{display:flex;gap:9px;background:#fff;border:1px solid #e9ecf1;border-radius:12px;padding:9px 11px}
  .cmitem .cm-body{flex:1;min-width:0}
  .cmitem .cm-top{display:flex;align-items:center;gap:8px;margin-bottom:3px}
  .cmitem .cm-top b{font-size:12.5px;font-weight:600}
  .cmitem .cm-d{font-size:11.5px;color:#98a1ad}
  .cmitem .cm-act{margin-left:auto;display:inline-flex;gap:8px;opacity:.55}
  .cmitem:hover .cm-act{opacity:1}
  .cmitem .cm-act svg{width:14px;height:14px}
  .cmitem .cm-t{font-size:13.5px;line-height:1.4;overflow-wrap:anywhere}
  /* подвал карточки */
  .tside .tfoot{gap:9px;padding:11px 18px}
  .tside .tfoot .cm-in{flex:1;min-width:0;height:40px;background:#f5f7fa;border-color:#eceff4}
  .tside .tfoot .savestate{font-size:12px;color:#98a1ad;white-space:nowrap}
  .cm-count{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 13px;border-radius:12px;border:1px solid var(--border);background:#fff;color:#5b6572;font:inherit;font-size:13px;cursor:pointer;flex:0 0 auto}
  .cm-count:hover{background:#f4f6fa}
  .cm-count svg{width:15px;height:15px}
  @media (max-width:820px){ .fld-row3,.fld-row2{grid-template-columns:1fr} }
  .dpbtn .ico,.tc-time .ico{width:16px;height:16px;color:#98a1ad;flex:0 0 auto}
  .tc-time{background:#f4f6f9;border:1px solid #eceff4;border-radius:12px;height:44px;padding:0 10px 0 12px}
  .tc-time select.tin{border:0;background:none;height:40px;padding:0 4px;width:120px}
  .tc-when .dpbtn{display:flex;gap:9px;align-items:center;height:44px;border-radius:12px}
  /* карточка задачи на телефоне: название и «Завершить» не наезжают друг на друга */
  @media (max-width:700px){
    .tc-head{flex-wrap:wrap;gap:10px}
    .tc-head .tc-name{flex:1 1 100%;font-size:20px;margin-bottom:0}
    .tc-head .tbtn{align-self:flex-start}
    .tc-when{gap:8px;flex-wrap:nowrap}
    .tc-when .dpbtn{width:auto;min-width:0;flex:1 1 auto;white-space:nowrap}
    .tc-time{flex:0 0 auto}
    .tc-time select.tin{width:96px}
    .tmore{right:12px}
    .tside .tfoot{padding:10px 12px;gap:7px}
    .cm-count{padding:0 10px}
  }
  /* ---- строка списка задач: дата, время, название, метки ---- */
  .lrow{gap:10px}
  .lrow .lsub{width:15px;height:15px;flex:0 0 auto;color:#9aa3ad}
  .lrow .ldate{flex:0 0 auto;font-size:12.5px;color:#7c8794;width:62px;font-variant-numeric:tabular-nums}
  .lrow .ltime{flex:0 0 auto;font-size:12.5px;font-weight:600;color:#3b82f6;width:38px;font-variant-numeric:tabular-nums}
  .lrow.done .ltime{color:#9aa3ad}
  .lrow .ldots{display:inline-flex;gap:4px;flex:0 0 auto}
  .lrow .ldots i{width:8px;height:8px;border-radius:50%;display:inline-block}
  .lrow .lwho{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .lrow .lmark{width:17px;height:17px;border:0;background:#22c55e;color:#fff;font-size:10px}
  /* ---- подсказка у свёрнутого меню ---- */
  body.navmin #nav .nv-i{position:relative}
  body.navmin #nav .nv-i::after{content:attr(data-tip);position:absolute;left:calc(100% + 14px);top:50%;transform:translateY(-50%);
    background:#20262e;color:#fff;font-size:12.5px;padding:6px 10px;border-radius:9px;white-space:nowrap;opacity:0;pointer-events:none;
    transition:opacity .12s;z-index:30;box-shadow:0 6px 18px rgba(20,30,45,.25)}
  body.navmin #nav .nv-i:hover::after{opacity:1}
  /* ---- вложения: файлы внутри пунктирной зоны, высота зоны постоянна ---- */
  .dropzone{display:flex;align-items:center;gap:14px;height:116px;padding:10px 14px;text-align:left}
  .dz-files{display:flex;gap:10px;overflow-x:auto;flex:0 1 auto;padding:2px 0;scrollbar-width:thin}
  .ftile{width:64px;flex:0 0 auto;cursor:pointer;text-align:center}
  .ftile .ft-b{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border-radius:12px;color:#fff;font-size:12px;font-weight:700;letter-spacing:.3px}
  .ftile .ft-b b{font-size:9.5px;font-weight:500;opacity:.92;margin-top:2px}
  .ftile .ft-n{display:block;font-size:10.5px;color:#7c8794;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ftile:hover .ft-b{filter:brightness(1.08)}
  .dz-cta{flex:1 1 auto;min-width:126px;text-align:center;color:#7c8794}
  .dz-cta svg{width:19px;height:19px;display:block;margin:0 auto 6px}
  .dz-cta b{display:block;font-size:13.5px;color:#3f4854;font-weight:600}
  .dz-cta span{display:block;font-size:11.5px;margin-top:3px}
  /* ---- люди в карточке: без белой подложки, высота строки постоянна ---- */
  .fld-row3 .fld-b{height:40px;display:flex;align-items:center;min-width:0}
  .pickwho{position:relative;width:100%;height:40px;display:flex;align-items:center;min-width:0}
  .pw-view{display:flex;align-items:center;gap:9px;width:100%;min-width:0;font-size:14.5px;font-weight:600;color:var(--ink)}
  .pw-view b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .pw-view svg{width:16px;height:16px;color:#98a1ad;margin-left:auto;flex:0 0 auto}
  .pw-view .tava{flex:0 0 auto}
  .pw-sel{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0;font:inherit}
  .pw-sel:disabled{cursor:default}
  .costack{display:flex;align-items:center;flex:0 0 auto}
  .costack .coav{width:28px;height:28px;border-radius:50%;margin-left:-8px;box-shadow:0 0 0 2.5px #f5f7fa;cursor:pointer;display:inline-flex;flex:0 0 auto}
  .costack .coav:first-child{margin-left:0}
  .costack .coav:hover{z-index:2;transform:translateY(-1px)}
  .costack .coav .tava{width:28px;height:28px;font-size:12px}
  .costack .coav.more{background:#dde3ea;color:#5b6572;font-size:11.5px;font-weight:600;align-items:center;justify-content:center}
  .costack .coadd{width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid #e2e6ec;display:inline-flex;align-items:center;justify-content:center;margin-left:6px;color:#3b82f6;flex:0 0 auto}
  .costack .coadd svg{width:15px;height:15px}
  .colab{font-size:14px;color:#98a1ad;margin-left:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #tcCo{position:relative;gap:0}
  /* ---- авторская задача: серым, справа от даты и времени ---- */
  .authnote{font-size:12.5px;color:#a3abb6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;cursor:default}
  /* ---- метки и повторение: строго одна строка ---- */
  .fld-row2 .fld-b{height:40px;display:flex;align-items:center;gap:7px;overflow:hidden}
  #tcTags{flex-wrap:nowrap}
  #tcTags .pill{margin:0!important;flex:0 0 auto;max-width:150px;overflow:hidden}
  #tcTags .csel{flex:0 0 auto}
  .fld-rec .fld-b{gap:9px}
  .fld-rec .recrow select.recsel{flex:0 0 auto;width:152px;min-width:152px;padding-left:10px;padding-right:6px}
  .fld-rec .recparams{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:7px;overflow-x:auto;scrollbar-width:none}
  .fld-rec .recparams::-webkit-scrollbar{display:none}
  .fld-rec .recparams .tseg.wd{gap:5px;margin:0;flex-wrap:nowrap}
  .fld-rec .recparams .tseg.wd .sg{padding:7px 6px;font-size:11.5px;border-radius:9px;background:#fff;min-width:29px;justify-content:center}
  .fld-rec .recrow .recparams select.tin{width:auto;min-width:106px}
  .fld-rec .norep{width:100%}
  .fld-row2{grid-template-columns:.66fr 1.34fr}
  #tcTags .pill .pnm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  #tcTags .pill{padding:5px 8px;font-size:12px;gap:5px}
  /* метки и дни недели никогда не переносятся на вторую строку — при нехватке места строка прокручивается вбок.
     Высота карточки от них не зависит (правило владельца: прыгать могут только описание, подзадачи и комментарии). */
  #tcTags{overflow-x:auto;scrollbar-width:none}
  #tcTags::-webkit-scrollbar{display:none}
  .recrow{display:flex;align-items:center;gap:9px;width:100%;min-width:0;height:40px}
  .lrow .lname{flex:0 1 auto}
  .lrow .lgap{flex:1 1 auto;min-width:6px}
  /* ---- список задач: колонки строго друг под другом ---- */
  .lrow .lsubslot{flex:0 0 auto;width:16px;display:inline-flex;align-items:center;justify-content:center}
  .lrow .lsubslot .lsub{width:15px;height:15px}
  /* ---- время в шапке карточки: без рамки фокуса ---- */
  .tc-time select.tin:focus,.tc-time select.tin:focus-visible{outline:none;box-shadow:none;border:0}
  .tc-when .dpbtn:focus{outline:none}
  .ctxmenu .pmrow{display:flex;align-items:center;gap:9px;font-size:13.5px}
  .ctxmenu .pmrow .tava{flex:0 0 auto}
  .pickwho.dis{cursor:default}
  .pickwho:not(.dis){cursor:pointer}
  .costack .coadd,.colab{cursor:pointer}
  /* ---- карточка создания: как карточка задачи, шире, без полосы прокрутки, углы всегда круглые ---- */
  .dlg.dlg2{width:780px;max-height:94vh;max-height:94svh;overflow:auto;scrollbar-width:none;padding:22px 24px 18px}
  .dlg.dlg2::-webkit-scrollbar{display:none}
  .dlg.dlg2 .tc-name{margin-bottom:14px}
  .atfoot{display:flex;justify-content:flex-end;gap:9px;margin-top:4px}
  .dlg.dlg2 .fld{margin-bottom:12px}
  .dlg.dlg2 .tin-desc{min-height:70px}
  .cm-list .cm-more{color:#3b82f6;font-size:12.5px;background:none;border:0;cursor:pointer;font-family:inherit}
  .cm-list .cm-more:hover{text-decoration:underline}
  /* поля в карточке: спокойная подсветка фокуса вместо системной рамки браузера */
  .tin:focus,.cm-in:focus,.srch input:focus{outline:none;border-color:#bcd2f2;box-shadow:0 0 0 3px rgba(59,130,246,.10)}
  .tside .tfoot .cm-in:focus{background:#fff}
  .fld-b select.tin:focus{outline:none}
  .tagadd{width:30px;height:30px;border-radius:10px;border:1px solid #e2e6ec;background:#fff;color:#3b82f6;font-size:15px;line-height:1;cursor:pointer;flex:0 0 auto;padding:0}
  .tagadd:hover{background:#f2f7ff;border-color:#cfe0fb}
  /* поля повторения одной высоты; выбранные дни недели — синие (раньше терялись на белом) */
  .fld-rec .recrow select.recsel,.fld-rec .recrow .recparams select.tin{height:36px;padding-top:0;padding-bottom:0}
  .fld-rec .recparams .tseg.wd .sg{height:36px;padding:0 9px;display:inline-flex;align-items:center;justify-content:center;min-width:34px;border-radius:10px;background:#fff;border:1px solid var(--border);font-size:12px;color:#3f4854}
  .fld-rec .recparams .tseg.wd .sg.on{background:#3b82f6;border-color:#3b82f6;color:#fff}
  .fld-rec .recrow{align-items:center}
  /* комментарии — у самого низа карточки, даже когда содержимого мало */
  .tside .tbody2{display:flex;flex-direction:column}
  .tside .tbody2>.cmfld{margin-top:auto}
  /* ⚠️ Меню выбора (люди, метки) должно лежать ВЫШЕ модального окна (z-index 40) — иначе в карточке
     создания задачи клик по «Ответственный» или «＋ метка» открывал меню ПОД затемнением, и казалось,
     что ничего не выбирается. */
  .ctxmenu{z-index:62}
  @media (max-width:700px){ .ctxmenu{z-index:62} }
  .tc-name.bad{box-shadow:inset 0 -2px 0 0 #e5484d}
  .tc-name.bad::placeholder{color:#e5848c}
  /* ручка ширины карточки: была 9px и почти не ловилась мышью */
  .tside .tgrip{left:-7px;width:16px}
  .tside .tgrip:hover{background:linear-gradient(90deg,transparent,rgba(59,130,246,.18),transparent)}
  /* ---- подсказка с именем: своя, а не системная (системную владелец не видел) ---- */
  .coav[data-tip],.coadd[data-tip]{position:relative}
  .coav[data-tip]::after,.coadd[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);
    background:#20262e;color:#fff;font-size:12px;padding:5px 9px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;
    transition:opacity .12s;z-index:40;box-shadow:0 6px 18px rgba(20,30,45,.25)}
  .coav[data-tip]:hover::after,.coadd[data-tip]:hover::after{opacity:1}
  .coav:hover{z-index:5}
  /* ---- ⚠️ ПЛОТНОЙ ДЕЛАЕМ ТОЛЬКО ШАПКУ карточки. «Много воздуха» у владельца относилось к шапке,
     а не ко всей карточке: поля ниже (описание, метки, повторение, подзадачи, вложения) держат
     свои исходные отступы — правка 20.09.2026, пункт 4. Не сжимать их «ради экономии высоты». ---- */
  .tside .tbody2{padding:48px 22px 6px}
  .tc-kind{margin:0 0 4px}
  .tc-head{margin:0 0 9px}
  .tc-when{margin:0 0 10px}
  /* статус задачи (ЗАВЕРШЕНА / УДАЛЕНА) — в одном ряду с ✕ и ←, правее их: отдельной строкой
     над названием он громоздил шапку (правка 20.09.2026, пункт 1) */
  .tside .tc-st{position:absolute;top:12px;left:58px;height:34px;display:flex;align-items:center;z-index:2;
    font-size:10.5px;letter-spacing:.12em;color:var(--textdim);pointer-events:none;white-space:nowrap}
  .tside.hasback .tc-st{left:100px}
  /* цвета переключателей в шапке: чёрный — «Фокус», белый — масштаб недели (правка 20.09.2026, пункт 2) */
  #scaleBtn{background:#fff;border-color:var(--border);color:#3f4854}
  #scaleBtn:hover{background:#f6f7f9}
  #focusBtn{background:var(--black);border-color:var(--black);color:#fff}
  #focusBtn .ico{color:#fff}
  #focusBtn:hover{background:#2b3440;border-color:#2b3440}
  #focusBtn.on{background:#3b82f6;border-color:#3b82f6}   /* включённый фокус — синий, чтобы отличался от выключенного */
  #focusBtn.on:hover{background:#3477e6;border-color:#3477e6}
  /* ⚠️ Ширина меню слева не должна зависеть от того, какой пункт выбран: у флекс-элемента
     min-width:auto, и активный пункт (font-weight 600) раздвигал колонку на 3px — меню «прыгало»
     (правка 20.09.2026, пункт 3). Держим min-width:0 и явную ширину под самое длинное слово. */
  body:not(.navmin) #nav{flex:0 0 188px;min-width:0}   /* :not(.navmin) — иначе это правило спорит со свёрнутым меню */
  #nav .nv-i>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mdrawer .nv-toggle{display:none}   /* в шторке на телефоне кнопка «свернуть меню» бессмысленна */
  /* ---- правки по восьмому кругу макета (20.09.2026) ---- */
  /* кнопка «свернуть меню» — у середины края карточки: наверху она наезжала на аватар (п.5) */
  .nv-toggle{top:auto;bottom:50%;transform:translateY(50%)}
  body.navmin .nv-toggle{transform:translateY(50%) rotate(180deg)}
  #nav .nv-me{border-radius:16px;transition:background .12s}
  #nav .nv-me:hover{background:#f4f6fa}
  /* кнопка состояния задачи — в строке с датой, прижата вправо (п.1) */
  .tc-when .tc-act{margin-left:auto;height:44px}
  /* значок пункта меню: графитовый квадрат, как кнопка «Завершить» (п.10) */
  .ctxmenu .ci{gap:12px}
  .ctxmenu .ci-ic{width:24px;height:24px;flex:0 0 auto;border-radius:8px;background:var(--black);color:#fff;
    display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1}
  /* вложение: крестик в углу плитки — удаляет сразу, без меню (п.11) */
  .ftile{position:relative}
  .ftile .ft-b{position:relative}
  .ftile .ft-x{position:absolute;top:3px;right:3px;width:17px;height:17px;border-radius:50%;border:1.5px solid rgba(255,255,255,.9);
    background:#3f4854;color:#fff;font-size:9px;line-height:1;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;
    opacity:.55;transition:opacity .12s,background .12s}   /* виден всегда: на телефоне наведения нет, а удалять файл надо и там */
  .ftile:hover .ft-x{opacity:1}
  .ftile .ft-x:hover{background:#e5484d;opacity:1}
  /* строка подзадачи: когда, метки, кто (п.12) */
  .subrow .subname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .subrow .subdt{font-size:11.5px;color:#8b95a3;white-space:nowrap;flex:0 0 auto}
  .subrow .subdt.late{color:#e5484d;font-weight:600}
  .subrow .subdots{display:inline-flex;gap:3px;flex:0 0 auto}
  .subrow .subdots i{width:7px;height:7px;border-radius:50%;display:block}
  .subrow .subwho2{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;max-width:150px}
  .subrow .subava{flex:0 0 auto;display:inline-flex}
  .subrow .subnm{font-size:12px;color:#5b6572;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .subrow.done .subnm{color:#b6bdc6}
  /* строка людей — без лишнего воздуха (правка владельца 20.09.2026). Три поля меняются ВМЕСТЕ,
     иначе карточка начнёт прыгать: высота у них общая по правилу «карточка не прыгает». */
  .fld-row3>.fld{padding:8px 13px 9px}
  .fld-row3>.fld .fld-l{margin-bottom:5px}
  .fld-row3>.fld .fld-b{height:34px}
  /* ---------- телефон: правки владельца 20.09.2026 (пп. 6, 7, 9, 10) ---------- */
  @media (max-width:700px){
    /* кнопка состояния — в один ряд с ✕, над датой: на узком экране строка даты для неё тесна */
    .tside .tc-when .tc-act{position:absolute;top:12px;right:14px;height:34px;margin:0;z-index:3;padding:0 14px;font-size:13px}
    /* на узком экране статус и кнопка делят один ряд — режем статус, а не кнопку */
    .tside .tc-st{max-width:calc(100% - 240px);overflow:hidden;text-overflow:ellipsis}
    /* запас снизу, чтобы кнопки диалога не липли к краю экрана */
    .dlg,.dlg.dlg2{padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
    /* ⚠️ Строка подзадачи: НАЗВАНИЕ ГЛАВНОЕ. В одну строку оно ужималось до пары точек — его не было
       видно и не по чему было попасть пальцем, отсюда жалоба «подзадачи не открываются». Теперь
       название занимает первую строку целиком, а дата, метки и аватар уходят на вторую. */
    .subrow{flex-wrap:wrap;row-gap:5px;padding:10px 11px;align-items:flex-start}
    .subrow .subchk{order:0;margin-top:5px}
    /* название + «…» держим в ПЕРВОЙ строке: подзадача без даты и исполнителя иначе тащит за собой
       пустую вторую строку. overflow-wrap — от длинного слова без пробелов: оно уводило всю
       страницу в горизонтальную прокрутку. */
    .subrow .subname{order:1;flex:1 1 calc(100% - 68px);white-space:normal;overflow:visible;text-overflow:clip;
      overflow-wrap:anywhere;line-height:1.3;padding:6px 0}
    .subrow .icobtn{order:2}
    .subrow .subdt,.subrow .subdots,.subrow .subwho2{order:3}
    .subrow .subnm{display:none}   /* имени исполнителя рядом с аватаркой на телефоне нет места */
    /* заголовок поля: полоска прогресса и счётчик съедали само слово «Подзадачи» —
       теперь ужимается счётчик, а название поля остаётся целым */
    .fld-l .pbar{display:none}
    .fld-l>span:not(.fld-cnt){flex:0 0 auto}
    .fld-l .fld-cnt{margin-left:2px;min-width:0;overflow:hidden;text-overflow:ellipsis}
  }
  .subrow.done .subdt{color:#b6bdc6}
  /* встроенная аватарка: кружок с мордочкой.
     ⚠️ Рисунок обязан занимать кружок ЦЕЛИКОМ и не слушать общие правила для значков.
     В карточке есть `.pw-view svg{width:16px;margin-left:auto}` и другие такие же — они ловили
     и аватарку: она ужималась до 16 px и уезжала в угол (жалоба владельца 20.09.2026).
     Поэтому размеры здесь с !important — это защита от любых будущих правил на svg. */
  .tava-b{overflow:hidden;line-height:0;padding:0}
  .tava-b>svg{display:block!important;width:100%!important;height:100%!important;margin:0!important;
    flex:none!important;border-radius:50%;max-width:none;min-width:0}
  /* выбор аватарки в профиле */
  .avapick{display:grid;grid-template-columns:repeat(10,1fr);gap:7px;margin:2px 0 4px}
  /* ⚠️ Кнопка ОБЯЗАНА быть квадратной: в растянутой ячейке сетки border-radius:50% даёт овал. */
  .avapick .ap{width:40px;height:40px;justify-self:center;border:2px solid transparent;border-radius:50%;padding:0;
    background:none;cursor:pointer;line-height:0;display:flex;align-items:center;justify-content:center}
  .avapick .ap:hover{border-color:#cfe0fb}
  .avapick .ap.on{border-color:#3b82f6}
  @media (max-width:700px){ .avapick{grid-template-columns:repeat(5,1fr)} }
  /* ⚠️ Мобильная раскладка блоков — В САМОМ КОНЦЕ файла: правило .fld-row2 с пропорциями колонок
     объявлено позже медиазапроса и при равной силе перебивало его, из-за чего на телефоне метки
     и повторение оставались в две колонки и не помещались. */
  /* телефон: дата занимает всю ширину, что осталась от времени — иначе «20 сентября 2026»
     не влезало в фиксированные 168px и обрезалось на последней цифре */
  @media (max-width:700px){
    .tc-when{flex-wrap:wrap}
    .tc-when .dp{flex:1 1 168px;min-width:0}
    .tc-when .dpbtn{width:100%!important;min-width:0}   /* ширина кнопки задана в разметке инлайном — иначе не перебить */
    .tc-when select.tin{width:108px}   /* времени хватает «10:30» — остальное отдаём дате */
    .tc-when .dpbtn{gap:6px;padding-left:9px;padding-right:9px}   /* «20 сентября 2026» должно помещаться целиком */
  }
  @media (max-width:820px){
    .fld-row3,.fld-row2{grid-template-columns:1fr!important}
    .fld-rec .recrow{flex-wrap:wrap;height:auto;min-height:40px}
    .fld-rec .recrow select.recsel{width:100%;min-width:0}
    .fld-row2 .fld-b{height:auto;min-height:40px}
  }

  /* ---- ФИНАНСЫ: дашборд касс и строки платежей ---- */
  .fin-dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(136px,1fr));gap:10px;margin:0 0 12px}   /* 6 карточек (5 касс + Итого): в ряд на широком, переносом на узком */
  .fin-card{background:#fff;border:1px solid #eef0f4;border-radius:14px;padding:13px 15px}
  .fin-card.fin-total{background:#f3f8ff;border-color:#d9e7fd}
  .fin-cl{font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--textdim);margin-bottom:6px}
  .fin-cv{font-size:18px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fin-month{font-size:12.5px;color:var(--muted);margin:0 0 14px}
  .fin-in{color:#2f9e5f}
  .fin-out{color:#d64545}
  /* жёсткая сетка строки документа: дата / тип / контрагент (резиновая) / касса / сумма / статус —
     колонки стоят ровно по вертикалям независимо от содержимого */
  .finrow{display:grid;grid-template-columns:78px 96px minmax(0,1fr) 86px 132px 122px;gap:10px;align-items:center;cursor:pointer}
  .finrow .fin-date{font-size:12.5px;color:var(--textdim);white-space:nowrap}
  .finrow .fin-main{min-width:0;display:flex;flex-direction:column;gap:2px}
  .finrow .fin-main .tnm,.finrow .fin-main .trl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .finrow .fin-acc{white-space:nowrap}
  .finrow .fin-sum{justify-self:end;text-align:right}
  .fin-sum{font-weight:700;font-size:14px;white-space:nowrap}
  .fin-dt{justify-self:start;font-size:11px;font-weight:700;color:#5b6572;background:#f4f6f9;border-radius:7px;padding:3px 7px;white-space:nowrap}
  /* статус: цветной кружок для мгновенного чтения + текстовый бейдж */
  .fin-stat{justify-self:end;display:inline-flex;align-items:center;gap:7px}
  .fin-dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:0 0 auto}
  .fin-dot.posted{background:#2f9e5f}
  .fin-dot.draft{background:#c3cad2}
  .fin-badge{font-size:11px;font-weight:600;border-radius:8px;padding:3px 9px;white-space:nowrap}
  .fin-badge.posted{background:#e4f6ec;color:#2f9e5f}
  .fin-badge.draft{background:#f2f4f8;color:#98a1ad}
  #tsStatus .fin-badge{display:inline-block}
  /* контрагенты: название | поступления | списания | документов */
  .cprow{display:grid;grid-template-columns:minmax(0,1fr) 150px 150px 80px;gap:10px;align-items:center;cursor:pointer}
  .cprow .fin-main{min-width:0;display:flex;flex-direction:column;gap:2px}
  .cprow .tnm,.cprow .trl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .cp-num{text-align:right;font-weight:700;font-size:13.5px;white-space:nowrap}
  .cp-n{text-align:right;white-space:nowrap}
  /* телефон: второстепенные колонки прячем, статус остаётся кружком */
  @media (max-width:700px){
    .finrow{grid-template-columns:64px minmax(0,1fr) 118px 24px;gap:8px}
    .finrow .fin-dt,.finrow .fin-acc{display:none}
    .fin-stat .fin-badge{display:none}
    .cprow{grid-template-columns:minmax(0,1fr) 110px}
    .cprow .cp-num.fin-out,.cprow .cp-n{display:none}
  }
