.work-toolbar,.task-actions,.service-actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.form-field .reminder-toggle{display:flex;align-items:center;gap:10px;min-height:44px}.reminder-toggle input.write-input{width:22px;height:22px;min-height:22px;accent-color:var(--green)}
.multiline{white-space:pre-wrap;overflow-wrap:anywhere}
[data-work-form] .compare-field p{white-space:pre-wrap;overflow-wrap:anywhere}
.deadline-editor{border:0;margin:0;padding:0;min-width:0}
.deadline-editor legend{font-size:13px;font-weight:650;margin-bottom:9px;padding:0}
.deadline-parts{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10px}
.deadline-parts label{font-size:12px;color:var(--muted);margin:0;min-width:0}
/* iOS date/time controls mis-size percentage widths when the native input has
   padding (WebKit 301648). Put spacing/borders on an ordinary wrapper instead. */
.deadline-control{display:block;margin-top:7px;min-width:0;max-width:100%;padding:12px 10px;
 border:1px solid var(--border);border-radius:10px;background:var(--surface2)}
.deadline-control input{display:block;appearance:none;-webkit-appearance:none;box-sizing:border-box;
 width:100%;min-width:0;min-inline-size:0;max-width:100%;height:24px;min-height:24px;
 padding:0;margin:0;border:0;border-radius:0;background:transparent;text-align:left}
.deadline-control input::-webkit-date-and-time-value{text-align:left;min-height:24px}
.deadline-control:focus-within{outline:3px solid var(--green);outline-offset:3px}
.deadline-control input:focus-visible{outline:0}
.form-field:has(#id_deadline[aria-invalid=true]) .deadline-control{border-color:var(--danger)}
.section-title{margin:28px 0 16px}.project-history{margin-top:36px;padding-top:24px;border-top:1px solid var(--border)}
.project-history ol{list-style:none;padding:0}.project-history li{border-bottom:1px solid var(--border);padding:16px 0;overflow-wrap:anywhere}.project-history time{font-family:'IBM Plex Sans',sans-serif;font-size:13px;color:var(--muted)}
.matrix-heading{margin-bottom:22px}.matrix-controls{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:20px}
.period-buttons{display:flex;flex-wrap:wrap;gap:6px}.period-buttons button{border:1px solid var(--border);background:var(--card);color:var(--text);min-height:42px;padding:8px 13px;border-radius:12px;font-size:13px}
.period-buttons button[aria-pressed=true]{color:var(--on-accent);background:var(--green);border-color:var(--green);font-weight:800}
.matrix-controls label{font-size:12px;color:var(--muted)}.matrix-controls select,.matrix-mobile-choice select{display:block;background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px;max-width:100%;font:inherit}
.matrix-workspace{display:grid;grid-template-columns:180px minmax(0,1fr);gap:16px;align-items:start}
.matrix-workspace.has-panel{grid-template-columns:150px minmax(0,1fr) 300px}
.matrix-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;min-width:0}
.quadrant,.overdue-column{min-width:0;background:var(--surface2);border:1px solid var(--border);border-radius:20px;padding:14px 10px 10px}
.quadrant{--quadrant:var(--danger)}.quadrant-orange{--quadrant:var(--accent2)}.quadrant-green{--quadrant:var(--ok)}.quadrant-gray{--quadrant:var(--muted)}
.quadrant h2,.overdue-column h2{font-size:12px;line-height:1.5;letter-spacing:.1px;display:flex;justify-content:space-between;gap:8px;padding:0 4px 12px;color:var(--quadrant,var(--danger))}
.quadrant h2:before{content:'';width:7px;height:7px;flex-shrink:0;border-radius:50%;background:var(--quadrant);margin-top:6px}
.quadrant h2 span{margin-left:auto}.matrix-scroll{max-height:calc((100dvh - 390px)/2);min-height:160px;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;padding:2px 4px 6px}
.overdue-column .matrix-scroll{max-height:calc(100dvh - 240px);min-height:240px}.matrix-empty{font-size:13px;color:var(--muted);padding:28px 6px;text-align:center}
.matrix-card{position:relative;border:1px solid var(--line);border-radius:14px;background:var(--surface2);padding:13px;margin-bottom:10px;min-width:0;overflow-wrap:anywhere}
.matrix-card h3{font-size:14px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap;font-weight:650}
.matrix-open{display:block}.matrix-card .card-kicker{display:block;color:var(--accent-text);font-size:11px;line-height:1.6;padding-right:25px;margin-bottom:6px}
.block-deadline{font:13px/1.5 'IBM Plex Sans',sans-serif;margin-top:12px}.block-deadline small{display:block;font-size:11px;color:var(--muted)}
.block-person{font-size:11px;margin-top:9px;color:var(--muted)}.reminder-card{background:var(--surface2);border-style:dashed}.reminder-card h3{color:var(--muted)}.reminder-card .block-deadline{color:var(--accent-text)}
.service-card{border-left:3px solid var(--danger)}.service-actions a{font-size:12px;min-height:40px;display:flex;align-items:center;padding:6px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface2)}
.card-menu{position:absolute;right:5px;top:4px}.card-menu summary{list-style:none;cursor:pointer;min-width:40px;min-height:40px;text-align:center;font-size:24px;border-radius:8px}.card-menu[open]{z-index:3;background:var(--surface2);border:1px solid var(--border);border-radius:10px}.card-menu div{display:grid;padding:4px;min-width:132px}.card-menu a{padding:9px;border-radius:7px;min-height:42px;font-size:13px}.card-menu a:hover{background:var(--surface2)}
.task-panel{min-width:0;background:var(--card);border:1px solid var(--border);border-radius:20px;padding:20px;max-height:calc(100dvh - 265px);overflow:auto;scrollbar-width:thin}.task-panel h2{font-size:19px}.task-panel .back-link{margin-bottom:18px}
.task-project{font-size:13px;overflow-wrap:anywhere;margin:14px 0;color:var(--accent-text)}.task-facts{display:grid;gap:12px;font-size:13px;margin:20px 0}.task-facts dt{color:var(--muted);font-size:11px}.task-facts dd{margin:3px 0 0;overflow-wrap:anywhere}.task-full{max-width:820px}
.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.tag-list span{background:var(--surface2);color:var(--accent-text);border-radius:9px;padding:4px 9px;font-size:12px;overflow-wrap:anywhere}
.checklist-read{list-style:none;padding:0}.checklist-read li{padding:8px 0;overflow-wrap:anywhere}.checklist-read .is-done{color:var(--muted);text-decoration:line-through}
.task-actions a{font-size:12px;min-height:42px}.legacy-tasks{margin-top:25px;font-size:13px;color:var(--muted)}.legacy-tasks a{display:block;padding:12px;border-bottom:1px solid var(--border)}.legacy-tasks summary{cursor:pointer;min-height:44px}
.matrix-mobile-choice{display:none}[data-work-form] textarea{font:inherit;color:var(--text);background:var(--surface2);resize:vertical;max-width:100%;min-height:90px;padding:12px;border-radius:10px;border:1px solid var(--border)}
[data-work-form] .form-field:has(textarea),[data-work-form] [data-field=checklist]{grid-column:1/-1}.checklist-editor-row{display:flex;gap:10px;align-items:center;margin:10px 0;min-width:0}.checklist-editor-row [data-item-text]{min-width:0;flex:1}.checklist-editor-row input[type=checkbox]{width:22px;min-width:22px;height:22px;accent-color:var(--green)}.checklist-editor-row .is-done,.checklist-editor-row.is-done [data-item-text]{color:var(--muted);text-decoration:line-through}.checklist-editor-row button{padding:8px;min-width:60px;font-size:12px}
[data-work-form] input[type=checkbox]{width:22px;height:22px;accent-color:var(--green)}
select:focus-visible,textarea:focus-visible{outline:3px solid var(--green);outline-offset:3px}
@media(max-width:1150px){.matrix-workspace{grid-template-columns:150px minmax(0,1fr)}.matrix-workspace.has-panel{grid-template-columns:1fr}.has-panel>.matrix-grid,.has-panel>.overdue-column{display:none}.task-panel{max-height:none}.matrix-card{padding:11px}.quadrant h2{font-size:11px}}
@media(max-width:680px){.matrix-controls{gap:12px}.period-buttons{gap:5px}.period-buttons button{padding:8px 10px;min-height:44px}.matrix-workspace{display:block}.matrix-grid{display:block}.quadrant,.overdue-column{margin-bottom:14px;border-radius:16px}.matrix-scroll,.overdue-column .matrix-scroll{max-height:65dvh;min-height:220px}.matrix-mobile-choice{display:block;margin:0 0 14px;font-size:12px;color:var(--muted)}.matrix-mobile-choice select{width:100%;margin-top:6px;min-height:44px}
.matrix-workspace[data-active-area] [data-area]{display:none}.matrix-workspace[data-active-area=red] [data-area=red],.matrix-workspace[data-active-area=orange] [data-area=orange],.matrix-workspace[data-active-area=green] [data-area=green],.matrix-workspace[data-active-area=gray] [data-area=gray],.matrix-workspace[data-active-area=overdue] [data-area=overdue]{display:block}.matrix-workspace.has-panel [data-area]{display:none}.matrix-card h3{font-size:15px}.quadrant h2{font-size:13px}.task-panel{padding:18px}.task-actions a{flex:1;min-width:120px;justify-content:center}.checklist-editor-row{flex-wrap:wrap}.checklist-editor-row button{margin-left:32px}.work-toolbar a{font-size:13px}}

/* The sections stay reachable while a long form scrolls. Only the menu is fixed;
   the logo, account and installation help remain in normal document flow. */
@media(max-width:760px){
 html{scroll-padding-top:calc(72px + env(safe-area-inset-top,0px))}
 .app-shell{padding-top:calc(58px + env(safe-area-inset-top,0px))}
 .sidebar{padding:12px 16px;gap:0 12px}
 .sidebar>.brand{font-size:20px}
 .navigation{position:fixed;z-index:20;top:0;left:0;right:0;margin:0;
   padding:calc(6px + env(safe-area-inset-top,0px)) 12px 6px;
   background:var(--sidebar,#171b2e);border-bottom:1px solid var(--border);
   flex-wrap:nowrap;justify-content:flex-start;min-width:0;overflow-x:auto;
   overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
 .navigation a{flex:1 0 auto;white-space:nowrap;min-height:44px;font-size:12px}
 .navigation a:focus-visible{outline-offset:-3px}
 .main{padding-top:22px;padding-bottom:calc(45px + env(safe-area-inset-bottom,0px))}
 input,textarea,select,[data-save]{scroll-margin-block:12px}
}

/* R1: both save buttons submit the same form and preserve its request key. */
.save-toolbar{position:sticky;top:0;z-index:10;display:flex;gap:12px;padding:10px;background:var(--sidebar,#171b2e);border-bottom:1px solid var(--border);margin-bottom:16px}.save-toolbar button{min-height:44px}.write-status,[aria-invalid=true]{scroll-margin-top:150px}.task-actions{display:flex;flex-wrap:wrap;gap:10px}.task-actions a{min-height:44px}
.refresh-app{position:relative;min-height:44px}.update-dot{display:none;width:9px;height:9px;background:var(--accent);border-radius:50%;margin-left:6px}.has-update .update-dot{display:inline-block}[data-mobile-footer]:empty{display:none}
@media(max-width:760px){.save-toolbar{top:calc(58px + env(safe-area-inset-top,0px));z-index:15}.sidebar-bottom{grid-column:1/-1;grid-row:auto}.refresh-app{grid-column:2;grid-row:1;padding:8px;font-size:12px}.sidebar [data-refresh-note]{grid-column:1/-1}.sidebar .navigation{grid-row:2}[data-mobile-footer]{padding:20px 20px calc(24px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border)}[data-mobile-footer] .logout{font-size:14px;padding:12px 20px}.form-field{scroll-margin-top:150px}}

/* Keep selected text readable in WebKit native-select themes. */
select.write-input{appearance:none;-webkit-appearance:none;color:var(--fg);background-color:var(--surface2);padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%;background-size:5px 5px;background-repeat:no-repeat}select.write-input option{color:var(--fg);background:var(--surface2)}

/* R3: shared compact controls, stable native date/time footprint. */
.brand-x{color:var(--accent-text)}.brand-credit{display:block;font-size:11px;color:var(--muted,#a5abc0);margin:4px 0 14px}
.refresh-app{min-width:44px;min-height:44px;font-size:23px}.refresh-app .update-dot{margin-left:4px}
.choice-picker{display:grid;gap:8px;min-width:0}.choice-picker input,.choice-picker select{max-width:100%;min-width:0;width:100%}
.deadline-control input{min-height:48px;height:48px}.deadline-control input::-webkit-date-and-time-value{min-height:1.5em;text-align:left}
.compact-task-actions{display:flex;gap:12px;align-items:center;margin-top:14px}.icon-button{min-width:44px;min-height:44px;font-size:22px;padding:8px 12px}.complete-task{margin-left:auto}
.card-menu a.danger{color:var(--danger)}.task-panel,.detail-card{position:relative}.card-menu{z-index:5}
.card-checklist{list-style:none;padding:0;margin:14px 0;display:grid;gap:10px}.card-checklist label{display:flex;gap:8px;align-items:center;overflow-wrap:anywhere}
.card-checklist label:before{content:'●';color:var(--accent-text);font-weight:900}.card-checklist input{width:22px;height:22px;flex:0 0 22px;accent-color:var(--accent)}
.card-checklist .is-done span{text-decoration:line-through;color:var(--muted)}
.form-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
@media(max-width:760px){.brand-credit{position:absolute;top:50px;left:18px;margin:0}.sidebar .brand{margin-bottom:14px}.task-panel .card-menu{right:12px;top:44px}}
.inline-checks{min-width:0;overflow-wrap:anywhere}.inline-checks select{display:block;width:100%;min-width:0;max-width:100%;min-height:44px;padding:10px;border:1px solid var(--border);border-radius:10px;font:inherit}

/* UI follow-up: icon artwork without a background, accessible focus retained. */
.icon-button,.card-menu summary,.refresh-app{background:transparent;border:1px solid transparent;border-radius:0;box-shadow:none;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:8px}
.icon-button:hover,.refresh-app:hover{background:transparent}.icon-button:focus-visible,.card-menu summary:focus-visible,.refresh-app:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.complete-task{color:var(--accent-text)}.refresh-app{align-self:flex-end;margin-left:auto}.update-dot{position:absolute;right:2px;top:4px}
@media(max-width:760px){.app-shell{padding-top:0}.sidebar .navigation{top:auto;bottom:0;border-top:1px solid var(--border);border-bottom:0;padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;gap:4px}.navigation a{flex:1 0 22%;justify-content:center;padding:8px 2px}.navigation a>span{display:none}.main{padding-bottom:calc(20px + var(--bottom-nav-height,80px))}.save-toolbar{top:0}.app-shell{padding-bottom:var(--bottom-nav-height,80px)}html{scroll-padding-bottom:calc(16px + var(--bottom-nav-height,80px))}.keyboard-open .sidebar .navigation{display:none}.refresh-app{justify-self:end}}

@media(max-width:760px){.sidebar .navigation{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.navigation a{min-width:0;order:1}.navigation a[href="/"],.navigation a[href*="department="],.navigation a[href="/analytics/"]{order:2;grid-column:span 2}}

button.save-icon,button.save-icon:hover{color:var(--accent-text);background:transparent;border:1px solid transparent;border-radius:0;box-shadow:none;min-width:44px;min-height:44px;padding:10px;display:inline-flex;align-items:center;justify-content:center}.save-icon:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.save-icon:disabled{opacity:.45;cursor:wait}form[aria-busy="true"] .save-icon{opacity:.45}

.mobile-profile{display:none}
.account a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
@media(max-width:760px){.sidebar>.mobile-profile{display:flex;grid-column:1/-1;align-items:center;min-height:44px;overflow-wrap:anywhere}}

.invoice-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.invoice-heading h1{min-width:0;overflow-wrap:anywhere}.invoice-heading>.invoice-edit{flex:none;margin-top:4px;text-decoration:none}

/* Verified, memory-only attachment retrieval; no overlay over the editor. */
.attachment-retrieval{margin:1rem 0;overflow-wrap:anywhere}.attachment-retrieval button,.attachment-retrieval a{max-width:100%;white-space:normal;overflow-wrap:anywhere;min-height:44px}.attachment-actions{display:flex;flex-wrap:wrap;gap:.6rem}.attachment-retrieval [hidden]{display:none!important}
.attachment-retrieval a.secondary-button{display:inline-flex;align-items:center;box-sizing:border-box;padding:.65rem 1rem;border:1px solid var(--line);border-radius:.75rem;color:inherit;text-decoration:none}

.kanban-board{display:flex;gap:16px;overflow-x:auto;max-width:100%;padding:0 2px 20px;align-items:stretch}
.kanban-column{flex:0 0 300px;min-width:0;min-height:200px;padding:10px;border:1px solid var(--line);border-radius:16px;overflow-wrap:anywhere}
.kanban-column>h2{font-size:1.15rem}.kanban-column .card,.kanban-column .record-card{margin-bottom:14px;max-width:100%;padding:16px}
.kanban-confirm{width:min(520px,calc(100vw - 32px));box-sizing:border-box;max-height:85dvh;overflow:auto;background:var(--surface2);color:var(--fg);border:1px solid var(--line);border-radius:18px;padding:22px;overflow-wrap:anywhere}
.kanban-confirm::backdrop{background:rgba(0,0,0,.6)}.kanban-confirm .form-actions{display:flex;flex-wrap:wrap;gap:12px}.kanban-confirm button{max-width:100%;white-space:normal}
@media(max-width:400px){.kanban-column{flex-basis:260px}.kanban-confirm{padding:16px}}
.stage-control{display:none}
@media(max-width:700px){.stage-control{display:block;margin:14px 0}.stage-control label{font-size:14px;margin:0 0 8px}.stage-control-line{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:6px;align-items:center}.stage-control-line button,.stage-control-line select{min-width:0;width:100%;min-height:44px;box-sizing:border-box;margin:0;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--fg);font:inherit;padding:8px}.stage-control-line button{font-size:22px;padding:4px}.stage-control-line :focus-visible{outline:3px solid var(--accent);outline-offset:2px}.stage-control-line :disabled{opacity:.65;cursor:not-allowed}.stage-control-note{font-size:13px;line-height:1.5;margin:8px 0;color:var(--muted)}.record-card:has(>.stage-control) .desktop-transition{display:none}}

/* KANBAN-R3: original headings remain clipped to their own protected board. */
.kanban-board{isolation:isolate;display:grid;grid-auto-flow:column;grid-auto-columns:300px;grid-template-rows:max-content;overflow:auto;max-height:var(--kanban-height,70svh);scroll-padding:100px 12px 16px;scroll-margin-block:var(--kanban-top,16px) var(--kanban-bottom,16px)}
.kanban-column>h2{position:sticky;top:0;z-index:2;margin:0 -10px 12px;padding:12px 10px;min-height:76px;box-sizing:border-box;background:var(--surface2);border-bottom:1px solid var(--line);border-radius:0}
@media(max-width:400px){.kanban-board{grid-auto-columns:260px}}
.kanban-column :is(button,a,select,input,summary){scroll-margin-top:100px}

/* The order board precedes list tools; other record screens retain their layout. */
.main:has(>[data-kanban-board]){display:flex;flex-direction:column;min-width:0;padding-top:0}
.main>[data-kanban-board]{order:-1}
.main:has(>[data-kanban-board])>.page-heading>div{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.main:has(>[data-kanban-board])>.page-heading{margin:16px 0 0}
@media(max-width:760px){
 .app-shell:has(>.main>[data-kanban-board]){display:flex;flex-direction:column}
 .app-shell:has(>.main>[data-kanban-board])>.main{order:0;width:100%}
 .app-shell:has(>.main>[data-kanban-board])>.sidebar{order:1}
 .app-shell:has(>.main>[data-kanban-board])>.sidebar>.brand,
 .app-shell:has(>.main>[data-kanban-board])>.sidebar>.brand-credit{display:none}
 .app-shell:has(>.main>[data-kanban-board])>[data-mobile-footer]{order:2}
}

/* Actionable notices occupy space above the board, never overlay its controls. */
.main:has(>[data-kanban-board]) [data-board-notices]{order:-2;display:none;max-height:40svh;overflow:auto;overflow-wrap:anywhere;background:var(--surface2);border:1px solid var(--line);border-radius:10px;margin:0 0 8px;padding:8px 12px;font-size:13px}
.main:has(>[data-kanban-board]) [data-board-notices]:has(>:not(:empty):not([hidden]):not([data-quiet="true"]):not(.notice)){display:block}
.main:has(>[data-kanban-board]) [data-board-notices]>p{margin:4px 0}
.main:has(>[data-kanban-board]) [data-board-notices]>:empty,.main:has(>[data-kanban-board]) [data-board-notices]>[data-quiet="true"]{display:none}

/* Контрагент и проект плашкой (TASKS 6.1а, static/pickers.js): поле поиска, под ним варианты, выбранный — плашка с крестиком. */
.pp{display:flex;flex-direction:column;gap:6px;min-width:0}
.pp-native{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.pp-chosen,.pp-search{min-width:0}
.pp-pill{display:inline-flex;align-items:center;gap:2px;max-width:100%;min-height:48px;padding:0 2px 0 16px;box-sizing:border-box;border-radius:999px;border:1.5px solid var(--accent);background:var(--accent-soft);color:var(--accent-text);font-weight:600}
.pp-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-x{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation}
.pp-x:hover{background:var(--surface2)}
.pp-x:focus-visible,.pp-input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pp .pp-input.write-input:not([type=checkbox]){width:100%;box-sizing:border-box;min-height:48px;font-size:16px}
.pp-list{list-style:none;margin:6px 0 0;padding:4px;max-height:min(240px,40svh);overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:16px;background:var(--surface2)}
.pp-opt{display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:12px;color:var(--fg);cursor:pointer;overflow-wrap:anywhere;touch-action:manipulation}
.pp-opt:hover,.pp-opt[aria-selected=true]{background:var(--accent-soft);color:var(--accent-text)}
.pp-note{margin:0;font-size:13px;color:var(--muted)}
.pp-note:empty{display:none}