:root {
  --green: #155b47;
  --green-dark: #124c3d;
  --mint: #eaf3ed;
  --ink: #17252b;
  --muted: #718078;
  --line: #e7ebe6;
  --paper: #fff;
  --canvas: #f7f8f5;
  --amber: #b97016;
  --red: #c94639;
}
.phase-stepper {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 0;
  margin: 9px 0 18px;
  overflow-x: auto;
}
.phase-step {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 7px;
  min-width: 75px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: #59665e;
  cursor: pointer;
}
.phase-step:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 17px;
  left: calc(50% + 21px);
  right: calc(-50% + 22px);
  height: 3px;
  background: #e3e5e1;
}
.phase-step.complete:not(:last-child)::after {
  background: #39845b;
}
.phase-step > span {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #e4e5e1;
  color: #404a43;
  font-size: 0.8rem;
  font-weight: 700;
}
.phase-step.active > span {
  outline: 4px solid #deebe0;
  background: var(--green);
  color: #fff;
}
.phase-step.complete > span {
  background: #39845b;
  color: #fff;
}
.phase-step b {
  font-size: 0.69rem;
  font-weight: 550;
  white-space: nowrap;
}
.phase-step.active b {
  color: var(--green);
  font-weight: 750;
}
.dashboard-main {
  grid-template-columns: minmax(0, 1.7fr) minmax(285px, 0.86fr);
  align-items: start;
}
.dashboard-column {
  display: grid;
  gap: 13px;
  align-content: start;
}
.dashboard-main .panel-title {
  margin-bottom: 6px;
  color: #1d3127;
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 0;
  background: transparent;
  color: var(--green);
  font: inherit;
  font-size: 0.77rem;
  font-weight: 650;
  white-space: nowrap;
  cursor: pointer;
}
.text-link svg {
  width: 15px;
  height: 15px;
}
.upcoming-list {
  display: grid;
}
.upcoming-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) minmax(110px, 0.6fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 2px;
  border: 0;
  border-top: 1px solid #edf0ec;
  background: #fff;
  text-align: left;
  color: #425247;
  cursor: pointer;
}
.upcoming-row:first-child {
  border-top: 0;
}
.upcoming-row b {
  font-size: 0.77rem;
}
.upcoming-row > span:not(.upcoming-date) {
  font-size: 0.69rem;
  color: #818a82;
}
.upcoming-date {
  font-size: 0.75rem;
  font-weight: 650;
  color: #344d3d;
}
.small-copy {
  font-size: 0.75rem;
  line-height: 1.5;
}
.phase-preview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 9px;
}
.phase-preview .panel-title {
  grid-column: 1/-1;
}
.mini-phase {
  display: grid;
  grid-template-columns: 23px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 8px 3px;
  border: 0;
  border-top: 1px solid #edf0ec;
  background: transparent;
  text-align: left;
  color: #56645b;
  cursor: pointer;
}
.mini-phase > span {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #edf1ec;
  color: #55665a;
  font-size: 0.65rem;
}
.mini-phase.active > span {
  background: #e0ece1;
  color: var(--green);
}
.mini-phase b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.66rem;
  font-weight: 550;
}
.mini-phase small {
  font-size: 0.62rem;
  color: #858e86;
}
.illustration-card {
  margin: 0;
}
.compact-empty {
  margin: 14px auto;
  padding: 10px;
}
.empty-state.compact-empty > span {
  width: 34px;
  height: 34px;
}
.empty-state.compact-empty h2 {
  font-size: 0.89rem;
}
.priority-row .badge {
  max-width: 120px;
  font-size: 0.64rem;
}
.doc-row-sub {
  display: block;
  margin-top: 5px;
  color: #849087;
  font-size: 0.7rem;
}
.file-preview {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 7px 0 14px;
  padding: 10px;
  border: 1px solid #e7ece6;
  border-radius: 7px;
  background: #f7f9f6;
  color: #48604f;
}
.file-preview > svg {
  width: 21px;
  height: 21px;
  flex: none;
}
.file-preview > span {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.73rem;
}
.file-preview > span small {
  display: block;
  margin-top: 3px;
  color: #869087;
  font-size: 0.67rem;
}
.file-preview .icon-button {
  width: 29px;
  height: 29px;
}
.file-preview .icon-button svg {
  width: 16px;
  height: 16px;
}
.file-empty {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 7px 0 14px;
  padding: 13px;
  border: 1px dashed #dce4dc;
  border-radius: 7px;
  color: #7e8980;
  font-size: 0.75rem;
}
.file-empty svg {
  width: 19px;
  height: 19px;
}
.doc-note {
  margin: 14px 0;
  padding: 10px;
  border-left: 3px solid #dce7dc;
  background: #f7f9f6;
  color: #647269;
  font-size: 0.75rem;
  line-height: 1.5;
}
.search-empty {
  padding: 13px;
  color: #879087;
  font-size: 0.77rem;
}
body {
  background: var(--canvas);
  color: var(--ink);
}
.app-shell {
  grid-template-columns: 232px minmax(0, 1fr);
  min-height: 100vh;
}
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  background: #fff;
  color: #24362f;
  border-right: 1px solid var(--line);
  padding: 23px 14px 14px;
  gap: 20px;
  z-index: 6;
}
.brand {
  gap: 10px;
  padding: 1px 11px 18px;
  border-bottom: 1px solid var(--line);
  color: #142722;
}
.brand-mark {
  width: 37px;
  height: 40px;
  border: 0;
  border-radius: 0;
  color: var(--green);
  display: grid;
  place-items: center;
}
.brand-mark svg {
  width: 36px;
  height: 40px;
}
.brand b {
  font-size: 1.16rem;
  letter-spacing: -0.04em;
}
.nav {
  display: grid;
  gap: 4px;
  align-content: start;
}
.nav-item {
  min-height: 45px;
  padding: 10px 12px;
  gap: 12px;
  border-radius: 8px;
  color: #34443e;
  font-size: 0.91rem;
  font-weight: 530;
  transition:
    background 0.15s,
    color 0.15s;
}
.nav-item > span {
  width: 19px;
  height: 20px;
  display: grid;
  place-items: center;
  color: #364841;
  font-size: 1rem;
}
.nav-item > span svg,
.topbar svg,
.icon-button svg {
  width: 19px;
  height: 19px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-item:hover,
.nav-item:focus-visible {
  background: #f0f5f0;
  color: var(--green-dark);
}
.nav-item.active {
  background: #e8f1e9;
  color: var(--green-dark);
  box-shadow: inset 3px 0 var(--green);
  font-weight: 700;
}
.nav-item.active > span {
  color: var(--green);
}
.nav-divider {
  height: 1px;
  background: var(--line);
  margin: 10px 6px 1px;
}
.sidebar-label {
  display: block;
  margin: 1px 11px 2px;
  color: #919991;
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.12em;
}
.nav-item.secondary {
  min-height: 38px;
  font-size: 0.83rem;
  color: #65736c;
}
.nav-item.secondary > span {
  color: #78877f;
  width: 18px;
}
.sidebar-note {
  margin-top: auto;
  border-top: 1px solid var(--line);
  padding: 14px 8px 4px;
  gap: 10px;
  color: #273830;
}
.sidebar-note small {
  color: #859087;
}
.avatar {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--green);
  color: white;
  font-size: 0.88rem;
  font-weight: 700;
}
.local-dot {
  margin-left: auto;
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
}
.main {
  min-width: 0;
  background: var(--canvas);
}
.topbar {
  height: 66px;
  position: sticky;
  top: 0;
  z-index: 4;
  padding: 0 30px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  color: #58665e;
  font-size: 0.84rem;
}
.top-project,
.project-picker,
.top-actions {
  display: flex;
  align-items: center;
}
.top-project {
  gap: 13px;
  min-width: 0;
}
.project-picker {
  height: 40px;
  gap: 10px;
  padding: 0 9px;
  border: 1px solid #dce4dd;
  border-radius: 8px;
  background: #fff;
  color: var(--green);
  box-shadow: 0 1px 2px #142b1808;
}
.project-picker > svg {
  width: 20px;
  height: 20px;
  flex: none;
}
.project-picker select {
  max-width: min(290px, 28vw);
  width: auto;
  min-width: 140px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #23352d;
  font: inherit;
  font-weight: 650;
  text-overflow: ellipsis;
}
.workspace-badge {
  flex: none;
  border-radius: 999px;
  padding: 7px 11px;
  background: #fff3dd;
  color: #93611d;
  font-size: 0.75rem;
  white-space: nowrap;
}
.top-actions {
  gap: 15px;
}
.global-search {
  position: relative;
  width: min(310px, 29vw);
  height: 39px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 1px solid #dfe5e0;
  border-radius: 8px;
  background: #fff;
  color: #78867f;
}
.global-search > svg {
  flex: none;
  width: 18px;
}
.global-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #263832;
  font: inherit;
  font-size: 0.82rem;
}
.global-search input::placeholder {
  color: #929a94;
}
.icon-button {
  position: relative;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #44574e;
  cursor: pointer;
}
.icon-button:hover,
.icon-button:focus-visible {
  background: #f0f5f1;
  color: var(--green);
}
.notification-button #notification-dot {
  position: absolute;
  right: 7px;
  top: 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #cf4d3e;
  border: 1.5px solid white;
}
.menu-toggle {
  display: none;
}
.search-results {
  position: absolute;
  z-index: 12;
  top: calc(100% + 7px);
  left: 0;
  right: 0;
  padding: 6px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 12px 30px #18332618;
}
.search-results button {
  width: 100%;
  display: block;
  padding: 9px;
  text-align: left;
  border: 0;
  border-radius: 7px;
  background: #fff;
  color: #293c33;
  cursor: pointer;
}
.search-results button:hover,
.search-results button:focus-visible {
  background: #eef4ee;
}
.search-results small {
  display: block;
  margin-top: 3px;
  color: #78857d;
}
.view {
  max-width: 1580px;
  padding: 27px 29px 56px;
}
.page-heading {
  align-items: center;
  margin-bottom: 20px;
}
.page-heading h1 {
  color: #182823;
  font-size: clamp(1.7rem, 2.5vw, 2.2rem);
  letter-spacing: -0.04em;
}
.page-heading p {
  color: #737f77;
}
.eyebrow {
  color: #226c53;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}
.btn {
  border-radius: 8px;
  color: #374b40;
  font-size: 0.83rem;
  font-weight: 600;
  transition:
    background 0.14s,
    color 0.14s,
    border-color 0.14s;
}
.btn.primary {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}
.btn.primary:hover,
.btn.primary:focus-visible {
  background: var(--green-dark);
  border-color: var(--green-dark);
}
.panel,
.stat-card,
.project-card {
  border-color: var(--line);
  border-radius: 10px;
  box-shadow: 0 2px 8px #16352606;
}
.panel {
  padding: 17px;
}
.stat-card {
  padding: 15px 17px;
}
.stat-card .value {
  color: #173e30;
}
.stat-card .label,
.muted {
  color: #79837d;
}
.dashboard-grid {
  grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.86fr);
}
.work-row {
  border-radius: 7px;
  border-color: #edf0ec;
}
.work-row button.row-title b {
  color: #22362c;
}
.sequence-summary {
  background: #f0f5ef;
  border-color: #e0eae0;
  border-radius: 10px;
}
.sequence-summary h2 {
  color: #1c3327;
}
.sequence-group,
.branch-card {
  border-color: #e7ece7;
  border-radius: 9px;
}
.sequence-group.current {
  border-color: #43816a;
  box-shadow: 0 0 0 2px #42806612;
}
.sequence-number,
.stage-num {
  background: #e9f2eb;
  color: var(--green);
}
.sequence-task {
  color: #34473d;
}
.sequence-task:hover,
.sequence-task:focus-visible {
  background: #f5f8f4;
}
.group-rule {
  color: #8a641f;
}
.badge.green {
  color: #286247;
  background: #e9f5ec;
  border-color: #d9e9db;
}
.badge.gold {
  color: #956116;
  background: #fff5df;
  border-color: #f0e1bd;
}
.badge.red {
  color: #ae4238;
  background: #fff0ed;
  border-color: #f1d4ce;
}
.table-wrap,
.timeline-box {
  border-color: var(--line);
  border-radius: 9px;
}
.table th {
  background: #f6f8f5;
  color: #758078;
}
.table td {
  color: #394b40;
}
.table .link {
  color: var(--green);
}
.field-grid {
  gap: 14px;
}
.field textarea,
.field input,
.field select,
.toolbar select {
  border-color: #dce4dc;
  border-radius: 7px;
}
.dialog {
  border-radius: 12px;
}
.dialog-head,
.dialog-foot {
  border-color: #e9ede8;
}
.timeline-box {
  overflow-x: auto;
}
.empty {
  background: #fff;
  border-color: #e0e7e0;
  border-radius: 9px;
}
.phase-ribbon {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 8px;
  margin: 17px 0 18px;
}
.phase-tab {
  min-width: 0;
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  text-align: left;
  border: 1px solid #e2e8e2;
  border-radius: 8px;
  background: #fff;
  color: #536158;
  cursor: pointer;
}
.phase-tab > span:first-child {
  font-size: 0.68rem;
  font-weight: 750;
  color: #879087;
}
.phase-tab b {
  font-size: 0.73rem;
  font-weight: 550;
  line-height: 1.3;
}
.phase-tab:hover {
  border-color: #a8c6b2;
}
.phase-tab.active {
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}
.phase-tab.active > span:first-child {
  color: #c4ded0;
}
.phase-tab.complete:not(.active) > span:first-child {
  color: #39845b;
}
.phase-tab-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.flow-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 315px;
  min-height: 510px;
  overflow: hidden;
  border: 1px solid #e1e8e1;
  border-radius: 10px;
  background: #fff;
}
.flow-main {
  min-width: 0;
  padding: 16px 17px;
  background-color: #fff;
  background-image: radial-gradient(#dce5dc 0.7px, transparent 0.7px);
  background-size: 19px 19px;
}
.flow-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.flow-toolbar h2 {
  margin: 1px 0 5px;
  font-size: 1rem;
}
.flow-toolbar p {
  margin: 0;
  color: #778279;
  font-size: 0.76rem;
}
.group-pager {
  display: flex;
  align-items: center;
  gap: 5px;
  max-width: 55%;
  overflow-x: auto;
  padding: 1px 1px 8px;
  scrollbar-width: thin;
}
.group-chip {
  flex: none;
  min-width: 32px;
  height: 31px;
  padding: 0 8px;
  border: 1px solid #e0e6df;
  border-radius: 7px;
  background: white;
  color: #647168;
  font: inherit;
  font-size: 0.72rem;
  cursor: pointer;
}
.group-chip:hover {
  border-color: #a5c4ae;
}
.group-chip.active {
  border-color: var(--green);
  background: var(--green);
  color: white;
}
.group-chip.complete {
  border-color: #cfe3d2;
  background: #f0f7f0;
  color: #39704c;
}
.group-chip.locked {
  color: #929b94;
}
.flow-group-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 0 14px;
}
.flow-group-title h3 {
  margin: 0;
  font-size: 0.95rem;
}
.flow-group-title p {
  margin: 4px 0 0;
  color: #78837c;
  font-size: 0.75rem;
}
.flow-group-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 10px;
  align-items: start;
}
.flow-lane {
  min-width: 0;
  padding: 10px;
  border: 1px solid #e4eae3;
  border-radius: 8px;
  background: #fff;
}
.flow-lane > header {
  display: flex;
  justify-content: space-between;
  gap: 7px;
  align-items: center;
  margin-bottom: 5px;
  color: #2d4638;
  font-size: 0.75rem;
  font-weight: 700;
}
.flow-lane > header small {
  color: #859087;
  font-weight: 500;
}
.flow-node {
  width: 100%;
  display: block;
  margin-top: 7px;
  padding: 10px;
  text-align: left;
  border: 1px solid #e3e9e2;
  border-radius: 7px;
  background: #fff;
  color: #273a30;
  cursor: pointer;
}
.flow-node:hover {
  border-color: #94b39d;
}
.flow-node.selected {
  border: 1.5px solid #438267;
  box-shadow: 0 0 0 2px #43826714;
}
.flow-node.complete {
  background: #f2f8f1;
  border-color: #cbdcca;
}
.flow-node.locked {
  background: #f7f8f6;
  color: #66736a;
}
.flow-node strong {
  display: block;
  font-size: 0.75rem;
  line-height: 1.45;
  font-weight: 650;
}
.flow-node small {
  display: block;
  margin-top: 5px;
  color: #78847c;
  font-size: 0.67rem;
  line-height: 1.35;
}
.node-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 7px;
  border-radius: 999px;
  background: #f0f3ef;
  padding: 3px 7px;
  color: #657269;
  font-size: 0.65rem;
}
.node-status.done {
  background: #e8f4e9;
  color: #317149;
}
.node-status.open {
  background: #fff3de;
  color: #90611d;
}
.node-status.blocked {
  background: #f1f2ef;
  color: #727b74;
}
.flow-detail {
  padding: 21px 18px;
  border-left: 1px solid #e7ece6;
  background: #fff;
}
.flow-detail-icon {
  width: 41px;
  height: 41px;
  display: grid;
  place-items: center;
  margin-bottom: 15px;
  border-radius: 8px;
  background: #eff4ef;
  color: var(--green);
}
.flow-detail h3 {
  margin: 8px 0;
  font-size: 1.03rem;
  line-height: 1.4;
}
.flow-detail p {
  color: #68766d;
  font-size: 0.79rem;
  line-height: 1.5;
}
.flow-detail .detail-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 8px;
  padding: 11px 0;
  border-bottom: 1px solid #edf0ec;
  font-size: 0.75rem;
}
.flow-detail .detail-row span:first-child {
  color: #829087;
}
.flow-detail .detail-row b {
  font-weight: 600;
  color: #34463a;
}
.flow-legend {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 13px;
  color: #758078;
  font-size: 0.71rem;
}
.flow-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #858d87;
}
.legend-dot.green {
  background: #388653;
}
.legend-dot.amber {
  background: #d39330;
}
.flow-message {
  margin: 14px 0 0;
  padding: 10px;
  border-radius: 7px;
  background: #fff6e7;
  color: #855d1e;
  font-size: 0.75rem;
  line-height: 1.45;
}
.dashboard-progress {
  height: 6px;
  margin: 8px 0;
  background: #e9ede7;
  border-radius: 99px;
  overflow: hidden;
}
.dashboard-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #39845b;
}
.priority-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 11px 0;
  border-top: 1px solid #edf0ec;
}
.priority-row:first-child {
  border-top: 0;
}
.priority-row > button {
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  color: inherit;
  cursor: pointer;
}
.priority-row b {
  display: block;
  font-size: 0.81rem;
  line-height: 1.4;
}
.priority-row small {
  display: block;
  margin-top: 4px;
  color: #7a857d;
  font-size: 0.71rem;
}
.next-step {
  border: 1px solid #e0e8e0;
  border-radius: 9px;
  padding: 15px;
  background: #fff;
}
.next-step h3 {
  margin: 5px 0 8px;
  font-size: 0.94rem;
  line-height: 1.4;
}
.next-step p {
  color: #78837b;
  font-size: 0.75rem;
  line-height: 1.48;
}
.next-step .btn {
  width: 100%;
  margin-top: 7px;
}
.illustration-card {
  overflow: hidden;
  padding: 0;
}
.illustration-card img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 215px;
  object-fit: contain;
  object-position: center bottom;
  padding: 9px 14px 0;
}
.illustration-caption {
  padding: 0 16px 15px;
  color: #68756d;
  font-size: 0.73rem;
}
.illustration-caption b {
  display: block;
  color: #384a3f;
  margin-bottom: 4px;
  font-size: 0.79rem;
}
.overview-lower {
  margin-top: 14px;
}
.project-card h2 {
  color: #20362a;
}
.project-overview-link {
  color: var(--green);
}
.doc-tabs {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  margin: -4px 0 15px;
  border-bottom: 1px solid #e6ebe5;
}
.doc-tab {
  display: flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  padding: 10px 13px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #647168;
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
}
.doc-tab.active {
  border-color: var(--green);
  color: var(--green);
  font-weight: 700;
}
.doc-tab-count {
  min-width: 20px;
  padding: 3px 6px;
  border-radius: 99px;
  background: #f0f2ee;
  color: #6f7971;
  font-size: 0.67rem;
  text-align: center;
}
.doc-tab-count.warn {
  background: #fff2dd;
  color: #97621d;
}
.doc-tab-count.red {
  background: #fff0ed;
  color: #ad4137;
}
.documents-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 318px;
  gap: 14px;
  align-items: start;
}
.document-table .table {
  min-width: 580px;
}
.document-table .table td {
  padding: 13px 12px;
}
.doc-selected td {
  background: #f2f7f1 !important;
}
.doc-preview {
  position: sticky;
  top: 82px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}
.doc-preview h2 {
  margin: 2px 0 9px;
  font-size: 1.04rem;
}
.doc-preview .preview-version {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 5px 8px;
  border-radius: 99px;
  background: #fff2df;
  color: #9a641a;
  font-size: 0.69rem;
  font-weight: 650;
}
.doc-status-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 0;
  border-bottom: 1px solid #edf0ec;
  color: #647269;
  font-size: 0.75rem;
}
.doc-preview .btn {
  width: 100%;
  margin-top: 12px;
}
.doc-history {
  margin: 16px 0;
}
.doc-history h3 {
  font-size: 0.83rem;
}
.doc-history-item {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  color: #647269;
  font-size: 0.72rem;
}
.doc-notice {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 13px 15px;
  border: 1px solid #f0e4ca;
  border-radius: 8px;
  background: #fff8ed;
  color: #78551d;
  font-size: 0.8rem;
}
.empty-state {
  display: grid;
  justify-items: center;
  gap: 8px;
  max-width: 460px;
  margin: 54px auto;
  padding: 22px;
  text-align: center;
}
.empty-state > span {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #edf4ed;
  color: var(--green);
}
.empty-state h2 {
  margin: 5px 0 0;
  font-size: 1rem;
}
.empty-state p {
  margin: 0 0 6px;
  color: #7c877f;
  font-size: 0.79rem;
  line-height: 1.55;
}
.menu-backdrop {
  display: none;
}
@media (max-width: 1200px) {
  .phase-ribbon {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .flow-workspace {
    grid-template-columns: minmax(0, 1fr) 285px;
  }
  .dashboard-grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(285px, 0.9fr);
  }
}
@media (max-width: 900px) {
  .app-shell {
    grid-template-columns: 206px minmax(0, 1fr);
  }
  .sidebar {
    padding-inline: 10px;
  }
  .view {
    padding: 23px 19px 45px;
  }
  .topbar {
    padding-inline: 18px;
  }
  .workspace-badge {
    display: none;
  }
  .phase-ribbon {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .flow-workspace {
    grid-template-columns: 1fr;
  }
  .flow-detail {
    border-left: 0;
    border-top: 1px solid #e7ece6;
  }
  .documents-layout {
    grid-template-columns: 1fr;
  }
  .doc-preview {
    position: static;
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .illustration-card img {
    max-height: 185px;
  }
}
@media (max-width: 680px) {
  .app-shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(290px, 84vw);
    height: 100dvh;
    transform: translateX(-102%);
    transition: transform 0.2s ease;
    box-shadow: 14px 0 36px #1732251a;
  }
  .sidebar.open {
    transform: translateX(0);
  }
  .menu-backdrop:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 5;
    border: 0;
    background: #10241b66;
  }
  .menu-toggle {
    display: grid;
  }
  .topbar {
    height: 60px;
    padding-inline: 11px;
    gap: 9px;
  }
  .top-project {
    gap: 6px;
    flex: 1;
  }
  .project-picker {
    height: 37px;
    min-width: 0;
    flex: 1;
    padding-inline: 7px;
    gap: 5px;
  }
  .project-picker select {
    max-width: calc(100vw - 190px);
    min-width: 0;
    font-size: 0.76rem;
  }
  .project-picker > svg {
    width: 17px;
  }
  .top-actions {
    gap: 2px;
  }
  .global-search {
    width: 38px;
    height: 37px;
    padding: 0;
    justify-content: center;
    border: 0;
    background: transparent;
    transition:
      width 0.2s,
      padding 0.2s;
  }
  .global-search:focus-within {
    position: absolute;
    left: 59px;
    right: 87px;
    width: auto;
    z-index: 8;
    padding: 0 10px;
    border: 1px solid #dce4dc;
    background: white;
  }
  .global-search input {
    width: 0;
    opacity: 0;
  }
  .global-search:focus-within input {
    width: 100%;
    opacity: 1;
  }
  .global-search > svg {
    flex: none;
  }
  .search-results {
    min-width: 260px;
    left: auto;
    right: 0;
  }
  .top-actions > .icon-button {
    width: 34px;
    height: 36px;
  }
  .view {
    padding: 20px 14px 42px;
  }
  .page-heading {
    gap: 12px;
    margin-bottom: 16px;
  }
  .page-heading h1 {
    font-size: 1.68rem;
  }
  .page-heading p {
    font-size: 0.84rem;
  }
  .page-heading .heading-actions {
    width: 100%;
  }
  .heading-actions .btn {
    flex: 1;
  }
  .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .stat-card {
    padding: 12px;
  }
  .stat-card .value {
    font-size: 1.42rem;
  }
  .panel {
    padding: 14px;
  }
  .phase-ribbon {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  .phase-tab {
    min-height: 52px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 4px;
    padding: 6px;
  }
  .phase-tab b {
    font-size: 0.65rem;
  }
  .flow-workspace {
    min-height: 0;
  }
  .flow-main {
    padding: 12px 10px;
  }
  .flow-toolbar {
    display: block;
  }
  .group-pager {
    max-width: 100%;
    margin-top: 12px;
  }
  .flow-group-columns {
    grid-template-columns: 1fr;
  }
  .flow-lane {
    padding: 8px;
  }
  .flow-detail {
    padding: 16px;
  }
  .sequence-summary {
    padding: 14px;
  }
  .toolbar {
    align-items: stretch;
  }
  .toolbar > .search {
    min-width: 100%;
  }
  .toolbar > select {
    flex: 1;
    min-width: 0;
  }
  .table-wrap {
    border-radius: 8px;
  }
  .calendar-item {
    grid-template-columns: 82px 1fr;
  }
  .field-grid,
  .doc-cards {
    grid-template-columns: 1fr;
  }
  .field.wide {
    grid-column: auto;
  }
  .doc-notice {
    align-items: flex-start;
    flex-direction: column;
  }
  .doc-notice .btn {
    width: 100%;
  }
  .toast {
    left: 12px;
    right: 12px;
    bottom: 12px;
    text-align: center;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

.toolbar > .search > svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
}
.doc-tabs {
  scrollbar-width: none;
}
.doc-tabs::-webkit-scrollbar {
  display: none;
}
.phase-stepper {
  scrollbar-width: none;
}
.phase-stepper::-webkit-scrollbar {
  display: none;
}

.stat-card {
  display: flex;
  align-items: center;
  gap: 12px;
}
.stat-icon {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #e9f2e9;
  color: var(--green);
}
.stat-icon.neutral {
  background: #eff1ef;
  color: #58665d;
}
.stat-icon.amber {
  background: #fff2dd;
  color: #9b6c21;
}
.stat-icon.danger {
  background: #fff0ed;
  color: #ac4b40;
}
.stat-icon svg {
  width: 19px;
  height: 19px;
  display: block;
}

.phase-stepper-six {
  grid-template-columns: repeat(6, minmax(105px, 1fr));
}
@media (max-width: 900px) {
  .phase-stepper-six {
    grid-template-columns: repeat(3, minmax(95px, 1fr));
  }
}
@media (max-width: 560px) {
  .phase-stepper-six {
    grid-template-columns: repeat(2, minmax(95px, 1fr));
  }
}

.new-owner-fields[hidden] {
  display: none !important;
}
.document-task-links {
  min-width: 0;
}
.automatic-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-height: 34px;
  padding: 10px;
  border: 1px solid #e1e9e7;
  border-radius: 9px;
  background: #f8fbf9;
}
.automatic-task,
.selected-task-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #d9e7df;
  border-radius: 999px;
  padding: 5px 9px;
  background: #fff;
  color: #34584b;
  font-size: 0.77rem;
  line-height: 1.35;
}
.selected-task-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.selected-task-chip button {
  border: 0;
  border-radius: 50%;
  background: #f0f3f1;
  color: #49655b;
  cursor: pointer;
  width: 19px;
  height: 19px;
  line-height: 1;
  padding: 0;
  font-size: 1rem;
}
.new-owner-row {
  display: grid;
  grid-template-columns: minmax(140px, 0.7fr) minmax(0, 1.3fr);
  gap: 8px;
}
.extra-task-picker {
  border: 1px solid #dce6e3;
  border-radius: 9px;
  background: #fff;
}
.extra-task-picker summary {
  cursor: pointer;
  padding: 10px 12px;
  color: #315950;
  font-size: 0.82rem;
  font-weight: 650;
}
.extra-task-body {
  padding: 0 10px 10px;
}
.extra-task-body > input[type='search'] {
  width: 100%;
  height: 38px;
  margin: 0 0 9px;
  border: 1px solid #d6e0e3;
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
}
.extra-task-body fieldset {
  max-height: 180px;
  overflow: auto;
  margin: 0 0 8px;
  padding: 7px;
  border: 1px solid #edf0ee;
  border-radius: 8px;
}
.extra-task-body legend {
  padding: 0 5px;
  color: #4a6a5f;
  font-size: 0.76rem;
  font-weight: 700;
}
.document-task-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 5px;
  border-radius: 6px;
  color: #314b43;
  font-size: 0.78rem;
  line-height: 1.4;
}
.document-task-option:hover {
  background: #f3f8f5;
}
.document-task-option input {
  margin-top: 2px;
  accent-color: #16866e;
}
.document-task-option b {
  color: #177762;
}
.document-task-option[hidden],
[data-task-stage][hidden] {
  display: none !important;
}
@media (max-width: 560px) {
  .new-owner-row {
    grid-template-columns: 1fr;
  }
  .extra-task-body fieldset {
    max-height: 145px;
  }
  .selected-task-chips {
    gap: 5px;
  }
  .selected-task-chip {
    font-size: 0.7rem;
  }
}

.local-dot.server-saving {
  background: #d99431;
}
.local-dot.server-offline {
  background: #bf4d46;
}

.schedule-panel {
  padding: 18px;
}
.schedule-toolbar,
.schedule-start,
.month-heading,
.month-heading > div:last-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.schedule-toolbar h2,
.month-heading h2 {
  margin: 3px 0 5px;
  font-size: 1.12rem;
}
.schedule-toolbar p,
.schedule-hint {
  margin: 0;
  color: #718078;
  font-size: 0.76rem;
  line-height: 1.5;
}
.schedule-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 15px 0;
}
.schedule-summary > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid #e8ede8;
  border-radius: 8px;
  background: #fafcf9;
}
.schedule-summary small {
  color: #7b877f;
  font-size: 0.67rem;
}
.schedule-summary b {
  color: #20392c;
  font-size: 0.84rem;
}
.schedule-variance {
  color: #65756a;
  font-size: 0.7rem;
  font-style: normal;
}
.schedule-variance.early {
  color: #2a7952;
}
.schedule-variance.late {
  color: #ad5545;
}
.schedule-start {
  justify-content: flex-start;
  margin-bottom: 9px;
  padding: 9px 11px;
  border: 1px solid #e9eee8;
  border-radius: 8px;
  background: #fbfcfa;
}
.schedule-start .field {
  max-width: 245px;
}
.schedule-start input {
  height: 36px;
}
.schedule-hint {
  margin: 8px 0 13px;
}
.critical-tag {
  padding: 4px 7px;
  border-radius: 99px;
  background: #fff2dc;
  color: #996521;
  font-size: 0.63rem;
  font-style: normal;
  font-weight: 650;
}
.schedule-error {
  padding: 12px;
  border: 1px solid #efd1cb;
  border-radius: 8px;
  background: #fff3f0;
  color: #9c4035;
  font-size: 0.78rem;
}
.month-panel {
  margin-top: 14px;
}
.month-heading {
  margin-bottom: 13px;
}
.month-heading > div:last-child {
  gap: 10px;
}
.month-heading > div:last-child > b {
  text-transform: capitalize;
  color: #354b3d;
  font-size: 0.82rem;
}
.month-grid {
  border: 1px solid #e6ebe5;
  border-radius: 8px;
  overflow: hidden;
}
.month-weekdays,
.month-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.month-weekdays {
  background: #f6f8f5;
}
.month-weekdays b {
  padding: 8px 5px;
  text-align: center;
  color: #728077;
  font-size: 0.66rem;
}
.month-cell {
  display: grid;
  grid-auto-rows: min-content;
  align-content: start;
  gap: 4px;
  min-width: 0;
  min-height: 83px;
  padding: 5px;
  border-top: 1px solid #edf0ec;
  border-right: 1px solid #edf0ec;
}
.month-cell:nth-child(7n) {
  border-right: 0;
}
.month-cell > b {
  color: #384c3e;
  font-size: 0.67rem;
}
.month-cell.outside-month {
  background: #fafbf9;
}
.month-cell.outside-month > b {
  color: #bdc3bd;
}
.month-cell.is-today {
  background: #f2f7ef;
}
.month-event {
  overflow: hidden;
  padding: 3px 5px;
  border: 0;
  border-radius: 4px;
  background: #e9f3ea;
  color: #34634a;
  font: inherit;
  font-size: 0.57rem;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.month-event.stage-event {
  background: #eaf0f5;
  color: #456174;
}
.month-event.actual-event {
  background: #dff0e3;
  color: #246341;
}
.month-event:disabled {
  cursor: default;
}
.more-events {
  color: #768279;
  font-size: 0.56rem;
}
.month-list-title {
  margin: 15px 0 7px;
  color: #405448;
  font-size: 0.82rem;
}
.schedule-editor {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid #e2ebe2;
  border-radius: 8px;
  background: #f8faf7;
}
.schedule-editor > b {
  color: #355644;
  font-size: 0.8rem;
}
.schedule-editor > small {
  font-size: 0.67rem;
}
.predecessor-field {
  min-width: 0;
  margin: 0;
  padding: 10px;
  border: 1px solid #e1e8e1;
  border-radius: 8px;
}
.predecessor-field > legend {
  padding: 0 5px;
  color: #40584a;
  font-size: 0.76rem;
  font-weight: 700;
}
.predecessor-field > small {
  display: block;
  margin-bottom: 8px;
}
.predecessor-field > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}
.predecessor-field details {
  min-width: 0;
  border: 1px solid #e8ede7;
  border-radius: 6px;
  background: white;
}
.predecessor-field summary {
  padding: 7px;
  color: #486051;
  font-size: 0.67rem;
  font-weight: 650;
  cursor: pointer;
}
.predecessor-field details label {
  display: flex;
  gap: 6px;
  padding: 5px 7px;
  color: #66756a;
  font-size: 0.63rem;
  line-height: 1.35;
}
.predecessor-field details label input {
  flex: none;
  margin: 2px 0 0;
}
.predecessor-field details label span {
  min-width: 0;
}
.calendar-list {
  display: grid;
}
.calendar-list .calendar-item {
  min-height: 54px;
}
@media (max-width: 760px) {
  .schedule-toolbar,
  .month-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .schedule-toolbar > .btn {
    width: 100%;
  }
  .schedule-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  .schedule-summary > div {
    padding: 9px;
  }
  .schedule-start {
    align-items: stretch;
    flex-direction: column;
  }
  .schedule-start .field {
    max-width: none;
  }
  .month-cell {
    min-height: 69px;
    padding: 3px;
  }
  .month-event {
    padding: 3px;
    font-size: 0.53rem;
  }
  .predecessor-field > div {
    grid-template-columns: 1fr;
  }
  .schedule-panel {
    padding: 13px;
  }
}

@media (max-width: 900px) {
  .workspace-badge {
    display: inline-flex;
    max-width: 132px;
    overflow: hidden;
    padding: 6px 8px;
    text-overflow: ellipsis;
    font-size: 0.75rem;
  }
}
@media (max-width: 560px) {
  .workspace-badge {
    flex: none;
    max-width: 98px;
    padding-inline: 7px;
  }
}
.workspace-badge.is-saved {
  background: #e7f2e9;
  color: #315f40;
}
.workspace-badge.is-saving {
  background: #eff2f3;
  color: #59696e;
}
.workspace-badge.is-offline {
  background: #fff0ed;
  color: #a3453c;
}
@media (max-width: 900px) {
  .topbar {
    height: auto;
    min-height: 66px;
    padding-block: 8px;
  }
  .top-project {
    flex-wrap: wrap;
    row-gap: 5px;
    min-width: 0;
  }
  .workspace-badge {
    display: inline-flex;
    flex: 0 0 auto;
    flex-basis: 100%;
    max-width: max-content;
  }
}
.task-advanced {
  grid-column: 1/-1;
  margin: 2px 0 0;
  padding: 0 12px;
  border: 1px solid #dfe8e3;
  border-radius: 10px;
  background: #fbfcfa;
}
.task-advanced > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  color: #29473a;
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
}
.task-advanced > summary span {
  color: #6b7c73;
  font-size: 0.76rem;
  font-weight: 500;
}
.task-advanced > summary:focus-visible {
  outline: 3px solid #78b9a4;
  outline-offset: 3px;
  border-radius: 5px;
}
.task-advanced > .field-grid {
  padding: 0 0 14px;
  gap: 12px;
}
.task-context-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
  padding: 2px 0 8px;
}
.task-context-row {
  min-width: 0;
  border-bottom: 1px solid #e6ece8;
  padding-bottom: 8px;
}
.task-context-row > span {
  display: block;
  color: #405d4d;
  font-size: 0.77rem;
  font-weight: 700;
}
.task-context-row > p {
  margin: 4px 0 0;
  color: #53645a;
  font-size: 0.86rem;
  line-height: 1.45;
}
.field.task-reason-field[hidden] {
  display: none !important;
}
@media (max-width: 560px) {
  .task-advanced > summary {
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    padding: 8px 0;
  }
  .task-context-grid {
    grid-template-columns: 1fr;
  }
}
.phase-stepper-six {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  overflow: visible;
  gap: 6px;
}
.phase-stepper-six .phase-step {
  min-width: 0;
  min-height: 82px;
  padding: 8px 6px;
  border: 1px solid #e5eae4;
  border-radius: 9px;
  background: #fff;
}
.phase-stepper-six .phase-step:not(:last-child)::after {
  top: 25px;
  left: calc(50% + 22px);
  right: calc(-50% + 27px);
  height: 2px;
}
.phase-stepper-six .phase-step > span {
  width: 30px;
  height: 30px;
}
.phase-stepper-six .phase-step b {
  font-size: 0.7rem;
  line-height: 1.35;
  white-space: normal;
}
.phase-stepper-six .phase-step small {
  font-size: 0.65rem;
  color: #68766c;
  font-variant-numeric: tabular-nums;
}
.phase-stepper-six .phase-step.active {
  border-color: #87b29a;
  background: #f5faf5;
}
.schedule-view-tabs {
  display: flex;
  gap: 7px;
  margin: 0 0 12px;
}
.schedule-view-tabs .btn {
  min-width: 94px;
}
.agenda-layout {
  margin-top: 12px;
}
.app-summary {
  margin: 0 0 10px;
  color: #59685e;
  font-size: 0.78rem;
}
.app-task-links {
  display: block;
  margin-top: 4px;
  color: #738078;
  font-size: 0.68rem;
}
.legacy-applications {
  margin-top: 16px;
}
.legacy-applications > summary {
  cursor: pointer;
  font-weight: 700;
}
.app-history {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}
.permit-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  padding: 14px;
  border: 1px solid #dce7dc;
  border-radius: 9px;
  background: #f8fbf7;
}
.permit-fields h3,
.permit-fields p {
  grid-column: 1/-1;
  margin: 0;
}
.permit-fields .field {
  display: grid;
  gap: 6px;
}
.permit-fields .field.wide {
  grid-column: 1/-1;
}
.permit-fields input {
  min-width: 0;
}
@media (max-width: 760px) {
  .phase-stepper-six {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  .phase-stepper-six .phase-step {
    min-height: 79px;
  }
  .phase-stepper-six .phase-step::after {
    display: none;
  }
  .permit-fields {
    grid-template-columns: 1fr;
  }
  .permit-fields > * {
    grid-column: 1/-1 !important;
  }
  .table-wrap {
    max-width: 100%;
    overflow-x: auto;
  }
}

/* Daily schedule: compact planning controls, readable four-week work window. */
.schedule-panel {
  padding: 15px;
}
.month-panel {
  margin: 0;
  padding: 16px;
  border: 1px solid #dfe8df;
  border-radius: 11px;
}
.month-heading {
  margin-bottom: 12px;
}
.month-heading h2 {
  margin: 0;
  color: #304a38;
  font-size: 1rem;
}
.agenda-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 18px;
  align-items: start;
}
.agenda-upcoming {
  padding: 2px 0;
}
.agenda-upcoming h3 {
  margin: 0 0 10px;
  color: #3b5340;
  font-size: 0.87rem;
}
.agenda-upcoming .calendar-list {
  gap: 0;
}
.agenda-upcoming .calendar-item {
  grid-template-columns: 92px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 11px 4px;
  border: 0;
  border-bottom: 1px solid #e8eee8;
  border-radius: 0;
  background: transparent;
}
.agenda-upcoming .calendar-item b {
  font-size: 0.78rem;
}
.agenda-upcoming .calendar-item small {
  font-size: 0.69rem;
}
.agenda-clear {
  margin: -4px 0 8px;
  padding: 0;
  border: 0;
  background: none;
  color: #397252;
  font: inherit;
  font-size: 0.71rem;
  text-decoration: underline;
  cursor: pointer;
}
.month-cell {
  min-height: 83px;
}
.month-day-select {
  justify-self: start;
  width: 27px;
  height: 25px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #3e5142;
  font: inherit;
  font-size: 0.71rem;
  font-weight: 650;
  text-align: center;
  cursor: pointer;
}
.month-cell.is-today .month-day-select {
  background: #dfeee0;
  color: #2e6842;
}
.month-day-select[aria-pressed='true'] {
  outline: 2px solid #43845c;
  outline-offset: 1px;
}
.month-cell.outside-month .month-day-select {
  color: #aeb8ae;
}
.schedule-panel {
  min-width: 0;
}
/* Collapsible desktop navigation */
.sidebar-head {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  border-bottom: 1px solid var(--line);
  padding: 1px 4px 18px 0;
}
.sidebar-head .brand {
  flex: 1;
  min-width: 0;
  padding: 0;
  border: 0;
}
.sidebar-collapse {
  width: 28px;
  height: 30px;
  flex: 0 0 28px;
  border: 1px solid #e1e8e2;
  border-radius: 7px;
  background: #fff;
  color: #52675d;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.sidebar-collapse:hover,
.sidebar-collapse:focus-visible {
  background: #f0f5f0;
  color: var(--green-dark);
  outline: 2px solid #8bbca5;
  outline-offset: 1px;
}
.sidebar-collapsed.app-shell {
  grid-template-columns: 76px minmax(0, 1fr);
}
.sidebar-collapsed .sidebar {
  padding-left: 8px;
  padding-right: 8px;
}
.sidebar-collapsed .sidebar-head {
  justify-content: center;
  padding-right: 0;
  padding-bottom: 14px;
}
.sidebar-collapsed .sidebar-head .brand {
  flex: 0 0 auto;
}
.sidebar-collapsed .brand b,
.sidebar-collapsed .nav-label,
.sidebar-collapsed .sidebar-label {
  display: none;
}
.sidebar-collapsed .sidebar-collapse {
  position: absolute;
  top: 68px;
  right: 7px;
  width: 22px;
  height: 24px;
  flex-basis: 22px;
  font-size: 19px;
}
.sidebar-collapsed .brand-mark {
  width: 38px;
}
.sidebar-collapsed .nav {
  padding-top: 5px;
}
.sidebar-collapsed .nav-item {
  justify-content: center;
  gap: 0;
  padding-left: 0;
  padding-right: 0;
  font-size: 0;
}
.sidebar-collapsed .nav-item > span:first-child {
  width: 22px;
  flex: none;
}
.sidebar-collapsed .nav-divider {
  margin-inline: 8px;
}
.sidebar-collapsed .sidebar-note {
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}
.sidebar-collapsed .sidebar-note > span:nth-child(2) {
  display: none;
}
.sidebar-collapsed .sidebar-note .local-dot {
  position: absolute;
  right: 7px;
  bottom: 29px;
  margin: 0;
}
.sidebar-collapsed .sidebar-note {
  position: relative;
}
@media (max-width: 720px) {
  .sidebar-head {
    border: 0;
    padding: 0;
  }
  .sidebar-collapse {
    display: none;
  }
  .sidebar-collapsed.app-shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .sidebar-collapsed .sidebar {
    padding: 11px 12px 8px;
  }
  .sidebar-collapsed .brand b,
  .sidebar-collapsed .sidebar-label,
  .sidebar-collapsed .sidebar-note {
    display: none;
  }
  .sidebar-collapsed .nav-label {
    display: inline;
  }
  .sidebar-collapsed .nav-item {
    justify-content: flex-start;
    gap: 12px;
    padding: 8px 10px;
    font-size: 0.82rem;
  }
}

/* The current task's document needs stay above the permanent project library. */
.required-documents,
.document-archive {
  margin-bottom: 20px;
}
.required-doc-heading,
.document-archive-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 17px;
}
.required-doc-heading h2,
.document-archive-heading h2 {
  margin: 0 0 5px;
  color: #20372b;
  font-size: 1.08rem;
}
.required-doc-heading p,
.document-archive-heading p {
  margin: 0;
  color: #66766b;
  font-size: 0.83rem;
  line-height: 1.45;
}
.required-doc-heading p b {
  color: #2a4535;
  font-weight: 650;
}
.required-doc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 10px;
}
.required-doc-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 15px;
  padding: 16px;
  border: 1px solid #e1e9df;
  border-radius: 9px;
  background: #f9fbf8;
}
.required-doc-card.is-uploaded {
  background: #f4faf6;
  border-color: #cfe5d5;
}
.required-doc-card h3 {
  margin: 0 0 6px;
  color: #1e392b;
  font-size: 0.93rem;
}
.required-doc-card p {
  margin: 0;
  color: #68766c;
  font-size: 0.78rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.required-doc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.required-doc-actions .btn {
  min-height: 36px;
}
.required-doc-empty {
  margin: 0;
  font-size: 0.84rem;
}
.document-archive .documents-layout {
  min-width: 0;
}
.document-archive .doc-preview {
  position: static;
  padding: 1px 0 0 18px;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
}
.document-archive .doc-preview h3 {
  margin: 0 0 9px;
  font-size: 1rem;
}
.document-archive .doc-history h4 {
  margin: 16px 0 4px;
  font-size: 0.81rem;
}
.document-archive .doc-history-item {
  align-items: center;
  border-top: 1px solid #edf1eb;
}
.document-archive .doc-history-item small {
  display: block;
  margin-top: 3px;
  overflow-wrap: anywhere;
}
.generated-document-name output {
  display: block;
  padding: 10px 12px;
  border: 1px solid #dce8dd;
  border-radius: 8px;
  background: #f7fbf6;
  color: #214a34;
  font-size: 0.9rem;
  font-weight: 700;
}
.generated-document-name small {
  color: #69766d;
  font-size: 0.76rem;
}
@media (max-width: 900px) {
  .document-archive .documents-layout {
    grid-template-columns: 1fr;
  }
  .document-archive .doc-preview {
    padding: 17px 0 0;
    border: 0;
    border-top: 1px solid var(--line);
  }
}

/* Task views */
.nav-item {
  display: flex;
  align-items: center;
  min-width: 0;
}
.nav-item > span:first-child {
  flex: 0 0 19px;
  width: 19px;
  height: 20px;
}
.nav-item > span + span {
  display: block;
  flex: 1 1 auto;
  width: auto;
  height: auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-view-tabs {
  display: flex;
  gap: 5px;
  margin: 0 0 16px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--line);
}
.task-view-tab {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #52635a;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 650;
  cursor: pointer;
}
.task-view-tab:hover,
.task-view-tab:focus-visible {
  background: #f2f6f1;
  color: #214b38;
}
.task-view-tab.active {
  border-color: #dce8dc;
  background: #edf5ed;
  color: #1c573d;
}
.task-view-tab > span {
  min-width: 22px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #fff;
  color: #526c59;
  text-align: center;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}
.task-status-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 13px;
  padding: 11px 13px;
  border: 1px solid #e4eae3;
  border-radius: 9px;
  background: #f9fbf8;
}
.task-status-links > span {
  margin-right: auto;
  color: #66746a;
  font-size: 0.78rem;
  font-weight: 650;
}
.task-status-links button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 9px;
  border: 1px solid #dfe7de;
  border-radius: 7px;
  background: white;
  color: #325742;
  font: inherit;
  font-size: 0.78rem;
  cursor: pointer;
}
.task-status-links button:hover,
.task-status-links button:focus-visible {
  border-color: #9bb8a1;
  background: #f2f8f1;
}
.task-status-links b,
.task-priority-section > header > span {
  min-width: 23px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #eef3ec;
  color: #475f4b;
  text-align: center;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}
.task-priority-sections,
.task-stage-list {
  display: grid;
  gap: 12px;
}
.task-priority-section,
.task-stage {
  overflow: hidden;
  border: 1px solid #e1e8e0;
  border-radius: 10px;
  background: #fff;
}
.task-priority-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 14px;
  border-bottom: 1px solid #edf1ec;
  background: #fafcf9;
}
.task-priority-section > header h2 {
  margin: 0;
  color: #263b2f;
  font-size: 0.91rem;
  letter-spacing: -0.01em;
}
.task-priority-empty,
.task-stage-empty {
  margin: 0;
  padding: 13px 15px;
  color: #7a857d;
  font-size: 0.82rem;
}
.task-view-list {
  display: grid;
}
.task-view-row {
  display: grid;
  grid-template-columns: minmax(270px, 1fr) minmax(125px, 0.34fr) minmax(110px, 0.3fr) max-content;
  align-items: center;
  gap: 16px;
  padding: 12px 14px;
  border-top: 1px solid #eef1ed;
}
.task-view-row:first-child {
  border-top: 0;
}
.task-view-row:hover {
  background: #fbfcfa;
}
.task-view-primary,
.task-view-field {
  min-width: 0;
}
.task-view-main {
  display: block;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: #24392d;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.task-view-main b {
  display: block;
  overflow: hidden;
  font-size: 0.87rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.task-view-main:hover b,
.task-view-main:focus-visible b {
  color: #176248;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.task-view-main small {
  display: block;
  margin-top: 3px;
  color: #778279;
  font-size: 0.74rem;
}
.task-view-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}
.task-view-reasons .badge {
  font-size: 0.68rem;
}
.task-view-field small {
  display: block;
  margin-bottom: 3px;
  color: #89928b;
  font-size: 0.68rem;
  font-weight: 650;
}
.task-view-field > span {
  display: block;
  overflow: hidden;
  color: #3c4c40;
  font-size: 0.78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.task-view-status {
  justify-self: end;
  white-space: nowrap;
}
.task-view-blocker {
  margin: 7px 0 0;
  color: #8b6222;
  font-size: 0.74rem;
  line-height: 1.4;
}
.task-view-blocker b {
  font-weight: 700;
}
.task-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(140px, 0.8fr));
  gap: 11px;
  margin: 0 0 13px;
  padding: 13px;
  border: 1px solid #e2e8e1;
  border-radius: 9px;
  background: #fafcf9;
}
.task-filter {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #56655b;
  font-size: 0.74rem;
  font-weight: 650;
}
.task-filter select,
.task-search-control {
  width: 100%;
  min-width: 0;
  height: 38px;
  border: 1px solid #dce5dc;
  border-radius: 7px;
  background: #fff;
  color: #283b30;
  font: inherit;
  font-size: 0.82rem;
}
.task-filter select {
  padding: 0 10px;
}
.task-search-control {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 9px;
  color: #7b887e;
}
.task-search-control svg {
  flex: none;
  width: 16px;
  height: 16px;
}
.task-search-control input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #283b30;
  font: inherit;
  font-size: 0.82rem;
}
.task-search-control:focus-within,
.task-filter select:focus-visible {
  border-color: #6e9a79;
  outline: 2px solid #41876424;
  outline-offset: 1px;
}
.task-stage > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  list-style: none;
  cursor: pointer;
}
.task-stage > summary::-webkit-details-marker {
  display: none;
}
.task-stage > summary:before {
  content: '＋';
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  grid-column: 1;
  grid-row: 1;
  border: 1px solid #dce6dc;
  border-radius: 50%;
  color: #53725a;
  font-size: 0.77rem;
}
.task-stage[open] > summary:before {
  content: '−';
}
.task-stage-name {
  grid-column: 1;
  grid-row: 1;
  padding-left: 28px;
  color: #2a4033;
  font-size: 0.87rem;
  font-weight: 700;
}
.task-stage-count,
.task-stage-completed {
  color: #718076;
  font-size: 0.73rem;
  font-variant-numeric: tabular-nums;
}
.task-stage[open] > summary {
  border-bottom: 1px solid #edf1ec;
  background: #fafcf9;
}
.task-empty {
  margin-top: 12px;
}
.task-dialog-tabs {
  display: flex;
  gap: 4px;
  margin: 0 0 16px;
  padding: 0 0 9px;
  border-bottom: 1px solid #e6ebe5;
  overflow-x: auto;
}
.task-dialog-tab {
  position: relative;
  flex: 0 0 auto;
  min-height: 40px;
  padding: 8px 12px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #5b6a60;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 650;
  white-space: nowrap;
  cursor: pointer;
}
.task-dialog-tab:hover,
.task-dialog-tab:focus-visible {
  background: #f3f6f2;
  color: #24563e;
}
.task-dialog-tab[aria-selected='true'] {
  background: #eaf3eb;
  color: #1d573e;
}
.task-dialog-tab[aria-selected='true']:after {
  position: absolute;
  right: 10px;
  bottom: -10px;
  left: 10px;
  height: 2px;
  background: #2d8060;
  content: '';
}
.task-dialog-tab > span {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #dceadd;
  color: #34583d;
  font-size: 0.7rem;
}
.task-dialog-panel[hidden] {
  display: none;
}
.task-dialog-panel {
  padding-top: 1px;
}
.task-dialog-panel .field-grid {
  align-items: start;
}
.task-intake-shortcut {
  display: flex;
  grid-column: 1/-1;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #dce9da;
  border-radius: 8px;
  background: #f5faf2;
  color: #34563b;
  font-size: 0.8rem;
  line-height: 1.4;
}
.task-intake-shortcut .text-link {
  flex: none;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: #186247;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.task-date-summary {
  margin: 0;
  color: #3d5144;
  font-size: 0.85rem;
}
.task-dialog-panel .work-row > span {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.task-dialog-panel .work-row > span small {
  display: block;
  line-height: 1.4;
}
.permit-fields {
  display: grid;
  grid-column: 1/-1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
  padding: 14px;
  border: 1px solid #dce7dc;
  border-radius: 9px;
  background: #f8fbf7;
}
.permit-fields h3,
.permit-fields > p {
  grid-column: 1/-1;
  margin: 0;
}
.permit-fields h3 {
  color: #253c2f;
  font-size: 0.94rem;
}
.permit-fields > p {
  margin-top: -4px;
  line-height: 1.4;
}

/* Overview and permit map: shared stages, readable work, and local view state. */
.workflow-surface {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.workflow-surface ::selection {
  background: #d7eadd;
  color: #143c2d;
}
.workflow-heading {
  align-items: center;
  margin-bottom: 24px;
}
.workflow-heading h1 {
  margin: 0 0 9px;
  font-size: 1.75rem;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.workflow-heading .workflow-project {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  font-size: 0.875rem;
  color: #536459;
}
.workflow-project b {
  color: #2e4436;
  font-weight: 650;
}
.workflow-phases {
  gap: 0;
  margin: 0 0 20px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.workflow-phases .phase-step {
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  justify-items: start;
  gap: 4px 9px;
  min-height: 72px;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  text-align: left;
}
.workflow-phases .phase-step::after {
  display: none;
}
.workflow-phases .phase-step > .workflow-phase-number {
  grid-row: 1/3;
  width: 28px;
  height: 28px;
  align-self: center;
  background: #eef1ec;
  color: #425348;
  font-size: 0.8125rem;
  outline: 0;
}
.workflow-phase-number svg {
  width: 17px;
  height: 17px;
}
.workflow-phases .phase-step b {
  align-self: end;
  color: #374b3e;
  font-size: 0.8125rem;
  line-height: 1.35;
}
.workflow-phases .phase-step small {
  grid-column: 2;
  color: #59685e;
  font-size: 0.75rem;
  line-height: 1.35;
}
.workflow-phases .phase-step.complete > .workflow-phase-number {
  background: #e7f1e8;
  color: #2b6b46;
}
.workflow-phases .phase-step.active {
  background: #eaf3ed;
}
.workflow-phases .phase-step.active > .workflow-phase-number {
  background: var(--green);
  color: #fff;
}
.workflow-phases .phase-step.active b {
  color: var(--green-dark);
}
.workflow-phases .phase-step:hover {
  background: #f0f5ee;
}
.workflow-surface button:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}
.overview-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin: 0 0 24px;
  padding: 15px 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.overview-metrics > div {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 12px;
  min-width: 0;
}
.overview-metrics dt {
  color: #526357;
  font-size: 0.8125rem;
}
.overview-metrics dd {
  margin: 0;
  color: #213e2d;
  font-size: 1.25rem;
  font-weight: 700;
}
.overview-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 28px;
  align-items: start;
}
.overview-next {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.workflow-section-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px;
}
.workflow-section-heading h2 {
  margin: 0;
  color: #253c2e;
  font-size: 1.0625rem;
  line-height: 1.4;
}
.workflow-section-heading p {
  margin: 5px 0 0;
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.overview-next .task-view-row {
  grid-template-columns: minmax(0, 1fr) minmax(125px, 0.6fr) auto;
  gap: 10px 16px;
  padding: 18px 20px;
  border-top: 1px solid var(--line);
}
.overview-next .task-view-primary {
  grid-column: 1/3;
}
.overview-next .task-view-main b {
  overflow: visible;
  color: #263e2e;
  font-size: 0.9375rem;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
}
.overview-next .task-view-main small {
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.4;
}
.overview-next .task-view-reasons {
  margin-top: 9px;
  gap: 6px;
}
.overview-next .task-view-reasons .badge {
  font-size: 0.75rem;
}
.overview-next .task-view-field {
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
}
.overview-next .task-view-field:nth-child(2) {
  grid-column: 1;
}
.overview-next .task-view-field:nth-child(3) {
  grid-column: 2/4;
}
.overview-next .task-view-field small {
  margin: 0;
  color: #59685e;
  font-size: 0.75rem;
}
.overview-next .task-view-field > span {
  overflow: visible;
  color: #344a3c;
  font-size: 0.8125rem;
  white-space: normal;
  overflow-wrap: anywhere;
}
.overview-next .task-view-field .muted {
  color: #59685e;
}
.overview-next .task-view-status {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
}
.overview-next .task-view-status .badge {
  font-size: 0.75rem;
}
.overview-next .task-view-blocker {
  margin: 10px 0 0;
  color: #78511c;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.overview-group-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: #fafcf8;
}
.overview-group-summary > span {
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.overview-support {
  min-width: 0;
  padding: 0 4px;
}
.overview-support > section {
  display: grid;
  justify-items: start;
  gap: 7px;
  padding: 18px 0;
  border-bottom: 1px solid #dde5dc;
}
.overview-support > section:first-child {
  padding-top: 8px;
}
.overview-support > section:last-child {
  border: 0;
}
.overview-support h2 {
  margin: 0 0 3px;
  color: #2d4435;
  font-size: 0.9375rem;
  line-height: 1.4;
}
.overview-support p {
  margin: 0;
  color: #344c3d;
  font-size: 0.875rem;
  line-height: 1.5;
}
.overview-support small {
  color: #59685e;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.overview-support .btn {
  margin-top: 5px;
}
.overview-waiting-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: #385541;
  text-align: left;
  font: inherit;
  font-size: 0.8125rem;
  cursor: pointer;
}
.overview-waiting-link:hover span {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.overview-waiting-link b {
  color: #284332;
  font-weight: 700;
}
.workflow-stage-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 24px 0 12px;
}
.workflow-stage-heading h2 {
  margin: 0;
  color: #2b4434;
  font-size: 1.0625rem;
}
.workflow-stage-heading > span {
  color: #536459;
  font-size: 0.8125rem;
}
.workflow-map {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.workflow-group-list {
  position: sticky;
  top: 20px;
  display: grid;
  align-content: start;
  gap: 4px;
  max-height: calc(100vh - 40px);
  min-width: 0;
  padding: 12px;
  border-right: 1px solid var(--line);
  border-radius: 12px 0 0 12px;
  background: #f9fbf7;
  overflow-y: auto;
}
.workflow-group-link {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  width: 100%;
  min-width: 0;
  padding: 12px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #334d3b;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.workflow-group-link:hover {
  background: #edf3e9;
}
.workflow-group-link.is-selected {
  border-color: #c7ddcb;
  background: #eaf3ed;
}
.workflow-group-number {
  display: grid;
  place-items: center;
  min-height: 28px;
  border: 1px solid #dce5d9;
  border-radius: 7px;
  background: #fff;
  color: #435e4b;
  font-size: 0.8125rem;
  font-weight: 700;
}
.workflow-group-number svg {
  width: 17px;
  height: 17px;
}
.workflow-group-link.is-selected .workflow-group-number {
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}
.workflow-group-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.workflow-group-copy b {
  color: #2d4435;
  font-size: 0.875rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.workflow-group-copy small {
  color: #59685e;
  font-size: 0.75rem;
  line-height: 1.4;
}
.workflow-group-link.is-complete .workflow-group-copy small {
  color: #326443;
}
.workflow-group-detail {
  container-type: inline-size;
  min-width: 0;
  padding: 24px;
}
.workflow-detail-heading {
  margin-bottom: 24px;
}
.workflow-detail-heading p {
  margin: 0 0 7px;
  color: #536459;
  font-size: 0.8125rem;
  font-weight: 600;
}
.workflow-detail-heading h2 {
  margin: 0 0 9px;
  color: #243e2d;
  font-size: 1.1875rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.workflow-detail-heading span {
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.workflow-lanes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 24px;
  align-items: start;
}
.workflow-lanes.has-one-lane {
  grid-template-columns: minmax(0, 1fr);
}
.workflow-lane {
  min-width: 0;
}
.workflow-lane > header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 7px;
  margin-bottom: 5px;
  padding-bottom: 12px;
  border-bottom: 1px solid #dbe5d9;
}
.workflow-lane h3 {
  margin: 0;
  color: #2d4935;
  font-size: 0.9375rem;
  line-height: 1.5;
}
.workflow-lane > header > span {
  color: #536459;
  font-size: 0.75rem;
  line-height: 1.4;
}
.workflow-task {
  min-width: 0;
  padding: 15px 0;
  border-bottom: 1px solid #e8ede5;
}
.workflow-task:last-child {
  border-bottom: 0;
}
.workflow-task-heading {
  display: grid;
  gap: 8px;
}
.workflow-task-heading button {
  display: grid;
  justify-items: start;
  gap: 4px;
  min-width: 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: #283f30;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.workflow-task-heading button:hover b {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.workflow-task-id {
  color: #536459;
  font-size: 0.75rem;
  font-weight: 600;
}
.workflow-task-heading b {
  font-size: 0.875rem;
  font-weight: 650;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.workflow-task.is-done .workflow-task-heading b {
  color: #326443;
}
.workflow-task-heading .badge {
  justify-self: start;
  font-size: 0.75rem;
}
.workflow-task-meta {
  display: grid;
  gap: 7px;
  margin: 12px 0 0;
}
.workflow-task-meta > div {
  display: grid;
  gap: 3px;
}
.workflow-task-meta dt {
  color: #59685e;
  font-size: 0.75rem;
}
.workflow-task-meta dd {
  margin: 0;
  color: #344a3c;
  font-size: 0.8125rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.workflow-task-blocker {
  margin: 12px 0 0;
  padding: 9px 11px;
  border: 1px solid #eadfc9;
  border-radius: 7px;
  background: #fff9ed;
  color: #78511c;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.workflow-cross-stage {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  padding: 14px 0;
  border-block: 1px solid var(--line);
}
.workflow-cross-stage p {
  flex-basis: 100%;
  margin: 0;
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.workflow-empty {
  padding: 24px 20px;
  color: #536459;
  font-size: 0.875rem;
  line-height: 1.6;
}
.workflow-empty h2 {
  margin: 0 0 9px;
  color: #2b4434;
  font-size: 1.0625rem;
}
.workflow-empty p {
  margin: 0 0 14px;
  max-width: 65ch;
}
.workflow-list-empty {
  margin: 0;
  padding: 14px 10px;
  color: #536459;
  font-size: 0.8125rem;
  line-height: 1.5;
}
@container (max-width:640px) {
  .workflow-lanes {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Gantt: one scroll surface with opaque pinned columns and timeline-only paths. */
.schedule-panel,
.gantt-board,
.gantt-workspace {
  min-width: 0;
}
.gantt-board {
  color: #344054;
  font-variant-numeric: tabular-nums;
}
.gantt-toolbar,
.gantt-range-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px;
  background: #f7f8fa;
  border-bottom: 1px solid #dfe3e8;
}
.gantt-tools {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}
.gantt-tools > label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #475467;
  font-size: 0.75rem;
}
.gantt-tools input[type='search'],
.gantt-tools select,
.gantt-range-controls select {
  height: 40px;
  border: 1px solid #c6ccd4;
  border-radius: 6px;
  background: #fff;
  color: #344054;
  font: inherit;
  font-size: 0.8rem;
  padding: 7px 9px;
}
.gantt-search input {
  width: 190px;
  caret-color: var(--green);
}
.gantt-tools input[type='checkbox'] {
  accent-color: var(--green);
}
.gantt-range-options .plan-settings-toggle {
  min-height: 40px;
  background: #fff;
  border-color: #c6ccd4;
}
.gantt-range-controls {
  background: #fff;
}
.gantt-range-controls b {
  font-size: 0.8rem;
  font-weight: 600;
}
.gantt-range-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
.gantt-range-controls .btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.gantt-plan-settings:not([open]) {
  display: none;
}
.gantt-plan-settings > summary {
  display: none;
}
.gantt-plan-settings > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  padding: 14px;
  background: #fafbfc;
  border-bottom: 1px solid #dfe3e8;
}
.gantt-plan-settings .field {
  width: 210px;
}
.gantt-plan-settings p {
  flex: 1;
  color: #475467;
  font-size: 0.78rem;
}
.gantt-workspace {
  display: block;
}
.gantt-cards {
  --gantt-label-width: 300px;
  --gantt-owner-width: 58px;
  --gantt-columns: var(--gantt-label-width) minmax(var(--gantt-track-min-width, 560px), 1fr) var(--gantt-owner-width);
  position: relative;
  isolation: isolate;
  min-width: 0;
  max-width: 100%;
  max-height: min(620px, calc(100vh - 220px));
  overflow: auto;
  border: 1px solid #dfe3e8;
  border-radius: 7px;
  overscroll-behavior: contain;
  scrollbar-color: #aeb6c2 #f3f4f6;
}
.gantt-axis,
.gantt-stage,
.gantt-row {
  width: max(100%, calc(var(--gantt-label-width) + var(--gantt-track-min-width, 560px) + var(--gantt-owner-width)));
}
.gantt-axis,
.gantt-row,
.gantt-stage-head {
  display: grid;
  grid-template-columns: var(--gantt-columns);
  gap: 0;
  align-items: stretch;
  padding: 0;
}
.gantt-axis {
  position: sticky;
  top: 0;
  z-index: 6;
  height: 72px;
  background: #f6f7f9;
  border-bottom: 1px solid #dfe3e8;
  color: #475467;
  font-size: 0.75rem;
  font-weight: 600;
}
.gantt-axis > span {
  display: flex;
  align-items: flex-end;
  min-height: 100%;
  padding: 12px;
  background: #f6f7f9;
}
.gantt-axis > span:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  border-right: 1px solid #dfe3e8;
}
.gantt-calendar-head {
  position: relative;
  display: block;
  height: 72px;
  min-width: 0;
  overflow: hidden;
  background: #f6f7f9;
}
.gantt-week-row,
.gantt-day-row {
  position: absolute;
  left: 0;
  right: 0;
  height: 36px;
  overflow: hidden;
}
.gantt-week-row {
  top: 0;
  border-bottom: 1px solid #dfe3e8;
}
.gantt-day-row {
  top: 36px;
}
.gantt-month-label,
.gantt-week-label,
.gantt-day-label {
  position: absolute;
  top: 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  height: 35px;
  white-space: nowrap;
  border-left: 1px solid #dfe3e8;
}
.gantt-month-label,
.gantt-week-label {
  padding: 0 7px;
  color: #475467;
  font-size: 0.74rem;
  font-weight: 600;
}
.gantt-day-label {
  justify-content: center;
  flex-direction: column;
  gap: 2px;
  color: #475467;
  font-size: 0.65rem;
  font-weight: 400;
}
.gantt-day-label b {
  font-size: 0.67rem;
  font-weight: 500;
}
.gantt-day-label.is-weekend {
  background: #eceef1;
  color: #667085;
}
.gantt-today-label {
  position: absolute;
  top: 1px;
  z-index: 1;
  padding: 1px 3px;
  background: #fff8ef;
  color: #87521f;
  font-size: 0.55rem;
  font-weight: 600;
}
.gantt-stage,
.gantt-stage-body {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}
.gantt-stage-head {
  width: 100%;
  min-height: 34px;
  border: 0;
  border-bottom: 1px solid #dfe3e8;
  background: #f6f7f9;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.gantt-stage-head.is-active {
  background: #edf1f5;
}
.gantt-stage-name {
  position: sticky;
  left: 0;
  z-index: 4;
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  padding: 6px 12px;
  border-right: 1px solid #dfe3e8;
  background: inherit;
  white-space: nowrap;
}
.gantt-stage-name b {
  overflow: hidden;
  text-overflow: ellipsis;
  color: #263b30;
  font-size: 0.8rem;
}
.gantt-stage-name small {
  flex: none;
  color: #475467;
  font-size: 0.7rem;
}
.gantt-stage-track {
  display: flex;
  align-items: center;
}
.gantt-stage-owner {
  position: sticky;
  right: 0;
  z-index: 4;
  background: inherit;
  border-left: 1px solid #dfe3e8;
}
.gantt-stage-bar {
  position: absolute;
  height: 8px;
  overflow: hidden;
  border-radius: 4px;
  background: #d0d5dd;
}
.gantt-stage-bar > i {
  display: block;
  height: 100%;
  background: #3d8b5f;
}
.gantt-row {
  position: relative;
  min-height: 44px;
  background: #fff;
  border-bottom: 1px solid #edf0f3;
  text-align: left;
}
.gantt-row.is-selected {
  background: #f0f3f6;
}
.gantt-task-open {
  position: sticky;
  left: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  padding: 4px 12px;
  border: 0;
  border-right: 1px solid #dfe3e8;
  background: #fff;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.gantt-row.is-selected .gantt-task-open {
  background: #f0f3f6;
}
.gantt-task-open:hover {
  background: #f7f8fa;
}
.gantt-task-label,
.gantt-task-copy {
  display: block;
  min-width: 0;
  width: 100%;
}
.gantt-task-copy b {
  display: block;
  color: #263b30;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gantt-task-copy small {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  overflow: hidden;
  white-space: nowrap;
  gap: 5px 8px;
  margin-top: 2px;
  color: #475467;
  font-size: 0.7rem;
  line-height: 1.4;
}
.gantt-task-copy small > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gantt-task-copy small > .gantt-task-code,
.gantt-task-copy small > .gantt-critical-label {
  flex: none;
}
.gantt-task-code {
  color: #3f5f7a;
  font-weight: 700;
}
.gantt-task-status {
  color: #475467;
}
.gantt-critical-label {
  color: #994a32;
  font-weight: 600;
}
.gantt-row.is-complete .gantt-task-copy b {
  color: #34754f;
}
.gantt-track {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background-image: linear-gradient(90deg, transparent calc(100% - 1px), #e3e6eb calc(100% - 1px));
  background-size: calc(100% / var(--gantt-days)) 100%;
}
.gantt-board[data-gantt-unit='month'] .gantt-track {
  background-size: calc(700% / var(--gantt-days)) 100%;
}
.gantt-baseline,
.gantt-current {
  position: absolute;
  display: block;
  min-width: 3px;
  border-radius: 3px;
}
.gantt-baseline {
  top: calc(50% + 7px);
  height: 3px;
  background: #c7ccd3;
  z-index: 1;
}
.gantt-current {
  top: calc(50% - 7px);
  height: 12px;
  min-width: 4px;
  padding: 0;
  border: 0;
  background: #98a2b3;
  z-index: 2;
  cursor: pointer;
}
.gantt-current.is-running {
  background: #2e6db4;
}
.gantt-current.is-done {
  background: #3d8b5f;
}
.gantt-current.is-critical {
  background: var(--red);
}
.gantt-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 14px;
  padding: 8px 2px;
  color: #475467;
  font-size: 0.7rem;
}
.gantt-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.gantt-legend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}
.gantt-legend i.gantt-legend-base {
  height: 3px;
  background: #c7ccd3;
}
.gantt-today-line {
  position: absolute;
  left: var(--today-position);
  top: 0;
  bottom: 0;
  z-index: 0;
  width: 1px;
  background: #b87545;
  pointer-events: none;
}
.gantt-assignee-head,
.gantt-assignee {
  position: sticky;
  right: 0;
  z-index: 4;
  display: grid;
  place-items: center;
  align-self: stretch;
  min-width: 0;
  padding: 4px;
  background: #f7f8fa;
  color: #475467;
  font-size: 0.65rem;
  border-left: 1px solid #dfe3e8;
}
.gantt-axis > .gantt-assignee-head {
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 12px;
}
.gantt-dependencies {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}
.gantt-dependency {
  fill: none;
  stroke: #a5adb8;
  stroke-width: 1.2;
  opacity: 0.85;
  vector-effect: non-scaling-stroke;
  pointer-events: stroke;
}
.gantt-dependency.is-related {
  stroke: #475467;
  stroke-width: 2;
  opacity: 1;
}
.gantt-dependency.is-indirect {
  stroke-dasharray: 4 3;
}
.gantt-detail {
  position: relative;
  display: grid;
  grid-template-columns: minmax(200px, 1fr) minmax(280px, 1.3fr) minmax(240px, 1.2fr);
  gap: 6px 24px;
  margin-top: 14px;
  padding: 18px 42px 18px 18px;
  border: 1px solid #dfe3e8;
  border-radius: 8px;
  background: #fafbfc;
  color: #344054;
}
.gantt-detail-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: #475467;
  font-size: 1.3rem;
  cursor: pointer;
}
.gantt-detail-code {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  color: #475467;
  font-size: 0.7rem;
  font-weight: 600;
}
.gantt-detail h3 {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
}
.gantt-detail-status {
  grid-column: 1;
  grid-row: 3;
  align-self: start;
  color: #475467;
  font-size: 0.74rem;
}
.gantt-detail dl {
  grid-column: 2;
  grid-row: 1/5;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}
.gantt-detail dt {
  margin-bottom: 4px;
  color: #475467;
  font-size: 0.72rem;
}
.gantt-detail dd {
  margin: 0;
  font-size: 0.8rem;
  overflow-wrap: anywhere;
}
.gantt-detail h4 {
  grid-column: 3;
  grid-row: 1;
  margin: 0;
  font-size: 0.77rem;
}
.gantt-detail > p:not(.gantt-detail-code) {
  grid-column: 3;
  grid-row: 2/4;
  margin: 0;
  color: #475467;
  font-size: 0.75rem;
  line-height: 1.5;
}
.gantt-detail > .btn {
  grid-column: 3;
  grid-row: 4;
  justify-self: start;
  align-self: start;
}
.gantt-empty {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 12px;
  color: #475467;
  font-size: 0.8rem;
}
.gantt-empty .btn {
  min-height: 32px;
  background: #fff;
  border-color: #cbd2dc;
}
.gantt-empty[hidden],
.gantt-empty [hidden],
.gantt-row[hidden],
.gantt-stage[hidden] {
  display: none !important;
}
.gantt-board button:focus-visible,
.gantt-board select:focus-visible,
.gantt-board input:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}
.gantt-task-open:focus-visible,
.gantt-current:focus-visible {
  outline-offset: -2px;
}
.gantt-board ::selection {
  background: #dbe9e2;
  color: #153b2e;
}

.identity-ocr {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dfe8e3;
  border-radius: 10px;
  background: #fbfcfa;
}
.identity-ocr-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.identity-ocr-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}
.identity-ocr-field {
  display: grid;
  gap: 4px;
  min-width: 0;
  font-size: 0.78rem;
  color: #4b5d54;
}
.identity-ocr-field input {
  width: 100%;
  min-width: 0;
  padding: 7px 9px;
  border: 1px solid #dce4dc;
  border-radius: 7px;
  font: inherit;
}
.identity-ocr-badge {
  justify-self: start;
  padding: 2px 8px;
  border-radius: 99px;
  font-style: normal;
  font-size: 0.68rem;
  font-weight: 650;
}
.identity-ocr-badge.ok {
  background: #e9f5ec;
  color: #286247;
}
.identity-ocr-badge.warn {
  background: #fff5df;
  color: #956116;
}
.identity-ocr-badge.bad {
  background: #fff0ed;
  color: #ae4238;
}
.identity-ocr-warnings {
  margin: 0 0 10px;
  padding: 8px 10px 8px 26px;
  border-radius: 8px;
  background: #fff5df;
  color: #7a5113;
  font-size: 0.78rem;
  display: grid;
  gap: 3px;
}
@media (max-width: 680px) {
  .identity-ocr-grid {
    grid-template-columns: 1fr;
  }
}
.docfill-warning {
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid #f0d9a6;
  border-radius: 10px;
  background: #fff5df;
  color: #956116;
  font-weight: 650;
}
.docfill-panel {
  display: grid;
  gap: 14px;
  max-width: 760px;
}
.docfill-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.docfill-actions .bad {
  color: #b3261e;
}
.nav-tag {
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 99px;
  background: #fff5df;
  color: #956116;
  font-size: 0.6rem;
  font-weight: 700;
}

/* Dış müellif paneli (ui/external.mjs) */
.external-panel {
  margin: 0 0 18px;
}
.external-panel h3 {
  margin: 0 0 10px;
  font-size: 0.86rem;
  color: #294650;
}
.external-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.external-panel .work-row > span:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.external-panel .work-row small {
  color: #71838a;
  overflow-wrap: anywhere;
}
.external-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.external-add {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.external-add select {
  flex: 1 1 160px;
  min-width: 0;
  height: 36px;
  border: 1px solid #d6e0e3;
  border-radius: 8px;
  background: #fff;
  padding: 0 8px;
  font: inherit;
  font-size: 0.84rem;
}
.external-due {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  color: #56655b;
}
.external-add input[type='date'],
.external-requests input[type='date'] {
  height: 32px;
  border: 1px solid #d6e0e3;
  border-radius: 8px;
  background: #fff;
  padding: 0 6px;
  font: inherit;
  font-size: 0.8rem;
}
.external-panel .external-note {
  color: #294650;
}
.external-requests {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.external-requests li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.8rem;
}
.external-requests li > span {
  display: grid;
  min-width: 0;
}
@media (max-width: 860px) {
  .external-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .external-panel .work-row {
    grid-template-columns: 1fr;
  }
  .external-panel .work-row > .btn {
    justify-self: start;
  }
  .external-actions {
    justify-content: flex-start;
  }
}
.task-order-note {
  margin: 0 0 10px;
  color: #56655b;
  font-size: 0.78rem;
  line-height: 1.45;
}
@media (max-width: 1100px) {
  .task-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .task-filter-search {
    grid-column: 1/-1;
  }
}
@media (max-width: 680px) {
  .task-filters {
    grid-template-columns: minmax(0, 1fr);
  }
  .task-filter-search {
    grid-column: auto;
  }
}
.company-picker select {
  max-width: min(210px, 20vw);
  min-width: 110px;
}
.project-picker:not(.company-picker) select {
  max-width: min(230px, 22vw);
}
.project-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
}
.project-pagination > div {
  display: flex;
  gap: 8px;
}
.project-pagination button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.notice {
  margin: 0 0 14px;
  padding: 11px 13px;
  border: 1px solid #ead9b8;
  border-radius: 8px;
  background: #fff8ed;
  color: #79571f;
  font-size: 0.82rem;
}
@media (max-width: 680px) {
  .company-picker select {
    max-width: calc(100vw - 265px);
    min-width: 0;
  }
  .project-picker:not(.company-picker) select {
    max-width: calc(100vw - 265px);
  }
}

/* Narrow task workspace and account-access controls */
body.task-only .sidebar,
body.task-only .topbar,
body.task-only .menu-backdrop {
  display: none !important;
}
body.task-only .app-shell:not([hidden]) {
  display: block;
  min-height: 100vh;
}
body.task-only .app-shell[hidden] {
  display: none;
}
body.task-only .main {
  min-height: 100vh;
}
body.task-only .view {
  max-width: 980px;
  margin: 0 auto;
  padding: 36px 32px 64px;
}
.task-workspace-page {
  max-width: 900px;
  margin: 0 auto;
  color: #253b30;
}
.task-workspace-page .page-heading {
  align-items: flex-start;
  margin-bottom: 18px;
}
.task-workspace-page .page-heading h1 {
  margin: 2px 0 6px;
  font-size: 1.75rem;
}
.task-workspace-page .page-heading p {
  margin: 0;
  color: #68786e;
  font-size: 0.86rem;
  line-height: 1.5;
}
.task-workspace-list {
  display: grid;
  gap: 10px;
}
.task-workspace-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.65fr) minmax(260px, 1.4fr) auto;
  align-items: center;
  gap: 18px;
  padding: 16px 18px;
  border: 1px solid #e0e8e0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px #16352606;
}
.task-workspace-project,
.task-workspace-summary {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.task-workspace-project span,
.task-workspace-summary p {
  margin: 0;
  color: #758279;
  font-size: 0.72rem;
}
.task-workspace-project b {
  font-size: 0.88rem;
  color: #244334;
}
.task-workspace-summary {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
}
.task-workspace-summary h2 {
  margin: 0;
  color: #24382e;
  font-size: 0.9rem;
  line-height: 1.45;
}
.task-workspace-id {
  padding: 3px 7px;
  border-radius: 6px;
  background: #edf4ee;
  color: #286047;
  font-size: 0.68rem;
  font-weight: 750;
  white-space: nowrap;
}
.task-workspace-row-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  white-space: nowrap;
}
.task-workspace-more {
  display: block;
  margin: 16px auto 0;
}
.task-workspace-empty {
  margin-top: 18px;
  padding: 32px 20px;
}
.task-workspace-skeleton {
  padding: 24px;
  border: 1px solid #e2e9e2;
  border-radius: 9px;
  background: #fff;
  color: #62736a;
}
.task-workspace-form {
  padding: 19px;
  border: 1px solid #e0e8e0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px #16352606;
}
.task-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.task-form-grid .task-notes-field {
  grid-column: 1/-1;
}
.task-form-section {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #e9eee8;
}
.task-form-section h3 {
  margin: 0 0 11px;
  color: #294839;
  font-size: 0.88rem;
}
.task-checklist {
  display: grid;
  gap: 8px;
}
.task-check-item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 9px 10px;
  border: 1px solid #e6ece5;
  border-radius: 7px;
  background: #fbfcfa;
  color: #3e5145;
  font-size: 0.8rem;
}
.task-check-item input {
  margin: 3px 0 0;
  accent-color: #286a4e;
}
.task-document-list {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.task-document-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px;
  border: 1px solid #e6ece5;
  border-radius: 7px;
  background: #fbfcfa;
}
.task-document-list li > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.task-document-list small {
  color: #77847c;
  font-size: 0.7rem;
}
.task-upload-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 0.7fr);
  gap: 12px;
  margin-top: 12px;
}
.task-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid #e9eee8;
}
.task-workspace-error,
.task-workspace-conflict,
.task-prerequisite-block,
.task-prerequisite-ready {
  margin: 12px 0;
  padding: 11px 13px;
  border: 1px solid #ecd6d0;
  border-radius: 8px;
  background: #fff3f0;
  color: #923e34;
  font-size: 0.78rem;
  line-height: 1.45;
}
.task-workspace-conflict {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border-color: #f0dfba;
  background: #fff8e9;
  color: #79571f;
}
.task-prerequisite-block {
  border-color: #f0dfba;
  background: #fff8e9;
  color: #79571f;
}
.task-prerequisite-ready {
  border-color: #d8e9da;
  background: #edf7ee;
  color: #2d6848;
}
.project-access-body {
  display: grid;
  gap: 16px;
  max-height: min(72vh, 720px);
  overflow: auto;
  padding: 4px 22px 20px;
}
.access-section {
  padding: 14px;
  border: 1px solid #e5ebe4;
  border-radius: 9px;
  background: #fff;
}
.access-section > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 11px;
}
.access-section h3 {
  margin: 0;
  color: #294839;
  font-size: 0.9rem;
}
.access-section header p {
  margin: 4px 0 0;
  color: #758279;
  font-size: 0.72rem;
  line-height: 1.45;
}
.access-member-list {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}
.access-member {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border: 1px solid #e8ede7;
  border-radius: 7px;
  background: #fbfcfa;
}
.access-member > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.access-member b {
  color: #2d4337;
  font-size: 0.78rem;
}
.access-member small {
  color: #748178;
  font-size: 0.69rem;
  line-height: 1.4;
}
.access-row-actions {
  display: flex;
  gap: 6px;
}
.access-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(145px, 0.55fr) auto;
  align-items: end;
  gap: 10px;
}
.access-form .field {
  margin: 0;
}
.task-access-form {
  grid-template-columns: minmax(160px, 0.9fr) minmax(145px, 0.55fr);
  margin-top: 13px;
  padding-top: 13px;
  border-top: 1px solid #e9eee8;
}
.task-access-form > .btn {
  justify-self: start;
}
.access-reference-list {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
  padding: 10px;
  border: 1px solid #e5ebe4;
  border-radius: 8px;
}
.access-reference-list legend {
  padding: 0 5px;
  color: #526359;
  font-size: 0.73rem;
  font-weight: 650;
}
.access-reference {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 7px;
  border-radius: 6px;
  background: #f7f9f6;
  color: #405248;
  font-size: 0.72rem;
}
.access-reference input {
  margin: 2px 0 0;
  accent-color: #286a4e;
}
.access-reference span {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.access-reference small {
  color: #7a867e;
  font-size: 0.66rem;
  overflow-wrap: anywhere;
}
.task-access-shortcut {
  display: grid;
  justify-items: start;
  gap: 6px;
  padding: 11px;
  border: 1px solid #e1eae1;
  border-radius: 8px;
  background: #f7faf6;
}
.task-access-shortcut p {
  margin: 0;
  color: #6c7a70;
  font-size: 0.7rem;
  line-height: 1.4;
}
.access-loading {
  padding: 20px;
  color: #617168;
  text-align: center;
}
.access-error {
  margin: 0 0 10px;
  padding: 10px;
  border: 1px solid #ecd6d0;
  border-radius: 7px;
  background: #fff3f0;
  color: #923e34;
  font-size: 0.76rem;
}
.sidebar-note[role='button'] {
  cursor: pointer;
  border-radius: 8px;
}
.sidebar-note[role='button']:hover,
.sidebar-note[aria-expanded='true'] {
  background: var(--mint);
}
.sidebar-note[role='button']:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}
.profile-menu {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 76px;
  z-index: 20;
  display: grid;
  gap: 6px;
  padding: 12px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(23, 37, 43, 0.14);
}
.profile-menu[hidden] {
  display: none;
}
.profile-menu-head {
  display: grid;
  gap: 2px;
  padding: 0 2px 8px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 2px;
}
.profile-menu-head b {
  color: var(--ink);
}
.profile-menu-head span {
  color: var(--muted);
  font-size: 0.82rem;
}
.profile-menu .btn {
  width: 100%;
  justify-content: center;
}